/* ==========================================================================
   BAARA KUMA — BASE  (v2.0)
   Typographie globale, liens, boutons, formulaires, badges, cartes,
   en-tête, menus, bandeau de titre, pied de page, accessibilité.
   --------------------------------------------------------------------------
   Pourquoi « html body » et !important ?
   Le thème JobCareer écrit ses propres couleurs et polices dans
   custom-style.css avec !important. Ce fichier est chargé APRÈS lui
   (priorité 1001) : à spécificité égale ou supérieure, nos règles gagnent.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. TYPOGRAPHIE GLOBALE
   -------------------------------------------------------------------------- */
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
html body{
  font-family:var(--bk-font) !important;
  font-size:var(--bk-fs-body) !important;
  line-height:var(--bk-lh-body);
  color:var(--bk-color-body);
  background:var(--bk-white);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

/* Une seule famille partout… sauf les polices d'icônes et le slider */
html body :is(p,a,span,li,dt,dd,label,legend,small,strong,b,em,blockquote,figcaption,
  td,th,caption,h1,h2,h3,h4,h5,h6,input,select,textarea,button,div,article,section,
  aside,nav,header,footer,ul,ol,address):not([class*="icon-"]):not(.fa):not([class*="fa-"]):not(.slick-arrow){
  font-family:var(--bk-font) !important;
}
/* En-tête et pied de page : le thème y impose ses polices avec des sélecteurs #id */
html body :is(#header, #footer) :is(p,a,span,li,h1,h2,h3,h4,h5,h6,button,input,label,div,strong):not([class*="icon-"]):not(.fa):not([class*="fa-"]){
  font-family:var(--bk-font) !important;
}

html body p,
html body .main-section p,
html body .rich-editor-text p{
  font-size:var(--bk-fs-body) !important;
  line-height:var(--bk-lh-body) !important;
  color:var(--bk-color-body) !important;
  letter-spacing:0 !important;
  margin:0 0 1em;
}
html body li{ line-height:var(--bk-lh-body); }
html body strong, html body b{ font-weight:var(--bk-fw-bold); }
html body small{ font-size:var(--bk-fs-sm); }

/* Texte collé depuis Word : on neutralise polices et tailles imposées */
html body .rich-editor-text :is(span,font,p,li)[style]{
  font-family:inherit !important; font-size:inherit !important; line-height:inherit !important;
}

/* Hiérarchie des titres */
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6{
  color:var(--bk-color-heading);
  font-weight:var(--bk-fw-bold) !important;
  line-height:var(--bk-lh-tight) !important;
  letter-spacing:var(--bk-ls-tight) !important;
  text-transform:none !important;
  margin:0 0 .5em;
  overflow-wrap:break-word;
}
html body h1{ font-size:var(--bk-fs-h1) !important; }
/* Dans le contenu, un H1 n'est jamais plus grand qu'un titre de section (le vrai H1 est le titre de la page) */
html body .main-section h1{ font-size:var(--bk-fs-h2) !important; }
html body h2{ font-size:var(--bk-fs-h2) !important; }
html body h3{ font-size:var(--bk-fs-h3) !important; line-height:var(--bk-lh-snug) !important; }
html body h4{ font-size:var(--bk-fs-h4) !important; line-height:var(--bk-lh-snug) !important; font-weight:var(--bk-fw-semi) !important; }
html body h5{ font-size:var(--bk-fs-h5) !important; line-height:var(--bk-lh-snug) !important; font-weight:var(--bk-fw-semi) !important; letter-spacing:0 !important; }
html body h6{ font-size:var(--bk-fs-h6) !important; line-height:var(--bk-lh-snug) !important; font-weight:var(--bk-fw-semi) !important; letter-spacing:0 !important; }
html body :is(h1,h2,h3,h4,h5,h6) a,
html body :is(.cs-post-title, .cs-element-title) :is(h1,h2,h3,h4,h5,h6) a{
  color:inherit !important; font-size:inherit !important; font-weight:inherit !important;
  line-height:inherit !important; letter-spacing:inherit !important; text-transform:inherit !important;
}
html body .cs-element-title h2{ font-size:var(--bk-fs-h3) !important; font-weight:var(--bk-fw-bold) !important; letter-spacing:var(--bk-ls-tight) !important; text-transform:none !important; }
html body :is(h1,h2,h3,h4,h5,h6) a:hover{ color:var(--bk-color-link) !important; }

/* Texte d'introduction & textes secondaires */
.bk-lead, html body .heading-description, html body .heading-description *{
  font-size:var(--bk-fs-lead) !important; line-height:1.55 !important; color:var(--bk-muted) !important;
  font-family:var(--bk-font) !important; letter-spacing:0 !important;
}
html body .post-options, html body .cs-post-date, html body .post-date,
html body .cs-location, html body .breadcrumb-nav, html body .post-comment{
  font-size:var(--bk-fs-sm) !important; color:var(--bk-muted) !important; letter-spacing:0 !important;
}

/* Contenus éditoriaux : largeur de lecture confortable */
html body .rich-editor-text{ font-size:var(--bk-fs-body); line-height:var(--bk-lh-body); color:var(--bk-text); }
html body .rich-editor-text :is(ul,ol){ padding-left:1.25em; margin:0 0 1em; }
html body .rich-editor-text li{ margin-bottom:.35em; }
html body .rich-editor-text :is(h1,h2,h3,h4,h5,h6){ margin:1.4em 0 .5em; }
html body blockquote{
  border-left:3px solid var(--bk-brand-orange); background:var(--bk-surface);
  padding:var(--bk-space-5) var(--bk-space-6); border-radius:0 var(--bk-radius-md) var(--bk-radius-md) 0;
  color:var(--bk-ink); font-size:var(--bk-fs-lead);
}
html body hr{ border:0; border-top:1px solid var(--bk-border); margin:var(--bk-space-7) 0; }
html body ::selection{ background:var(--bk-blue-100); color:var(--bk-ink); }

/* --------------------------------------------------------------------------
   2. LIENS
   -------------------------------------------------------------------------- */
html body a{
  color:var(--bk-color-link);
  text-decoration:none;
  transition:color var(--bk-t-fast), background-color var(--bk-t-fast), border-color var(--bk-t-fast), box-shadow var(--bk-t-base), transform var(--bk-t-base);
}
html body a:hover{ color:var(--bk-color-link-hover); }
/* Liens dans un texte : soulignés pour être repérables sans la couleur */
html body :is(.rich-editor-text, .rich-text-editor, .cs-blog-detail .cs-editor-text, .entry-content) p a,
html body :is(.rich-editor-text, .rich-text-editor, .entry-content) li a{
  color:var(--bk-color-link) !important;
  text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px;
  text-decoration-color:color-mix(in srgb, var(--bk-color-link) 45%, transparent);
  word-break:break-word;
}
html body :is(.rich-editor-text, .rich-text-editor, .entry-content) :is(p,li) a:hover{ text-decoration-color:currentColor; }

/* Couleur d'accent du thème (« .cs-color ») = bleu Baara interactif */
html body .cs-color, html body a.cs-color, html body i.cs-color{ color:var(--bk-blue-600) !important; }
html body .csborder-color{ border-color:var(--bk-blue-600) !important; }

/* --------------------------------------------------------------------------
   3. FOCUS & ACCESSIBILITÉ
   -------------------------------------------------------------------------- */
html body :is(a,button,input,select,textarea,summary,[tabindex]):focus{ outline:none; }
html body :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2px solid var(--bk-blue-600) !important;
  outline-offset:2px !important;
  box-shadow:var(--bk-focus-ring) !important;
  border-radius:var(--bk-radius-sm);
}
.bk-skip-link{
  position:absolute; left:16px; top:-100px; z-index:100000;
  background:var(--bk-ink); color:#fff !important; padding:12px 18px; border-radius:var(--bk-radius-md);
  font-weight:var(--bk-fw-semi); transition:top var(--bk-t-fast);
}
.bk-skip-link:focus{ top:12px; }
.bk-sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
html, body{ overflow-x:clip; }
html body img{ max-width:100%; height:auto; }

