/* Tema moderno con richiami Totocalcio */
:root{
  --bg:#0e1116;
  --card:#141a22;
  --text:#eaf1f8;
  --muted:#9fb2c8;
  --green:#1aa865; /* verde Totocalcio moderno */
  --green-dark:#0d5d2f;
  --red:#e54535;
  --yellow:#f7df77;
  --paper:#f6f2e9; /* carta chiara per elementi */
  --border:#273446;
  --grid:#243244;
  --ring:rgba(26,168,101,.35);
}

body.totocalcio90{background:linear-gradient(180deg,#0f1115 0%, #10141b 60%, #0f1115 100%);color:var(--text);font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,sans-serif;margin:0}
.site-header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:linear-gradient(90deg, var(--green-dark), #157347);color:#fff;border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;z-index:10}
.site-header .brand{font-weight:700;letter-spacing:.5px;display:flex;align-items:center;gap:10px}
.site-header .brand .logo{font-family:'Roboto Mono',monospace;color:var(--yellow);text-shadow:0 0 10px rgba(248,226,122,.25)}
.site-header nav a{color:#fff;margin-right:14px;text-decoration:none;opacity:.85;padding:6px 10px;border-radius:8px}
.site-header nav a:hover{opacity:1;background:rgba(255,255,255,.08)}
.site-header nav a.active{background:rgba(255,255,255,.18)}
.site-header a:hover{opacity:1}
.container{max-width:1100px;margin:22px auto;padding:0 16px}
.site-footer{border-top:1px solid rgba(255,255,255,.08);background:#0f1115;color:var(--muted);text-align:center;padding:14px;margin-top:30px}

/* Admin shell responsive */
.admin-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
.admin-aside{background:#0f141b;border-right:1px solid var(--border);padding:16px}
.admin-aside .brand{color:#fff;font-weight:700;margin-bottom:12px}
.admin-nav{display:flex;flex-direction:column;gap:6px}
.admin-main{padding:18px}
.admin-menu-toggle{display:none;background:transparent;border:1px solid var(--grid);color:#fff;padding:8px 10px;border-radius:8px;cursor:pointer}

@media (max-width: 920px){
  .admin-shell{grid-template-columns:1fr}
  .admin-aside{position:sticky;top:0;z-index:9;border-right:0;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px}
  .admin-menu-toggle{display:inline-block}
  .admin-nav{display:none;flex-direction:column;gap:6px;width:100%}
  .admin-shell.menu-open .admin-nav{display:flex}
  .admin-nav .btn{padding:10px 12px}
}

/* Menu admin pills lightweight */
.admin-nav .btn{background:transparent;border-color:var(--grid);color:#fff}
.admin-nav .btn:hover{background:rgba(255,255,255,.08)}

/* Responsive tables */
.table-scroll{overflow-x:auto}
.table th,.table td{white-space:nowrap}

/* Mobile-friendly tables: card layout, no horizontal scroll */
@media (max-width: 720px){
  .table-scroll{overflow:visible}
  .table{border:0}
  .table thead{display:none}
  .table tr{display:block;border:1px solid var(--border);border-radius:10px;margin-bottom:10px;background:var(--card)}
  .table td{display:grid;grid-template-columns:120px 1fr;gap:8px;white-space:normal;border:0;border-bottom:1px solid var(--border);padding:10px}
  .table td:last-child{border-bottom:0}
  .table td::before{content:attr(data-label);color:var(--muted)}
}

.card{background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.35);padding:18px;backdrop-filter:saturate(1.1)}
.section-title{margin:0 0 10px;font-weight:700;letter-spacing:.3px;color:#e8eef5}
.text-muted{color:#b9c6d6 !important}
.muted{color:#b9c6d6}

.hero .schedina-banner{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03)}
.hero .title{font-weight:700;color:var(--yellow);margin-bottom:8px}
.pools{display:flex;gap:18px;flex-wrap:wrap}
.pools .pool{background:#0f141b;border:1px dashed var(--grid);padding:12px 14px;border-radius:10px}
.pools .pool span{display:block;color:var(--muted);font-size:12px}
.pools .pool strong{font-size:22px;color:var(--red)}
.winners-list{list-style:none;padding:0;margin:0}
.winners-list li{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px dashed var(--grid)}
.winners-list li strong{color:var(--text);font-weight:600}
.winners-list li em{color:var(--text);font-style:normal;font-weight:500}
.winners .muted{color:var(--text);font-style:italic}
.badge{display:inline-block;width:26px;height:26px;line-height:26px;text-align:center;border-radius:50%;background:#0b1320;color:#fff;border:1px solid var(--grid);font-weight:700}
.badge.first{background:linear-gradient(#ffe27a,#f3bf2d);color:#271c00}
.badge.second{background:linear-gradient(#cde0ff,#86b2ff);color:#001b44}

.form .row{margin-bottom:12px}
.form label{display:block;font-size:13px;color:var(--muted)}
.form input,.form select{padding:10px;border:1px solid var(--border);border-radius:10px;width:100%;background:#09111d;color:var(--text)}
.form select{background-image:linear-gradient(180deg,#0c1726 0%, #0a1320 100%);border-color:var(--grid)}
.form input:focus,.form select:focus{outline:none;border-color:#1ea768;box-shadow:0 0 0 3px var(--ring)}
.btn{background:var(--green);color:#0c1a10;border:1px solid #1ea768;padding:10px 14px;border-radius:10px;cursor:pointer;font-weight:600;transition:transform .08s ease, box-shadow .15s ease}
.btn:hover{filter:brightness(1.05)}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--red);border-color:#c53025;color:#fff}
.alert.error{background:rgba(228,61,48,.12);border:1px solid rgba(228,61,48,.35);color:#ffb3a9;padding:10px;border-radius:10px;margin:8px 0}
.muted{color:var(--muted)}

/* Griglia schedina moderna con richiami vintage */
.schedina90 .schedina-grid{display:block;overflow:auto;border:1px solid var(--border);border-radius:14px;background:#0f141b;position:relative}
.schedina90 .schedina-grid:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top left, rgba(25,160,94,.08), transparent 40%), radial-gradient(circle at bottom right, rgba(248,226,122,.08), transparent 40%);pointer-events:none}
.schedina90 .schedina-header{display:grid;grid-template-columns:220px repeat(7, 1fr);background:#122030;border-bottom:1px solid var(--border)}
.schedina90 .schedina-header .col{padding:10px;text-align:center;font-weight:700;color:var(--yellow);font-family:'Roboto Mono', monospace}
.schedina90 .schedina-row{display:grid;grid-template-columns:220px repeat(7, 1fr);border-bottom:1px dashed var(--grid)}
.schedina90 .schedina-row .match{padding:10px;font-weight:600;color:#dbe7f3}
.schedina90 .col-group{display:flex;justify-content:center;gap:10px;padding:8px}
.schedina90 .token{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;border:1px solid var(--grid);background:#0b1320;color:#dbe7f3;font-weight:700;cursor:pointer;user-select:none;transition:background .15s,border-color .15s,box-shadow .15s}
.schedina90 .token:hover{border-color:var(--green);box-shadow:0 0 0 3px var(--ring)}
.schedina90 .token.active{background:linear-gradient(#1a8a56,#146e45);border-color:#1ea768;color:#eafff3}
.schedina90 input[type="radio"]{display:none}
.schedina-actions{display:flex;gap:10px;margin-top:12px}

.table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--border)}
.table th,.table td{border:1px solid var(--border);padding:8px}
.inline-form{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap}
.inline-form input[type="text"],.inline-form input:not([type]){padding:8px;border:1px solid var(--border);border-radius:10px;background:#09111d;color:var(--text)}
.card.table-scroll{margin-top:12px}

/* Stepper */
.steps{display:flex;gap:10px;margin:12px 0}
.step{flex:1;display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:#0f141b;color:var(--muted)}
.step .num{width:26px;height:26px;line-height:26px;text-align:center;border-radius:50%;background:#0b1320;border:1px solid var(--grid);font-weight:700;color:#9fb2c8}
.step.active{border-color:#2a915f;background:linear-gradient(180deg,#0f1c16,#0d1511)}
.step.active .num{background:linear-gradient(#1a8a56,#146e45);color:#eafff3;border-color:#1ea768}
.step.done{opacity:.8}

/* Match rows responsive layout */
.form .matchcard{background:#0f141b;border:1px solid var(--border);border-radius:12px;padding:12px;margin-bottom:12px;box-shadow:0 4px 18px rgba(0,0,0,.25);width:100%;box-sizing:border-box}
.form .matchtitle{font-weight:700;color:var(--yellow);margin:0 0 8px 0}
/* Logo circles */
.team-logo{width:24px;height:24px;border-radius:50%;object-fit:cover;border:1px solid var(--grid);background:#0b1320}

/* User play: compact rows */
.play-table td.match-cell{padding:.5rem .75rem}
.play-table .team-row{display:flex;align-items:center;gap:8px}

/* 1X2 buttons: dim when not selected */
.btn-1x2{opacity:1;filter:none;background:#0b1320;border-color:#var(--grid);color:#b9c6d6;transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease}
.btn-outline-success.btn-1x2:hover{background:#1aa865;border-color:#1aa865;color:#0c1a10}
.btn-outline-warning.btn-1x2:hover{background:#f7df77;border-color:#f7df77;color:#3a2a00}
.btn-outline-danger.btn-1x2:hover{background:#e54535;border-color:#e54535;color:#fff}
.btn-check:checked + .btn-outline-success.btn-1x2{background:linear-gradient(#1a8a56,#146e45);border-color:#1ea768;color:#eafff3;box-shadow:0 0 0 3px var(--ring)}
.btn-check:checked + .btn-outline-warning.btn-1x2{background:linear-gradient(#ffd666,#f4b400);border-color:#ffcd38;color:#3a2a00;box-shadow:0 0 0 3px rgba(247,223,119,.35)}
.btn-check:checked + .btn-outline-danger.btn-1x2{background:linear-gradient(#e74c3c,#c0392b);border-color:#c53025;color:#fff;box-shadow:0 0 0 3px rgba(228,69,53,.35)}

/* Stili specifici per tabella predizioni admin */
.predict-table .btn-1x2 {
    min-width: 50px;
    padding: 8px 4px;
    font-size: 0.85rem;
}

.predict-table .btn-1x2 small {
    font-size: 0.7rem;
    font-weight: 600;
}

.predict-table .form-control-sm {
    font-size: 0.8rem;
    padding: 4px 8px;
}

.predict-table .match-cell {
    min-width: 200px;
}

.predict-table .team-row {
    font-size: 0.9rem;
    margin-bottom: 2px;
}

.predict-table .team-logo {
    width: 20px;
    height: 20px;
}

.predict-table td {
    vertical-align: middle;
    padding: 12px 8px;
}

.predict-table th {
    background: #1a2332;
    color: var(--yellow);
    font-weight: 600;
    font-size: 0.9rem;
    padding: 12px 8px;
    border-bottom: 2px solid var(--green);
}

.predict-table tbody tr:hover {
    background: rgba(255, 255, 255, 0.02);
}

/* Stili per card quote bookmaker - Layout a griglia con card mini */
.quotes-grid-compact {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 8px;
    max-height: 500px;
    overflow-y: auto;
    background: #0f141b;
    border-radius: 8px;
    padding: 8px;
}

.quote-card-mini {
    background: linear-gradient(135deg, #1a2332 0%, #0f141b 100%);
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 8px;
    transition: all 0.2s ease;
    min-height: 80px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.quote-card-mini:hover {
    border-color: var(--green);
    box-shadow: 0 2px 8px rgba(26, 168, 101, 0.1);
    transform: translateY(-1px);
}

.match-teams {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-bottom: 6px;
    flex: 1;
}

.team-mini {
    display: flex;
    align-items: center;
    gap: 3px;
    flex: 1;
    min-width: 0;
}

.team-logo-mini {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.team-name-mini {
    color: var(--text);
    font-weight: 600;
    font-size: 0.75rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 60px;
}

.vs-mini {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 500;
    margin: 0 2px;
    flex-shrink: 0;
}

.quotes-mini {
    display: flex;
    justify-content: space-between;
    gap: 4px;
    margin-bottom: 4px;
}

.quote-mini {
    font-family: 'Roboto Mono', monospace;
    font-weight: 700;
    font-size: 0.8rem;
    padding: 2px 4px;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    text-align: center;
    flex: 1;
    min-width: 0;
}

.quote-mini.quote-1 {
    color: var(--green);
}

.quote-mini.quote-x {
    color: #f7df77;
}

.quote-mini.quote-2 {
    color: var(--red);
}

.time-mini {
    color: var(--muted);
    font-size: 0.65rem;
    text-align: center;
    margin-top: 2px;
}

/* Responsive per card mini */
@media (max-width: 768px) {
    .quotes-grid-compact {
        grid-template-columns: 1fr;
        gap: 6px;
    }
    
    .quote-card-mini {
        min-height: 70px;
        padding: 6px;
    }
    
    .team-name-mini {
        font-size: 0.7rem;
        max-width: 50px;
    }
    
    .quote-mini {
        font-size: 0.75rem;
        padding: 1px 3px;
    }
}

/* Responsive per quote */
@media (max-width: 768px) {
    .quotes-display {
        gap: 10px;
    }
    
    .quote-row {
        min-width: 35px;
    }
    
    .quote-value {
        font-size: 1rem;
    }
    
    .match-info {
        min-width: 150px;
    }
}
/* Submit disabilitato: verde spento */
#submitTicket:disabled{background:#1c2a22 !important;border-color:#1c2a22 !important;color:#8fb9a3 !important;cursor:not-allowed;opacity:1}

/* Legend for matches in home */
.legend-table th{font-weight:600;text-align:center}
.legend-cell{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.legend-team{display:flex;align-items:center;gap:6px}
.legend-team .team-logo{width:18px;height:18px}

/* Home plays cards */
.play-card-username{color:#e8eef5}
.legend-card{background:#0f141b;border:1px solid var(--border);box-shadow:0 8px 24px rgba(0,0,0,.35)}
.plays-username{color:#ffffff}

/* Improve text contrast on dark cards */
.hero .title{color:#e8eef5}
.schedina-banner .pool span,.schedina-banner .pool strong{color:#e8eef5}
.jackpot-card{background:linear-gradient(135deg,#16202e 0%, #0f141b 60%);border:1px solid rgba(255,215,0,.35);border-radius:14px;padding:14px 16px;box-shadow:0 10px 40px rgba(255,215,0,.12), inset 0 0 0 1px rgba(255,255,255,.05)}
.jackpot-card .label{color:#f6e9a3;letter-spacing:.3px}
.jackpot-amount{font-size:30px;color:#ffe27a;text-shadow:0 0 12px rgba(255,205,0,.35), 0 0 2px rgba(0,0,0,.9)}
.jackpot-amount{animation:jackpotPulse 2.2s ease-in-out infinite}
.secondary-card{background:linear-gradient(135deg,#151a22 0%, #0f141b 60%);border:1px solid rgba(138,162,255,.35);border-radius:14px;padding:14px 16px;box-shadow:0 10px 40px rgba(138,162,255,.12), inset 0 0 0 1px rgba(255,255,255,.05)}
.secondary-card .label{color:#b7c7ff;letter-spacing:.3px}
.secondary-amount{font-size:26px;color:#d6e0ff;text-shadow:0 0 10px rgba(138,162,255,.35)}
.legend-card .card-header{color:#e8eef5;border-color:var(--border)}
.legend-table th,.legend-table td{color:#e8eef5}
.stat-number{font-size:26px;font-weight:800;color:#e8eef5}
.mono{font-family:'Roboto Mono', monospace}
.small{font-size:12px}
.badge.bg-success-soft{background:rgba(25,135,84,.15);color:#20c997;border:1px solid rgba(25,135,84,.35)}

/* CTA gioca ora */
.cta-row{display:flex;gap:10px;align-items:center;margin-top:8px}
.cta-play{background:linear-gradient(90deg,#ff5f6d,#ffc371);color:#1b1200;border:0;padding:10px 14px;border-radius:10px;font-weight:800;box-shadow:0 6px 22px rgba(255,95,109,.35);cursor:pointer;text-decoration:none}
.cta-play:hover{filter:brightness(1.05)}
.tagline{color:#f6e9a3}

@keyframes jackpotPulse{
  0%{text-shadow:0 0 10px rgba(255,205,0,.35),0 0 2px rgba(0,0,0,.9);transform:scale(1)}
  50%{text-shadow:0 0 18px rgba(255,215,0,.55),0 0 3px rgba(0,0,0,1);transform:scale(1.02)}
  100%{text-shadow:0 0 10px rgba(255,205,0,.35),0 0 2px rgba(0,0,0,.9);transform:scale(1)}
}

/* Tickets grid for History detail */
.tickets-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width: 768px){.tickets-grid{grid-template-columns:1fr}}
.ticket-card{background:#0f141b;border:1px solid var(--border);border-radius:8px}
.ticket-header{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-bottom:1px solid var(--border)}
.ticket-header .name{font-weight:700;color:#fff}
.ticket-header .meta{color:var(--muted);font-size:12px}
.ticket-header .amounts{display:flex;gap:14px;text-align:right;color:#fff}
.ticket-header .amounts .time span{color:#fff}
.ticket-header .amounts div{color:#fff}
.ticket-header .amounts div span{font-weight:700;display:inline-block;margin-top:2px;color:#fff}
.columns-grid{padding:10px 12px;display:grid;grid-template-columns:1fr;gap:6px}
.column-row{display:grid;grid-template-columns:50px 1fr;gap:8px;align-items:center}
.points{font-weight:700;text-align:center;border-right:1px dashed var(--border);color:#fff}
.picks{display:flex;gap:6px;flex-wrap:wrap}
.pick-badge{display:inline-block;min-width:24px;text-align:center;padding:4px 6px;border-radius:6px;font-weight:700}
.pick-neutral{background:#1b2430;color:#adb5bd;border:1px solid #2a3442}
.pick-correct{background:var(--green);color:#fff;border:1px solid #158955}
.pick-wrong{background:var(--red);color:#fff;border:1px solid #c53025}

/* Shareable card */
.share-card{position:relative}
.summary-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:12px}
@media (max-width: 920px){.summary-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width: 540px){.summary-grid{grid-template-columns:repeat(2,1fr)}}
.result-badge{display:inline-block;min-width:26px;text-align:center;padding:4px 8px;border-radius:10px;font-weight:800;font-family:'Roboto Mono',monospace}
.result-badge.one{background:linear-gradient(#1a8a56,#146e45);color:#eafff3;border:1px solid #1ea768}
.result-badge.draw{background:linear-gradient(#ffd666,#f4b400);color:#3a2a00;border:1px solid #ffcd38}
.result-badge.two{background:linear-gradient(#e74c3c,#c0392b);color:#fff;border:1px solid #c53025}

/* Migliora contrasto testi in share-card */
.share-card .muted{color:#d6e0ea}
.share-card .section-title{color:#f0f6ff}
.form .matchline{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:center}
.form .matchline select{min-width:0}

@media (max-width: 640px){
  .form .matchline{grid-template-columns:1fr}
}