@charset "UTF-8";
/* CONSTANTES */
@keyframes blink {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
}
@keyframes blink-opacity {
  0%, 100% {
    opacity: 0.1;
  }
  50% {
    opacity: 0.02;
  }
}
@keyframes pulse {
  0% {
    transform: scale(1);
    opacity: 0.8;
  }
  70% {
    transform: scale(2.2);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 0;
  }
}
@keyframes radar-ping {
  0% {
    box-shadow: 0 0 0 0 rgba(216, 5, 54, 0.6);
  }
  50% {
    box-shadow: 0 0 0 4px rgba(216, 5, 54, 0);
  }
  100% {
    box-shadow: 0 0 0 4px rgba(216, 5, 54, 0);
  }
}
@keyframes icon-alert {
  0%, 100% {
    color: inherit;
  }
  50% {
    color: #D80536;
  }
}
.danger-lvl1 {
  animation: blink 2s infinite ease-in-out;
}

.danger-lvl2 {
  animation: blink 1.5s infinite ease-in-out;
}

.danger-lvl3 {
  animation: blink 1s infinite ease-in-out;
}

.danger-lvl4 {
  animation: blink 0.6s infinite ease-in-out;
}

.danger-lvl5 {
  animation: blink 0.4s infinite ease-in-out;
}

body {
  background-color: #fafafa;
  color: #444444;
}

.h-inherit {
  height: inherit !important;
}

.disabled-link {
  pointer-events: none;
  opacity: 0.5;
  cursor: default;
}

.img-cover {
  max-height: 560px;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.logo-veilleurs {
  width: 180px;
  mix-blend-mode: multiply;
}

/* NEW VARIABLES */
.text-color-vert,
.text-color-lvl0 {
  color: #56dc83 !important;
}

.text-color-jaune,
.text-color-lvl1 {
  color: #fcdd59 !important;
}

.text-color-orange,
.text-color-lvl2 {
  color: #ec8b31 !important;
}

.text-color-rouge,
.text-color-lvl3 {
  color: #D80536 !important;
}

.text-color-violet,
.text-color-lvl4 {
  color: #ac74b0 !important;
}

.butn-style4.xsmall {
  padding: 2px 12px !important;
  font-size: 11px;
}

.butn-style4.xxsmall {
  padding: 1px 9px !important;
  font-size: 9px;
}

.butn-style4.disabled {
  pointer-events: none;
  opacity: 0.5;
}

.butn-style5 {
  border-color: rgb(19.2, 73.8, 112.8);
  color: white;
  letter-spacing: 1px;
  width: calc(33% - 2px);
  position: relative;
  background-color: rgb(19.2, 73.8, 112.8);
}

.butn-style5.demi {
  width: calc(50% - 2px);
}

.butn-style5.check::after {
  content: "\f00c";
  position: absolute;
  top: calc(50% - 12.5px);
  right: 6px;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 14px;
  opacity: 0.2;
  transition: opacity 0.2s ease-in-out;
}

.butn-style5.check.active {
  background-color: #ec8b31;
  border-color: #ec8b31;
  font-weight: 700;
  color: white;
}

.butn-style5.check.active::after {
  content: "\f00c";
  opacity: 1;
  transform: translateY(0);
}

.butn-style5.case::after {
  content: "\f0fe";
  position: absolute;
  top: 2px;
  right: 6px;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 14px;
  opacity: 0.2;
  transition: opacity 0.2s ease-in-out;
}

.butn-style5.case.active {
  background-color: #ec8b31;
  border-color: #ec8b31;
  font-weight: 700;
}

.butn-style5.case.active::after {
  content: "\f146";
  opacity: 1;
  transform: translateY(0);
}

.butn-style5:hover::after {
  opacity: 0.6;
}

.bg-bleu {
  background-color: #207bbc !important;
  color: white !important;
}

.bg-gris {
  background-color: #dbd8d9 !important;
}

.bg-gristresclair {
  background-color: #fafafa !important;
}

.bg-gristresclair-transparent {
  background-color: rgba(250, 250, 250, 0.2) !important;
}

.bg-vert {
  background-color: #56dc83 !important;
  color: white !important;
}

.bg-vert-opacity {
  background-color: rgba(86, 220, 131, 0.4) !important;
}

.bg-vert-clair {
  background-color: #c2deb4 !important;
}

.bg-jaune {
  background-color: #fcdd59 !important;
  color: #444444;
}

.bg-jaune-opacity {
  background-color: rgba(252, 221, 89, 0.4) !important;
}

.bg-orange {
  background-color: #ec8b31 !important;
  color: white !important;
}

.bg-rouge {
  background-color: #D80536 !important;
  color: white !important;
}

.bg-violet {
  background-color: #ac74b0 !important;
  color: white !important;
}

.bg-violet-opacity {
  background-color: rgba(172, 116, 176, 0.4) !important;
}

.brd-gristresclair {
  border-width: 1px;
  border-style: solid;
  border-color: #969696;
}

.brd-vert,
.brd-lvl1 {
  border-width: 1px;
  border-style: solid;
  border-color: rgb(31.5, 152.1, 72);
}

.brd-vert-clair2 {
  border: 1px solid #c2deb4;
}

.brd-gris,
.brd-lvl0 {
  border-width: 1px;
  border-style: solid;
  border-color: rgb(135.48, 125.52, 128.84);
}

.brd-jaune,
.brd-lvl2 {
  border-width: 1px;
  border-style: solid;
  border-color: rgb(200.9680473373, 163.4378698225, 3.6319526627);
}

.brd-orange,
.brd-lvl3 {
  border-width: 1px;
  border-style: solid;
  border-color: rgb(156.56, 82.84, 14.44);
}

.brd-rouge,
.brd-lvl4 {
  border-width: 1px;
  border-style: solid;
  border-color: rgb(129.6, 3, 32.4);
}

.brd-violet,
.brd-lvl5 {
  border-width: 1px;
  border-style: solid;
  border-color: rgb(108.495412844, 63.4899082569, 111.7100917431);
}

.brd-arrondi {
  border-radius: 10px;
}

.before-bleu::before {
  background: linear-gradient(180deg, rgba(19.2, 73.8, 112.8, 0.95), rgba(19.2, 73.8, 112.8, 0) 70%) !important;
}

.before-rouge::before {
  background: linear-gradient(180deg, rgba(129.6, 3, 32.4, 0.95), rgba(129.6, 3, 32.4, 0) 70%) !important;
}

.before-vert::before {
  background: linear-gradient(180deg, rgba(31.5, 152.1, 72, 0.95), rgba(31.5, 152.1, 72, 0) 70%) !important;
}

.border-secondary {
  border-color: #ec8b31 !important;
}

.fs-6-5 {
  font-size: 0.85rem !important;
}

.fs-7 {
  font-size: 0.75rem !important;
}

.picto {
  width: 38px;
}

.picto img {
  filter: drop-shadow(1px 0 0 rgba(122, 122, 122, 0.2)) drop-shadow(-1px 0 0 rgba(122, 122, 122, 0.2)) drop-shadow(0 1px 0 rgba(122, 122, 122, 0.2)) drop-shadow(0 -1px 0 rgba(122, 122, 122, 0.2));
}

.arrowWind {
  max-width: 14px;
}

.arrowWind.pro {
  max-width: inherit;
}

.card {
  background-color: #f5f9ff;
}

.card .card-body {
  color: #444444;
}

.card .card-body hr {
  margin: 2rem 0;
}

.card .card-large {
  font-size: 2rem;
}

.card .card-large .picto {
  width: 58px;
}

.card .blog-img img {
  aspect-ratio: 1;
  -o-object-fit: cover;
     object-fit: cover;
}

section {
  background: transparent;
}

.text-hover-secondary:hover {
  transition: color 0.2s ease-in-out;
  color: #ec8b31 !important;
}

p {
  hyphens: none;
  word-break: normal;
  overflow-wrap: normal;
  font-size: clamp(0.9rem, 0.6vw + 0.75rem, 1rem);
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  color: #444444;
}

h1.text-fourth span {
  display: block;
  font-size: 1.4rem;
  padding-top: 8px;
  font-weight: normal;
}

.section-title2 h2,
.section-title2.team-title h2,
.h3 {
  font-size: clamp(1.6rem, 1.4vw + 1.4rem, 3.125rem);
  line-height: 1.2 !important;
  color: #444444;
  font-weight: 700;
}

.h4,
h4 {
  font-size: clamp(1.1rem, 1.2vw + 1rem, 1.3rem) !important;
}

.h4.large,
h4.large {
  font-size: clamp(1.1rem, 1.2vw + 2rem, 4rem) !important;
}

.border-no-right {
  border-top: 1px solid #c2deb4;
  border-left: 1px solid #c2deb4;
  border-bottom: 1px solid #c2deb4;
}

.border-no-left {
  border-top: 1px solid #c2deb4;
  border-right: 1px solid #c2deb4;
  border-bottom: 1px solid #c2deb4;
}

.border-bottom-orange {
  border-bottom: 5px solid #ec8b31;
}

.border-bottom-orange.card {
  border-top-color: #e6f0ff;
  border-left-color: #e6f0ff;
  border-right-color: #e6f0ff;
}

.h-fit-content {
  height: -moz-fit-content !important;
  height: fit-content !important;
}

.text-justify {
  text-align: justify;
}

.bg-light-blue {
  background-color: #f5f9ff;
}

.dangers-encart {
  padding: 24px;
  border-radius: 5px;
  z-index: 2;
  position: relative;
  display: block;
}

.dangers-encart > div {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
  padding-left: 15px;
  position: relative;
  z-index: 3;
}

.dangers-encart > div.flex-row {
  padding-left: 0;
}

.dangers-encart > div.pro {
  width: 100%;
}

.dangers-encart > div.pro .horaires {
  display: flex;
  align-items: center;
}

.dangers-encart > div.pro .periode {
  display: block;
  width: 100%;
}

.dangers-encart > div > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.dangers-encart > div > div i {
  font-size: 1.6rem;
}

.dangers-encart > div > div .icn {
  max-height: 40px;
}

.dangers-encart > div > div span {
  font-size: clamp(1.2rem, 0.8vw + 1rem, 1.4rem);
  line-height: clamp(1.5rem, 0.9vw + 1.1rem, 2rem);
  text-transform: uppercase;
  white-space: nowrap;
}

.dangers-encart > div p {
  line-height: 1.6rem;
  margin-bottom: 0;
  font-weight: 500;
}

.dangers-encart::before {
  content: "\f071";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  z-index: 1;
  bottom: 50%;
  right: 6px;
  font-size: 8rem;
  opacity: 0.1;
  transform: translateY(50%);
}

.dangers-encart.bg-gristresclair-transparent::before {
  color: #ececec;
}

.dangers-encart::after {
  content: "";
  position: absolute;
  z-index: 3;
  width: 24px;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgb(197, 197, 197);
}

.dangers-encart.lvl1::after {
  background-color: #56dc83;
}

.dangers-encart.lvl1::before {
  animation: blink-opacity 2s infinite ease-in-out;
}

.dangers-encart.lvl2::after {
  background-color: #fcdd59;
}

.dangers-encart.lvl2::before {
  animation: blink-opacity 1.5s infinite ease-in-out;
}

.dangers-encart.lvl3::after {
  background-color: #ec8b31;
}

.dangers-encart.lvl3::before {
  animation: blink-opacity 1s infinite ease-in-out;
}

.dangers-encart.lvl4::after {
  background-color: #D80536;
}

.dangers-encart.lvl4::before {
  animation: blink-opacity 0.6s infinite ease-in-out;
}

.dangers-encart.lvl5::after {
  background-color: #ac74b0;
}

.dangers-encart.lvl5::before {
  animation: blink-opacity 0.6s infinite ease-in-out;
}

.frise {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(3.8%, 1fr));
  gap: 2px;
  max-width: 100%;
  margin: 8px 0;
}

