/* ==========================================================================
   Jobriver v2 – Cookie-Banner & Einstellungen im v2-Look
   Markup + Logik unverändert aus partials/cookie-banner.php / consent.js,
   Grundstile aus consent.css. Hier nur: alte --color-* auf v2-Tokens biegen
   und Formen/Schatten an den Styleguide anpassen (Hell + Dunkel).
   ========================================================================== */

.v2 .consent-banner,
.v2 .consent-modal {
    --color-white: var(--surface);
    --color-bg: var(--tint);
    --color-text: var(--ink);
    --color-text-secondary: var(--muted);
    --color-border: var(--line-2);
    --color-border-light: var(--line);
    --color-primary: var(--brand);
    --color-primary-dark: var(--brand-600, #5f3df0);
    --color-success-text: var(--mint);
    --container-max: 1100px;
    font-family: inherit;
}

/* Banner: schwebende Glas-Karte unten */
.v2 .consent-banner { padding: 0 16px 16px; transition: transform .45s var(--ease); }
.v2 .consent-banner__inner {
    max-width: 1100px;
    padding: 20px 20px 20px 28px;
    gap: 24px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--glass-strong, var(--surface));
    -webkit-backdrop-filter: blur(16px) saturate(140%);
    backdrop-filter: blur(16px) saturate(140%);
    box-shadow: var(--shadow-lg);
}
.v2 .consent-banner__text strong { font-size: 1rem; font-weight: 600; letter-spacing: -.01em; }
.v2 .consent-banner__text p { font-size: .875rem; line-height: 1.55; }
.v2 .consent-banner__text a { color: var(--brand-700); }

/* Buttons als Pillen wie im Kern */
.v2 .consent-btn {
    min-height: 44px;
    padding: 0 20px;
    border-radius: 999px;
    font-size: .875rem;
    font-weight: 600;
    transition: background-color .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}
.v2 .consent-btn:active { transform: translateY(1px); }
.v2 .consent-btn--primary { background: var(--ink); color: var(--bg); }
.v2 .consent-btn--primary:hover { background: var(--brand); color: #fff; }
.v2 .consent-btn--secondary { background: transparent; color: var(--ink); border: 1px solid var(--line-2); }
.v2 .consent-btn--secondary:hover { background: transparent; border-color: var(--ink); }
.v2 .consent-btn--ghost { color: var(--brand-700); }
.v2 .consent-btn--ghost:hover { background: var(--brand-50); }
.v2 .consent-btn:focus-visible,
.v2 .consent-modal__close:focus-visible,
.v2 .consent-accordion__trigger:focus-visible { outline: 2.5px solid var(--brand); outline-offset: 3px; }

/* Einstellungen */
.v2 .consent-modal__backdrop { background: rgba(13, 10, 20, .5); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.v2 .consent-modal__dialog {
    max-width: 640px;
    border: 1px solid var(--line);
    border-radius: var(--r-xl, 32px);
    background: var(--surface);
    box-shadow: var(--shadow-lg);
}
.v2 .consent-modal__header { padding: 22px 28px; }
.v2 .consent-modal__title { font-size: 1.25rem; font-weight: 600; letter-spacing: -.02em; }
.v2 .consent-modal__close { width: 40px; height: 40px; border-radius: 999px; }
.v2 .consent-modal__close:hover { background: var(--tint); }
.v2 .consent-modal__body { padding: 8px 28px 20px; }
.v2 .consent-modal__footer { padding: 16px 28px; }
.v2 .consent-category__desc,
.v2 .consent-toggle__detail,
.v2 .consent-detail p { color: var(--muted); }
.v2 .consent-toggle__badge { border-radius: 999px; background: var(--brand-50); color: var(--brand-700); }
.v2 .consent-toggle input:checked + .consent-toggle__slider { background: var(--brand); }
.v2 .consent-accordion__trigger { border-radius: 999px; color: var(--muted); }
.v2 .consent-accordion__trigger:hover { background: var(--tint); color: var(--ink); }
.v2 .consent-cookie-table table { border-color: var(--line); border-radius: 14px; overflow: hidden; }
.v2 .consent-cookie-table td { border-color: var(--line); color: var(--ink-2); }
.v2 .consent-cookie-table__label { background: var(--tint); color: var(--muted); }
.v2 .consent-cookie-table code { background: var(--brand-50); color: var(--brand-700); }
.v2 .consent-cookie-table a { color: var(--brand-700); overflow-wrap: anywhere; }

@media (max-width: 768px) {
    .v2 .consent-banner { padding: 0 10px 10px; }
    .v2 .consent-banner__inner { padding: 16px; gap: 12px; border-radius: 20px; }
    .v2 .consent-btn { min-height: 44px; font-size: .875rem; }
    .v2 .consent-modal__dialog { border-radius: 24px 24px 0 0; }
    .v2 .consent-modal__header,
    .v2 .consent-modal__footer { padding-inline: 20px; }
    .v2 .consent-modal__body { padding-inline: 20px; }
}

@media (prefers-reduced-motion: reduce) {
    .v2 .consent-banner,
    .v2 .consent-modal { transition: none; }
}