/* --------------------------------------------------------------------------
   4. BOUTONS
   4 variantes : principal (bleu) · secondaire (contour) · prioritaire
   (orange) · discret (transparent).  États : hover, focus, active,
   disabled, loading ([aria-busy="true"] ou .is-loading).
   -------------------------------------------------------------------------- */
.bk-btn,
html body .btn-primary,
html body a.cs-bgcolor, html body button.cs-bgcolor, html body input.cs-bgcolor,
html body #header #btn-header-main-login,
html body input[type="submit"], html body button[type="submit"],
html body .wpcf7-submit,
html body .woocommerce :is(a.button, button.button, input.button, #respond input#submit),
html body .bk-ao-submit, html body .jobalert-submit, html body .acc-submit input,
html body .user-submit input, html body .cs-button,
html body .bbp-submit-wrapper button,
html body .apply-buttons a.applied_icon, html body .bk-apply-btn, html body .bk-ao-promo a{
  --_bg: var(--bk-blue-600); --_bg-h: var(--bk-blue-700); --_bg-a: var(--bk-blue-800);
  --_fg: #fff; --_bd: var(--_bg); --_bd-h: var(--_bg-h);
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:var(--bk-control-h);
  padding:0 22px !important;
  background:var(--_bg) !important;
  color:var(--_fg) !important;
  border:1.5px solid var(--_bd) !important;
  border-radius:var(--bk-radius-md) !important;
  font-family:var(--bk-font) !important;
  font-size:var(--bk-fs-body) !important;
  font-weight:var(--bk-fw-semi) !important;
  line-height:1.2 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  text-decoration:none !important;
  text-align:center;
  white-space:nowrap;
  box-shadow:none !important;
  cursor:pointer;
  transition:background-color var(--bk-t-fast), border-color var(--bk-t-fast), color var(--bk-t-fast), box-shadow var(--bk-t-base), transform var(--bk-t-fast);
  -webkit-appearance:none; appearance:none;
}
.bk-btn:hover,
html body .btn-primary:hover,
html body a.cs-bgcolor:hover, html body button.cs-bgcolor:hover, html body input.cs-bgcolor:hover,
html body #header #btn-header-main-login:hover,
html body input[type="submit"]:hover, html body button[type="submit"]:hover,
html body .wpcf7-submit:hover,
html body .woocommerce :is(a.button, button.button, input.button):hover,
html body .bk-ao-submit:hover, html body .jobalert-submit:hover, html body .cs-button:hover,
html body .apply-buttons a.applied_icon:hover, html body .bk-apply-btn:hover, html body .bk-ao-promo a:hover{
  background:var(--_bg-h) !important; border-color:var(--_bd-h) !important; color:var(--_fg) !important;
  box-shadow:0 6px 16px -6px color-mix(in srgb, var(--_bg) 60%, transparent) !important;
}
.bk-btn:active,
html body a.cs-bgcolor:active, html body input[type="submit"]:active, html body button[type="submit"]:active,
html body #header #btn-header-main-login:active, html body .bk-ao-submit:active{
  background:var(--_bg-a, var(--_bg-h)) !important; transform:translateY(1px); box-shadow:none !important;
}
.bk-btn:is(:disabled,[aria-disabled="true"],.is-disabled),
html body :is(input[type="submit"],button[type="submit"],.cs-bgcolor):disabled{
  background:var(--bk-surface-2) !important; border-color:var(--bk-border) !important;
  color:var(--bk-subtle) !important; cursor:not-allowed; box-shadow:none !important; transform:none;
}
.bk-btn:is([aria-busy="true"],.is-loading),
html body :is(input,button)[aria-busy="true"]{
  position:relative; color:transparent !important; pointer-events:none;
}
.bk-btn:is([aria-busy="true"],.is-loading)::after{
  content:""; position:absolute; inset:0; margin:auto; width:18px; height:18px;
  border:2px solid rgba(255,255,255,.5); border-top-color:#fff; border-radius:50%;
  animation:bk-spin .8s linear infinite;
}
@keyframes bk-spin{ to{ transform:rotate(360deg); } }