.frise .heure {
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.65rem;
  border: 1px solid rgb(212.736, 209.214, 210.388);
  background-color: #dbd8d9;
  border-radius: 4px;
}

.legende {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.legende.h-100px {
  height: 100px;
  justify-content: flex-end;
}

.legende div {
  display: inline-block;
  width: 100%;
  height: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.8rem;
  font-weight: 700;
}

.legende div.h10 {
  height: 10px;
}

.legende div.h20 {
  height: 20px;
}

.legende div.h30 {
  height: 30px;
}

.legende div.h40 {
  height: 40px;
}

.legende div.h50 {
  height: 50px;
}

.legende div.h60 {
  height: 60px;
}

.legende div.h70 {
  height: 70px;
}

.legende div.h80 {
  height: 80px;
}

.legende div.h90 {
  height: 90px;
}

.legende div.h100 {
  height: 100px;
}

.legende div .fa-check {
  font-size: 1.5rem;
}

.legende span {
  font-size: 0.85rem;
  font-weight: bold;
}

.bottom-2 {
  bottom: 8px;
  top: inherit;
}

.top-2 {
  top: 8px;
  bottom: inherit;
}

.left-2 {
  left: 8px;
  right: inherit;
}

.right-2 {
  right: 8px;
  left: inherit;
}

.font-italic {
  font-style: italic;
}

.text-left {
  text-align: left !important;
}

.icn {
  max-height: 28px;
}

.icn.icn2x {
  max-height: 36px;
}

.lh-0-5 {
  line-height: 0.5rem;
}

.modal#legende .col-4 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.modal#legende .col-4 img {
  max-height: 36px;
}

.modal#legende .col-4 .info {
  font-size: 0.7rem;
  text-align: center;
}

.modal .large {
  max-width: 800px;
}

.radius-br-0 {
  border-end-end-radius: 0;
}

.home-tab-obs {
  background-color: transparent;
}

