/*
 * tarteaucitron-custom.css
 * Custom overrides for tarteaucitron.js to match the FIMLAB dark theme.
 *
 * Design tokens (mirrored from style.css :root):
 *   --bgcolor         : #0a0a0a
 *   --bgcolorsecond   : #050505
 *   --fcolor          : rgb(230, 230, 230)
 *   --tcolor          : rgb(155, 155, 155)
 *   --gradient        : linear-gradient(to right top, #7860ca, #ca0084, #ce2c2c)
 *   --accent-start    : #7860ca  (violet)
 *   --accent-end      : #ce2c2c  (crimson)
 *
 * Load this file AFTER tarteaucitron.min.css.
 * In functions.php, enqueue with: wp_enqueue_style('tac-custom', ..., ['tarteaucitron'], '1.0.0');
 */

/* =====================================================
   LOCAL DESIGN TOKENS
   ===================================================== */
#tarteaucitronRoot {
    --tac-bg:          #0a0a0a;
    --tac-bg2:         #111111;
    --tac-border:      rgba(255, 255, 255, 0.08);
    --tac-fg:          rgb(230, 230, 230);
    --tac-muted:       rgb(155, 155, 155);
    --tac-gradient:    linear-gradient(to right top, #7860ca, #ca0084, #ce2c2c);
    --tac-accent:      #7860ca;
    --tac-radius:      12px;
    --tac-radius-sm:   6px;
    --tac-shadow:      0 24px 64px rgba(0, 0, 0, 0.8);
    --tac-font:        system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* =====================================================
   BACKDROP / OVERLAY
   ===================================================== */
html body .tarteaucitronSize-middle.tarteaucitronBeforeVisible::before,
html body.tarteaucitron-modal-open div#tarteaucitronRoot::before {
    background: rgba(0, 0, 0, 0.75) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* =====================================================
   RESET COLORS INSIDE ROOT
   ===================================================== */
#tarteaucitronRoot * {
    color: var(--tac-fg);
    font-family: var(--tac-font);
}

/* =====================================================
   BANNER — ALERT BIG (bottom / middle / popup)
   ===================================================== */
#tarteaucitronRoot #tarteaucitronAlertBig {
    background: var(--tac-bg) !important;
    color: var(--tac-fg) !important;
    border: 1px solid var(--tac-border) !important;
    box-shadow: var(--tac-shadow) !important;
}

/* Middle (modal-style) banner */
body #tarteaucitronRoot.tarteaucitronSize-middle div#tarteaucitronAlertBig {
    background: #0d0d0d !important;
    border-radius: var(--tac-radius) !important;
    border: 1px solid var(--tac-border) !important;
    box-shadow: var(--tac-shadow) !important;
    padding: 40px 35px !important;
}

/* Popup (corner) banner */
body #tarteaucitronRoot.tarteaucitronSize-popup div#tarteaucitronAlertBig {
    background: #0d0d0d !important;
    border-radius: var(--tac-radius) var(--tac-radius) 0 0 !important;
    border: 1px solid var(--tac-border) !important;
    border-bottom: 0 !important;
    box-shadow: var(--tac-shadow) !important;
}

/* Disclaimer text */
#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert,
#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert strong,
#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert .tarteaucitronPartnersList * {
    color: var(--tac-fg) !important;
}

#tarteaucitronRoot.tarteaucitronSize-middle span#tarteaucitronDisclaimerAlert,
#tarteaucitronRoot.tarteaucitronSize-popup span#tarteaucitronDisclaimerAlert {
    font-size: 16px !important;
    color: var(--tac-muted) !important;
    line-height: 1.6 !important;
}

/* Partners list inside banner */
html body #tarteaucitronRoot #tarteaucitronAlertBig div.tarteaucitronPartnersList {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid var(--tac-border);
    border-radius: var(--tac-radius-sm);
}

html body #tarteaucitronRoot #tarteaucitronAlertBig div.tarteaucitronPartnersList b {
    color: var(--tac-fg) !important;
}

html body #tarteaucitronRoot #tarteaucitronAlertBig div.tarteaucitronPartnersList ul li {
    color: var(--tac-muted) !important;
}

/* =====================================================
   CTA BUTTONS — Accept / Deny / Personalize
   ===================================================== */

/* Primary CTA: gradient background */
#tarteaucitronAlertBig #tarteaucitronCloseAlert,
#tarteaucitronAlertBig #tarteaucitronPersonalize,
#tarteaucitronAlertBig #tarteaucitronPersonalize2,
.tarteaucitronCTAButton,
#tarteaucitronRoot .tarteaucitronAllow,
.tac_activate:not(.youtube_player .tac_activate) .tac_float .tarteaucitronAllow,
.tac_activate:not(.youtube_player .tac_activate) .tarteaucitronAllow {
    background: var(--tac-gradient) !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: var(--tac-radius-sm) !important;
    font-weight: 600 !important;
    padding: 10px 20px !important;
    font-size: 15px !important;
    transition: opacity 0.3s ease, transform 0.2s ease !important;
    cursor: pointer !important;
}