/* Variante : secondaire (fond blanc, texte bleu, bordure discrète) */
.bk-btn--secondary,
html body .bk-btn-outline,
html body .email-jobs-top,
html body .company-info .cs-text > a,
html body .bk-cv-btn{
  --_bg:#fff; --_bg-h:var(--bk-blue-50); --_bg-a:var(--bk-blue-100);
  --_fg:var(--bk-blue-600); --_bd:var(--bk-border-strong); --_bd-h:var(--bk-blue-600);
}
html body :is(.bk-btn--secondary,.bk-btn-outline,.email-jobs-top,.company-info .cs-text > a,.bk-cv-btn){
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:var(--bk-control-h-sm); padding:0 18px !important;
  background:var(--_bg) !important; color:var(--_fg) !important;
  border:1.5px solid var(--_bd) !important; border-radius:var(--bk-radius-md) !important;
  font-size:var(--bk-fs-sm) !important; font-weight:var(--bk-fw-semi) !important;
  text-transform:none !important; letter-spacing:0 !important; text-decoration:none !important;
  box-shadow:none !important; cursor:pointer;
  transition:background-color var(--bk-t-fast), border-color var(--bk-t-fast), color var(--bk-t-fast);
}
html body :is(.bk-btn--secondary,.bk-btn-outline,.email-jobs-top,.company-info .cs-text > a,.bk-cv-btn):hover{
  background:var(--_bg-h) !important; border-color:var(--_bd-h) !important; color:var(--bk-blue-700) !important;
}

/* Variante : prioritaire (orange Kuma) — réservée aux actions clés
   (Postuler, publier une offre, appel à l'action principal d'un bloc) */
.bk-btn--accent,
html body .apply-buttons a.applied_icon,
html body .bk-apply-btn,
html body .bk-ao-promo a{
  --_bg:var(--bk-orange-600); --_bg-h:var(--bk-orange-700); --_bg-a:var(--bk-orange-700);
}

/* Variante : discret (transparent) */
.bk-btn--ghost{
  --_bg:transparent; --_bg-h:var(--bk-surface-2); --_bg-a:var(--bk-border);
  --_fg:var(--bk-ink); --_bd:transparent; --_bd-h:transparent;
}
.bk-btn--ghost:hover{ color:var(--bk-ink) !important; box-shadow:none !important; }

/* Tailles */
.bk-btn--sm{ min-height:var(--bk-control-h-sm); padding:0 16px !important; font-size:var(--bk-fs-sm) !important; }
.bk-btn--lg{ min-height:56px; padding:0 28px !important; font-size:1.0625rem !important; }
.bk-btn--block{ display:flex; width:100%; }

/* --------------------------------------------------------------------------
   5. FORMULAIRES
   -------------------------------------------------------------------------- */
html body :is(input[type="text"],input[type="email"],input[type="password"],input[type="tel"],
  input[type="url"],input[type="number"],input[type="search"],input[type="date"],
  select,textarea,.form-control){
  font-family:var(--bk-font) !important;
  font-size:var(--bk-fs-body) !important;  /* 16 px : évite le zoom auto sur iPhone */
  color:var(--bk-ink) !important;
  background-color:#fff;
  border:1px solid var(--bk-border-strong) !important;
  border-radius:var(--bk-radius-md) !important;
  box-shadow:var(--bk-shadow-xs) !important;
  transition:border-color var(--bk-t-fast), box-shadow var(--bk-t-fast);
}
/* Hauteur et marges internes sans spécificité : les champs avec icône du
   thème (.input-holder, filtres…) gardent leur propre retrait. */
:where(input[type="text"],input[type="email"],input[type="password"],input[type="tel"],
  input[type="url"],input[type="number"],input[type="search"],input[type="date"],select,.form-control){
  min-height:var(--bk-control-h); padding-left:14px; padding-right:14px;
}
:where(textarea){ min-height:120px; padding:12px 14px; line-height:1.5; }
html body :is(input,select,textarea,.form-control)::placeholder{ color:var(--bk-subtle) !important; opacity:1; }
html body :is(input,select,textarea,.form-control):hover{ border-color:var(--bk-subtle) !important; }
html body :is(input,select,textarea,.form-control):focus{
  border-color:var(--bk-blue-600) !important;
  box-shadow:var(--bk-focus-ring) !important;
  outline:none !important;
}
html body :is(input,select,textarea)[aria-invalid="true"],
html body .wpcf7-not-valid{ border-color:var(--bk-danger) !important; }
html body .wpcf7-not-valid-tip, html body .validation.error label{ color:var(--bk-danger) !important; font-size:var(--bk-fs-sm) !important; }
html body label{ color:var(--bk-ink); font-weight:var(--bk-fw-medium); font-size:var(--bk-fs-sm); }
html body :is(form, .input-filed-contact, .input-filed) label{ text-transform:none !important; letter-spacing:0 !important; }
html body input[type="checkbox"], html body input[type="radio"]{ accent-color:var(--bk-blue-600); width:18px; height:18px; }
html body .wpcf7-response-output{ border-radius:var(--bk-radius-md) !important; padding:12px 16px !important; font-size:var(--bk-fs-sm); }