.home-tab-obs tr td {
  background-color: transparent;
  text-align: left;
  color: white;
  font-size: 0.8rem;
  vertical-align: middle;
}

.home-tab-obs tr td:first-child {
  font-size: clamp(1rem, 1.2vw + 0.6rem, 1.25rem) !important;
}

.home-tab-obs tr td:nth-child(2) {
  font-size: clamp(0.8rem, 1vw + 0.4rem, 1.05rem) !important;
  font-weight: 700;
}

.home-tab-obs tr td img {
  width: 25px;
}

.table-tri-wrapper {
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid #dbd8d9;
  border-radius: 4px;
}

.table-tri-wrapper .table-tri,
.table-tri-wrapper .compact-tri {
  width: 100%;
  overflow-x: auto;
}

.table-tri-wrapper .table-tri td:not(:first-child),
.table-tri-wrapper .table-tri th:not(:first-child),
.table-tri-wrapper .compact-tri td:not(:first-child),
.table-tri-wrapper .compact-tri th:not(:first-child) {
  text-align: center;
}

.table-tri-wrapper .table-tri td:first-child,
.table-tri-wrapper .table-tri th:first-child,
.table-tri-wrapper .compact-tri td:first-child,
.table-tri-wrapper .compact-tri th:first-child {
  min-width: 200px;
  padding-left: 8px;
}

.table-tri-wrapper .table-tri td:first-child.heure,
.table-tri-wrapper .table-tri th:first-child.heure,
.table-tri-wrapper .compact-tri td:first-child.heure,
.table-tri-wrapper .compact-tri th:first-child.heure {
  min-width: 100px;
  text-align: center;
}

.table-tri-wrapper .table-tri tr:nth-child(odd),
.table-tri-wrapper .compact-tri tr:nth-child(odd) {
  background-color: #ececec;
}

.table-tri-wrapper .table-tri tr:hover,
.table-tri-wrapper .compact-tri tr:hover {
  background-color: rgb(214.824, 211.476, 212.592);
}

.table-tri-wrapper .table-tri tr:hover td,
.table-tri-wrapper .compact-tri tr:hover td {
  font-weight: 700;
}

.table-tri-wrapper .table-tri td,
.table-tri-wrapper .compact-tri td {
  padding: 4px 8px;
  font-size: clamp(0.75rem, 0.6vw + 0.7rem, 0.9rem) !important;
  font-weight: 500;
  position: relative;
  border-right: 1px dashed rgb(214.824, 211.476, 212.592);
}

.table-tri-wrapper .table-tri td:last-child,
.table-tri-wrapper .compact-tri td:last-child {
  border-right: none;
}

.table-tri-wrapper .table-tri td:first-child,
.table-tri-wrapper .compact-tri td:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.table-tri-wrapper .table-tri td:first-child.heure,
.table-tri-wrapper .compact-tri td:first-child.heure {
  display: block;
}

.table-tri-wrapper .table-tri td i,
.table-tri-wrapper .compact-tri td i {
  position: absolute;
  right: 12px;
  top: calc(50% - 7px);
}

.table-tri-wrapper .table-tri td i.fa-plus,
.table-tri-wrapper .table-tri td i.fa-edit,
.table-tri-wrapper .table-tri td i.fa-trash-alt,
.table-tri-wrapper .compact-tri td i.fa-plus,
.table-tri-wrapper .compact-tri td i.fa-edit,
.table-tri-wrapper .compact-tri td i.fa-trash-alt {
  position: inherit;
  right: inherit;
  top: inherit;
}

.table-tri-wrapper .table-tri td svg.arrowWind,
.table-tri-wrapper .compact-tri td svg.arrowWind {
  position: absolute;
  right: 12px;
  top: calc(50% - 15px);
}

.table-tri-wrapper .table-tri td .date-ext,
.table-tri-wrapper .compact-tri td .date-ext {
  display: block;
  font-size: 0.7rem;
}

.table-tri-wrapper .table-tri thead th,
.table-tri-wrapper .compact-tri thead th {
  background-color: #207bbc;
  color: white;
  font-size: 0.8rem;
  line-height: 1.1rem;
  padding: 4px 8px;
  cursor: pointer;
  position: relative;
}

.table-tri-wrapper .table-tri thead th span,
.table-tri-wrapper .compact-tri thead th span {
  font-size: 0.7rem;
  display: block;
}

.table-tri-wrapper .table-tri thead th::after,
.table-tri-wrapper .compact-tri thead th::after {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.7rem;
  opacity: 0.6;
  content: "\f0dc";
}

.table-tri-wrapper .table-tri thead th.sorting-asc::after,
.table-tri-wrapper .compact-tri thead th.sorting-asc::after {
  content: "\f0de";
  opacity: 1;
}

.table-tri-wrapper .table-tri thead th.sorting-desc::after,
.table-tri-wrapper .compact-tri thead th.sorting-desc::after {
  content: "\f0dd";
  opacity: 1;
}

.table-tri-wrapper .table-tri.no-tri thead th,
.table-tri-wrapper .compact-tri.no-tri thead th {
  padding: 8px;
}

.table-tri-wrapper .table-tri.no-tri thead th::after,
.table-tri-wrapper .compact-tri.no-tri thead th::after {
  display: none;
}

.table-tri-wrapper .table-tri.no-tri tbody tr.row-odd,
.table-tri-wrapper .compact-tri.no-tri tbody tr.row-odd {
  background-color: #ececec;
}

.table-tri-wrapper .table-tri.no-tri tbody tr.row-even,
.table-tri-wrapper .compact-tri.no-tri tbody tr.row-even {
  background-color: white;
}

.table-tri-wrapper .table-tri.no-tri tbody td:first-child,
.table-tri-wrapper .compact-tri.no-tri tbody td:first-child {
  display: table-cell;
  align-items: unset;
  justify-content: unset;
}

.table-tri-wrapper .table-tri.no-tri tbody td:last-child,
.table-tri-wrapper .compact-tri.no-tri tbody td:last-child {
  font-weight: 600;
}

.table-tri-wrapper .table-tri.no-tri tbody td:last-child .date-ext,
.table-tri-wrapper .compact-tri.no-tri tbody td:last-child .date-ext {
  font-weight: 400;
}

.tooltip.bs-tooltip-auto {
  font-size: 10px;
  background-color: #ec8b31;
}

.tooltip.bs-tooltip-auto * {
  border-radius: 0;
}

.tendance-pression.up::before {
  content: "\f061";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  display: inline-block;
  transform: rotate(-45deg);
  color: #D80536;
  font-size: 1.4rem;
}

.tendance-pression.down::before {
  content: "\f061";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  display: inline-block;
  transform: rotate(45deg);
  color: #56dc83;
  font-size: 1.4rem;
}

.tendance-pression.equal::before {
  content: "=";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  display: inline-block;
  color: #ec8b31;
  font-size: 1.4rem;
}

.highcharts-background {
  background-color: transparent;
}