#tarteaucitronAlertBig #tarteaucitronCloseAlert:hover,
#tarteaucitronAlertBig #tarteaucitronPersonalize:hover,
#tarteaucitronAlertBig #tarteaucitronPersonalize2:hover,
.tarteaucitronCTAButton:hover,
#tarteaucitronRoot .tarteaucitronAllow:hover,
.tac_activate:not(.youtube_player .tac_activate) .tac_float .tarteaucitronAllow:hover {
    opacity: 0.85 !important;
    transform: translateY(-1px) !important;
}

/* Deny / Privacy link: ghost style */
#tarteaucitronRoot .tarteaucitronDeny,
#tarteaucitron #tarteaucitronPrivacyUrl,
#tarteaucitron #tarteaucitronPrivacyUrlDialog,
#tarteaucitronAlertBig #tarteaucitronPrivacyUrl,
#tarteaucitronAlertBig #tarteaucitronPrivacyUrlDialog {
    background: transparent !important;
    color: var(--tac-muted) !important;
    border: 1px solid var(--tac-border) !important;
    border-radius: var(--tac-radius-sm) !important;
    font-weight: 500 !important;
    padding: 10px 20px !important;
    font-size: 15px !important;
    transition: border-color 0.3s ease, color 0.3s ease !important;
    cursor: pointer !important;
}

#tarteaucitronRoot .tarteaucitronDeny:hover,
#tarteaucitron #tarteaucitronPrivacyUrl:hover,
#tarteaucitronAlertBig #tarteaucitronPrivacyUrl:hover {
    color: var(--tac-fg) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
}

/* Privacy URL link inside the panel */
html #tarteaucitronRoot #tarteaucitronPrivacyUrl {
    font-size: 13px !important;
    color: var(--tac-muted) !important;
    background: transparent !important;
    border: 1px solid var(--tac-border) !important;
}

/* =====================================================
   SAVE BUTTON (inside panel)
   ===================================================== */
html body #tarteaucitronRoot button#tarteaucitronSaveButton {
    background: var(--tac-gradient) !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: var(--tac-radius-sm) !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    padding: 10px 28px !important;
    cursor: pointer !important;
    transition: opacity 0.3s ease !important;
}

html body #tarteaucitronRoot button#tarteaucitronSaveButton:hover {
    opacity: 0.85 !important;
}

html body #tarteaucitronRoot div#tarteaucitronSave {
    background: var(--tac-bg) !important;
    border-top: 1px solid var(--tac-border);
    text-align: right;
    padding: 20px;
}

/* =====================================================
   PREFERENCES PANEL (#tarteaucitron)
   ===================================================== */
div#tarteaucitronServices {
    background: var(--tac-bg) !important;
    border-radius: var(--tac-radius) !important;
    box-shadow: var(--tac-shadow) !important;
    border: 1px solid var(--tac-border) !important;
    margin-top: 21px !important;
}

#tarteaucitron .tarteaucitronBorder {
    background: var(--tac-bg) !important;
    border-color: var(--tac-border) !important;
}

/* Close panel button */
button#tarteaucitronClosePanel {
    background: #1a1a1a !important;
    color: var(--tac-fg) !important;
    border-radius: var(--tac-radius-sm) var(--tac-radius-sm) 0 0 !important;
    font-weight: 500 !important;
}