/* --------------------------------------------------------------------------
   6. BADGES & ÉTIQUETTES
   -------------------------------------------------------------------------- */
.bk-badge,
html body .jobtype-btn, html body a.jobtype-btn, html body .jobs-info a.freelance,
html body .bk-ao-tag, html body .bk-job-type, html body .cs-tags ul li a, html body .tag-list li a{
  display:inline-flex; align-items:center; gap:6px;
  min-height:26px; padding:2px 12px !important;
  border-radius:var(--bk-radius-pill) !important;
  background:var(--bk-blue-50) !important; color:var(--bk-blue-700) !important;
  border:0 !important;
  font-size:var(--bk-fs-xs) !important; font-weight:var(--bk-fw-semi) !important;
  line-height:1.4 !important; letter-spacing:0 !important; text-transform:none !important;
  white-space:nowrap; box-shadow:none !important;
}
.bk-badge--accent, html body .bk-ao-tag-new{ background:var(--bk-orange-50) !important; color:var(--bk-orange-700) !important; }
.bk-badge--neutral, html body .bk-cv-tag{ background:var(--bk-surface-2) !important; color:var(--bk-text) !important; font-weight:var(--bk-fw-medium) !important; }
.bk-badge--success{ background:var(--bk-success-bg) !important; color:var(--bk-success) !important; }

/* --------------------------------------------------------------------------
   7. CARTES (base commune)
   -------------------------------------------------------------------------- */
.bk-card{
  background:#fff; border:1px solid var(--bk-border); border-radius:var(--bk-radius-lg);
  box-shadow:var(--bk-shadow-card); padding:var(--bk-space-6);
  transition:box-shadow var(--bk-t-base), border-color var(--bk-t-base), transform var(--bk-t-base);
}
.bk-card--link:hover{ box-shadow:var(--bk-shadow-hover); border-color:var(--bk-border-strong); transform:translateY(-3px); }

/* --------------------------------------------------------------------------
   8. EN-TÊTE
   -------------------------------------------------------------------------- */
/* L'en-tête « transparent » du thème recouvrait le haut du slider : on le
   remet dans le flux de la page. Le slider reste intact et entièrement visible. */
html body #header, html body #header.cs-transparent-header{
  position:relative !important; top:auto !important; background:#fff !important;
  z-index:auto !important; box-shadow:none; padding-left:0 !important; padding-right:0 !important;
}

/* Barre du haut : sobre, sur fond gris clair */
html body #header .top-bar{
  background:var(--bk-surface) !important; border-bottom:1px solid var(--bk-border) !important;
  padding:6px 0 !important; min-height:0;
}
html body #header .top-bar :is(span,li,a,div,.tagline){ color:var(--bk-muted) !important; font-size:var(--bk-fs-xs) !important; }
html body #header .top-bar a:hover{ color:var(--bk-blue-600) !important; }
html body #header .top-bar .text-right{ display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:6px 16px; }
html body #header .top-bar .text-right > div{ float:none !important; margin:0 !important; }
html body #header .top-bar .contact-detail ul{ display:inline-flex; flex-wrap:wrap; gap:4px 18px; margin:0; }
html body #header .top-bar ul{ padding:0 !important; }
html body #header .top-bar :is(.contact-detail, .social-media) li{ padding:0 !important; margin:0 !important; border:0 !important; float:none !important; }
html body #header .top-bar .contact-detail li i{ margin-right:6px; }
html body #header .top-bar .social-media ul{ display:inline-flex; gap:4px; margin:0 !important; }
html body #header .top-bar .social-media a{
  display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px;
  border-radius:50%; background:transparent !important; color:var(--bk-muted) !important;
}
html body #header .top-bar .social-media a:hover{ background:var(--bk-blue-50) !important; color:var(--bk-blue-600) !important; }
html body #header .top-bar .social-media i{ font-size:13px; color:inherit !important; }

/* Bandeau principal */
html body #header .main-head{
  background:#fff !important; border-bottom:1px solid var(--bk-border);
  box-shadow:none; padding:0 !important;
}
html body #header .main-head > .navbar{ min-height:var(--bk-header-h); margin:0 auto; border:0; background:transparent; }
html body #header .main-head > .navbar > .row{ display:flex; align-items:center; min-height:var(--bk-header-h); flex-wrap:nowrap; }
html body #header .main-head > .navbar > .row::before, html body #header .main-head > .navbar > .row::after{ display:none; }
html body #header .main-head .logo{ margin:8px 0 !important; padding:0 !important; }
html body #header .main-head .logo img{ display:block; width:auto !important; height:60px !important; max-width:none !important; }
html body #header .main-head .logo.sticky{ display:none; }
html body #header .main-head .nav-right-area{ display:flex; align-items:center; justify-content:flex-end; gap:8px; float:none !important; }

/* En-tête collant (plugin scroll-to-fixed du thème) */
html body #header .main-head.scroll-to-fixed-fixed{
  left:0 !important; right:0; width:100% !important; z-index:1000;
  box-shadow:0 6px 20px -8px rgba(16,24,40,.18);
}
html body #header .main-head.scroll-to-fixed-fixed .logo:not(.sticky){ display:none; }
html body #header .main-head.scroll-to-fixed-fixed .logo.sticky{ display:block; margin:6px 0 !important; }
html body #header .main-head.scroll-to-fixed-fixed .logo.sticky img{ height:46px !important; width:auto !important; }

