/* =========================================================
   COOKIE CONSENT — PreveHub (conform GDPR + ePrivacy UE)
   ========================================================= */
.cc-banner { position: fixed; bottom: 20px; left: 20px; right: 20px; max-width: 780px; margin: 0 auto; background: var(--ink-2, #11141B); border: 1px solid var(--line-strong, #2a2f3a); border-radius: 16px; padding: 26px 30px; z-index: 9999; box-shadow: 0 20px 60px rgba(0,0,0,0.5); font-family: var(--font-body, sans-serif); transform: translateY(140%); transition: transform 0.5s cubic-bezier(0.22,1,0.36,1); }
.cc-banner.show { transform: translateY(0); }
.cc-banner h3 { font-family: var(--font-display, serif); font-size: 1.25rem; font-weight: 500; color: var(--paper, #F4F1EA); margin: 0 0 10px; }
.cc-banner p { font-size: 0.88rem; color: var(--paper-dim, #C9C5BC); line-height: 1.6; margin: 0 0 20px; }
.cc-banner p a { color: var(--amber, #FFB627); text-decoration: underline; }
.cc-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.cc-btn { padding: 12px 22px; border-radius: 100px; font-family: var(--font-body, sans-serif); font-size: 0.86rem; font-weight: 500; cursor: pointer; border: 1px solid transparent; transition: all 0.25s; }
.cc-accept { background: var(--amber, #FFB627); color: var(--ink, #0A0C10); }
.cc-accept:hover { opacity: 0.9; }
.cc-reject { background: transparent; border-color: var(--line-strong, #2a2f3a); color: var(--paper, #F4F1EA); }
.cc-reject:hover { border-color: var(--amber, #FFB627); }
.cc-settings { background: transparent; border-color: var(--line-strong, #2a2f3a); color: var(--paper-dim, #C9C5BC); }
.cc-settings:hover { border-color: var(--paper-dim, #C9C5BC); color: var(--paper, #F4F1EA); }

/* Panou setari */
.cc-panel { display: none; margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--line, #1c2029); }
.cc-panel.open { display: block; }
.cc-cat { display: flex; align-items: flex-start; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--line, #1c2029); }
.cc-cat:last-child { border-bottom: none; }
.cc-cat-info { flex: 1; }
.cc-cat-info h4 { font-size: 0.95rem; color: var(--paper, #F4F1EA); margin: 0 0 4px; font-weight: 500; }
.cc-cat-info p { font-size: 0.8rem; color: var(--paper-dim, #C9C5BC); margin: 0; line-height: 1.5; }
/* Toggle */
.cc-toggle { position: relative; width: 44px; height: 24px; flex-shrink: 0; margin-top: 2px; }
.cc-toggle input { opacity: 0; width: 0; height: 0; }
.cc-slider { position: absolute; inset: 0; background: var(--ink-3, #181C26); border: 1px solid var(--line-strong, #2a2f3a); border-radius: 24px; transition: 0.3s; cursor: pointer; }
.cc-slider::before { content: ''; position: absolute; height: 16px; width: 16px; left: 3px; bottom: 3px; background: var(--paper-dim, #C9C5BC); border-radius: 50%; transition: 0.3s; }
.cc-toggle input:checked + .cc-slider { background: rgba(255,182,39,0.25); border-color: var(--amber, #FFB627); }
.cc-toggle input:checked + .cc-slider::before { transform: translateX(20px); background: var(--amber, #FFB627); }
.cc-toggle input:disabled + .cc-slider { opacity: 0.5; cursor: not-allowed; }
.cc-toggle input:disabled + .cc-slider::before { background: var(--signal, #4ADE80); }
.cc-panel-actions { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; }

/* Buton reopen (floating) */
.cc-reopen { position: fixed; bottom: 20px; left: 20px; width: 44px; height: 44px; border-radius: 50%; background: var(--ink-2, #11141B); border: 1px solid var(--line-strong, #2a2f3a); color: var(--amber, #FFB627); font-size: 1.2rem; cursor: pointer; z-index: 9998; display: none; align-items: center; justify-content: center; transition: all 0.25s; }
.cc-reopen:hover { border-color: var(--amber, #FFB627); transform: scale(1.05); }
.cc-reopen.show { display: flex; }

/* Placeholder pentru continut blocat (YouTube) */
.cc-blocked { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 40px 24px; text-align: center; background: var(--ink-3, #181C26); border-radius: 12px; min-height: 200px; }
.cc-blocked p { font-size: 0.88rem; color: var(--paper-dim, #C9C5BC); margin: 0; max-width: 340px; }
.cc-blocked button { padding: 10px 20px; border-radius: 100px; background: var(--amber, #FFB627); color: var(--ink, #0A0C10); border: none; font-size: 0.84rem; font-weight: 500; cursor: pointer; }

@media (max-width: 560px) {
  .cc-banner { left: 12px; right: 12px; bottom: 12px; padding: 22px; }
  .cc-actions { flex-direction: column; }
  .cc-btn { width: 100%; }
}
