/* ============================================================
   leBroker — Surcharges CSS pour Tarteaucitron
   Design clair, lisible, avec états ON/OFF évidents
   ============================================================ */

/* ============================================================
   1. BANNIÈRE PRINCIPALE
   ============================================================ */

#tarteaucitronAlertBig {
  background: #0F1A2E !important;
  color: #FFFFFF !important;
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  padding: 24px 28px !important;
  max-width: 680px !important;
  width: calc(100% - 32px) !important;
  border-radius: 0 !important;
  box-shadow: 0 -4px 40px rgba(0, 0, 0, 0.25) !important;
  box-sizing: border-box !important;
  bottom: 16px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

#tarteaucitronAlertBig p,
#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert {
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  margin-bottom: 16px !important;
  text-align: left !important;
}

#tarteaucitronAlertBig button,
#tarteaucitronRoot button.tarteaucitronCTAButton {
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 11px 18px !important;
  border-radius: 0 !important;
  margin: 4px 4px 4px 0 !important;
  cursor: pointer !important;
  transition: opacity 0.2s ease !important;
  border: 1px solid transparent !important;
}

#tarteaucitronPersonalize,
#tarteaucitronPersonalize2 {
  background: #FFFFFF !important;
  color: #0F1A2E !important;
  border-color: #FFFFFF !important;
}

#tarteaucitronAllDenied2 {
  background: transparent !important;
  color: #FFFFFF !important;
  border-color: rgba(255, 255, 255, 0.45) !important;
}

#tarteaucitronCloseAlert {
  background: transparent !important;
  color: rgba(255, 255, 255, 0.75) !important;
  text-decoration: underline !important;
  border: none !important;
}

#tarteaucitronAlertBig a#tarteaucitronPrivacyUrl {
  background: transparent !important;
  color: rgba(255, 255, 255, 0.6) !important;
  text-decoration: underline !important;
  font-size: 12px !important;
  border: none !important;
}

/* ============================================================
   2. PANNEAU DE GESTION (modal détaillé)
   ============================================================ */

#tarteaucitronBack {
  background: rgba(11, 22, 38, 0.85) !important;
  opacity: 1 !important;
}

#tarteaucitron {
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
  background: transparent !important;
  max-width: 720px !important;
  width: calc(100% - 32px) !important;
  border-radius: 0 !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.3) !important;
  border: none !important;
  margin: 0 auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  top: 5vh !important;
  max-height: 90vh !important;
  overflow: hidden !important;
}

/* Titre du panneau */
#tarteaucitron #tarteaucitronClosePanel {
  background: #0F1A2E !important;
  color: #FFFFFF !important;
  font-family: 'Fraunces', serif !important;
  font-weight: 500 !important;
  font-size: 18px !important;
  padding: 18px 24px !important;
  border-radius: 0 !important;
}

#tarteaucitron #tarteaucitronCloseCross {
  color: #FFFFFF !important;
  background: transparent !important;
  font-size: 22px !important;
}

/* Section info en haut */
#tarteaucitron #tarteaucitronInfo {
  background: #F5F1EA !important;
  color: #0F1A2E !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  padding: 18px 24px !important;
  text-align: left !important;
  border: none !important;
  border-radius: 0 !important;
}

#tarteaucitron #tarteaucitronInfo a {
  color: #0F1A2E !important;
  text-decoration: underline !important;
}

#tarteaucitron a#tarteaucitronPrivacyUrlDialog {
  display: inline-block !important;
  background: #FFFFFF !important;
  color: #0F1A2E !important;
  padding: 8px 14px !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  margin-top: 10px !important;
  border: 1px solid #0F1A2E !important;
}

/* Conteneur des services */
#tarteaucitron #tarteaucitronServices {
  background: #FFFFFF !important;
  border-radius: 0 !important;
}

/* Boutons globaux "Tout accepter / Tout refuser" — en haut à droite */
#tarteaucitron #tarteaucitronAllAllowed,
#tarteaucitron .tarteaucitronAllAllow {
  background: #0F1A2E !important;
  color: #FFFFFF !important;
  border: 2px solid #0F1A2E !important;
  font-weight: 500 !important;
  padding: 10px 16px !important;
  border-radius: 0 !important;
  margin: 4px !important;
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
}