/* Menu principal */
html body #header .main-head .navigation{ float:none !important; }
html body #header .main-head .navbar-nav{ display:flex; align-items:center; gap:2px; float:none !important; margin:0 !important; }
html body #header .main-head .navbar-nav > li{ float:none !important; position:relative; }
html body #header .main-head .navbar-nav > li > a{
  display:flex !important; align-items:center; gap:4px;
  padding:10px 14px !important; margin:0 !important;
  color:var(--bk-ink) !important; background:transparent !important;
  font-size:var(--bk-fs-nav) !important; font-weight:var(--bk-fw-medium) !important;
  letter-spacing:0 !important; text-transform:none !important; line-height:1.3 !important;
  border-radius:var(--bk-radius-md); white-space:nowrap;
}
html body #header .main-head .navbar-nav > li > a:hover,
html body #header .main-head .navbar-nav > li:hover > a,
html body #header .main-head .navbar-nav > li:focus-within > a{ color:var(--bk-blue-600) !important; background:var(--bk-blue-50) !important; }
html body #header .main-head .navbar-nav > li:is(.current-menu-item,.current-menu-ancestor,.current-menu-parent,.current_page_item) > a{
  color:var(--bk-blue-600) !important;
}
html body #header .main-head .navbar-nav > li:is(.current-menu-item,.current-menu-ancestor,.current-menu-parent) > a::after{
  content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:2px; border-radius:2px; background:var(--bk-blue-600);
}
/* « Accueil » pointe vers /# : pas d'état actif trompeur sur la page d'accueil */
html body.home #header .main-head .navbar-nav > li.menu-item-home > a{ color:var(--bk-ink) !important; }
html body.home #header .main-head .navbar-nav > li.menu-item-home > a::after{ display:none; }

/* Menus déroulants */
html body #header .main-head .navbar-nav .dropdown-menu{
  min-width:240px; padding:8px !important; margin-top:6px !important;
  background:#fff !important; border:1px solid var(--bk-border) !important;
  border-radius:var(--bk-radius-lg) !important; box-shadow:var(--bk-shadow-pop) !important;
}
html body #header .main-head .navbar-nav .dropdown-menu::before{ display:none !important; }
html body #header .main-head .navbar-nav .dropdown-menu li{ float:none; border:0 !important; }
html body #header .main-head .navbar-nav .dropdown-menu li > a{
  display:block; padding:9px 12px !important; border-radius:var(--bk-radius-sm);
  color:var(--bk-text) !important; background:transparent !important;
  font-size:var(--bk-fs-sm) !important; font-weight:var(--bk-fw-medium) !important;
  letter-spacing:0 !important; text-transform:none !important; line-height:1.4 !important; border:0 !important;
}
html body #header .main-head .navbar-nav .dropdown-menu li > a:hover,
html body #header .main-head .navbar-nav .dropdown-menu li > a:focus-visible{ color:var(--bk-blue-700) !important; background:var(--bk-blue-50) !important; }
html body #header .main-head .navbar-nav .dropdown-menu li.current-menu-item > a{ color:var(--bk-blue-600) !important; font-weight:var(--bk-fw-semi) !important; }
html body #header .main-head .navbar-nav .dropdown-menu .dropdown-menu{ margin:0 0 0 8px !important; top:-9px; }
/* Ouverture au clavier aussi (et pas seulement à la souris) */
@media (min-width:992px){
  html body #header .main-head .navbar-nav li:focus-within > .dropdown-menu{ display:block; opacity:1; visibility:visible; }
}

/* Zone connexion / inscription */
html body #header .cs-login-area{ margin-left:10px !important; padding:0 !important; }
html body #header .cs-login-area .cs-loginsec ul, html body #header .cs-login-area .cs-drp-dwn{ margin:0 !important; padding:0 !important; }
html body #header .user-account .join-us{ display:flex; align-items:center; gap:6px; }
html body #header .user-account div.join-us{ gap:14px; }
html body #header .user-account div.join-us > i{ display:none; }
html body #header .user-account a.join-us{
  color:var(--bk-ink) !important; font-size:var(--bk-fs-nav) !important; font-weight:var(--bk-fw-semi) !important;
  text-transform:none !important; letter-spacing:0 !important; padding:8px 4px !important; border:0 !important;
}
html body #header .user-account a.join-us:hover{ color:var(--bk-blue-600) !important; }
html body #header #btn-header-main-login{ min-height:42px; padding:0 18px !important; font-size:var(--bk-fs-sm) !important; }
html body #header #btn-header-main-login i{ color:#fff !important; font-size:15px; margin:0 !important; }

/* Bouton recherche */
html body #header .main-head .search-bar a{
  display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px;
  border-radius:50%; color:var(--bk-ink) !important; background:transparent; border:0;
}
html body #header .main-head .search-bar a:hover{ background:var(--bk-surface-2); color:var(--bk-blue-600) !important; }
html body #header .main-head .search-bar i{ color:inherit !important; font-size:17px; }
/* Flèche des menus déroulants : dans le flux, après le libellé */
html body #header .main-head .navbar-nav > li > a::before{
  position:static !important; order:2; font-size:10px !important; line-height:1; margin:2px 0 0 2px;
  color:var(--bk-muted) !important; width:auto !important; height:auto !important;
}
html body #header .main-head .navbar-nav > li:hover > a::before{ color:currentColor !important; }
html body #search{ background:rgba(32,33,36,.92) !important; }
html body #search input[type="search"], html body #search input[type="text"]{
  background:transparent !important; color:#fff !important; border:0 !important; border-bottom:2px solid rgba(255,255,255,.4) !important;
  border-radius:0 !important; box-shadow:none !important; font-size:clamp(1.5rem, 1rem + 2vw, 2.5rem) !important;
}

