/* --- COOKIE BANNER --- */
.cookie-banner {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(100px);
  width: calc(100% - 48px);
  max-width: 1000px;
  background: var(--glass-bg);
  backdrop-filter: blur(var(--blur-lg)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter: blur(var(--blur-lg)) saturate(var(--glass-saturate));
  border: 1px solid var(--glass-border);
  border-radius: 20px;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  box-shadow: var(--shadow-lg);
  z-index: 99990;
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.cookie-banner.show {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}

.cookie-banner-content {
  display: flex;
  align-items: center;
  gap: 20px;
  flex: 1;
}

.cookie-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(247,72,73,0.1);
  color: #f74849;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  flex-shrink: 0;
  border: 1px solid rgba(247,72,73,0.2);
}

.cookie-actions {
  display: flex;
  gap: 12px;
  flex-shrink: 0;
}

.cookie-btn {
  padding: 10px 18px;
  border-radius: 12px;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
}

.cookie-btn--primary {
  background: linear-gradient(135deg, #ff0000, #f74849);
  color: #fff;
  border: none;
  box-shadow: 0 4px 15px rgba(255,0,0,0.3);
}
.cookie-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(255,0,0,0.4); }

.cookie-btn--secondary {
  background: rgba(255,255,255,0.05);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.1);
}
.cookie-btn--secondary:hover { background: rgba(255,255,255,0.1); }