select.form-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 1rem;
  padding-right: 2.5rem;
  font-size: 15px;
  color: #fff;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path fill='white' d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/></svg>");
  padding: 10px;
}

select.form-select.text-white.bg-secondary {
  background-color: #ec8b31;
}

select.form-select.text-white.bg-primary {
  background-color: #207bbc;
}

.wrapper-photos {
  position: relative;
  border-radius: 4px;
  min-height: 310px;
  height: 310px;
  overflow: hidden;
}

.wrapper-photos img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  transition: transform 0.2s ease-in-out;
  display: block;
}

.wrapper-photos .legende-photos {
  display: block;
  background-color: rgba(243.6, 185.4, 131.4, 0.9);
  padding: 4px 12px;
  font-size: 0.8rem;
  font-style: italic;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  margin: 0;
  font-weight: 500;
}

.wrapper-photos:hover img {
  transform: scale(1.05);
}

.wrapper-photos.nocover {
  height: auto;
  min-height: unset;
  padding-bottom: 30px;
}

.wrapper-photos.nocover img {
  -o-object-fit: contain;
     object-fit: contain;
  height: auto;
}

.mb10 {
  margin-bottom: 10px;
}

.horizontaltab.pro .resp-tabs-list li {
  font-size: 15px;
  padding: 8px 20px;
  background-color: #ececec;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  transition: all 0.2s ease-in-out;
}

.horizontaltab.pro .resp-tabs-list li.resp-tab-active {
  background-color: #207bbc !important;
  color: white;
}

.horizontaltab.pro .resp-tabs-list li:not(.resp-tab-active):hover {
  background-color: #dee2e6;
}

.ratio1 {
  aspect-ratio: 1;
  -o-object-fit: cover;
     object-fit: cover;
}

.ratio1-08 {
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 1/0.8;
}

.page-title-section h1 {
  font-size: clamp(1.5625rem, 2vw + 2rem, 3.75rem);
  line-height: clamp(2rem, 2.5vw + 2rem, 4.25rem);
}

.page-title-section p.lead {
  font-size: clamp(0.9rem, 1vw + 0.75rem, 1.25rem);
}

/*CARTES ET CANVAS */
canvas {
  border-radius: 16px;
}

.carte-commune {
  height: 1000px;
  border-radius: 10px;
}

.carte-dangers,
.carte-pro {
  height: 500px;
  border-radius: 10px;
}

.legende-radar {
  position: absolute;
  left: 5px;
  bottom: 10px;
  z-index: 2;
  height: 30px;
  width: 460px;
}

.legende-radar svg {
  width: auto;
  display: block;
}

.legende-radar svg line {
  stroke: black;
}

.legende-radar svg text {
  font-size: 0.65rem;
  font-weight: 700;
}

/* FIN NEW VARIABLES */
.navbar-nav li.has-sub ul {
  border-bottom: 5px solid #ec8b31;
  border-radius: 0 0 6px 6px;
  background: #ececec;
}

.navbar-nav li.has-sub ul li a {
  transition: padding-left 0.2s ease-in-out;
}

.navbar-nav li.has-sub ul li a:hover {
  color: #207bbc;
  padding-left: 42px;
}

.navbar-nav li a {
  font-weight: 500;
  font-size: 14px;
  color: #292929;
}

.accordion-style1 .btn-link {
  background-color: #207bbc;
  color: white;
}

.accordion-style1 .btn-link::after {
  color: white;
}

.accordion-style1 .btn-link.collapsed {
  background-color: #ececec;
  border-radius: 4px;
}

.accordion-style1 .btn-link.collapsed::after {
  color: #207bbc;
}

.accordion-style1 .card-body {
  background-color: #f5f9ff;
}

.ol-zoom {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row-reverse;
  background: transparent;
  display: none;
}

.ol-zoom button {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  padding: 0;
  position: relative;
  font-size: 0;
  background-color: rgb(56.7454545455, 152.7090909091, 221.2545454545);
  color: transparent;
  transition: all 0.1s ease-in-out;
  outline: none;
}

.ol-zoom button:hover {
  background-color: rgb(28.8, 110.7, 169.2);
  color: white;
  outline: none;
}

.ol-zoom button::before {
  content: "";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1;
  transform: translateY(-2px);
  color: white;
}

.ol-zoom .ol-zoom-in::before {
  content: "+";
}

.ol-zoom .ol-zoom-out::before {
  content: "–";
}

.actions {
  position: absolute;
  top: 10px;
  left: 65px;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.actions .md-switch {
  position: relative;
  display: inline-block;
  width: 62px;
  height: 22px;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: auto;
}

.actions .md-switch input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 5;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
}

.actions .md-switch .md-switch__track {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: rgb(56.7454545455, 152.7090909091, 221.2545454545);
  transition: background 160ms ease;
  overflow: hidden;
}

.actions .md-switch .md-switch__thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 27px;
  height: 18px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
  transition: transform 160ms ease;
  z-index: 1;
  will-change: transform;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.actions .md-switch .md-switch__labels {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
  z-index: 2;
}

.actions .md-switch .md-switch__label {
  width: 29px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.4px;
  line-height: 1;
  white-space: nowrap;
  transition: color 160ms ease;
  color: rgba(255, 255, 255, 0.95);
}

.actions .md-switch .md-switch__label.icn {
  font-size: 12px;
}

.actions .md-switch .md-switch__label i,
.actions .md-switch .md-switch__label svg {
  line-height: 1;
  display: inline-block;
}

.actions .md-switch input:checked ~ .md-switch__track {
  background: rgb(25.6, 98.4, 150.4);
}

.actions .md-switch input:checked ~ .md-switch__thumb {
  transform: translateX(31px);
}

.actions .md-switch input:checked ~ .md-switch__labels .md-switch__label--on,
.actions .md-switch input:not(:checked) ~ .md-switch__labels .md-switch__label--off {
  color: #444444;
}

.actions .md-switch#label-switch-radar:not(.d-none) {
  animation: radar-ping 1s ease-out infinite;
  border-radius: 999px;
}

.actions .md-switch#label-switch-radar:not(.d-none) input:not(:checked) ~ .md-switch__labels .md-switch__label--off i {
  animation: icon-alert 1.2s ease-in-out infinite;
}

.actions .md-switch#label-switch-radar:not(.d-none) input:checked ~ .md-switch__labels .md-switch__label--off i {
  animation: icon-alert 1.2s ease-in-out infinite;
}

.actions .md-switch.md-switch--radar-toggle input:not(:checked) ~ .md-switch__track {
  background: rgb(142.8, 142.8, 142.8);
}

.actions .md-switch.md-switch--radar-toggle input:checked ~ .md-switch__labels .md-switch__label--off {
  visibility: hidden;
}

.actions .md-switch.md-switch--radar-toggle input:not(:checked) ~ .md-switch__labels .md-switch__label--off {
  position: relative;
  color: rgba(80, 80, 80, 0.75);
}