/* Menu mobile (SlickNav) */
html body .slicknav_menu{ background:transparent !important; padding:0 !important; }
html body .slicknav_btn{
  background:#fff !important; border:1px solid var(--bk-border-strong) !important; border-radius:var(--bk-radius-md) !important;
  margin:0 !important; padding:10px 11px !important; box-shadow:none !important; text-shadow:none !important;
}
html body .slicknav_btn .slicknav_icon-bar{ background:var(--bk-ink) !important; box-shadow:none !important; width:20px; }
html body .slicknav_nav{
  position:absolute; left:0; right:0; top:100%; z-index:1001;
  background:#fff !important; border-top:1px solid var(--bk-border); box-shadow:var(--bk-shadow-pop);
  padding:8px 12px 16px !important; max-height:calc(100vh - 120px); overflow-y:auto; text-align:left;
}
html body .slicknav_nav :is(a,.slicknav_row){
  color:var(--bk-ink) !important; font-size:var(--bk-fs-body) !important; font-weight:var(--bk-fw-medium) !important;
  text-transform:none !important; letter-spacing:0 !important; padding:12px 10px !important; margin:0 !important;
  border-radius:var(--bk-radius-sm); border-bottom:0 !important; background:transparent !important;
}
html body .slicknav_nav :is(a,.slicknav_row):hover{ background:var(--bk-blue-50) !important; color:var(--bk-blue-700) !important; }
html body .slicknav_nav li{ border-bottom:1px solid var(--bk-border) !important; }
html body .slicknav_nav li:last-child{ border-bottom:0 !important; }
html body .slicknav_nav ul{ margin:0 0 8px 12px !important; }
html body .slicknav_nav ul li{ border:0 !important; }
html body .slicknav_nav ul a{ font-size:var(--bk-fs-sm) !important; color:var(--bk-text) !important; padding:9px 10px !important; }
html body .slicknav_nav a.slicknav_row{ display:flex !important; align-items:center; justify-content:space-between; gap:8px; }
html body .slicknav_nav a.slicknav_row > a{ flex:1 1 auto; padding:0 !important; }
html body .slicknav_arrow{
  display:inline-flex !important; align-items:center; justify-content:center; flex:0 0 28px; width:28px; height:28px; margin:0 !important;
  border-radius:50%; background:var(--bk-surface-2); color:var(--bk-muted) !important; font-size:11px !important;
}
html body .slicknav_arrow i{ display:none !important; }
html body .slicknav_arrow::before{
  content:""; display:block; width:7px; height:7px; border:solid var(--bk-ink); border-width:0 2px 2px 0;
  transform:translateY(-2px) rotate(45deg); transition:transform var(--bk-t-fast);
}
html body .slicknav_open > a > .slicknav_arrow::before{ transform:translateY(2px) rotate(-135deg); }
html body .slicknav_nav .dropdown-menu{
  position:static !important; float:none !important; min-width:0 !important; box-shadow:none !important; border:0 !important;
  background:transparent !important; padding:0 0 6px 12px !important; margin:0 !important; border-radius:0 !important;
}

/* --------------------------------------------------------------------------
   9. BANDEAU DE TITRE DES PAGES (.cs-subheader)
   Par défaut : bandeau bleu profond (le texte du constructeur est blanc).
   Quand le script de nettoyage tourne (html.bk-clean), le texte imposé en
   blanc est retiré et le bandeau devient clair, plus aéré.
   -------------------------------------------------------------------------- */
