/* assets/css/main.css – PingPong Betting System */
:root {
  --primary:   #0d6efd;
  --success:   #198754;
  --danger:    #dc3545;
  --warning:   #ffc107;
  --info:      #0dcaf0;
  --dark:      #212529;
  --light:     #f8f9fa;
  --border:    #dee2e6;
  --radius:    6px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: system-ui, -apple-system, sans-serif; font-size: .95rem;
       background: #f0f2f5; color: var(--dark); }

/* ── Navbar ── */
nav.navbar { background: var(--dark); padding: .75rem 1.5rem; display:flex;
             align-items:center; justify-content:space-between; }
nav.navbar .brand { color:#fff; font-weight:700; font-size:1.1rem; text-decoration:none; }
nav.navbar a { color:#ccc; text-decoration:none; margin-left:1rem; }
nav.navbar a:hover { color:#fff; }
nav.navbar .user-info { color:#adb5bd; font-size:.85rem; }

/* ── Container ── */
.container { max-width:1200px; margin:1.5rem auto; padding:0 1rem; }

/* ── Auth page ── */
body.auth-page { display:flex; align-items:center; justify-content:center; min-height:100vh; }
.auth-card { background:#fff; padding:2rem; border-radius:var(--radius);
             box-shadow:0 4px 20px rgba(0,0,0,.1); width:100%; max-width:420px; }
.auth-logo { font-size:3rem; text-align:center; }
.auth-card h1 { text-align:center; margin:.5rem 0 .2rem; }
.auth-card .subtitle { text-align:center; color:#6c757d; margin-bottom:1.5rem; }
.auth-footer { text-align:center; margin-top:1rem; font-size:.9rem; color:#6c757d; }

/* ── Cards ── */
.card { background:#fff; border:1px solid var(--border); border-radius:var(--radius);
        margin-bottom:1rem; }
.card-header { padding:.75rem 1rem; background:#f8f9fa; border-bottom:1px solid var(--border);
               font-weight:600; }
.card-body { padding:1rem; }
.card-success .card-header { background:#d1e7dd; }

/* ── Forms ── */
.form-group { margin-bottom:1rem; }
.form-group label { display:block; font-weight:500; margin-bottom:.3rem; }
.form-control { width:100%; padding:.5rem .75rem; border:1px solid var(--border);
                border-radius:var(--radius); font-size:.9rem; }
.form-control:focus { outline:none; border-color:var(--primary);
                      box-shadow:0 0 0 3px rgba(13,110,253,.15); }
.form-row { display:flex; flex-wrap:wrap; gap:1rem; }
.form-row .form-group { flex:1; min-width:150px; }
.col-md-2 { flex:0 0 calc(16.66% - .5rem); }
.col-md-3 { flex:0 0 calc(25% - .5rem); }
.col-md-4 { flex:0 0 calc(33.33% - .5rem); }
.col-md-5 { flex:0 0 calc(41.66% - .5rem); }
.col-md-6 { flex:0 0 calc(50% - .5rem); }
.col-md-8 { flex:0 0 calc(66.66% - .5rem); }

/* ── Buttons ── */
.btn { display:inline-block; padding:.45rem .9rem; border:none; border-radius:var(--radius);
       cursor:pointer; font-size:.9rem; text-decoration:none; transition:.15s; }
.btn-primary   { background:var(--primary); color:#fff; }
.btn-success   { background:var(--success); color:#fff; }
.btn-danger    { background:var(--danger);  color:#fff; }
.btn-warning   { background:var(--warning); color:#000; }
.btn-info      { background:var(--info);    color:#000; }
.btn-secondary { background:#6c757d; color:#fff; }
.btn-outline-secondary { background:transparent; border:1px solid #6c757d; color:#6c757d; }
.btn-sm  { padding:.3rem .6rem; font-size:.8rem; }
.btn-block { display:block; width:100%; text-align:center; }
.btn:hover { opacity:.85; }

/* ── Alerts ── */
.alert { padding:.75rem 1rem; border-radius:var(--radius); margin-bottom:1rem; }
.alert-success { background:#d1e7dd; color:#0f5132; border:1px solid #badbcc; }
.alert-danger  { background:#f8d7da; color:#842029; border:1px solid #f5c2c7; }
.alert-info    { background:#cff4fc; color:#055160; border:1px solid #b6effb; }
.alert-warning { background:#fff3cd; color:#664d03; border:1px solid #ffecb5; }

/* ── Tables ── */
.table-responsive { overflow-x:auto; }
.table { width:100%; border-collapse:collapse; background:#fff;
         border-radius:var(--radius); overflow:hidden; }
.table th, .table td { padding:.6rem .8rem; border-bottom:1px solid var(--border);
                        text-align:left; font-size:.88rem; }
.table thead th { background:#343a40; color:#fff; font-weight:600; }
.table-striped tbody tr:nth-child(even) { background:#f8f9fa; }
.table-sm th, .table-sm td { padding:.35rem .6rem; }

/* ── Stats grid ── */
.stats-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
              gap:1rem; margin-bottom:1.5rem; }
.stat-card { background:#fff; padding:1rem; border-radius:var(--radius);
             text-align:center; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.stat-card.green { border-top:3px solid var(--success); }
.stat-card.red   { border-top:3px solid var(--danger); }
.stat-number { display:block; font-size:1.5rem; font-weight:700; }
.stat-label  { display:block; font-size:.8rem; color:#6c757d; margin-top:.2rem; }
.stats-mini  { display:flex; flex-wrap:wrap; gap:1.5rem; background:#fff;
               padding:.75rem 1rem; border-radius:var(--radius); }

/* ── Badges ── */
.badge { display:inline-block; padding:.2rem .55rem; border-radius:20px;
         font-size:.75rem; font-weight:600; }
.badge-programado  { background:#e2e3e5; color:#383d41; }
.badge-en_curso    { background:#cff4fc; color:#055160; }
.badge-finalizado  { background:#d1e7dd; color:#0f5132; }
.badge-cancelado   { background:#f8d7da; color:#842029; }
.badge-activa      { background:#d1e7dd; color:#0f5132; }
.badge-inactiva    { background:#e2e3e5; color:#383d41; }
.badge-agotada     { background:#f8d7da; color:#842029; }
.badge-resultado-ganada   { background:#d1e7dd; color:#0f5132; }
.badge-resultado-perdida  { background:#f8d7da; color:#842029; }
.badge-resultado-pendiente{ background:#fff3cd; color:#664d03; }
.badge-resultado-nula     { background:#e2e3e5; color:#383d41; }
.badge-tipo-deportiva { background:#cff4fc; color:#055160; }
.badge-tipo-gemini    { background:#e8d5f5; color:#5a2d82; }
.badge-tipo-groq      { background:#d5f0f5; color:#0d4f5c; }
.badge-tipo-otra      { background:#e2e3e5; color:#383d41; }

/* ── Misc ── */
.confidence { font-weight:700; font-size:.9rem; }
.consensus-badge { font-size:.82rem; }
.actions { white-space:nowrap; }
.text-muted   { color:#6c757d; }
.text-success { color:var(--success); }
.text-danger  { color:var(--danger); }
.mb-3 { margin-bottom:1rem; }
.mb-4 { margin-bottom:1.5rem; }
.mt-2 { margin-top:.5rem; }
.d-inline { display:inline; }
.w-auto   { width:auto; }
.align-items-end { align-items:flex-end; }
details summary { cursor:pointer; color:var(--primary); margin:1rem 0 .5rem; }

@media (max-width:768px) {
  .form-row { flex-direction:column; }
  .col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-8 { flex:1 1 100%; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
}