.actions .md-switch.md-switch--radar-toggle input:not(:checked) ~ .md-switch__labels .md-switch__label--off i {
  opacity: 0.75;
}

.actions .md-switch.md-switch--radar-toggle input:not(:checked) ~ .md-switch__labels .md-switch__label--off::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 2px;
  background: #D80536;
  border-radius: 2px;
  transform: translate(-50%, -50%) rotate(-45deg);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.6);
  pointer-events: none;
}

.actions .typeChamps {
  background-color: rgba(255, 255, 255, 0.2);
  color: white;
  font-size: 0.7rem;
  border-radius: 12px;
  padding: 1px 8px;
}

.btn-legende-carte {
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 2;
  background: rgb(105.4, 105.4, 105.4);
  color: white;
  font-size: 0.7rem;
  border-radius: 12px;
  padding: 2px 10px;
  text-decoration: none;
  transition: background-color 160ms ease;
}

.btn-legende-carte:hover, .btn-legende-carte:active, .btn-legende-carte:focus {
  background: rgb(54.4, 54.4, 54.4);
  color: white;
}

#map-popup,
.map-popup {
  border-radius: 8px;
  border: 1px solid #ec8b31;
}

#map-popup .tb-pop,
.map-popup .tb-pop {
  max-width: 400px;
  line-height: 1.25;
  padding: 8px;
}

#map-popup .tb-pop__head,
.map-popup .tb-pop__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

#map-popup .tb-pop__headleft,
.map-popup .tb-pop__headleft {
  flex: 1;
  min-width: 0;
}

#map-popup .tb-pop__logo,
.map-popup .tb-pop__logo {
  width: 32px;
  height: 32px;
  -o-object-fit: contain;
     object-fit: contain;
  flex-shrink: 0;
}

#map-popup .tb-pop__title,
.map-popup .tb-pop__title {
  font-weight: 700;
  font-size: 15px;
  margin-bottom: 6px;
}

#map-popup .tb-pop__dept,
.map-popup .tb-pop__dept {
  font-weight: 600;
  opacity: 0.7;
}

#map-popup .tb-pop__meta,
.map-popup .tb-pop__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: 12px;
  opacity: 0.85;
}

#map-popup .tb-pop__metaico,
.map-popup .tb-pop__metaico {
  margin-right: 6px;
  opacity: 0.8;
}

#map-popup .tb-pop__alt, #map-popup .tb-pop__date,
.map-popup .tb-pop__alt,
.map-popup .tb-pop__date {
  display: inline-flex;
  align-items: center;
  gap: 0;
  white-space: nowrap;
}

#map-popup .tb-pop__grid,
.map-popup .tb-pop__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

#map-popup .tb-pop .tb-pop__temp,
.map-popup .tb-pop .tb-pop__temp {
  font-weight: 600;
  padding: 0.1rem 0.45rem;
  border-radius: 0.4rem;
  line-height: 1.4;
  white-space: nowrap;
}

#map-popup .tb-pop .tb-pop__temp--tn,
.map-popup .tb-pop .tb-pop__temp--tn {
  color: #0d47a1;
  background: rgba(33, 150, 243, 0.12);
}

#map-popup .tb-pop .tb-pop__temp--tx,
.map-popup .tb-pop .tb-pop__temp--tx {
  color: #b71c1c;
  background: rgba(244, 67, 54, 0.12);
}

#map-popup .tb-pop .tb-pop__temp--na,
.map-popup .tb-pop .tb-pop__temp--na {
  color: #999;
}

#map-popup .tb-pop .tb-pop__sep,
.map-popup .tb-pop .tb-pop__sep {
  margin: 0 0.25rem;
  color: #666;
}

#map-popup .tb-pop__item,
.map-popup .tb-pop__item {
  position: relative;
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 8px;
  align-items: start;
  padding: 8px 8px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.03);
}

#map-popup .tb-pop__ico,
.map-popup .tb-pop__ico {
  font-size: 14px;
  opacity: 0.85;
  margin-top: 2px;
}

#map-popup .tb-pop__label,
.map-popup .tb-pop__label {
  font-size: 10px;
  opacity: 0.7;
  margin-bottom: 2px;
}

#map-popup .tb-pop__val,
.map-popup .tb-pop__val {
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

#map-popup .tb-pop__unit,
.map-popup .tb-pop__unit {
  font-weight: 600;
  opacity: 0.75;
  margin-left: 2px;
}

#map-popup .tb-pop__wind,
.map-popup .tb-pop__wind {
  display: inline-flex;
  align-items: center;
  transform: translateY(1px);
}

#map-popup .tb-pop__wind svg,
.map-popup .tb-pop__wind svg {
  width: 22px;
  height: 22px;
  display: block;
}

#map-popup .tb-pop__empty,
.map-popup .tb-pop__empty {
  padding: 10px 8px;
  font-size: 13px;
  opacity: 0.7;
}

/* PAGE HOME */
#home #carte-bg #map {
  min-height: 600px;
}

#home #carte-bg .carte-infos {
  position: absolute;
  top: 8px;
  right: 24px;
  z-index: 2;
}

#home #carte-bg .carte-infos p {
  background: rgb(25.6, 98.4, 150.4);
  padding: 2px 8px;
  font-weight: 700;
  font-size: 0.8rem;
  color: white;
  border-radius: 4px;
}

#home #carte-bg.banner4 .banner-left,
#home #carte-bg.banner4 .banner-right {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

#home #carte-bg .astres img {
  max-width: 36px;
}

#home #carte-bg .astres span {
  color: white;
  font-size: 11px;
}

#home #carte-bg .astres.phase img {
  max-width: 36px;
}

#home #carte-bg .astres.phase p {
  color: white;
  font-size: 11px;
  line-height: 14px;
}

#home #carte-bg .footer-icon img {
  max-width: 90px;
  filter: drop-shadow(1px 0 0 rgba(122, 122, 122, 0.2)) drop-shadow(-1px 0 0 rgba(122, 122, 122, 0.2)) drop-shadow(0 1px 0 rgba(122, 122, 122, 0.2)) drop-shadow(0 -1px 0 rgba(122, 122, 122, 0.2));
}

#home #carte-bg .ligne-pictos {
  background-color: #fafafa;
  margin-left: inherit;
  margin-right: inherit;
  border-radius: 5px;
  border: 2px dashed rgb(32.8436363636, 126.2427272727, 192.9563636364);
}

#home .card-style15 .blog-content .blog-content-inner .content-inner {
  margin-bottom: -20px;
  transition: all 0.3s;
}

#home .card-style15 .blog-content .blog-content-inner .content-inner:hover {
  margin-bottom: 0;
}

#home .play-btn-modal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  text-decoration: none;
  transition: transform 0.3s ease;
  animation: pulse-ring 2s infinite;
}

#home .play-btn-modal:hover {
  transform: scale(1.1);
}

#home .play-btn-modal i {
  margin-left: 5px;
  /* décale l'icône play pour la centrer visuellement */
}

