/* ──────────────────────────────────────────────
   VAKYR LEGAL LAYER — banner + cookie + age gate + footer
   Injected globally via legal.js
   ────────────────────────────────────────────── */

/* === BANNER PUBLIC BETA — sticky top === */
.vk-beta-banner{
  position:sticky;top:0;left:0;right:0;z-index:9998;
  background:linear-gradient(90deg,#00f5ff 0%,#06b6d4 30%,#7c3aed 100%);
  color:#fff;font-family:Inter,system-ui,sans-serif;font-size:0.78rem;
  padding:8px 16px;text-align:center;line-height:1.4;
  box-shadow:0 2px 12px rgba(124,58,237,0.35);
  display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap
}
.vk-beta-banner strong{font-weight:700}
.vk-beta-banner .vk-beta-close{
  background:rgba(255,255,255,0.18);border:0;color:#fff;
  width:22px;height:22px;border-radius:50%;cursor:pointer;
  font-size:0.85rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;
  transition:background 0.15s
}
.vk-beta-banner .vk-beta-close:hover{background:rgba(255,255,255,0.32)}
@media(max-width:600px){
  .vk-beta-banner{font-size:0.68rem;padding:6px 10px}
}

/* === COOKIE BANNER === */
.vk-cookie-banner{
  position:fixed;left:16px;right:16px;bottom:16px;z-index:9999;
  max-width:920px;margin:0 auto;
  background:#0f172a;color:#e2e8f0;
  border:1px solid #1e293b;border-radius:14px;
  box-shadow:0 20px 60px rgba(0,0,0,0.5);
  padding:12px 16px;font-family:Inter,system-ui,sans-serif;font-size:0.82rem;
  line-height:1.5
}
.vk-cookie-banner h3{
  margin:0 0 6px 0;font-size:0.95rem;color:#fff;font-weight:700
}
.vk-cookie-banner p{margin:0 0 14px 0;color:#94a3b8;font-size:0.78rem}
.vk-cookie-banner a{color:#7dd3fc;text-decoration:underline}
/* compact-first row: short text + actions inline */
.vk-cookie-compact{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between}
.vk-cookie-lead{margin:0;flex:1 1 300px;color:#cbd5e1;font-size:0.8rem;line-height:1.45}
.vk-cookie-options{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.vk-cookie-options[hidden]{display:none}
.vk-cookie-row{
  display:flex;align-items:flex-start;gap:10px;
  padding:10px 12px;background:#1e293b;border-radius:8px;
  border:1px solid #334155
}
.vk-cookie-row label{
  flex:1;cursor:pointer;font-size:0.76rem;color:#cbd5e1
}
.vk-cookie-row label strong{color:#fff;display:block;margin-bottom:2px;font-size:0.82rem}
.vk-cookie-row input[type="checkbox"]{
  margin-top:3px;width:16px;height:16px;cursor:pointer;accent-color:#a855f7
}
.vk-cookie-row.locked{opacity:0.7}
.vk-cookie-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.vk-cookie-actions button{
  padding:9px 16px;border:0;border-radius:8px;font-size:0.78rem;font-weight:600;
  cursor:pointer;transition:all 0.15s;font-family:inherit
}
.vk-btn-accept-all{background:#7c3aed;color:#fff}
.vk-btn-accept-all:hover{background:#6d28d9}
.vk-btn-only-necessary{background:#334155;color:#e2e8f0}
.vk-btn-only-necessary:hover{background:#475569}
.vk-btn-save{background:#10b981;color:#fff}
.vk-btn-save:hover{background:#059669}
.vk-btn-customize{background:transparent;color:#cbd5e1;border:1px solid #475569 !important}
.vk-btn-customize:hover{background:#1e293b;color:#fff}
.vk-cookie-compact .vk-cookie-actions{flex-wrap:nowrap}
@media(max-width:600px){
  .vk-cookie-banner{left:8px;right:8px;bottom:8px;padding:12px 12px}
  .vk-cookie-compact{flex-direction:column;align-items:stretch;gap:10px}
  .vk-cookie-lead{flex:1 1 auto}
  .vk-cookie-actions button{flex:1;min-width:0;padding:9px 8px}
}

/* === AGE GATE MODAL === */
.vk-age-gate-overlay{
  position:fixed;inset:0;z-index:10000;
  background:rgba(2,6,23,0.92);backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;
  padding:20px;font-family:Inter,system-ui,sans-serif
}
.vk-age-gate-card{
  max-width:480px;width:100%;background:#0f172a;border:1px solid #1e293b;
  border-radius:18px;padding:32px 28px;text-align:center;color:#e2e8f0;
  box-shadow:0 30px 80px rgba(0,0,0,0.7)
}
.vk-age-gate-card .vk-age-icon{font-size:2.6rem;margin-bottom:12px}
.vk-age-gate-card h2{
  margin:0 0 12px 0;font-size:1.3rem;color:#fff;font-weight:800
}
.vk-age-gate-card p{
  margin:0 0 20px 0;color:#94a3b8;font-size:0.86rem;line-height:1.55
}
.vk-age-gate-card .vk-warn{
  background:rgba(220,38,38,0.12);border:1px solid rgba(220,38,38,0.35);
  color:#fca5a5;padding:10px 14px;border-radius:10px;
  font-size:0.74rem;margin-bottom:18px;line-height:1.5
}
.vk-age-buttons{display:flex;gap:10px;flex-wrap:wrap}
.vk-age-buttons button{
  flex:1;min-width:130px;padding:12px 18px;border:0;border-radius:10px;
  font-size:0.86rem;font-weight:700;cursor:pointer;font-family:inherit;
  transition:transform 0.15s
}
.vk-age-buttons button:hover{transform:translateY(-1px)}
.vk-btn-age-yes{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#fff}
.vk-btn-age-no{background:#334155;color:#e2e8f0}

/* === GLOBAL FOOTER (auto-injected) === */
.vk-global-footer{
  margin-top:48px;padding:24px 18px 32px;
  background:#0a0e18;border-top:1px solid rgba(148,163,184,0.15);
  color:#94a3b8;font-family:Inter,system-ui,sans-serif;font-size:0.72rem;
  line-height:1.65;text-align:center
}
.vk-global-footer .vk-footer-warn{
  color:#fbbf24;font-weight:700;margin-bottom:8px;font-size:0.78rem
}
.vk-global-footer .vk-footer-links{
  margin:14px 0 10px 0;display:flex;gap:14px;justify-content:center;flex-wrap:wrap
}
.vk-global-footer .vk-footer-links a{
  color:#7dd3fc;text-decoration:none;font-size:0.74rem
}
.vk-global-footer .vk-footer-links a:hover{text-decoration:underline}
.vk-global-footer .vk-footer-meta{
  margin-top:10px;font-size:0.66rem;color:#64748b
}
.vk-global-footer .vk-footer-meta strong{color:#94a3b8}

/* === HEADER STANDARD VAKYR (compact) — usato su upgrade/account/legal/contatti === */
.vk-shell-header{
  background:linear-gradient(180deg,rgba(8,14,26,0.95),rgba(8,14,26,0.85));
  border-bottom:1px solid rgba(60,80,120,0.35);
  padding:14px 24px;position:sticky;top:0;z-index:100;backdrop-filter:blur(8px);
  font-family:Inter,system-ui,-apple-system,sans-serif
}
.vk-shell-row{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.vk-shell-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#e8eaf3}
.vk-shell-logo{width:40px;height:40px;border-radius:8px}
.vk-shell-name{
  font-weight:800;letter-spacing:.5px;font-size:18px;
  background:linear-gradient(135deg,#ffffff 0%,#c4b5fd 50%,#06b6d4 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text
}
.vk-shell-tag{font-size:11px;color:#06b6d4;font-style:italic;line-height:1.2;display:block;margin-top:2px}
.vk-shell-nav{display:flex;gap:14px;align-items:center;margin-left:auto;flex-wrap:wrap}
.vk-shell-nav a{color:#9ca3af;text-decoration:none;font-size:13px;font-weight:600;padding:6px 10px;border-radius:6px;transition:color .15s}
.vk-shell-nav a:hover{color:#e8eaf3}
.vk-shell-nav a.active{color:#06b6d4}
.vk-shell-nav a.nav-premium{
  background:linear-gradient(180deg,#d4af37,#b8902a);color:#0a0e1a;font-weight:800;
  padding:7px 14px;box-shadow:0 2px 8px rgba(212,175,55,.25)
}
.vk-shell-nav a.nav-premium:hover{color:#0a0e1a}
/* ── Shell hamburger button (iniettato da legal.js su mobile) ── */
.vk-shell-hamburger{display:none}
@media (max-width:780px){
  .vk-shell-row{gap:10px;flex-wrap:wrap}
  /* Nav nascosta di default su mobile, apre solo con .mobile-open */
  .vk-shell-nav{display:none !important}
  .vk-shell-hamburger{
    display:flex;align-items:center;justify-content:center;
    order:3;width:100%;min-height:44px;padding:10px 14px;margin-top:6px;
    background:rgba(0,245,255,0.08);border:1px solid rgba(0,245,255,0.30);
    border-radius:10px;color:#00f5ff;font-weight:700;font-size:14px;
    letter-spacing:0.04em;cursor:pointer;font-family:inherit;
    transition:background 0.15s
  }
  .vk-shell-hamburger:active{background:rgba(0,245,255,0.18)}
  .vk-shell-nav.mobile-open{
    display:flex !important;flex-direction:column;align-items:stretch;
    width:100%;order:4;
    margin:8px 0 0 0;padding:10px;gap:4px;
    background:rgba(15,23,42,0.92);
    border:1px solid rgba(0,245,255,0.22);border-radius:12px;
    box-shadow:0 8px 24px rgba(0,0,0,0.5)
  }
  .vk-shell-nav.mobile-open a{
    display:flex;align-items:center;width:100%;
    padding:12px 14px;min-height:44px;
    font-size:14px;font-weight:700;
    text-align:left;justify-content:flex-start;
    border-radius:9px;text-decoration:none
  }
  .vk-shell-nav.mobile-open a.nav-premium{
    background:linear-gradient(180deg,#d4af37,#b8902a) !important;
    color:#0a0e1a !important;font-weight:800 !important
  }
}
