/*
 * Charte Ekphora — primary Bootstrap, parité structurelle STAUA
 * Couleur de marque : token --bs-primary (teal professionnel santé / terrain).
 */

:root,
[data-bs-theme="light"] {
  --bs-primary: #0b7285;
  --bs-primary-rgb: 11, 114, 133;
  --bs-link-color: #0b7285;
  --bs-link-hover-color: #095c6b;
  --bs-focus-ring-color: rgba(var(--bs-primary-rgb), 0.35);
  --ekphora-heading: color-mix(in srgb, var(--bs-primary) 55%, #0f172a);
}

html {
  scroll-padding-top: 5.5rem;
}

.site-body {
  padding-top: 4.25rem;
}

.site-body-portal {
  padding-top: 4rem;
}

.site-main .lead {
  max-width: 44rem;
}

.ekphora-heading {
  color: var(--ekphora-heading);
}

.site-main h1,
.site-main h2,
.site-main h3.ekphora-heading {
  color: var(--ekphora-heading);
}

.ekphora-brand {
  color: color-mix(in srgb, var(--bs-primary) 70%, #000);
}
.ekphora-brand:hover {
  color: color-mix(in srgb, var(--bs-primary) 85%, #000);
}

/* Navigation */
.ekphora-nav-header {
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--bs-primary) 92%, #000) 0%,
    var(--bs-primary) 32%,
    color-mix(in srgb, var(--bs-primary) 88%, #1e3a5f) 68%,
    color-mix(in srgb, var(--bs-primary) 75%, #0f172a) 100%
  );
  --bs-navbar-color: rgba(255, 255, 255, 0.92);
  --bs-navbar-hover-color: #fff;
  --bs-navbar-active-color: #fff;
  --bs-navbar-disabled-color: rgba(255, 255, 255, 0.45);
}

.ekphora-nav-header--portal {
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--bs-primary) 88%, #000) 0%,
    color-mix(in srgb, var(--bs-primary) 70%, #1a2f3d) 100%
  );
}

.ekphora-nav-header .navbar-brand {
  color: #fff;
}
.ekphora-nav-header .navbar-brand:hover {
  color: rgba(255, 255, 255, 0.88);
}

.ekphora-nav-header .nav-link {
  font-weight: 500;
  padding: 0.5rem 0.75rem;
  border-radius: 0.25rem;
}
.ekphora-nav-header .nav-link:hover {
  background-color: rgba(255, 255, 255, 0.08);
}
.ekphora-nav-header .nav-link.active {
  text-decoration: underline;
  text-underline-offset: 0.2rem;
}

.ekphora-nav-header .btn-outline-ekphora {
  --bs-btn-color: #fff;
  --bs-btn-border-color: rgba(255, 255, 255, 0.55);
  --bs-btn-hover-bg: rgba(255, 255, 255, 0.12);
  --bs-btn-hover-border-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: rgba(255, 255, 255, 0.2);
  --bs-btn-active-border-color: #fff;
  --bs-btn-focus-shadow-rgb: 255, 255, 255;
}

.navbar-toggler {
  border-color: rgba(255, 255, 255, 0.45) !important;
}

.navbar-nav .nav-link:not(.active):hover {
  color: var(--bs-link-hover-color);
}

/* Boutons marque */
.btn-ekphora {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: color-mix(in srgb, var(--bs-primary) 88%, #000);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-primary) 88%, #000);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
  --bs-btn-active-bg: color-mix(in srgb, var(--bs-primary) 78%, #000);
  --bs-btn-active-border-color: color-mix(in srgb, var(--bs-primary) 78%, #000);
}

.btn-outline-ekphora {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
}

.link-ekphora {
  color: var(--bs-primary);
  text-decoration-color: rgba(var(--bs-primary-rgb), 0.35);
}
.link-ekphora:hover {
  color: var(--bs-link-hover-color);
}

.border-ekphora-soft {
  border-color: rgba(var(--bs-primary-rgb), 0.2) !important;
}

.ekphora-offcanvas {
  background: linear-gradient(
    180deg,
    #fff 0%,
    color-mix(in srgb, var(--bs-primary) 6%, #fff) 100%
  );
}

/* Panneau C-Prog (équivalent STAUA : offcanvas dédié, fond lisible) */
.ekphora-offcanvas-cprog {
  background: linear-gradient(
    180deg,
    #fff 0%,
    color-mix(in srgb, var(--bs-primary) 5%, #fff) 100%
  );
}

.offcanvas-backdrop.show {
  background-color: rgba(var(--bs-primary-rgb), 0.12);
  backdrop-filter: blur(2px);
}

.ekphora-footer {
  border-top-color: rgba(var(--bs-primary-rgb), 0.18) !important;
}

.form-control:focus,
.form-select:focus {
  border-color: rgba(var(--bs-primary-rgb), 0.65);
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.18);
}

.form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.alert-ekphora {
  background-color: color-mix(in srgb, var(--bs-primary) 8%, #fff);
  border-color: rgba(var(--bs-primary-rgb), 0.22);
  color: color-mix(in srgb, var(--bs-primary) 45%, #0f172a);
}

.ekphora-card-elevated {
  border: 1px solid rgba(var(--bs-primary-rgb), 0.15);
  box-shadow: 0 0.5rem 1.25rem rgba(var(--bs-primary-rgb), 0.1);
}

.ekphora-hero-badge {
  background: color-mix(in srgb, var(--bs-primary) 10%, #fff);
  color: color-mix(in srgb, var(--bs-primary) 50%, #0f172a);
  border: 1px solid rgba(var(--bs-primary-rgb), 0.2);
}

/* Carrousel accueil (parité itun / renum / staua : inset, légende légère) */
.ekphora-carousel .ekphora-carousel-visual {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  height: min(52vh, 440px);
  min-height: 280px;
  background: color-mix(in srgb, var(--bs-primary) 35%, #0f172a);
}

.ekphora-carousel .ekphora-carousel-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: brightness(0.88) contrast(1.08) saturate(0.92);
  transition: filter 0.45s ease-in-out;
}

.ekphora-carousel .carousel-item.active .ekphora-carousel-img {
  filter: brightness(0.9) contrast(1.06) saturate(0.95);
}

.ekphora-carousel .ekphora-carousel-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    165deg,
    rgba(var(--bs-primary-rgb), 0.42) 0%,
    rgba(var(--bs-primary-rgb), 0.22) 38%,
    rgba(15, 23, 42, 0.48) 100%
  );
}

.ekphora-carousel .ekphora-carousel-visual--placeholder::after {
  background: linear-gradient(
    165deg,
    rgba(var(--bs-primary-rgb), 0.1) 0%,
    rgba(255, 255, 255, 0.35) 48%,
    rgba(var(--bs-primary-rgb), 0.12) 100%
  );
}

.ekphora-carousel .carousel-caption.ekphora-carousel-caption {
  z-index: 2;
}

@media (prefers-reduced-motion: reduce) {
  .ekphora-carousel .ekphora-carousel-img {
    transition: none;
  }
}

.ekphora-carousel .carousel-control-prev,
.ekphora-carousel .carousel-control-next {
  filter: drop-shadow(0 0 2px rgba(15, 23, 42, 0.35));
}

.ekphora-carousel .carousel-indicators [data-bs-target] {
  background-color: #fff;
  opacity: 0.55;
}

.ekphora-carousel .carousel-indicators .active {
  opacity: 1;
  background-color: var(--bs-primary);
}

.ekphora-carousel-caption {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(var(--bs-primary-rgb), 0.2);
  border-radius: 1rem;
  color: #111;
  padding: 1rem 1.25rem;
  margin-bottom: 2rem;
  box-shadow: 0 0.25rem 1rem rgba(var(--bs-primary-rgb), 0.12);
}

.ekphora-carousel-placeholder {
  min-height: 280px;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--bs-primary) 8%, #fff) 0%,
    #fff 45%,
    color-mix(in srgb, var(--bs-primary) 12%, #fff) 100%
  );
}

.ekphora-carousel-visual .ekphora-carousel-placeholder {
  border-bottom: none;
}

/* Accordéon */
.accordion.ekphora-accordion .accordion-button:not(.collapsed) {
  background-color: color-mix(in srgb, var(--bs-primary) 10%, #fff);
  color: var(--ekphora-heading);
  box-shadow: none;
}
.accordion.ekphora-accordion .accordion-button:focus {
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.2);
}

/* Tarifs */
.tarifs-page .pricing-card {
  transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
  border: 1px solid rgba(var(--bs-primary-rgb), 0.15);
}
.tarifs-page .pricing-card:hover,
.tarifs-page .pricing-card:focus-within {
  box-shadow: 0 0.75rem 1.75rem rgba(var(--bs-primary-rgb), 0.14);
  border-color: rgba(var(--bs-primary-rgb), 0.35);
  transform: translateY(-2px);
}

.bg-ekphora-step {
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--bs-primary) 18%, #fff),
    #fff
  ) !important;
}

.bg-ekphora-year {
  background: color-mix(in srgb, var(--bs-primary) 88%, #0f172a) !important;
}

.border-ekphora-year {
  border-color: color-mix(in srgb, var(--bs-primary) 55%, #0f172a) !important;
}

.ekphora-tooltip-month {
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--bs-primary) 92%, #000),
    var(--bs-primary)
  );
  color: #fff;
  box-shadow: 0 0.35rem 1rem rgba(var(--bs-primary-rgb), 0.25);
}

.z-ekphora-skip {
  z-index: 1080;
}

.ekphora-carousel-visual picture {
  display: block;
  width: 100%;
  height: 100%;
}

/* Icônes : swap sur mobile (évite FOIT) */
@media (max-width: 576px) {
  @font-face {
    font-family: "bootstrap-icons";
    font-display: swap;
  }
}
