/* ============================================================
   Basket Manager — tema "court" (moderno, sporty, responsive)
   ============================================================ */
:root{
  --bg:#e9edf4;
  --surface:#ffffff;
  --surface-2:#f6f8fc;
  --border:#e4e9f2;
  --ink:#1b2233;
  --muted:#6c7688;
  --brand-1:#141a2e;      /* header gradient scuro */
  --brand-2:#26315a;
  --nav:#1b2338;
  --nav-hi:#2b3760;
  --accent:#ff6a13;       /* arancione basket */
  --accent-d:#e85d0c;
  --accent-soft:#fff2e9;
  --gold:#f4b41a;
  --ok:#1e9e5a; --ok-bg:#e6f7ee; --ok-ink:#12703f;
  --danger:#e23b3b; --danger-bg:#fde7e7; --danger-ink:#9c2020;
  --radius:14px;
  --radius-sm:10px;
  --shadow:0 8px 24px rgba(20,26,46,.10);
  --shadow-sm:0 2px 8px rgba(20,26,46,.07);
}
*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:"Segoe UI",Inter,Roboto,Arial,sans-serif;
  background:
    radial-gradient(1200px 400px at 80% -120px, #dfe6f5 0, rgba(223,230,245,0) 70%),
    var(--bg);
  color:var(--ink);
  font-size:15px;
  line-height:1.5;
}
a{ color:var(--accent-d); text-decoration:none; }
a:hover{ text-decoration:underline; }