#home {
  /* Animation pulse autour du bouton */
}

@keyframes pulse-ring {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
  }
  70% {
    box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
#home {
  /* Modale vidéo */
}

#home #videoModal .modal-dialog {
  max-width: none;
  width: auto;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}

#home #videoModal .modal-content {
  width: auto;
  max-height: 90dvh;
  background-color: transparent;
  border: 0;
  position: relative;
}

#home #videoModal #presentationVideo {
  max-height: 90dvh;
  width: auto;
  max-width: 90vw;
  display: block;
}

#home #videoModal .video-close-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 10;
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 50%;
  padding: 0.6rem;
  opacity: 1;
}

#home #videoModal .video-close-btn:hover {
  background-color: rgba(0, 0, 0, 0.9);
}

/* PAGES DE PREVISIONS */
#previsions #carte-bg .ol-zoom {
  top: 4rem;
}

#previsions #carte-bg .btn-legende-carte {
  bottom: 44px;
  right: 18px;
}

#previsions #carte-bg .tab-style1 .resp-tabs-list {
  border-bottom: none;
  margin-bottom: 24px;
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

#previsions #carte-bg .tab-style1 .resp-tabs-list li {
  background-color: #ececec !important;
  padding: 4px 32px;
  border-radius: 5px;
  font-weight: 500;
  font-size: 16px;
  transition: all 0.2s ease-in-out;
  border-bottom: none;
  display: block;
  width: 100%;
}

#previsions #carte-bg .tab-style1 .resp-tabs-list li.active {
  background-color: #207bbc !important;
  color: white;
  font-weight: 700;
}

#previsions #carte-bg .tab-style1 .resp-tabs-list li:hover {
  background-color: #dbd8d9 !important;
}

#previsions #carte-bg .tab-style1 .resp-tabs-container .col-lg-12 {
  position: relative;
}

#previsions #carte-bg .tab-style1 .resp-tabs-container .col-lg-12 .options {
  width: calc(100% - 24px);
  position: absolute;
  top: 8px;
  left: 12px;
  display: flex;
  justify-content: space-between;
  background-color: rgba(250, 250, 250, 0.2);
  padding: 4px 12px;
  border-radius: 5px;
  z-index: 2;
}

#previsions #carte-bg .tab-style1 .resp-tabs-container .col-lg-12 .options div a.butn-style5 {
  min-width: 160px;
  border-radius: 4px;
  text-align: center;
  width: -moz-fit-content !important;
  width: fit-content !important;
}

#previsions #carte-bg .tab-style1 .resp-tabs-container .col-lg-12 .options div a.butn-style5::after {
  display: none;
}

/* PAGE D'OBSERVATION */
#carte .carte-infos {
  position: absolute;
  top: 8px;
  right: 24px;
  z-index: 2;
}

#carte .carte-infos p {
  background: rgb(25.6, 98.4, 150.4);
  padding: 2px 8px;
  font-weight: 700;
  color: white;
  border-radius: 4px;
  font-size: clamp(0.6rem, 0.6vw + 0.6rem, 0.9rem);
  display: none;
}

#carte .ol-viewport {
  overflow: visible;
}

#carte .dashboard .card-body {
  padding: 1rem 1.5rem;
}

#carte .dashboard .card-body .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}

#carte .dashboard .card-body .title h3 {
  color: inherit;
}

#carte .dashboard .card-body .title span {
  font-size: 1.2rem;
  font-weight: 700;
}

#carte .dashboard .card-body .valeurs {
  display: flex;
  justify-content: space-between;
}

#carte .dashboard .card-body .valeurs p {
  font-size: clamp(0.75rem, 0.6vw + 0.7rem, 0.9rem);
  margin: 0;
}

#carte .dashboard .card-body .valeurs p span {
  font-weight: 600;
  margin-left: 0.3rem;
}

#carte .dashboard::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 6px;
  width: 5px;
  background-color: var(--bg-color, transparent);
  pointer-events: none;
}

#carte .dashboard.petite .card-body {
  padding: 0.5rem 1.25rem;
}

#carte .dashboard.petite .card-body .title {
  margin-bottom: 0.5rem;
}

#carte .dashboard.petite .card-body .title h3 {
  font-size: clamp(1rem, 0.8vw + 0.8rem, 1.2rem) !important;
  font-weight: 400;
}

#carte .dashboard.petite .card-body .title span {
  font-size: clamp(1.1rem, 1vw + 0.9rem, 1.4rem);
  font-weight: 400;
}

#carte .dashboard.petite .card-body .valeurs p {
  font-size: clamp(0.7rem, 0.4vw + 0.65rem, 0.8rem);
}

#carte .dashboard.petite .card-body .valeurs p span {
  font-weight: 400;
}

/* PAGE CLIMAT*/
.table-climat tbody td {
  font-size: 0.9rem;
  min-width: 250px;
}

.table-climat tbody td:first-child {
  min-width: 250px;
}

.climat-tabs-wrap {
  position: relative;
  margin-bottom: 2rem;
}

.climat-tab-btn {
  width: 100%;
  min-height: 74px;
  padding: 14px 16px;
  border: 1px solid #cfe0f5;
  border-radius: 14px;
  background: #f7fbff;
  color: #207bbc;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.06);
}

.climat-tab-btn:hover {
  background: #edf5ff;
  border-color: #9fc0ef;
  color: #174ecb;
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.1);
}

.climat-tab-btn:focus {
  outline: none;
  box-shadow: 0 0 0 0.2rem rgba(37, 99, 235, 0.18);
}

.climat-tab-btn.active {
  background: linear-gradient(135deg, #207bbc 0%, #207bbc 100%);
  border-color: #207bbc;
  color: #fff;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.2);
  position: relative;
}

.climat-tabs-wrap .col {
  display: flex;
}

.climat-tabs-wrap .col > .climat-tab-btn {
  flex: 1 1 auto;
}

.cta-oeb {
  transition: filter 0.25s ease, transform 0.2s ease;
  cursor: pointer;
}

.cta-oeb:hover {
  filter: brightness(1.15);
}

.cta-oeb:hover .butn-style4 {
  transform: translateX(6px);
}

.cta-oeb:active {
  filter: brightness(0.95);
}

/* PAGE ACTUALITES*/
#actus .card > .position-relative.brd-type {
  position: relative;
}

#actus .card > .position-relative.brd-type::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 8px;
  background: #dbd8d9;
  clip-path: polygon(0% 90%, 50% 10%, 100% 90%, 100% 100%, 0% 100%);
}

#actus .card > .position-relative.brd-type .card-date {
  z-index: 2;
}

#actus .card > .position-relative.brd-type .card-date.bg-rouge {
  box-shadow: 0 0 0 7px rgba(216, 5, 54, 0.2);
}

#actus .card > .position-relative.brd-type .card-date.bg-bleu {
  box-shadow: 0 0 0 7px rgba(32, 123, 188, 0.2);
}