html body .cs-subheader{
  position:relative; isolation:isolate;
  padding:clamp(40px, 2rem + 3vw, 80px) 0 clamp(36px, 1.75rem + 2.5vw, 64px) !important;
  min-height:0 !important; text-align:left; margin:0 !important;
  background:#08364A !important; /* bleu Baara très profond (dérivé de #009CD0) */
  border:0 !important;
}
html body .cs-subheader .container{ position:relative; z-index:1; }
html body .cs-subheader .cs-page-title{ float:none !important; width:auto !important; margin:0 !important; padding:0 !important; }
html body .cs-subheader h1{
  color:#fff !important; margin:0 !important; max-width:900px;
  font-size:clamp(1.875rem, 1.35rem + 2vw, 2.875rem) !important; /* 30 → 46 px */
  line-height:1.15 !important; letter-spacing:var(--bk-ls-tight) !important; text-transform:none !important;
  font-weight:var(--bk-fw-bold) !important;
}
html body .cs-subheader p{
  color:rgba(255,255,255,.85) !important; max-width:760px; margin:12px 0 0 !important;
  font-size:var(--bk-fs-lead) !important; line-height:1.6 !important;
}
html body .cs-subheader .breadcrumb{ float:none !important; margin:14px 0 0 !important; padding:0 !important; background:none !important; }
html body .cs-subheader .breadcrumb .row{ margin:0; }
html body .cs-subheader .breadcrumb .col-md-12{ padding:0; }
html body .cs-subheader .breadcrumb-nav{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 !important; padding:0 !important; background:none !important; }
html body .cs-subheader .breadcrumb-nav li{ float:none !important; padding:0 !important; color:rgba(255,255,255,.75) !important; font-size:var(--bk-fs-sm) !important; }
html body .cs-subheader .breadcrumb-nav li a{ color:#fff !important; }
html body .cs-subheader .breadcrumb-nav li + li::before{ content:"/" !important; margin-right:6px; opacity:.6; }
html body .cs-subheader .breadcrumb-nav li::after{ display:none !important; }

/* Version claire (après nettoyage des couleurs imposées) */
html.bk-clean body .cs-subheader{
  background:
    radial-gradient(600px 240px at 100% 0%, rgba(0,156,208,.10), transparent 70%),
    radial-gradient(420px 200px at 0% 100%, rgba(240,125,45,.08), transparent 70%),
    var(--bk-surface) !important;
  border-bottom:1px solid var(--bk-border) !important;
}
html.bk-clean body .cs-subheader h1{ color:var(--bk-ink) !important; }
html.bk-clean body .cs-subheader p{ color:var(--bk-muted) !important; }
html.bk-clean body .cs-subheader .breadcrumb-nav li{ color:var(--bk-muted) !important; }
html.bk-clean body .cs-subheader .breadcrumb-nav li a{ color:var(--bk-blue-600) !important; }
html body .cs-subheader .overlay{ display:none !important; }
html body .cs-subheader + .main-section > .page-section:first-child{ padding-top:clamp(32px, 1.5rem + 1.5vw, 56px) !important; }

/* --------------------------------------------------------------------------
   10. SECTIONS DU CONSTRUCTEUR & TITRES DE SECTION
   -------------------------------------------------------------------------- */
html body .main-section > .page-section,
html body .wrapper > .page-section{
  padding-top:var(--bk-section-y) !important; padding-bottom:var(--bk-section-y) !important;
}
html body .cs-heading{ margin-bottom:clamp(28px, 1.5rem + 1.5vw, 48px) !important; text-align:center; }
html body .cs-heading :is(h1,h2,h3){
  font-size:var(--bk-fs-h2) !important; font-weight:var(--bk-fw-bold) !important;
  letter-spacing:var(--bk-ls-tight) !important; line-height:1.2 !important;
  color:var(--bk-ink); margin:0 0 10px !important;
}
/* Titres saisis en MAJUSCULES dans le constructeur → casse de phrase */
html.bk-clean body :is(.cs-heading, .cs-element-title) :is(h1,h2,h3){ text-transform:lowercase !important; }
html.bk-clean body :is(.cs-heading, .cs-element-title) :is(h1,h2,h3)::first-letter{ text-transform:uppercase; }
html body .cs-heading .heading-description{ max-width:640px; margin:0 auto !important; }
html body .cs-heading .heading-description span{ font-size:inherit !important; color:inherit !important; }
html body .cs-heading .spliter-medium, html body .cs-heading .zigzag-separator{ display:none !important; }
html body .cs-heading::after{
  content:""; display:block; width:40px; height:3px; border-radius:3px;
  background:var(--bk-brand-orange); margin:18px auto 0;
}
/* Titres alignés à gauche dans le constructeur : filet et description suivent */
html body .cs-heading:has([style*="text-align: left" i], [style*="text-align:left" i]){ text-align:left; }
html body .cs-heading:has([style*="text-align: left" i], [style*="text-align:left" i]) .heading-description{ margin-left:0 !important; text-align:left !important; }
html body .cs-heading:has([style*="text-align: left" i], [style*="text-align:left" i])::after{ margin-left:0; }

/* --------------------------------------------------------------------------
   11. PAGINATION
   -------------------------------------------------------------------------- */
html body :is(.pagination, ul.page-numbers, .cs-pagination ul, .woocommerce-pagination ul){
  display:flex !important; flex-wrap:wrap; justify-content:center; gap:6px; border:0 !important; padding:0; margin:var(--bk-space-8) 0 0 !important;
}
html body :is(.pagination, ul.page-numbers, .cs-pagination ul, .woocommerce-pagination ul) li{ float:none !important; border:0 !important; margin:0 !important; }
html body :is(.pagination, ul.page-numbers, .cs-pagination ul, .woocommerce-pagination ul) li :is(a,span){
  display:inline-flex !important; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 12px !important;
  border-radius:var(--bk-radius-md) !important; border:1px solid var(--bk-border) !important; background:#fff !important;
  color:var(--bk-ink) !important; font-weight:var(--bk-fw-semi) !important; font-size:var(--bk-fs-sm) !important; float:none !important;
}
html body :is(.pagination, ul.page-numbers, .cs-pagination ul, .woocommerce-pagination ul) li a:hover{ border-color:var(--bk-blue-600) !important; color:var(--bk-blue-600) !important; }
html body :is(.pagination, ul.page-numbers, .cs-pagination ul, .woocommerce-pagination ul) li :is(.current, .active a, span.current),
html body :is(.pagination, .cs-pagination ul) li.active :is(a,span){
  background:var(--bk-blue-600) !important; border-color:var(--bk-blue-600) !important; color:#fff !important;
}

/* --------------------------------------------------------------------------
   12. PIED DE PAGE
   -------------------------------------------------------------------------- */
html body footer#footer, html body #footer .cs-footer, html body #footer .footer-top{
  background:var(--bk-surface) !important; color:var(--bk-text);
}
html body #footer .cs-footer{ border-top:1px solid var(--bk-border); }
html body #footer .footer-top{ padding:clamp(48px, 2.5rem + 2vw, 72px) 0 clamp(24px, 1rem + 1vw, 40px) !important; }
html body #footer .widget{ margin-bottom:var(--bk-space-7) !important; }
html body #footer .widget-title{ border:0 !important; margin:0 0 16px !important; padding:0 !important; }
html body #footer .widget-title::before, html body #footer .widget-title::after{ display:none !important; }
html body #footer .widget-title :is(h2,h3,h4,h5,h6){
  color:var(--bk-ink) !important; font-size:var(--bk-fs-body) !important; font-weight:var(--bk-fw-bold) !important;
  letter-spacing:0 !important; text-transform:lowercase !important; margin:0 !important; padding:0 !important; border:0 !important;
}
html body #footer .widget-title :is(h2,h3,h4,h5,h6)::first-letter{ text-transform:uppercase; }
html body #footer .widget ul{ margin:0; padding:0; }
html body #footer .widget ul li{ padding:0 !important; margin:0 0 10px !important; border:0 !important; background:none !important; }
html body #footer .widget ul li::before{ display:none !important; }
html body #footer .widget ul li a{
  color:var(--bk-text) !important; font-size:var(--bk-fs-sm) !important; padding:0 !important;
  display:inline-block; line-height:1.5;
}
html body #footer .widget ul li a::before{ display:none !important; }
html body #footer .widget ul li a:hover{ color:var(--bk-blue-600) !important; transform:translateX(2px); }
html body #footer :is(p,span,li){ color:var(--bk-text); }