#tarteaucitron #tarteaucitronAllDenied,
#tarteaucitron .tarteaucitronAllDeny {
  background: #FFFFFF !important;
  color: #B33A3A !important;
  border: 2px solid #B33A3A !important;
  font-weight: 500 !important;
  padding: 10px 16px !important;
  border-radius: 0 !important;
  margin: 4px !important;
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
}

/* En-tête catégorie (Cookies obligatoires, Mesure d'audience) */
#tarteaucitron #tarteaucitronMainLineOffset,
#tarteaucitron .tarteaucitronMainLine {
  background: #F5F1EA !important;
  color: #0F1A2E !important;
  font-family: 'Fraunces', serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  padding: 14px 24px !important;
  border: none !important;
  border-bottom: 1px solid rgba(15, 26, 46, 0.08) !important;
}

/* Lignes de service individuelles */
#tarteaucitron .tarteaucitronLine {
  background: #FFFFFF !important;
  border-bottom: 1px solid rgba(15, 26, 46, 0.08) !important;
  padding: 18px 24px !important;
}

#tarteaucitron .tarteaucitronName {
  width: 60% !important;
  padding-right: 16px !important;
  box-sizing: border-box !important;
}

#tarteaucitron .tarteaucitronName .tarteaucitronH3 {
  font-family: 'Fraunces', serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  color: #0F1A2E !important;
  margin: 0 0 4px 0 !important;
  line-height: 1.3 !important;
}

#tarteaucitron .tarteaucitronName a,
#tarteaucitron .tarteaucitronName .tarteaucitronListCookies {
  font-size: 12px !important;
  color: rgba(15, 26, 46, 0.65) !important;
}

#tarteaucitron .tarteaucitronAsk {
  width: 40% !important;
  text-align: right !important;
  padding: 0 !important;
}

/* ============================================================
   BOUTONS AUTORISER / INTERDIRE — États très visibles
   ============================================================ */

/* État par défaut (en attente) */
#tarteaucitron .tarteaucitronAllow,
#tarteaucitron button.tarteaucitronAllow {
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 9px 16px !important;
  border-radius: 0 !important;
  cursor: pointer !important;
  margin: 2px !important;
  min-width: 95px !important;
  background: #FFFFFF !important;
  color: rgba(15, 26, 46, 0.45) !important;
  border: 2px solid rgba(15, 26, 46, 0.25) !important;
  transition: all 0.15s ease !important;
}

#tarteaucitron .tarteaucitronDeny,
#tarteaucitron button.tarteaucitronDeny {
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 9px 16px !important;
  border-radius: 0 !important;
  cursor: pointer !important;
  margin: 2px !important;
  min-width: 95px !important;
  background: #FFFFFF !important;
  color: rgba(15, 26, 46, 0.45) !important;
  border: 2px solid rgba(15, 26, 46, 0.25) !important;
  transition: all 0.15s ease !important;
}

/* État ACTIVÉ pour Autoriser : VERT plein */
#tarteaucitron .tarteaucitronIsAllowed .tarteaucitronAllow,
#tarteaucitron li.tarteaucitronAllowed .tarteaucitronAllow,
#tarteaucitron li.tarteaucitronIsAllowed button.tarteaucitronAllow,
#tarteaucitron li.tarteaucitronAllowed button.tarteaucitronAllow {
  background: #2E5942 !important;
  color: #FFFFFF !important;
  border-color: #2E5942 !important;
}

/* État ACTIVÉ pour Interdire : ROUGE plein */
#tarteaucitron .tarteaucitronIsDenied .tarteaucitronDeny,
#tarteaucitron li.tarteaucitronDenied .tarteaucitronDeny,
#tarteaucitron li.tarteaucitronIsDenied button.tarteaucitronDeny,
#tarteaucitron li.tarteaucitronDenied button.tarteaucitronDeny {
  background: #B33A3A !important;
  color: #FFFFFF !important;
  border-color: #B33A3A !important;
}

/* Hover pour montrer l'interactivité */
#tarteaucitron .tarteaucitronAllow:hover {
  background: #2E5942 !important;
  color: #FFFFFF !important;
  border-color: #2E5942 !important;
}