#actus .card > .position-relative.brd-type .card-date.bg-vert {
  box-shadow: 0 0 0 7px rgba(86, 220, 131, 0.2);
}

#actus .card > .position-relative.brd-type.rouge::after {
  background: #D80536;
}

#actus .card > .position-relative.brd-type.bleu::after {
  background: #207bbc;
}

#actus .card > .position-relative.brd-type.vert::after {
  background: #56dc83;
}

#actus .card .legende-photo-actu {
  position: absolute;
  bottom: 0;
  text-align: center;
  font-size: 0.7rem;
  background-color: rgba(41, 41, 41, 0.8);
  padding: 2px 4px;
  color: white;
  display: block;
  width: 100%;
  border-bottom-left-radius: 0.375rem;
  border-bottom-right-radius: 0.375rem;
}

#actus .archives-list a.active,
#actus .cat-list a.active {
  background-color: #207bbc;
  color: white;
}

#actus .archives-list a.active h6,
#actus .cat-list a.active h6 {
  color: white;
}

#actus .archives-list a span,
#actus .cat-list a span {
  width: 30px;
  height: 30px;
  text-align: center;
  border-radius: 3px;
  font-size: 14px;
  color: #292929;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* PAGES PRO*/
#pro .page-title-section.pro {
  padding: 120px 0 60px;
}

#pro {
  /* Carte TABLEAU DE BORD : positionnement des overlays */
}

#pro #carte .position-relative > .actions {
  top: 10px;
  left: 10px;
}

#pro #carte .position-relative .carte-infos {
  position: absolute;
  top: 8px;
  right: 16px;
  z-index: 2;
}

#pro #carte .position-relative .carte-infos p {
  background: rgb(25.6, 98.4, 150.4);
  padding: 2px 8px;
  font-weight: 700;
  font-size: 0.8rem;
  color: white;
  border-radius: 4px;
  margin: 0;
}

#pro #carte .position-relative .legende-radar {
  width: 320px;
  left: 10px;
  bottom: 10px;
}

#pro .veille-dashboard-carte {
  height: 500px;
  width: 100%;
}

#pro .veille-dashboard-img {
  background-color: #fafafa;
  border-radius: 5px;
  width: 100%;
}

#pro .veille-dashboard-img img {
  max-width: 90%;
  border-radius: 5px;
}

#pro .veille-dashboard-img .alert-no-danger {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  width: auto;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

#pro .dangers-encart.no-danger::before {
  display: none;
}

#pro .dangers-encart.no-danger .veille-dashboard-img {
  width: 100%;
}

#pro {
  /* Panneau rassurant "aucun danger" (section Dangers - Aujourd'hui) */
}

#pro .no-danger-panel {
  background: linear-gradient(135deg, rgba(86, 220, 131, 0.08), rgba(86, 220, 131, 0.02));
  border: 1px dashed rgba(86, 220, 131, 0.4);
  border-radius: 10px;
  min-height: 280px;
}

#pro .no-danger-panel .no-danger-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(86, 220, 131, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #56dc83;
  font-size: 2.2rem;
  flex-shrink: 0;
}

#pro .no-danger-panel h4,
#pro .no-danger-panel h5 {
  color: rgb(39.375, 190.125, 90);
  font-weight: 700;
}

#pro .no-danger-panel p {
  color: #444444;
  max-width: 420px;
}

#pro .no-danger-panel.no-danger-panel--compact {
  min-height: 0;
}

#pro .no-danger-panel.no-danger-panel--compact .no-danger-icon {
  width: 48px;
  height: 48px;
  font-size: 1.3rem;
}

#pro .no-danger-panel.no-danger-panel--compact h5 {
  font-size: 1rem;
}

#pro .no-danger-panel.no-danger-panel--compact p {
  font-size: 0.85rem;
  max-width: none;
}

#pro .no-danger-panel.no-danger-panel--overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  min-height: 0;
  max-width: 90%;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
}

#pro .no-danger-panel.no-danger-panel--overlay .no-danger-icon {
  width: 48px;
  height: 48px;
  font-size: 1.3rem;
}

#pro .no-danger-panel.no-danger-panel--overlay h5 {
  font-size: 1rem;
}

#pro .no-danger-panel.no-danger-panel--overlay p {
  font-size: 0.85rem;
  max-width: none;
}

/* PAGES SERVICES */
.pricing-plan {
  max-width: 500px;
  height: 200px;
  margin-top: -70px;
}

.pricing-plan .pricing-price {
  padding-top: 90px;
}

.video-assu {
  max-width: 500px;
}

