/* ============================================================
   assets/css/stile-comune.css
   Tenace Games S.r.l.s. — Stili comuni a tutte le pagine
   ============================================================ */

/* ── VARIABILI TEMA CHIARO ── */
:root,
[data-tema="chiaro"] {
  /* Colori principali */
  --blu-primario:       #1c3c78;
  --blu-hover:          #152d5c;
  --blu-chiaro:         #e8eef8;
  --accento:            #cccccc;
  --accento-scuro:      #aaaaaa;
  /* Sfondi */
  --sfondo-corpo:       #f4f6fa;
  --sfondo-navbar:      #ffffff;
  --sfondo-sezione-alt: #eef1f8;
  --sfondo-card:        #ffffff;
  /* Testi */
  --testo-primario:     #1a1a2e;
  --testo-secondario:   #4a5568;
  /* Bordi e ombre */
  --bordo:              #dee2ee;
  --ombra:              rgba(28,60,120,.12);
  --ombra-forte:        rgba(28,60,120,.22);
  /* Gradienti */
  --gradiente-hero:     linear-gradient(135deg,#0f1f45 0%,#1c3c78 55%,#2a5298 100%);
  --gradiente-brand:    linear-gradient(135deg,#1c3c78,#2a5298);
  --navbar-shadow:      0 2px 20px rgba(0,0,0,.08);
  /* Alias brevi (compatibilità pagine legali) */
  --blu:                #1c3c78;
  --testo:              #1a1a2e;
  --testo-sec:          #4a5568;
  --sfondo:             #f4f6fa;
  --gradiente:          linear-gradient(135deg,#0f1f45,#1c3c78,#2a5298);
}

/* ── VARIABILI TEMA SCURO ── */
[data-tema="scuro"] {
  --blu-primario:       #4a7fd4;
  --blu-hover:          #5a8fe4;
  --blu-chiaro:         #1a2540;
  --accento:            #cccccc;
  --accento-scuro:      #eeeeee;
  --sfondo-corpo:       #0d1117;
  --sfondo-navbar:      #161b27;
  --sfondo-sezione-alt: #0f1520;
  --sfondo-card:        #1a2035;
  --testo-primario:     #e8ecf5;
  --testo-secondario:   #9aaabf;
  --bordo:              #2a3450;
  --ombra:              rgba(0,0,0,.35);
  --ombra-forte:        rgba(0,0,0,.55);
  --gradiente-hero:     linear-gradient(135deg,#050c1f 0%,#0f1f45 55%,#1c3c78 100%);
  --gradiente-brand:    linear-gradient(135deg,#1a2a50,#2a4080);
  --navbar-shadow:      0 2px 20px rgba(0,0,0,.4);
  /* Alias brevi */
  --blu:                #4a7fd4;
  --testo:              #e8ecf5;
  --testo-sec:          #9aaabf;
  --sfondo:             #0d1117;
  --gradiente:          linear-gradient(135deg,#050c1f,#0f1f45,#1c3c78);
}

/* ── RESET E BASE ── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Barlow', sans-serif;
  font-size: 1.1rem;
  background-color: var(--sfondo-corpo);
  color: var(--testo-primario);
  transition: background-color .35s ease, color .35s ease;
  line-height: 1.75;
}
h1, h2, h3, h4, h5 {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  letter-spacing: -.01em;
}
a { color: var(--blu-primario); }
a:hover { color: var(--blu-hover); }

/* ── NAVBAR ── */
.navbar-tenace {
  background-color: var(--sfondo-navbar);
  box-shadow: var(--navbar-shadow);
  transition: background-color .35s ease, box-shadow .35s ease;
  padding: .5rem 0;
  position: sticky;
  top: 0;
  z-index: 1030;
}
.navbar-brand { padding-top: 0; padding-bottom: 0; }
.navbar-brand img { height: 44px; width: auto; transition: opacity .2s; }
.navbar-brand img:hover { opacity: .85; }
.logo-chiaro { display: block; }
.logo-scuro  { display: none;  }
[data-tema="scuro"] .logo-chiaro { display: none;  }
[data-tema="scuro"] .logo-scuro  { display: block; }
.nav-link-tenace {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 600;
  font-size: 1.1rem;
  letter-spacing: .04em;
  color: var(--testo-primario) !important;
  padding: .4rem .85rem !important;
  border-radius: 6px;
  transition: color .2s, background .2s;
}
.nav-link-tenace:hover { color: var(--blu-primario) !important; background: var(--blu-chiaro); }
.btn-tema {
  background: none;
  border: 1.5px solid var(--bordo);
  color: var(--testo-primario);
  border-radius: 50px;
  padding: .35rem .85rem;
  font-size: .95rem;
  display: flex;
  align-items: center;
  gap: .4rem;
  transition: all .2s;
  cursor: pointer;
}
.btn-tema:hover { border-color: var(--blu-primario); color: var(--blu-primario); }
.navbar-toggler { border: 1.5px solid var(--bordo); border-radius: 8px; padding: .4rem .6rem; }
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%231c3c78' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
[data-tema="scuro"] .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%234a7fd4' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ── FOOTER ── */
.footer-tenace { background: #0a1128; color: rgba(255,255,255,.65); padding: 70px 0 0; }
.footer-logo img { height: 38px; width: auto; }
.footer-desc { font-size: .95rem; line-height: 1.75; margin-top: .8rem; color: rgba(255,255,255,.5); }
.footer-titolo { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: .95rem; letter-spacing: .1em; text-transform: uppercase; color: var(--accento); margin-bottom: 1.2rem; }
.footer-link { list-style: none; padding: 0; margin: 0; }
.footer-link li { margin-bottom: .55rem; }
.footer-link a { color: rgba(255,255,255,.55); text-decoration: none; font-size: .95rem; transition: color .2s; display: flex; align-items: center; gap: .4rem; }
.footer-link a:hover { color: var(--accento); }
.footer-link a i { font-size: .7rem; }
.footer-divider { border-color: rgba(255,255,255,.08); margin: 50px 0 0; }
.footer-bottom { padding: 1.4rem 0; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .8rem; font-size: .88rem; color: rgba(255,255,255,.35); }
.footer-bottom a { color: rgba(255,255,255,.4); text-decoration: none; }
.footer-bottom a:hover { color: var(--accento); }
/* Footer semplice (pagine legali) */
.footer-semplice { background: #0a1128; color: rgba(255,255,255,.55); padding: 2rem 0; }
.footer-semplice a { color: rgba(255,255,255,.5); text-decoration: none; }
.footer-semplice a:hover { color: var(--accento); }

/* ── BOTTONE TORNA SU ── */
.btn-torna-su {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  width: 52px;
  height: 52px;
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gradiente-brand);
  color: #fff;
  box-shadow: 0 10px 28px rgba(0,0,0,.22);
  cursor: pointer;
  z-index: 9998;
  opacity: 0;
  visibility: hidden;
  transform: translateY(16px) scale(.92);
  transition: opacity .25s ease, visibility .25s ease, transform .25s ease, box-shadow .25s ease;
}
.btn-torna-su i { font-size: 1.35rem; line-height: 1; }
.btn-torna-su:hover { box-shadow: 0 14px 34px rgba(0,0,0,.28); transform: translateY(-2px) scale(1); }
.btn-torna-su.visibile { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }

/* ── COOKIE BANNER ── */
#cookieBanner { position: fixed; bottom: 0; left: 0; right: 0; z-index: 9990; background: #0a1128; border-top: 1px solid rgba(255,255,255,.1); padding: 1.4rem 0; transform: translateY(100%); transition: transform .45s cubic-bezier(.22,.61,.36,1); box-shadow: 0 -8px 40px rgba(0,0,0,.4); }
#cookieBanner.visibile { transform: translateY(0); }
.cookie-titolo { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 1.2rem; color: #fff; margin-bottom: .3rem; }
.cookie-testo { font-size: .92rem; color: rgba(255,255,255,.6); margin: 0; line-height: 1.6; }
.cookie-testo a { color: var(--accento); text-decoration: none; }
.cookie-testo a:hover { text-decoration: underline; }
.btn-cookie-accetta { background: #1c3c78; color: #fff; border: none; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 1rem; letter-spacing: .05em; padding: .6rem 1.4rem; border-radius: 8px; cursor: pointer; transition: all .2s; white-space: nowrap; }
.btn-cookie-accetta:hover { background: #2a5298; }
.btn-cookie-necessari { background: transparent; color: rgba(255,255,255,.7); border: 1px solid rgba(255,255,255,.25); font-family: 'Barlow Condensed', sans-serif; font-weight: 600; font-size: 1rem; padding: .6rem 1.4rem; border-radius: 8px; cursor: pointer; transition: all .2s; white-space: nowrap; }
.btn-cookie-necessari:hover { border-color: rgba(255,255,255,.5); color: #fff; }
.btn-cookie-impostazioni { background: transparent; color: rgba(255,255,255,.5); border: none; font-size: .9rem; cursor: pointer; text-decoration: underline; padding: 0; white-space: nowrap; }
.btn-cookie-impostazioni:hover { color: rgba(255,255,255,.8); }
.cookie-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.75); z-index: 10000; display: none; align-items: center; justify-content: center; padding: 1rem; }
.cookie-modal-overlay.aperta { display: flex; }
.cookie-modal { background: #0f1d3a; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; max-width: 560px; width: 100%; max-height: 90vh; overflow-y: auto; padding: 2rem; }
.cookie-modal h5 { font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: 1.5rem; color: #fff; margin-bottom: 1rem; }
.cookie-categoria { border: 1px solid rgba(255,255,255,.1); border-radius: 10px; padding: 1rem 1.2rem; margin-bottom: .8rem; }
.cookie-categoria-header { display: flex; justify-content: space-between; align-items: center; }
.cookie-categoria-nome { font-weight: 600; font-size: 1rem; color: #fff; }
.cookie-categoria-desc { font-size: .9rem; color: rgba(255,255,255,.55); margin-top: .4rem; line-height: 1.55; }
.form-switch .form-check-input { width: 2.5rem; height: 1.3rem; cursor: pointer; }
.form-check-input:checked { background-color: #1c3c78; border-color: #1c3c78; }

/* ── ANIMAZIONI ── */
.anima-entrata { opacity: 0; transform: translateY(28px); transition: opacity .65s ease, transform .65s ease; }
.anima-entrata.visibile { opacity: 1; transform: translateY(0); }
.ritardo-1 { transition-delay: .1s; }
.ritardo-2 { transition-delay: .2s; }
.ritardo-3 { transition-delay: .3s; }
.ritardo-4 { transition-delay: .4s; }

/* ── BADGE COMUNE ── */
.badge-pvr { display: inline-flex; align-items: center; gap: .4rem; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: 6px; padding: .3rem .75rem; font-size: .85rem; color: rgba(255,255,255,.5); margin-top: .8rem; }
.toast-tenace { position: fixed; bottom: 2rem; right: 2rem; z-index: 9999; }

/* ── RESPONSIVE ── */
@media (max-width: 767px) {
  .cookie-bottoni { flex-direction: column; gap: .6rem !important; }
  .btn-torna-su { right: .75rem; bottom: .75rem; width: 48px; height: 48px; }
}