#tarteaucitron .tarteaucitronDeny:hover {
  background: #B33A3A !important;
  color: #FFFFFF !important;
  border-color: #B33A3A !important;
}

/* Pictos cases à cocher dans les boutons */
.tarteaucitronCheck,
.tarteaucitronCross {
  font-weight: 700 !important;
  margin-right: 6px !important;
  font-size: 14px !important;
  color: inherit !important;
}

/* Force la couleur blanche des pictos dans tous les boutons sombres */
#tarteaucitron #tarteaucitronAllAllowed .tarteaucitronCheck,
#tarteaucitron #tarteaucitronAllAllowed .tarteaucitronCross,
#tarteaucitron .tarteaucitronAllAllow .tarteaucitronCheck,
#tarteaucitron .tarteaucitronAllAllow .tarteaucitronCross {
  color: #FFFFFF !important;
}

#tarteaucitron #tarteaucitronAllDenied .tarteaucitronCheck,
#tarteaucitron #tarteaucitronAllDenied .tarteaucitronCross,
#tarteaucitron .tarteaucitronAllDeny .tarteaucitronCheck,
#tarteaucitron .tarteaucitronAllDeny .tarteaucitronCross {
  color: #B33A3A !important;
}

/* Pictos dans les boutons Autoriser/Interdire individuels */
#tarteaucitron .tarteaucitronIsAllowed .tarteaucitronAllow .tarteaucitronCheck,
#tarteaucitron li.tarteaucitronAllowed .tarteaucitronAllow .tarteaucitronCheck {
  color: #FFFFFF !important;
}

#tarteaucitron .tarteaucitronIsDenied .tarteaucitronDeny .tarteaucitronCross,
#tarteaucitron li.tarteaucitronDenied .tarteaucitronDeny .tarteaucitronCross {
  color: #FFFFFF !important;
}

/* ============================================================
   3. ICÔNE FLOTTANTE (bas-gauche)
   ============================================================ */

#tarteaucitronManager,
#tarteaucitronIcon {
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
}

/* ============================================================
   4. MOBILE (≤ 768px)
   ============================================================ */

@media (max-width: 768px) {
  /* Bannière */
  #tarteaucitronAlertBig {
    padding: 20px !important;
    font-size: 13px !important;
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    bottom: 12px !important;
    max-height: 80vh !important;
    overflow-y: auto !important;
  }
  
  #tarteaucitronAlertBig button {
    width: 100% !important;
    margin: 6px 0 !important;
    padding: 13px 18px !important;
    box-sizing: border-box !important;
    display: block !important;
  }
  
  #tarteaucitronAlertBig a#tarteaucitronPrivacyUrl {
    display: block !important;
    text-align: center !important;
    padding: 12px 0 4px 0 !important;
    margin-top: 12px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
  }
  
  /* Panneau de gestion */
  #tarteaucitron {
    width: calc(100% - 16px) !important;
    max-width: calc(100% - 16px) !important;
    top: 2vh !important;
    max-height: 96vh !important;
  }
  
  #tarteaucitron #tarteaucitronClosePanel {
    font-size: 16px !important;
    padding: 14px 18px !important;
  }
  
  #tarteaucitron #tarteaucitronInfo {
    padding: 14px 18px !important;
    font-size: 12.5px !important;
  }
  
  #tarteaucitron .tarteaucitronLine {
    padding: 16px 18px !important;
  }
  
  #tarteaucitron .tarteaucitronName {
    width: 100% !important;
    padding-right: 0 !important;
    margin-bottom: 12px !important;
  }
  
  #tarteaucitron .tarteaucitronAsk {
    width: 100% !important;
    text-align: left !important;
  }
  
  #tarteaucitron .tarteaucitronAllow,
  #tarteaucitron .tarteaucitronDeny {
    min-width: 0 !important;
    width: calc(50% - 4px) !important;
    margin: 2px !important;
    box-sizing: border-box !important;
  }
  
  #tarteaucitron .tarteaucitronMainLine {
    font-size: 15px !important;
    padding: 12px 18px !important;
  }
}