/* RESPONSIVE */
/* Uniquement Desktop */
@media (min-width: 1200px) {
  .xl-position-absolute {
    position: absolute !important;
  }
}
/* Mini tablettes*/
@media (min-width: 992px) {
  .lg-position-absolute {
    position: absolute !important;
  }
  .w-lg-20 {
    width: 20% !important;
  }
}
/* Mini mobiles paysage / petites tablettes*/
@media (min-width: 768px) {
  .md-position-absolute {
    position: absolute !important;
  }
}
/* ≤ 1200px : grands laptops / tablettes paysage */
@media (max-width: 1200px) {
  .frise {
    grid-template-columns: repeat(24, 1fr);
  }
  .h-300px {
    height: 600px;
  }
}
/* ≤ 992px : tablettes */
@media (max-width: 992px) {
  .navbar-toggler {
    border-radius: 4px;
  }
  .frise {
    grid-template-columns: repeat(24, 1fr);
  }
  .fs-2 {
    font-size: calc(1.125rem + 0.9vw) !important;
  }
  .arrowWind.pro {
    max-width: 15px;
  }
  .climat-tab-btn {
    min-height: 68px;
    font-size: 1rem;
    padding: 12px 14px;
  }
  .banner4 .banner-left {
    border: none;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
  }
  .banner4 .banner-left h3 {
    font-size: 1rem;
  }
  .banner4 .banner-right {
    border: none;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }
  .banner4 .banner-right canvas {
    border-radius: 0;
  }
  #carte-bg .options {
    position: static !important;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem;
    margin: 0 0.5rem;
    border-radius: 5px;
  }
  #carte-bg .options div {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
  }
  #carte-bg .options div a.butn-style5 {
    width: auto !important;
    min-width: auto !important;
    flex: 1 1 calc(33.33% - 4px);
    font-size: 10px;
    padding: 6px 8px !important;
  }
  #carte-bg .carte-infos {
    bottom: 30px;
    left: 10px;
    top: inherit !important;
    right: inherit !important;
  }
  #carte-bg .carte-infos p {
    padding: 2px 8px !important;
    margin-bottom: 8px;
    font-size: 0.7rem !important;
  }
  .actions .typeChamps {
    background: rgb(56.7454545455, 152.7090909091, 221.2545454545);
    font-size: 0.6rem;
  }
  #map-popup,
  .map-popup {
    border-radius: 8px;
    border: 1px solid #ec8b31;
  }
  #map-popup .tb-pop,
  .map-popup .tb-pop {
    max-width: 260px;
    padding: 6px;
    line-height: 1.2;
  }
  #map-popup .tb-pop__head,
  .map-popup .tb-pop__head {
    padding-bottom: 6px;
    margin-bottom: 6px;
  }
  #map-popup .tb-pop__title,
  .map-popup .tb-pop__title {
    font-size: 14px;
    margin-bottom: 4px;
  }
  #map-popup .tb-pop__dept,
  .map-popup .tb-pop__dept {
    font-size: 12px;
  }
  #map-popup .tb-pop__meta,
  .map-popup .tb-pop__meta {
    font-size: 11px;
    gap: 4px 8px;
  }
  #map-popup .tb-pop__metaico,
  .map-popup .tb-pop__metaico {
    margin-right: 4px;
    font-size: 11px;
  }
  #map-popup .tb-pop__grid,
  .map-popup .tb-pop__grid {
    grid-template-columns: 1fr;
    gap: 5px;
  }
  #map-popup .tb-pop__item,
  .map-popup .tb-pop__item {
    padding: 6px 6px;
    border-radius: 8px;
    grid-template-columns: 16px 1fr;
    gap: 6px;
  }
  #map-popup .tb-pop__ico,
  .map-popup .tb-pop__ico {
    font-size: 12px;
    margin-top: 1px;
  }
  #map-popup .tb-pop__label,
  .map-popup .tb-pop__label {
    font-size: 9px;
    margin-bottom: 1px;
  }
  #map-popup .tb-pop__val,
  .map-popup .tb-pop__val {
    font-size: 13px;
    gap: 3px;
  }
  #map-popup .tb-pop__unit,
  .map-popup .tb-pop__unit {
    font-size: 11px;
  }
  #map-popup .tb-pop .tb-pop__temp,
  .map-popup .tb-pop .tb-pop__temp {
    font-size: 12px;
    padding: 0.05rem 0.35rem;
    border-radius: 0.35rem;
  }
  #map-popup .tb-pop .tb-pop__sep,
  .map-popup .tb-pop .tb-pop__sep {
    margin: 0 0.2rem;
  }
  #map-popup .tb-pop__wind svg,
  .map-popup .tb-pop__wind svg {
    width: 18px;
    height: 18px;
  }
  #map-popup .tb-pop__empty,
  .map-popup .tb-pop__empty {
    padding: 8px 6px;
    font-size: 12px;
  }
  .social-icon-style7 li {
    margin-right: 0;
  }
  .table-tri-wrapper .table-tri {
    /* Corps du tableau : cellule station */
  }
  .table-tri-wrapper .table-tri td:first-child {
    min-width: 140px;
    max-width: 140px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .table-tri-wrapper .table-tri {
    /* Label tronqué avec … */
  }
  .table-tri-wrapper .table-tri td:first-child .cell-label {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .table-tri-wrapper .table-tri {
    /* En-tête : on garde un comportement "normal" */
  }
  .table-tri-wrapper .table-tri th:first-child {
    min-width: 140px;
    max-width: 140px;
  }
  .table-tri-wrapper .table-tri td:first-child.heure,
  .table-tri-wrapper .table-tri th:first-child.heure {
    min-width: 80px;
  }
  .table-tri-wrapper .table-tri td {
    white-space: nowrap;
  }
  .table-tri-wrapper .table-tri td i,
  .table-tri-wrapper .table-tri td svg.arrowWind {
    position: relative;
    right: inherit;
    display: inline-block;
  }
  .table-tri-wrapper .table-tri th {
    white-space: nowrap;
  }
  .table-tri-wrapper .table-tri th::after {
    position: relative;
    transform: inherit;
    right: inherit;
    top: inherit;
  }
  .pricing-plan {
    height: 150px;
  }
  .video-assu {
    max-width: 100%;
  }
  .w-350px {
    width: 100%;
    max-width: 100%;
  }
  .h-300px {
    height: 370px;
  }
  #pro .dangers-encart > div > div {
    flex-direction: column;
  }
  #pro .dangers-encart > div > div .horaires {
    align-items: center;
    justify-content: center;
  }
  #pro .dangers-encart > div > div {
    width: 100%;
  }
  #pro .dangers-encart > div > div span {
    white-space: inherit;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
  }
  #pro .dangers-encart > div > div > div {
    display: flex;
  }
}
/* ≤ 768px : mobiles paysage / petites tablettes */
@media (max-width: 768px) {
  .climat-tab-btn {
    min-height: 62px;
    font-size: 0.95rem;
    border-radius: 12px;
  }
  .page-title-section {
    padding: 110px 0 40px;
  }
  .text-mobile-center {
    text-align: center;
  }
  .carte-commune {
    height: 700px;
  }
  .carte-dangers {
    height: 700px;
  }
  .text-actualisation {
    color: white;
  }
  .dangers-encart > div {
    padding-left: 20px;
  }
  #home #carte-bg #map {
    min-height: 700px;
  }
}
/* ≤ 576px : petits mobiles */
@media (max-width: 576px) {
  .frise {
    grid-template-columns: repeat(12, 1fr);
  }
  .page-title-section {
    padding: 110px 0 30px;
  }
  .inner-pages .banner-lg-text {
    right: 12px;
    bottom: 0;
  }
  .text-mobile-center {
    text-align: center;
  }
  .carte-commune,
  .carte-dangers,
  .carte-pro {
    height: 320px;
  }
  .carte-observations {
    margin: 0 !important;
    height: 400px !important;
  }
  .text-actualisation {
    color: white;
  }
  .dangers-encart > div {
    padding-left: 20px;
  }
  .butn-style4 {
    line-height: 15px;
    border-radius: 3px;
  }
  .legende-radar {
    width: 240px;
    left: 10px;
    bottom: -5px;
  }
  .legende-radar svg text {
    font-size: 0.8rem;
  }
  #home #carte-bg #map {
    min-height: 370px;
  }
  .butn-style5.demi {
    width: calc(33% - 2px);
  }
  .butn-style5.small {
    font-size: 7px;
    padding: 2px 8px;
  }
  .butn-style5.case::after {
    font-size: 12px;
    top: -2px;
  }
  #carte-bg .options {
    position: static !important;
    width: auto !important;
    left: auto !important;
    margin: 8px !important;
  }
  #carte-bg .options div a.butn-style5 {
    flex: 1 1 calc(33.33% - 4px);
    font-size: 9px;
    padding: 4px 6px !important;
  }
  #map {
    margin: 0 8px;
    position: static !important;
    width: auto !important;
    left: auto !important;
  }
  #pro .veille-dashboard-carte {
    height: 350px;
  }
}
.bg-fiabilite-faible {
  color: white;
  background-color: #ff6b68;
}

.bg-fiabilite-moyenne {
  color: white;
  background-color: #ffc721;
}

.bg-fiabilite-bonne {
  color: white;
  background-color: #32c787;
}