html body #footer .cs-copyright{
  background:#fff !important; border-top:1px solid var(--bk-border) !important; padding:20px 0 !important;
}
html body #footer .cs-copyright-area .row > div{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 24px; }
html body #footer .cs-copyright :is(p,span,a,li){ color:var(--bk-muted) !important; font-size:var(--bk-fs-sm) !important; }
html body #footer .cs-copyright a:hover{ color:var(--bk-blue-600) !important; }
html body #footer .footer-links{ order:2; }
html body #footer .footer-nav ul{ display:flex; flex-wrap:wrap; gap:6px 18px; margin:0 !important; padding:0; }
html body #footer .footer-nav ul li{ float:none !important; padding:0 !important; margin:0 !important; border:0 !important; }
html body #footer .footer-nav ul li::before, html body #footer .footer-nav ul li::after{ display:none !important; }
html body #footer .cs-copyright .social-media{ display:flex; gap:8px; margin:0 !important; padding:0; order:3; }
html body #footer .cs-copyright .social-media li{ margin:0 !important; padding:0 !important; float:none !important; }
html body #footer .cs-copyright .social-media a{
  display:inline-flex !important; align-items:center; justify-content:center; width:36px; height:36px;
  border-radius:50%; background:var(--bk-surface) !important; border:1px solid var(--bk-border); color:var(--bk-muted) !important;
}
html body #footer .cs-copyright .social-media a:hover{ background:var(--bk-blue-600) !important; border-color:var(--bk-blue-600); color:#fff !important; }
html body #footer .cs-copyright .social-media a i{ color:inherit !important; font-size:15px; background:none !important; }
html body footer#footer .back-to-top a{
  background:var(--bk-blue-600) !important; color:#fff !important; border-radius:50% !important; box-shadow:var(--bk-shadow-hover);
}

/* --------------------------------------------------------------------------
   13. ALERTES & MESSAGES
   -------------------------------------------------------------------------- */
html body :is(.woocommerce-message,.woocommerce-info,.woocommerce-error,.alert){
  border-radius:var(--bk-radius-md) !important; border:1px solid var(--bk-border) !important; border-left:4px solid var(--bk-blue-600) !important;
  background:#fff !important; color:var(--bk-text) !important; box-shadow:var(--bk-shadow-card) !important;
}
html body :is(.woocommerce-error,.alert-danger){ border-left-color:var(--bk-danger) !important; }
html body .alert-success{ border-left-color:var(--bk-success) !important; }

/* --------------------------------------------------------------------------
   14. RESPONSIVE (en-tête & bandeau)
   -------------------------------------------------------------------------- */
@media (max-width:991px){
  html body #header .main-head > .navbar > .row{ flex-wrap:wrap; }
  html body #header .main-head > .navbar > .row > [class*="col-"]{ width:auto; flex:1 1 auto; }
  html body #header .main-head .logo img{ height:52px !important; }
  html body #header .main-head .nav-right-area{ min-height:var(--bk-header-h); }
  html body #header .main-head .navigation .navbar-nav{ display:none; }
  html body #header .main-head .navigation .user-account{ display:flex !important; align-items:center; gap:10px; margin:0 !important; float:none !important; }
  html body #header .main-head .navigation .user-account .login{ margin:0 !important; }
  html body #header .main-head > .navbar > .row{ margin:0 !important; }
  html body #header .main-head > .navbar > .row > [class*="col-"]{ padding:0 !important; }
  html body #header .main-head > .navbar > .row > [class*="col-"]:first-child{ flex:0 0 auto; }
  html body #header .main-head .nav-right-area{ gap:10px; position:static !important; }
  html body #header .main-head .slicknav_menu{ order:3; }
  html body #header .main-head .navigation .user-account #btn-header-main-login{ display:inline-flex !important; }
  html body #header .top-bar .col-lg-5{ display:none; }
  html body #header .top-bar [class*="col-"]{ text-align:center !important; width:100%; }
  html body #header .top-bar .text-right{ justify-content:center; }
}
@media (max-width:767px){
  html body #header .top-bar{ display:none !important; } /* infos reprises dans le pied de page */
  html body #header .main-head .logo img{ height:44px !important; }
  html body #header .main-head .navigation .user-account a.join-us{ display:none; }
  html body #header #btn-header-main-login{ min-height:40px; padding:0 14px !important; }
  html body .cs-subheader h1{ font-size:clamp(1.625rem, 1.2rem + 2vw, 2rem) !important; }
  html body #footer .cs-copyright-area .row > div{ flex-direction:column; text-align:center; }
  html body #footer .footer-nav ul{ justify-content:center; }
}

/* --------------------------------------------------------------------------
   15. IMPRESSION
   -------------------------------------------------------------------------- */
@media print{
  html body :is(#header, .top-bar, #footer, .cs-banner, .slicknav_menu){ display:none !important; }
  html body .cs-subheader{ background:none !important; padding:0 0 12px !important; }
  html body .cs-subheader h1{ color:#000 !important; }
}