.cookie-btn--ghost {
  background: transparent;
  color: rgba(255,255,255,0.6);
  border: 1px solid transparent;
  text-decoration: underline;
}
.cookie-btn--ghost:hover { color: #fff; }

/* --- COOKIE MODAL --- */
.cookie-modal {
  position: fixed;
  inset: 0;
  z-index: 99995;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s;
}

.cookie-modal.show {
  opacity: 1;
  visibility: visible;
}

.cookie-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.cookie-modal-dialog {
  position: relative;
  width: 90%;
  max-width: 500px;
  background: var(--c-bg-soft);
  border: 1px solid var(--c-border);
  border-radius: 24px;
  box-shadow: var(--shadow-xl);
  transform: translateY(20px) scale(0.95);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.cookie-modal.show .cookie-modal-dialog {
  transform: translateY(0) scale(1);
}

.cookie-modal-header {
  padding: 20px 24px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.cookie-modal-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.cookie-option {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  background: rgba(255,255,255,0.02);
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.03);
}

.cookie-modal-footer {
  padding: 20px 24px;
  border-top: 1px solid rgba(255,255,255,0.05);
}

/* Toggle Switch */
.cookie-toggle input { display: none; }
.cookie-toggle label {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
  background: rgba(255,255,255,0.1);
  border-radius: 24px;
  cursor: pointer;
  transition: 0.3s;
}
.cookie-toggle label::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 50%;
  transition: 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.cookie-toggle input:checked + label {
  background: #f74849;
}
.cookie-toggle input:checked + label::after {
  transform: translateX(20px);
}
.cookie-toggle input:disabled + label {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Panneau compact, opaque et cohérent avec les deux thèmes. */
.cookie-banner,.cookie-modal { --ck-bg:#16151c; --ck-text:#faf8fc; --ck-soft:#bcb8c7; --ck-line:#ffffff14; --ck-accent:#ff655e; color:var(--ck-text); font-family:var(--font-body); }
html[data-theme="light"] :is(.cookie-banner,.cookie-modal) { --ck-bg:#fff; --ck-text:#22212b; --ck-soft:#66616f; --ck-line:#24202e18; --ck-accent:#cc3935; }
#cookie-banner { left:24px; bottom:24px; width:min(460px,calc(100% - 48px)); max-height:calc(100dvh - 48px); overflow:auto; box-sizing:border-box; padding:28px; background:var(--ck-bg); border:1px solid var(--ck-line); border-radius:24px; box-shadow:0 24px 80px #0005; flex-direction:column; align-items:stretch; gap:24px; transform:translateY(24px); transition:opacity .25s,transform .25s; }
#cookie-banner.show { transform:none; }
.cookie-banner-content { flex-direction:column; align-items:flex-start; gap:20px; }
.cookie-icon { color:#ff9b6a; background:#ff956b12; border-color:#ff956b25; border-radius:16px; }
.cookie-kicker { display:block; margin-bottom:8px; font-size:.65rem; font-weight:700; letter-spacing:.11em; text-transform:uppercase; color:var(--ck-accent); }
.cookie-text h3,.cookie-modal-header h3 { margin:0 0 12px; font-family:var(--font-body); font-size:1.55rem; line-height:1.2; font-weight:750; letter-spacing:-.04em; color:var(--ck-text); }
.cookie-text p,.cookie-intro { margin:0; color:var(--ck-soft); font-size:.87rem; line-height:1.7; }
.cookie-policy { display:inline-flex; align-items:center; gap:8px; margin-top:14px; color:var(--ck-soft); font-size:.75rem; text-decoration:underline; text-underline-offset:4px; }
.cookie-policy:hover { color:var(--ck-text); }
.cookie-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; width:100%; }
.cookie-banner .cookie-btn,.cookie-modal .cookie-btn { appearance:none; min-height:46px; padding:11px 14px; border-radius:12px !important; border:1px solid var(--ck-line); font-family:var(--font-body); font-size:.78rem; font-weight:650; line-height:1.4; text-transform:none; letter-spacing:normal; box-shadow:none; transition:background .2s; }
.cookie-btn--primary { background:var(--ck-accent); color:white; }
.cookie-btn--primary:hover { background:#e94f49; transform:none; box-shadow:none; }
.cookie-btn--secondary { background:transparent; color:var(--ck-text); }
.cookie-btn--secondary:hover { background:var(--ck-line); }
.cookie-actions .cookie-btn--ghost { grid-column:1/-1; grid-row:2; min-height:36px; background:transparent; color:var(--ck-soft); border-color:transparent; text-decoration:none; }
.cookie-btn--ghost:hover { color:var(--ck-text); }
.cookie-banner :focus-visible,.cookie-modal :focus-visible { outline:2px solid var(--ck-accent); outline-offset:4px; }
.cookie-modal { padding:20px; box-sizing:border-box; }
.cookie-modal-dialog { width:100%; max-width:540px; max-height:calc(100dvh - 40px); overflow:auto; background:var(--ck-bg); border-color:var(--ck-line); }
.cookie-modal-header { padding:28px 28px 20px; border-color:var(--ck-line); }
.cookie-modal-header h3 { margin:0; }
.cookie-modal-header button { width:36px; height:36px; flex-shrink:0; border-radius:10px !important; background:var(--ck-line) !important; color:var(--ck-soft) !important; }
.cookie-modal-body { padding:24px 28px; gap:16px; }
.cookie-option { align-items:center; padding:20px; border-color:var(--ck-line); background:var(--ck-line); }
.cookie-option h4 { color:var(--ck-text) !important; font-family:var(--font-body); }
.cookie-option p { color:var(--ck-soft) !important; line-height:1.6; }
.cookie-required { display:flex; align-items:center; gap:6px; flex-shrink:0; font-size:.65rem; font-weight:650; color:var(--ck-soft); }
.cookie-modal-footer { padding:20px 28px 24px; border-color:var(--ck-line); text-align:center; }
.cookie-toggle { position:relative; flex-shrink:0; width:44px; height:24px; }
.cookie-toggle input { display:block; position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; z-index:1; }
.cookie-toggle input:focus-visible { outline:none; }
.cookie-toggle input:focus-visible + label { outline:2px solid var(--ck-accent); outline-offset:4px; }
.cookie-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:540px) { #cookie-banner { left:12px; bottom:12px; width:calc(100% - 24px); max-height:calc(100dvh - 24px); padding:22px; gap:18px; border-radius:20px; } .cookie-banner-content { gap:14px; } .cookie-modal { padding:12px; } .cookie-modal-dialog { max-height:calc(100dvh - 24px); } .cookie-modal-header,.cookie-modal-body,.cookie-modal-footer { padding:20px; } .cookie-option { padding:16px; } .cookie-required { max-width:72px; flex-wrap:wrap; } }
@media(prefers-reduced-motion:reduce) { .cookie-banner,.cookie-modal,.cookie-modal-dialog,.cookie-toggle label,.cookie-toggle label::after { transition:none; } }

@media (max-width: 768px) {
  .cookie-banner {
    flex-direction: column;
    align-items: stretch;
    padding: 16px;
    bottom: 16px;
  }
  .cookie-actions {
    flex-direction: column;
  }
  .cookie-actions .cookie-btn {
    width: 100%;
    text-align: center;
  }
}