/* =====================================================
   SERVICE CATEGORY TITLE LINE (main line)
   ===================================================== */
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine {
    background: #111111 !important;
    border: 1px solid var(--tac-border) !important;
    border-left: 4px solid #7860ca !important;
    border-top: 1px solid var(--tac-border) !important;
    border-radius: var(--tac-radius-sm);
    margin-top: 12px !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine:hover {
    background: #161616 !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName a,
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle a {
    color: var(--tac-fg) !important;
}

/* =====================================================
   SERVICE LINES (individual)
   ===================================================== */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine {
    background: #0d0d0d !important;
    border-left: 3px solid transparent !important;
    transition: background 0.2s ease, border-color 0.2s ease !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronLine:hover {
    background: #131313 !important;
}

/* Allowed state: gradient left border */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine.tarteaucitronIsAllowed {
    border-left: 3px solid #7860ca !important;
}

/* Denied state: crimson left border */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine.tarteaucitronIsDenied {
    border-left: 3px solid #ce2c2c !important;
}

/* Per-line allow/deny buttons */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronAllow {
    background: var(--tac-gradient) !important;
    color: #ffffff !important;
    border-radius: var(--tac-radius-sm) !important;
    font-size: 13px !important;
    padding: 6px 12px !important;
    border: 0 !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronDeny {
    background: transparent !important;
    color: rgb(210, 210, 210) !important;  /* More visible than muted grey */
    border: 1px solid rgba(206, 44, 44, 0.45) !important; /* Subtle crimson hint */
    border-radius: var(--tac-radius-sm) !important;
    font-size: 13px !important;
    padding: 6px 12px !important;
    transition: background 0.2s ease, border-color 0.2s ease !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronDeny:hover {
    background: rgba(206, 44, 44, 0.15) !important;
    border-color: rgba(206, 44, 44, 0.7) !important;
}

/* Active/selected state: Tout accepter → gradient, Tout refuser → crimson solid */
#tarteaucitron #tarteaucitronServices #tarteaucitronAllAllowed.tarteaucitronIsSelected {
    background: var(--tac-gradient) !important;
    color: #ffffff !important;
    opacity: 1 !important;
}

#tarteaucitron #tarteaucitronServices #tarteaucitronAllDenied.tarteaucitronIsSelected,
#tarteaucitron #tarteaucitronServices #tarteaucitronAllDenied2.tarteaucitronIsSelected {
    background: #ce2c2c !important;
    color: #ffffff !important;
    border: 0 !important;
    opacity: 1 !important;
}

/* Mandatory services: allow button uses gradient */
#tarteaucitron #tarteaucitronServices #tarteaucitronServices_mandatory .tarteaucitronLine button.tarteaucitronAllow,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine.tarteaucitronIsAllowed .tarteaucitronAllow {
    background: var(--tac-gradient) !important;
    color: #ffffff !important;
}

/* Active deny button: solid crimson, clearly distinct from allow */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine.tarteaucitronIsDenied .tarteaucitronDeny {
    background: #ce2c2c !important;
    color: #ffffff !important;
    border: 0 !important;
    font-weight: 600 !important;
}

/* =====================================================
   TITLE / INFO BLOCKS INSIDE PANEL
   ===================================================== */
#tarteaucitron #tarteaucitronInfo,
#tarteaucitron #tarteaucitronServices .tarteaucitronDetails,
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle button,
#tarteaucitronRoot .asCatToggleBtn {
    background: #111111 !important;
    color: var(--tac-fg) !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronTitle + [id^="tarteaucitronDetails"] {
    background: #111111 !important;
    color: var(--tac-muted) !important;
}

/* Heading H1 inside panel */
#tarteaucitronRoot .tarteaucitronH1 {
    color: var(--tac-fg) !important;
}

/* H2 headings (category names) */
#tarteaucitronRoot .tarteaucitronH2 {
    color: var(--tac-fg) !important;
}

/* Service name small text */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName .tarteaucitronListCookies {
    color: var(--tac-muted) !important;
}

.tarteaucitronName .tacCurrentStatus,
.tarteaucitronName .tarteaucitronReadmoreSeparator {
    color: var(--tac-muted) !important;
}

/* Close cross button */
#tarteaucitronCloseCross,
#tarteaucitronCloseCross span {
    color: var(--tac-fg) !important;
}

/* =====================================================
   SMALL ALERT (bottom-right icon)
   ===================================================== */
#tarteaucitronAlertSmall {
    background: #0d0d0d !important;
    border: 1px solid var(--tac-border) !important;
    border-radius: var(--tac-radius-sm) 0 0 0 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6) !important;
}

#tarteaucitronAlertSmall #tarteaucitronManager {
    color: var(--tac-fg) !important;
}

#tarteaucitronAlertSmall #tarteaucitronManager:hover {
    background: rgba(255, 255, 255, 0.06) !important;
}

#tarteaucitronAlertSmall #tarteaucitronCookiesNumber {
    color: var(--tac-fg) !important;
    background: transparent !important;
}

/* Dot indicator colors (keep green/yellow/red semantic) */
#tarteaucitronAlertSmall #tarteaucitronManager #tarteaucitronDot {
    background-color: rgba(255, 255, 255, 0.15) !important;
    border-radius: 4px !important;
}

/* =====================================================
   COOKIES LIST (small panel)
   ===================================================== */
#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList {
    background: #0d0d0d !important;
    border: 1px solid var(--tac-border) !important;
    color: var(--tac-fg) !important;
}

#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesTitle {
    background: #111111 !important;
    border-radius: var(--tac-radius-sm) 0 0 0 !important;
}

#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesTitle strong {
    color: var(--tac-fg) !important;
}

#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronTitle {
    background: #111111 !important;
    color: var(--tac-fg) !important;
}

#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronCookiesListMain {
    background: rgba(255, 255, 255, 0.03) !important;
}

#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronCookiesListMain:hover {
    background: rgba(255, 255, 255, 0.07) !important;
}

#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronCookiesListMain a {
    color: var(--tac-muted) !important;
}