/* ---------- Topbar ---------- */
header.topbar{
  background:linear-gradient(120deg,var(--brand-1),var(--brand-2));
  color:#fff;
  padding:12px 18px;
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; flex-wrap:wrap;
  border-bottom:3px solid var(--accent);
  position:sticky; top:0; z-index:100;
}
header.topbar .logo{ font-weight:800; font-size:20px; letter-spacing:.2px; display:flex; align-items:center; gap:8px; }
header.topbar .logo span{ color:var(--accent); }
header.topbar .userbox{ font-size:14px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
header.topbar .userbox .chip{
  background:rgba(255,255,255,.12); padding:5px 10px; border-radius:999px; font-weight:600;
  display:inline-flex; align-items:center; gap:6px;
}
header.topbar .userbox .chip.budget{ color:#ffd9b8; }
header.topbar .userbox a{ color:#fff; opacity:.9; }
header.topbar .userbox a:hover{ opacity:1; }

.navtoggle{
  display:none; background:rgba(255,255,255,.12); color:#fff; border:none;
  border-radius:10px; padding:8px 12px; font-size:18px; cursor:pointer;
}

/* ---------- Nav ---------- */
nav.menu{
  background:var(--nav);
  padding:0 12px;
  display:flex; flex-wrap:wrap; align-items:center;
  position:sticky; top:56px; z-index:90;
  box-shadow:var(--shadow-sm);
}
nav.menu a, .menu .dropbtn{
  color:#e8ecf6; padding:13px 15px; display:inline-block; font-size:14.5px; font-weight:600;
  border-bottom:3px solid transparent; cursor:pointer;
}
nav.menu a:hover, .menu .dropbtn:hover{ background:var(--nav-hi); text-decoration:none; }
nav.menu a.active, .menu .dropbtn.active{
  background:var(--nav-hi); border-bottom-color:var(--accent); color:#fff;
}

/* Menu a tendina */
.menu .dropdown{ position:relative; display:inline-block; }
.menu .dropdown:hover .dropbtn{ background:var(--nav-hi); }
.menu .dropcontent{
  display:none; position:absolute; left:0; top:100%; background:var(--nav);
  min-width:210px; z-index:50; box-shadow:0 12px 26px rgba(0,0,0,.3);
  border-radius:0 0 12px 12px; overflow:hidden;
}
.menu .dropdown:hover .dropcontent{ display:block; }
.menu .dropcontent a{ display:block; padding:12px 16px; color:#e8ecf6; border-bottom:1px solid rgba(255,255,255,.05); }
.menu .dropcontent a:hover{ background:var(--nav-hi); text-decoration:none; }

/* Tendina notifiche (campanello) */
.notif-badge{ background:#c0392b; color:#fff; border-radius:9px; padding:0 6px; font-size:12px; font-weight:bold; margin-left:3px; }
.menu .notif-panel{ left:auto; right:0; width:320px; max-width:92vw; background:var(--surface);
  color:var(--ink); border:1px solid var(--border); border-radius:12px; box-shadow:0 14px 36px rgba(15,20,40,.30); }
/* apertura al CLICK (via .open), non all'hover */
.menu .notif-dd:hover .notif-panel{ display:none; }
.menu .notif-dd.open .notif-panel{ display:block; }
.notif-head{ display:flex; justify-content:space-between; align-items:center; padding:10px 13px;
  font-weight:800; font-size:13px; color:var(--ink); background:var(--surface-2); border-bottom:1px solid var(--border); }
.notif-head a{ font-size:12px; font-weight:700; color:var(--accent-d); }
.notif-empty{ padding:20px 14px; color:var(--muted); font-size:13px; text-align:center; }
.menu .notif-panel a.notif-item{ display:flex; gap:9px; align-items:flex-start; padding:8px 13px;
  color:var(--ink); border-bottom:1px solid var(--border); line-height:1.25; }
.menu .notif-panel a.notif-item:hover{ background:var(--surface-2); }
.menu .notif-panel a.notif-item.unread{ background:#eef4ff; }
.menu .notif-panel a.notif-item.unread:hover{ background:#e4eeff; }
.ni-ic{ font-size:16px; line-height:1.3; flex:0 0 auto; }
.ni-body{ display:flex; flex-direction:column; min-width:0; gap:1px; }
.ni-title{ font-weight:600; font-size:12.5px; line-height:1.25;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.notif-item.unread .ni-title{ font-weight:800; }
.ni-time{ color:var(--muted); font-size:11px; margin-top:1px; }
.menu .notif-panel a.notif-all{ display:block; text-align:center; padding:10px 14px; font-weight:700;
  font-size:13px; color:var(--accent-d); border-bottom:none; }
.menu .notif-panel a.notif-all:hover{ background:var(--surface-2); }
@media (max-width:760px){ .menu .notif-panel{ width:100%; max-width:100%; right:auto; border-radius:0; } }

/* ---------- Layout ---------- */
/* Su monitor grandi il contenuto si allarga progressivamente per riempire lo schermo. */
.container{ max-width:1240px; margin:22px auto; padding:0 22px;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:18px; align-items:start; grid-auto-flow:row dense; }
/* Default: ogni figlio occupa l'intera riga (paragrafi, form, tabelle, hero,
   flash, banner, e le card che contengono tabelle o griglie). */
.container > *{ grid-column:1 / -1; }
.container > .card{ margin-bottom:0; }
/* Solo le card "compatte" (senza tabelle o griglie interne) si affiancano su
   desktop, così stanno più card per riga. Su browser senza :has() restano a
   piena larghezza (nessuna regressione). */
.container > .card:not(:has(table)):not(:has(.grid)):not(.span-all){ grid-column:auto; }
@media (min-width:1500px){ .container{ max-width:1560px; } }
@media (min-width:1850px){ .container{ max-width:1800px; } }
@media (max-width:560px){ .container{ display:block; } .container > .card{ margin-bottom:18px; } }

/* Intestazione di pagina (titolo sezione) — coerente su tutte le pagine */
.page-head{ display:flex; align-items:center; gap:12px; margin:2px 0 18px; flex-wrap:wrap; }
.page-head .ph-accent{ width:6px; height:28px; border-radius:6px; background:var(--accent); flex:0 0 auto; }
.page-head h1{ margin:0; font-size:23px; font-weight:800; letter-spacing:.2px; }
.page-head .ph-sub{ color:var(--muted); font-size:13.5px; }

/* ---------- Card ---------- */
.card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:20px;
  margin-bottom:18px;
  box-shadow:var(--shadow-sm);
}
.card h2{
  margin:0 0 14px; font-size:18px; font-weight:800; letter-spacing:.2px;
  padding-bottom:10px; border-bottom:2px solid var(--surface-2);
  position:relative;
}
.card h2::after{ content:""; position:absolute; left:0; bottom:-2px; width:52px; height:2px; background:var(--accent); }

.grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); gap:16px; }
.grid .card{ margin-bottom:0; }

/* Dossier: più card sulla stessa riga su desktop, impilate su smartphone.
   Le card con .span-all occupano l'intera larghezza (tabelle larghe). */
.dossier{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:18px; align-items:start; grid-auto-flow:row dense; }
.dossier > .card{ margin-bottom:0; }
.dossier > .span-all{ grid-column:1 / -1; }
@media (max-width:560px){ .dossier{ grid-template-columns:1fr; } }

.stat-big{ font-size:26px; font-weight:800; color:var(--ink); line-height:1.15; }
.muted{ color:var(--muted); font-size:13px; }

/* ---------- Dashboard: hero + tiles ---------- */
.hero{
  background:linear-gradient(120deg,var(--brand-1),var(--brand-2));
  color:#fff; border-radius:var(--radius); padding:22px; margin-bottom:18px;
  box-shadow:var(--shadow); display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  position:relative; overflow:hidden;
}
.hero::before{
  content:"🏀"; position:absolute; right:-10px; bottom:-24px; font-size:120px; opacity:.10; transform:rotate(-12deg);
}
.hero .crest{
  flex:0 0 auto; height:auto; width:auto; z-index:1;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.30));
}
.hero .h-main{ flex:1; min-width:200px; z-index:1; }
.hero .h-main h1{ margin:0; font-size:24px; font-weight:800; }
.hero .h-sub{ opacity:.85; font-size:14px; margin-top:4px; }
.hero .h-actions{ display:flex; gap:10px; flex-wrap:wrap; z-index:1; }

.tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:14px; margin-bottom:18px; }
.tile{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  padding:16px; box-shadow:var(--shadow-sm); position:relative; overflow:hidden;
}
.tile::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--accent); }
.tile .t-label{ color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.4px; font-weight:700; display:flex; align-items:center; gap:6px; }
.tile .t-val{ font-size:24px; font-weight:800; margin-top:6px; }
.tile .t-sub{ color:var(--muted); font-size:12.5px; margin-top:2px; }
.tile.accent-gold::before{ background:var(--gold); }
.tile.accent-green::before{ background:var(--ok); }
.tile.accent-blue::before{ background:#3a7bd5; }
.tile.accent-red::before{ background:var(--danger); }

/* ---------- Landing page (ospiti) ---------- */
.lp-hero{ background:linear-gradient(120deg,var(--brand-1),var(--brand-2)); color:#fff; border-radius:18px; padding:52px 28px; text-align:center; position:relative; overflow:hidden; box-shadow:var(--shadow); margin-bottom:20px; }
.lp-hero::before{ content:"🏀"; position:absolute; right:-24px; bottom:-48px; font-size:220px; opacity:.08; transform:rotate(-12deg); }
.lp-hero .badge{ display:inline-block; background:rgba(255,255,255,.14); color:#ffd9b8; font-weight:700; font-size:13px; padding:5px 12px; border-radius:999px; margin-bottom:14px; }
.lp-hero h1{ font-size:40px; line-height:1.1; margin:0 0 12px; font-weight:800; position:relative; z-index:1; }
.lp-hero h1 span{ color:var(--accent); }
.lp-hero .lead{ font-size:18px; opacity:.92; max-width:700px; margin:0 auto 24px; position:relative; z-index:1; }
.lp-cta{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; position:relative; z-index:1; }
.lp-cta .btn-lg{ font-size:16px; padding:14px 24px; border-radius:12px; }
.lp-cta a{ text-decoration:none; }
.lp-ghost{ background:rgba(255,255,255,.12)!important; box-shadow:none!important; }
.lp-sec-title{ text-align:center; font-size:24px; font-weight:800; margin:34px 0 6px; }
.lp-sec-sub{ text-align:center; color:var(--muted); margin:0 auto 20px; max-width:640px; }
.lp-features{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; }
.lp-feature{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px; box-shadow:var(--shadow-sm); }
.lp-feature .ic{ font-size:28px; line-height:0; color:var(--accent); display:inline-flex;
  width:52px; height:52px; align-items:center; justify-content:center; border-radius:14px;
  background:var(--accent-soft); margin-bottom:6px; }
.lp-feature .ic .gicon{ width:26px; height:26px; }
.lp-feature h3{ margin:10px 0 6px; font-size:16px; font-weight:800; }
.lp-feature p{ margin:0; color:var(--muted); font-size:14px; }
.lp-steps{ counter-reset:step; display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; }
.lp-step{ position:relative; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px 20px 20px 60px; box-shadow:var(--shadow-sm); }
.lp-step::before{ counter-increment:step; content:counter(step); position:absolute; left:18px; top:18px; width:30px; height:30px; border-radius:50%; background:linear-gradient(180deg,var(--accent),var(--accent-d)); color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center; }
.lp-step h3{ margin:0 0 6px; font-size:16px; font-weight:800; }
.lp-step p{ margin:0; color:var(--muted); font-size:14px; }
.lp-final{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:28px; text-align:center; box-shadow:var(--shadow-sm); margin-top:24px; }
.lp-final h2{ border:none; font-size:22px; margin:0 0 8px; }
.lp-final h2::after{ display:none; }
@media (max-width:760px){
  .lp-hero{ padding:36px 18px; }
  .lp-hero h1{ font-size:29px; }
  .lp-hero .lead{ font-size:16px; }
  .lp-cta .btn-lg{ width:100%; }
}

/* ---------- Tabelle ---------- */
table{ width:100%; border-collapse:collapse; }
th,td{ padding:9px 11px; text-align:left; border-bottom:1px solid var(--border); }
th{ background:var(--surface-2); font-size:12px; text-transform:uppercase; letter-spacing:.3px; color:var(--muted); font-weight:700; }
tbody tr:hover, table tr:hover{ background:#fafbfe; }
tr.me{ background:var(--accent-soft); font-weight:700; }
tr.me:hover{ background:var(--accent-soft); }
td.num,th.num{ text-align:center; }

/* ---------- Barre ---------- */
.bar{ background:#e9edf4; border-radius:6px; height:10px; overflow:hidden; min-width:80px; display:inline-block; width:100px; vertical-align:middle; }
.bar>span{ display:block; height:100%; background:var(--ok); }
.bar.low>span{ background:var(--danger); }
.bar.mid>span{ background:var(--gold); }

/* ---------- Bottoni ---------- */
button, input[type=submit]{
  background:linear-gradient(180deg,var(--accent),var(--accent-d)); color:#fff; border:none;
  padding:9px 16px; border-radius:10px; cursor:pointer; font-size:14px; font-weight:700;
  box-shadow:0 2px 6px rgba(232,93,12,.28); transition:transform .05s ease, box-shadow .15s ease;
}
button:hover, input[type=submit]:hover{ box-shadow:0 4px 12px rgba(232,93,12,.36); }
button:active, input[type=submit]:active{ transform:translateY(1px); }
button.secondary{ background:linear-gradient(180deg,#5b6478,#454d5f); box-shadow:0 2px 6px rgba(30,36,52,.2); }
button[disabled]{ opacity:.5; cursor:not-allowed; box-shadow:none; }

select, input[type=text], input[type=email], input[type=password], input[type=number], input[type=date]{
  padding:8px 10px; border:1px solid #cdd5e2; border-radius:10px; font-size:14px; background:#fff; color:var(--ink);
}
select:focus, input:focus{ outline:2px solid var(--accent-soft); border-color:var(--accent); }

/* ---------- Flash ---------- */
.flash{ padding:12px 16px; border-radius:12px; margin-bottom:16px; font-weight:600; }
.flash.ok{ background:var(--ok-bg); border:1px solid #9ad9b6; color:var(--ok-ink); }
.flash.err{ background:var(--danger-bg); border:1px solid #f2b3b3; color:var(--danger-ink); }

/* ---------- Auth ---------- */
.auth-wrap{ max-width:420px; margin:48px auto; }
.auth-wrap .card label{ display:block; margin:10px 0 4px; font-weight:700; font-size:14px; }
.auth-wrap .card input{ width:100%; }
.auth-wrap .card button{ width:100%; margin-top:16px; }

/* ---------- Pills ---------- */
.pill{ display:inline-block; padding:3px 10px; border-radius:999px; font-size:12px; font-weight:700; background:#eef1f7; color:#485267; }
.pill.win{ background:var(--ok-bg); color:var(--ok-ink); }
.pill.loss{ background:var(--danger-bg); color:var(--danger-ink); }

/* ---------- Starbar ---------- */
.starbar{ position:relative; display:inline-block; white-space:nowrap; font-size:15px; letter-spacing:1px; line-height:1; vertical-align:middle; }
.starbar .s-base{ color:#d7dce6; }
.starbar .s-pot, .starbar .s-cur{ position:absolute; left:0; top:0; overflow:hidden; }
.starbar .s-pot{ color:#f3dfa0; }
.starbar .s-cur{ color:var(--gold); }

.dot{ display:inline-block; width:12px; height:12px; border-radius:50%; vertical-align:middle; margin-right:6px; border:1px solid rgba(0,0,0,.15); }
details summary{ cursor:pointer; }

/* ---------- Pubblicità (AdSense) ---------- */
.adbox{ margin:0 0 18px; text-align:center; }
.adbox-ph{
  border:1px dashed #c3cbda; border-radius:12px; background:repeating-linear-gradient(45deg,#f4f6fb,#f4f6fb 12px,#eef1f8 12px,#eef1f8 24px);
  color:#9aa3b5; padding:22px; display:flex; flex-direction:column; align-items:center; gap:2px; min-height:90px; justify-content:center;
}
.adbox-ph span{ font-weight:700; letter-spacing:.4px; }
.adbox-ph small{ font-size:11px; opacity:.8; }

/* ---------- Footer ---------- */
footer{ text-align:center; color:var(--muted); font-size:12px; padding:22px; }

/* ============================================================
   RESPONSIVE — smartphone
   ============================================================ */
@media (max-width:760px){
  body{ font-size:14.5px; }
  header.topbar{ padding:10px 14px; position:static; }
  header.topbar .logo{ font-size:18px; }
  .navtoggle{ display:inline-flex; }

  nav.menu{ position:static; flex-direction:column; align-items:stretch; padding:0; display:none; }
  nav.menu.open{ display:flex; }
  nav.menu > a, .menu .dropbtn{ width:100%; border-bottom:1px solid rgba(255,255,255,.06); }
  nav.menu a.active, .menu .dropbtn.active{ border-bottom-color:rgba(255,255,255,.06); box-shadow:inset 4px 0 0 var(--accent); }
  .menu .dropdown{ width:100%; }
  .menu .dropdown .dropcontent{ position:static; display:none; box-shadow:none; min-width:auto; border-radius:0; background:rgba(0,0,0,.18); }
  .menu .dropdown.open .dropcontent{ display:block; }
  nav.menu a[style*="margin-left"]{ margin-left:0 !important; }

  .container{ margin:14px auto; padding:0 12px; }
  .card{ padding:16px; border-radius:12px; }
  .hero{ padding:18px; }
  .hero .h-main h1{ font-size:20px; }
  .hero .h-actions{ width:100%; }
  .hero .h-actions button{ flex:1; }
  .stat-big{ font-size:22px; }
  .page-head h1{ font-size:19px; }
  .page-head .ph-sub{ width:100%; }

  /* tabelle scorrevoli in orizzontale */
  .card > table, .card > form > table{ display:block; overflow-x:auto; white-space:nowrap; }
}
@media (max-width:420px){
  .tiles{ grid-template-columns:repeat(2,1fr); }
}

button.danger, .btn.danger{ background:#c0392b; border-color:#a5311f; color:#fff; }
button.danger:hover{ background:#a5311f; }

/* Azioni rosa (mercato): gruppi distinti per evitare click errati */
.ra{ display:flex; flex-direction:column; gap:2px; min-width:230px; }
.ra-group{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; padding:7px 0; }
.ra-group + .ra-group{ border-top:1px dashed var(--border); }
.ra-lbl{ font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.5px;
  color:var(--muted); width:72px; flex:0 0 auto; }
.ra-group.ra-danger{ background:#fdf2f2; border-radius:8px; padding:7px 8px; margin-top:2px; }
.ra-group.ra-danger + .ra-group{ border-top:none; }
.ra-danger .ra-lbl{ color:var(--danger-ink); }

/* DataTable (simple-datatables) coerente col tema */
.datatable-top, .datatable-bottom{ display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:10px; padding:8px 0; font-size:13px; color:var(--muted); }
.datatable-input, .datatable-selector{ padding:7px 10px; border:1px solid var(--border);
  border-radius:8px; font-size:13px; background:#fff; }
.datatable-input:focus, .datatable-selector:focus{ outline:none; border-color:var(--accent); }
.datatable-pagination ul{ list-style:none; display:flex; gap:4px; padding:0; margin:0; flex-wrap:wrap; }
.datatable-pagination a{ display:block; padding:6px 11px; border:1px solid var(--border);
  border-radius:8px; color:var(--accent-d); text-decoration:none; font-size:13px; }
.datatable-pagination a:hover{ background:var(--accent-soft); }
.datatable-pagination .datatable-active a{ background:var(--accent); border-color:var(--accent); color:#fff; }
.datatable-pagination .datatable-disabled a{ opacity:.4; pointer-events:none; }
.datatable-table th{ cursor:pointer; }
.datatable-empty{ text-align:center; color:var(--muted); padding:14px; }

/* ============================================================
   TABELLONE RISULTATI (girone): selettore giornate + match card scure
   ============================================================ */
.mb-rounds{ display:flex; flex-direction:column; gap:8px; margin:4px 0 18px; }
.mb-rrow{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.mb-rlabel{ width:64px; color:var(--muted); font-size:13px; font-weight:700; flex:0 0 auto; }
.mb-num{ width:30px; height:30px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  font-size:13px; color:var(--muted); text-decoration:none; flex:0 0 auto; border:1px solid transparent; transition:.12s; }
.mb-num:hover{ background:var(--surface-2); color:var(--ink); border-color:var(--border); }
.mb-num.done{ color:var(--ink); font-weight:600; }
.mb-num.on{ background:var(--accent); color:#fff; font-weight:800; border-color:var(--accent); }

.mb-match{ background:#141d33; border-radius:16px; overflow:hidden; margin-bottom:14px;
  color:#fff; box-shadow:0 6px 18px rgba(10,16,32,.28); }
.mb-team{ display:flex; align-items:center; gap:14px; padding:15px 18px; }
.mb-team + .mb-team{ border-top:1px solid rgba(255,255,255,.07); }
.mb-team .nm{ flex:1; font-weight:800; font-size:16px; text-transform:uppercase; letter-spacing:.4px; line-height:1.15; }
.mb-team .sc{ font-size:30px; font-weight:800; min-width:44px; text-align:right; font-variant-numeric:tabular-nums; }
.mb-team.lose{ opacity:.62; }
.mb-team.me-row{ box-shadow:inset 4px 0 0 var(--accent); }
.mb-foot{ display:flex; align-items:center; gap:16px; padding:11px 18px; background:#0d1424;
  font-size:13px; color:#9db0d0; border-top:1px solid rgba(255,255,255,.06); flex-wrap:wrap; }
.mb-foot .mb-info{ margin-left:auto; color:#fff; font-weight:700; text-decoration:none; }
.mb-foot .mb-info:hover{ color:var(--accent); }
@media (max-width:480px){
  .mb-team .nm{ font-size:14px; } .mb-team .sc{ font-size:26px; }
  .mb-rlabel{ width:100%; }
}

/* ============================================================
   GRAFICA: logo, stemmi, avatar, icone, hero
   ============================================================ */
header.topbar .logo{ display:inline-flex; align-items:center; line-height:0; }
header.topbar .logo .site-logo{ display:block; }

/* icone inline: allineate al testo */
.gicon{ display:inline-block; vertical-align:-0.18em; flex:0 0 auto; }
nav.menu a, nav.menu .dropbtn{ display:inline-flex; align-items:center; gap:7px; }
nav.menu .dropcontent a{ display:flex; align-items:center; gap:8px; }
.userbox a{ display:inline-flex; align-items:center; gap:5px; }

/* stemma società */
.crest{ display:inline-block; vertical-align:middle; flex:0 0 auto;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.25)); }
.chip-club{ display:inline-flex; align-items:center; gap:7px; }
.chip-club .crest{ filter:none; }
.crest-lg{ filter:drop-shadow(0 3px 8px rgba(0,0,0,.30)); }

/* ritratto clipart (scheda giocatore/staff) */
.portrait{ display:block; flex:0 0 auto; border-radius:16px;
  box-shadow:0 4px 14px rgba(0,0,0,.14); border:1px solid rgba(0,0,0,.06); }

/* avatar giocatore/staff */
.avatar{ display:inline-block; vertical-align:middle; flex:0 0 auto; border-radius:50%; }
.avatar-staff{ border-radius:11px; }
.name-cell{ display:inline-flex; align-items:center; gap:9px; }
.name-cell .avatar{ flex:0 0 auto; }
.name-cell .nm{ display:inline-flex; flex-direction:column; line-height:1.15; }
.name-cell .nm small{ color:var(--muted); font-size:11px; }

/* intestazione società con stemma grande */
.club-hero{ display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  padding:20px 22px; border-radius:16px; color:#fff; margin-bottom:18px;
  background:linear-gradient(135deg, var(--nav-bg) 0%, #223a63 100%);
  position:relative; overflow:hidden; }
.club-hero::after{ content:""; position:absolute; inset:0;
  background-image:var(--court, none); background-size:220px; opacity:.5; pointer-events:none; }
.club-hero > *{ position:relative; z-index:1; }
.club-hero h1{ margin:0; font-size:26px; color:#fff; }
.club-hero .ch-meta{ opacity:.85; font-size:14px; margin-top:3px; }
.club-hero .ch-spacer{ flex:1; }
.club-hero .ch-stat{ text-align:center; }
.club-hero .ch-stat .v{ font-size:20px; font-weight:800; }
.club-hero .ch-stat .k{ font-size:11px; text-transform:uppercase; letter-spacing:.5px; opacity:.8; }

/* hero generico con pattern campo */
.court-bg{ position:relative; }
.court-bg::after{ content:""; position:absolute; inset:0;
  background-image:var(--court, none); background-size:220px; opacity:.5; pointer-events:none; }

/* ============================================================
   PARTITA DAL VIVO (partita_live.php)
   ============================================================ */
.live-board{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  background:linear-gradient(135deg,#141a2b,#20293f); color:#fff; border:none; }
.live-board .lb-team{ display:flex; align-items:center; gap:12px; flex:1; }
.live-board .lb-team:last-child{ justify-content:flex-end; }
.live-board .lb-name{ font-weight:800; font-size:16px; letter-spacing:.2px; }
.live-board .lb-score{ font-size:40px; font-weight:900; line-height:1; min-width:56px; text-align:center;
  font-variant-numeric:tabular-nums; }
.live-board .lb-mid{ text-align:center; padding:0 6px; }
.live-board .lb-period{ font-size:12px; text-transform:uppercase; letter-spacing:1px; color:#aeb8cf; }
.live-board .lb-clock{ font-size:26px; font-weight:800; font-variant-numeric:tabular-nums; }

.live-grid{ grid-template-columns:1.2fr .8fr; }
@media (max-width:820px){ .live-grid{ grid-template-columns:1fr; } }

.pbp{ min-height:360px; max-height:66vh; overflow-y:auto; display:flex; flex-direction:column; }
.pbp-line{ padding:6px 8px; border-bottom:1px solid var(--border); font-size:13.5px;
  display:flex; gap:8px; align-items:baseline; animation:pbpIn .18s ease; }
.pbp-line.mine{ background:rgba(255,106,19,.08); }
.pbp-line.opp{ background:rgba(30,136,229,.06); }
.pbp .pbp-t{ color:var(--muted); font-size:11px; font-variant-numeric:tabular-nums; min-width:64px; }
.pbp .pbp-s{ flex:1; }
.pbp .pbp-sc{ font-weight:800; font-variant-numeric:tabular-nums; }
@keyframes pbpIn{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }

.live-tactic{ display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; margin:6px 0 4px; }
.live-tactic label{ display:flex; flex-direction:column; font-size:12px; color:var(--muted); gap:3px; }
.live-tactic select{ padding:6px 8px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }

.live-lineup{ width:100%; border-collapse:collapse; }
.live-lineup td{ padding:5px 6px; border-bottom:1px solid var(--border); font-size:13.5px; }
.live-lineup td:first-child{ font-weight:600; }
button.mini{ padding:3px 8px; font-size:12px; }
button.big{ font-size:16px; padding:11px 20px; }

.live-controls{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }

/* Marcatori inizio/fine gara nella cronaca dal vivo */
.pbp-line.pbp-mark{ justify-content:center; gap:8px; background:var(--surface-2);
  font-weight:800; color:var(--ink); border-bottom:1px solid var(--border); }
.pbp-line.pbp-mark .pbp-t{ min-width:0; }

/* ============================================================
   TABELLONE ELETTRONICO + TABELLE SQUADRA (partita dal vivo)
   ============================================================ */
.scoreboard{ display:flex; align-items:stretch; justify-content:space-between; gap:12px;
  background:radial-gradient(120% 140% at 50% 0%, #10182b 0%, #0a0e16 70%);
  border:2px solid #223052; border-radius:16px; padding:16px 20px; margin-bottom:14px;
  box-shadow:inset 0 0 46px rgba(0,0,0,.65), 0 10px 26px rgba(10,15,30,.28); }
.scoreboard .sb-side{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; flex:1; min-width:0; }
.scoreboard .sb-team{ font-weight:800; letter-spacing:1px; text-transform:uppercase; font-size:13px;
  color:#7fe3ff; text-shadow:0 0 9px rgba(90,200,255,.55); text-align:center; line-height:1.15;
  max-width:100%; overflow:hidden; text-overflow:ellipsis; }
.scoreboard .sb-num{ font-family:'Courier New',Consolas,monospace; font-weight:900; font-size:66px; line-height:.9;
  font-variant-numeric:tabular-nums; letter-spacing:2px; }
.scoreboard .sb-num.home{ color:#ff6a2b; text-shadow:0 0 16px rgba(255,106,43,.85),0 0 5px rgba(255,150,90,.9); }
.scoreboard .sb-num.away{ color:#ffb02b; text-shadow:0 0 16px rgba(255,176,43,.8),0 0 5px rgba(255,200,90,.9); }
.scoreboard .sb-mid{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:0 6px; }
.scoreboard .sb-period{ font-size:11px; letter-spacing:2px; text-transform:uppercase; color:#9fb0cf; }
.scoreboard .sb-clock{ font-family:'Courier New',Consolas,monospace; font-weight:800; font-size:32px; color:#3dff88;
  text-shadow:0 0 12px rgba(61,255,136,.7); font-variant-numeric:tabular-nums; letter-spacing:1px; }
.scoreboard .sb-to{ font-size:10px; letter-spacing:1px; color:#6f7d99; }
.scoreboard .sb-to span{ color:#ffd23f; font-weight:800; }
@media (max-width:640px){
  .scoreboard{ padding:12px; }
  .scoreboard .sb-num{ font-size:44px; } .scoreboard .sb-clock{ font-size:24px; } .scoreboard .sb-team{ font-size:11px; }
}

.box-teams{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
@media (max-width:820px){ .box-teams{ grid-template-columns:1fr; } }
.box-card h3{ margin:0 0 8px; font-size:15px; }
.box-tbl{ width:100%; border-collapse:collapse; font-size:13px; }
.box-tbl th{ text-align:right; font-size:11px; color:var(--muted); font-weight:700; padding:4px 5px; border-bottom:2px solid var(--border); }
.box-tbl th.pl{ text-align:left; }
.box-tbl td{ text-align:right; padding:5px; border-bottom:1px solid var(--border); font-variant-numeric:tabular-nums; }
.box-tbl td.pl{ text-align:left; font-weight:600; white-space:nowrap; }
.box-tbl td.rl{ text-align:left; }
.box-tbl td.b{ font-weight:800; }
.box-tbl td.act{ text-align:center; }
.box-tbl tr.on td{ background:rgba(255,106,19,.07); }
.box-tbl tr.off td{ color:var(--muted); }
.box-tbl tr.off td.pl{ color:var(--ink); font-weight:500; }
.pdot{ display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:6px; vertical-align:middle; }
.pdot.d-on{ background:#2ec16b; box-shadow:0 0 5px rgba(46,193,107,.85); }
.pdot.d-off{ background:#c3ccd9; }

/* ============================================================
   LANDING/GUIDE — miglioramenti grafici
   ============================================================ */
.lp-feature{ transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.lp-feature:hover{ transform:translateY(-3px); box-shadow:0 10px 24px rgba(15,20,40,.12); border-color:var(--accent); }
.lp-feature.is-new{ position:relative; }
.lp-feature.is-new::after{ content:"NOVITÀ"; position:absolute; top:12px; right:12px; font-size:10px; font-weight:800;
  letter-spacing:.5px; color:#fff; background:linear-gradient(180deg,var(--accent),var(--accent-d)); padding:3px 8px; border-radius:999px; }

/* Vetrina "partita dal vivo": mini-tabellone che richiama il gioco reale */
.lp-showcase{ display:grid; grid-template-columns:1.1fr .9fr; gap:22px; align-items:center;
  background:radial-gradient(120% 140% at 15% 0%, #10182b 0%, #0a0e16 70%); color:#eaf0ff;
  border:1px solid #223052; border-radius:18px; padding:26px 28px; margin:20px 0; box-shadow:var(--shadow); }
.lp-showcase .sc-txt h2{ color:#fff; font-size:24px; margin:0 0 8px; border:none; }
.lp-showcase .sc-txt h2::after{ display:none; }
.lp-showcase .sc-txt p{ color:#aeb8cf; margin:0 0 14px; font-size:15px; line-height:1.55; }
.lp-showcase .sc-list{ list-style:none; padding:0; margin:0 0 4px; }
.lp-showcase .sc-list li{ padding:4px 0 4px 26px; position:relative; color:#dbe3f5; font-size:14px; }
.lp-showcase .sc-list li::before{ content:"▸"; position:absolute; left:6px; color:var(--accent); font-weight:800; }
.lp-board{ background:#070b12; border:2px solid #1c2740; border-radius:14px; padding:16px; text-align:center;
  box-shadow:inset 0 0 36px rgba(0,0,0,.6); }
.lp-board .row{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.lp-board .tm{ flex:1; font-weight:800; text-transform:uppercase; font-size:12px; letter-spacing:1px; color:#7fe3ff; text-shadow:0 0 8px rgba(90,200,255,.5); }
.lp-board .sc{ font-family:'Courier New',monospace; font-weight:900; font-size:52px; line-height:1; font-variant-numeric:tabular-nums; }
.lp-board .sc.h{ color:#ff6a2b; text-shadow:0 0 14px rgba(255,106,43,.8); }
.lp-board .sc.a{ color:#ffb02b; text-shadow:0 0 14px rgba(255,176,43,.8); }
.lp-board .clk{ font-family:'Courier New',monospace; font-weight:800; font-size:20px; color:#3dff88; text-shadow:0 0 10px rgba(61,255,136,.7); margin-top:6px; }
.lp-board .pbp{ margin-top:12px; border-top:1px solid #1c2740; padding-top:10px; font-size:12.5px; color:#9fb0cf; text-align:left; }
.lp-board .pbp span{ color:#fff; }
@media (max-width:760px){ .lp-showcase{ grid-template-columns:1fr; } .lp-board .sc{ font-size:40px; } }

/* Striscia numeri/qualità */
.lp-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; margin:18px 0; }
.lp-stat{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:16px; text-align:center; box-shadow:var(--shadow-sm); }
.lp-stat .n{ font-size:26px; font-weight:900; color:var(--accent); line-height:1; }
.lp-stat .l{ font-size:13px; color:var(--muted); margin-top:4px; }

/* ============================================================
   ANALYTICS (analytics.php)
   ============================================================ */
.an-bars{ display:flex; flex-direction:column; gap:7px; }
.an-row{ display:grid; grid-template-columns:130px 1fr 54px; align-items:center; gap:10px; }
.an-k{ font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.an-track{ background:var(--surface-2); border-radius:999px; height:12px; overflow:hidden; }
.an-track span{ display:block; height:100%; background:linear-gradient(90deg,var(--accent),var(--accent-d)); border-radius:999px; }
.an-n{ text-align:right; font-weight:800; font-variant-numeric:tabular-nums; font-size:13px; }
.an-split{ display:flex; height:26px; border-radius:8px; overflow:hidden; margin:6px 0 4px; font-size:12px; font-weight:800; color:#fff; }
.an-split span{ display:flex; align-items:center; justify-content:center; white-space:nowrap; min-width:0; }
.an-split .hu{ background:#1e9e5a; }
.an-split .bo{ background:#8a94a6; }
.an-split .gu{ background:#b0392b; }
@media (max-width:520px){ .an-row{ grid-template-columns:100px 1fr 46px; } }