#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList strong {
    color: var(--tac-fg) !important;
}

/* =====================================================
   FOCUS VISIBLE (accessibility)
   ===================================================== */
#tarteaucitronRoot a:focus-visible,
#tarteaucitronRoot button:focus-visible {
    outline: 3px dashed #7860ca !important;
}

/* =====================================================
   TAC ACTIVATE BLOCK (inline consent placeholder)
   ===================================================== */
.tac_activate:not(.youtube_player .tac_activate) {
    background: #0d0d0d !important;
    border: 1px solid var(--tac-border) !important;
    border-radius: var(--tac-radius) !important;
}

.tac_activate .tac_float strong {
    color: var(--tac-fg) !important;
}

/* =====================================================
   MAGIC BLOCK BUTTON (tarteaucitron-magic-block)
   ===================================================== */
.tarteaucitron-magic-block button {
    background: var(--tac-gradient) !important;
    color: #ffffff !important;
    border-radius: var(--tac-radius-sm) !important;
    border: 0 !important;
    font-weight: 600 !important;
}

/* =====================================================
   PROGRESS BAR
   ===================================================== */
#tarteaucitronPercentage {
    background: var(--tac-gradient) !important;
    box-shadow: none !important;
}

/* =====================================================
   BACK BUTTON
   ===================================================== */
#tarteaucitronRoot button#tarteaucitronBack {
    background: rgba(0, 0, 0, 0.7) !important;
}

/* =====================================================
   INFO BLOCK (bottom border separator)
   ===================================================== */
div#tarteaucitronInfo {
    border-color: var(--tac-border) !important;
    color: var(--tac-muted) !important;
}

/* =====================================================
   CLOSE PANEL BUTTON (cookie list)
   ===================================================== */
#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronClosePanelCookie {
    background: #111111 !important;
    color: var(--tac-fg) !important;
    border-radius: var(--tac-radius-sm) var(--tac-radius-sm) 0 0 !important;
}

/* =====================================================
   CHECKBOX / CROSS ICONS (::before pseudo-elements)
   Base CSS sets color:#000 — invisible on dark backgrounds.
   ===================================================== */

/* Default unchecked state: light grey */
#tarteaucitronRoot .tarteaucitronCheck::before,
#tarteaucitronRoot .tarteaucitronCross::before {
    color: rgb(210, 210, 210) !important;
    font-size: 1rem !important;
}

/* Allow button checked (☑) when service is allowed */
#tarteaucitronRoot .tarteaucitronIsAllowed .tarteaucitronAllow .tarteaucitronCheck::before {
    color: #ffffff !important;
}

/* Deny button checked (☑) when service is denied: crimson for clear feedback */
#tarteaucitronRoot .tarteaucitronIsDenied .tarteaucitronDeny .tarteaucitronCross::before {
    color: #ffffff !important;
}

/* Unchecked deny cross on an allowed service: muted, slightly crimson-tinted */
#tarteaucitronRoot .tarteaucitronIsAllowed .tarteaucitronDeny .tarteaucitronCross::before,
#tarteaucitronRoot .tarteaucitronIsDenied .tarteaucitronAllow .tarteaucitronCheck::before {
    color: rgba(255, 255, 255, 0.4) !important;
}

/* Mandatory services checkbox */
#tarteaucitronRoot #tarteaucitronServices_mandatory .tarteaucitronCheck::before {
    color: #ffffff !important;
}
/* =====================================================
   FLOATING ICON (#tarteaucitronIcon)
   Replacing default image with FontAwesome icon
   ===================================================== */
#tarteaucitronIcon {
    bottom: 7px !important;
    left: 15px !important;
}

#tarteaucitronIcon #tarteaucitronManager {
    width: 48px !important;
    height: 48px !important;
    background: var(--tac-bg) !important;
    border: 1px solid var(--tac-border) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    box-shadow: var(--tac-shadow) !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.3s ease !important;
}

#tarteaucitronIcon #tarteaucitronManager:hover {
    transform: scale(1.1) rotate(5deg);
    border-color: var(--tac-accent) !important;
    cursor: pointer !important;
}

/* Hide default image */
#tarteaucitronIcon #tarteaucitronManager img {
    display: none !important;
}

/* Inject Custom SVG Icon */
#tarteaucitronIcon #tarteaucitronManager::before {
    content: "";
    width: 24px;
    height: 24px;
    background-color: var(--tac-fg);
    mask: url('../img/icon/cookie.svg') no-repeat center;
    -webkit-mask: url('../img/icon/cookie.svg') no-repeat center;
    mask-size: contain;
    -webkit-mask-size: contain;
    display: block !important;
    transition: background-color 0.3s ease !important;
}

#tarteaucitronIcon #tarteaucitronManager:hover::before {
    background-color: #ffffff !important;
}

