/* QUINIELA PLATFORM v3 — themes.css */
:root {
  --brand-primary:#00A651; --brand-secondary:#C8A12E; --brand-accent:#0d6efd;
  --bg-dark-primary:#0A1628; --bg-dark-card:#162032;
  --bg-light-primary:#F0F4F8; --bg-light-card:#FFFFFF;
  --navbar-bg:linear-gradient(135deg,#050E1F,#0A2040);
  --font-family-main:'Segoe UI',system-ui,sans-serif;
  --radius-card:14px; --radius-btn:8px; --transition-speed:0.25s;
}
html[data-theme="dark"],:root{
  --bg-primary:var(--bg-dark-primary); --bg-surface:#12243C; --bg-card:var(--bg-dark-card);
  --bg-card-hover:#1C2B44; --border-color:#1E3A5F; --border-subtle:rgba(255,255,255,.06);
  --text-primary:#E8F0FE; --text-secondary:#A8BFDF; --text-muted:#6B7FA3;
  --input-bg:rgba(0,0,0,.25); --input-border:#1E3A5F;
  --shadow-card:0 4px 24px rgba(0,0,0,.4); --shadow-glow:0 0 24px rgba(0,166,81,.18);
  --table-stripe:rgba(255,255,255,.025); --badge-muted-bg:rgba(255,255,255,.08);
  --alert-success-bg:rgba(25,135,84,.15); --alert-danger-bg:rgba(220,53,69,.15);
  --alert-warning-bg:rgba(255,193,7,.10); --alert-info-bg:rgba(13,202,240,.10);
  --code-bg:rgba(255,255,255,.08); --code-color:#79dbf0;
}
html[data-theme="light"]{
  --bg-primary:var(--bg-light-primary); --bg-surface:#FFFFFF; --bg-card:var(--bg-light-card);
  --bg-card-hover:#F7FAFF; --border-color:#D1E0F0; --border-subtle:rgba(0,0,0,.06);
  --text-primary:#1A2B42; --text-secondary:#3A5070; --text-muted:#7A90A8;
  --input-bg:#FFFFFF; --input-border:#C4D5E8;
  --shadow-card:0 2px 12px rgba(0,0,0,.09); --shadow-glow:0 0 20px rgba(0,166,81,.12);
  --table-stripe:rgba(0,0,0,.025); --badge-muted-bg:rgba(0,0,0,.06);
  --alert-success-bg:rgba(25,135,84,.10); --alert-danger-bg:rgba(220,53,69,.08);
  --alert-warning-bg:rgba(255,193,7,.12); --alert-info-bg:rgba(13,202,240,.10);
  --code-bg:rgba(0,0,0,.06); --code-color:#1a6b8a;
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth; font-family:var(--font-family-main);}
body{background-color:var(--bg-primary)!important;color:var(--text-primary)!important;transition:background-color .2s,color .2s;min-height:100vh;display:flex;flex-direction:column;}
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:var(--bg-primary);}
::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:var(--brand-primary);}
.card{background-color:var(--bg-card)!important;border-color:var(--border-color)!important;color:var(--text-primary)!important;transition:background-color .2s,border-color .2s;}
.card-header{background:var(--border-subtle)!important;border-bottom-color:var(--border-color)!important;color:var(--text-primary)!important;}
.form-control,.form-select{background-color:var(--input-bg)!important;border-color:var(--input-border)!important;color:var(--text-primary)!important;}
.form-control:focus,.form-select:focus{border-color:var(--brand-primary)!important;box-shadow:0 0 0 3px rgba(0,166,81,.2)!important;}
.form-control::placeholder{color:var(--text-muted)!important;}
.form-label{color:var(--text-secondary)!important;}
.input-group-text{background:var(--input-bg)!important;border-color:var(--input-border)!important;color:var(--text-muted)!important;}
#mainNav{background:var(--navbar-bg)!important;border-bottom:1px solid var(--border-color);}
.table{color:var(--text-primary)!important;--bs-table-bg:transparent;--bs-table-hover-bg:var(--table-stripe);--bs-table-border-color:var(--border-color);}
.table-dark{--bs-table-bg:transparent;--bs-table-hover-bg:rgba(255,255,255,.04);--bs-table-border-color:var(--border-color);color:var(--text-primary)!important;background:transparent!important;}
[data-theme="light"] .table-dark{--bs-table-hover-bg:rgba(0,0,0,.04);color:var(--text-primary)!important;}
.alert-success{background:var(--alert-success-bg)!important;border-color:rgba(25,135,84,.3)!important;color:var(--text-primary)!important;}
.alert-danger{background:var(--alert-danger-bg)!important;border-color:rgba(220,53,69,.3)!important;color:var(--text-primary)!important;}
.alert-warning{background:var(--alert-warning-bg)!important;border-color:rgba(255,193,7,.3)!important;color:var(--text-primary)!important;}
.alert-info{background:var(--alert-info-bg)!important;border-color:rgba(13,202,240,.3)!important;color:var(--text-primary)!important;}
.dropdown-menu{background:var(--bg-card)!important;border-color:var(--border-color)!important;box-shadow:var(--shadow-card);}
.dropdown-item{color:var(--text-muted)!important;}
.dropdown-item:hover{background:var(--table-stripe)!important;color:var(--text-primary)!important;}
.dropdown-divider{border-color:var(--border-color)!important;}
.modal-content{background:var(--bg-card)!important;border-color:var(--border-color)!important;color:var(--text-primary)!important;}
.modal-header,.modal-footer{border-color:var(--border-color)!important;}
.page-link{background:var(--bg-card)!important;border-color:var(--border-color)!important;color:var(--text-primary)!important;}
.page-item.active .page-link{background:var(--brand-primary)!important;border-color:var(--brand-primary)!important;}
.list-group-item{background:transparent!important;border-color:var(--border-color)!important;color:var(--text-primary)!important;}
.nav-tabs{border-color:var(--border-color)!important;}
.nav-tabs .nav-link{color:var(--text-muted)!important;}
.nav-tabs .nav-link.active{background:var(--bg-card)!important;border-color:var(--border-color)!important;color:var(--text-primary)!important;}
.progress{background:var(--badge-muted-bg)!important;}
.bg-dark{background-color:var(--bg-card)!important;}
.border-secondary{border-color:var(--border-color)!important;}
.text-white{color:var(--text-primary)!important;}
.text-white-50{color:var(--text-muted)!important;}
.text-muted{color:var(--text-muted)!important;}
code{background:var(--code-bg);color:var(--code-color);padding:.1em .4em;border-radius:4px;font-size:.85em;}
.footer{background:var(--bg-card)!important;border-top:1px solid var(--border-color)!important;margin-top:auto;}
.btn-world-cup{background:linear-gradient(135deg,color-mix(in srgb,var(--brand-primary) 70%,#004 30%),var(--brand-primary));border:none;color:#fff;box-shadow:0 4px 15px color-mix(in srgb,var(--brand-primary) 40%,transparent);transition:all .2s;}
.btn-world-cup:hover{background:linear-gradient(135deg,var(--brand-primary),color-mix(in srgb,var(--brand-primary) 80%,#fff 20%));color:#fff;transform:translateY(-1px);}
.theme-toggle-btn{width:38px;height:38px;border-radius:50%;border:1px solid var(--border-color);background:var(--badge-muted-bg);color:var(--text-muted);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;font-size:1.1rem;}
.theme-toggle-btn:hover{border-color:var(--brand-secondary);color:var(--brand-secondary);transform:rotate(20deg);}
.avatar-sm{width:32px;height:32px;background:linear-gradient(135deg,var(--brand-primary),color-mix(in srgb,var(--brand-primary) 50%,#000));border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:#fff;flex-shrink:0;}
.profile-avatar{width:90px;height:90px;background:linear-gradient(135deg,var(--brand-primary),color-mix(in srgb,var(--brand-primary) 50%,#003));border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:700;color:#fff;border:3px solid var(--brand-secondary)!important;}
.breadcrumb-item a{color:var(--text-muted)!important;text-decoration:none;}
.breadcrumb-item a:hover{color:var(--brand-primary)!important;}
.breadcrumb-item+.breadcrumb-item::before,.breadcrumb-item.active{color:var(--text-muted)!important;}
html[data-theme="light"] #adminSidebar{background:#1A2540!important;}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.auth-badge{animation:float 3s ease-in-out infinite;}
.blink{animation:blink 1.2s step-start infinite;}
@keyframes blink{50%{opacity:.4}}
@media(max-width:576px){.card{border-radius:10px!important;}}

/* ── ADAPTIBILIDAD DE TEMAS (CLARO/OSCURO) ── */
.text-light { color: var(--text-secondary) !important; }
.card .bg-dark, .modal-content .bg-dark {
  background-color: var(--bg-primary) !important;
  border-color: var(--border-color) !important;
}
html[data-theme="light"] .btn-outline-light {
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
  background-color: transparent !important;
}
html[data-theme="light"] .btn-outline-light:hover {
  background-color: var(--badge-muted-bg) !important;
  color: var(--brand-primary) !important;
}
html[data-theme="light"] .btn-close-white {
  filter: none !important;
}
html[data-theme="light"] #adminSidebar {
  background-color: #162238 !important;
  border-color: rgba(255,255,255,.1) !important;
}
html[data-theme="light"] #adminSidebar,
html[data-theme="light"] #adminSidebar * {
  color: rgba(255,255,255,0.85) !important;
}
html[data-theme="light"] #adminSidebar a.sidebar-link {
  color: rgba(255,255,255,0.8) !important;
}
html[data-theme="light"] #adminSidebar a.sidebar-link:hover,
html[data-theme="light"] #adminSidebar a.sidebar-link.active {
  background: rgba(255,255,255,0.1) !important;
  color: #fff !important;
}
html[data-theme="light"] #adminSidebar .text-warning {
  color: #ffc107 !important;
}
html[data-theme="light"] .table-dark th,
html[data-theme="light"] .table-dark td {
  color: var(--text-primary) !important;
}
html[data-theme="light"] .card {
  box-shadow: var(--shadow-card) !important;
}
html[data-theme="light"] .table-dark {
  color: var(--text-primary) !important;
}

/* bg-dark exceptions in light theme */
html[data-theme="light"] .card.bg-dark,
html[data-theme="light"] .card .bg-dark,
html[data-theme="light"] .modal-content .bg-dark {
  background-color: var(--bg-card) !important;
  border-color: var(--border-color) !important;
}
html[data-theme="light"] .card.bg-dark *,
html[data-theme="light"] .card .bg-dark *,
html[data-theme="light"] .modal-content .bg-dark * {
  color: var(--text-primary) !important;
}
html[data-theme="light"] .card.bg-dark .text-white,
html[data-theme="light"] .card .bg-dark .text-white,
html[data-theme="light"] .card.bg-dark .text-light,
html[data-theme="light"] .card .bg-dark .text-light {
  color: var(--text-primary) !important;
}
html[data-theme="light"] .card.bg-dark .text-muted,
html[data-theme="light"] .card .bg-dark .text-muted,
html[data-theme="light"] .card.bg-dark .text-white-50,
html[data-theme="light"] .card .bg-dark .text-white-50,
html[data-theme="light"] .modal-content .bg-dark .text-muted,
html[data-theme="light"] .modal-content .bg-dark .text-white-50 {
  color: var(--text-muted) !important;
}
html[data-theme="light"] .card.bg-dark .text-success,
html[data-theme="light"] .card .bg-dark .text-success {
  color: var(--brand-primary) !important;
}
html[data-theme="light"] .card.bg-dark .text-warning,
html[data-theme="light"] .card .bg-dark .text-warning {
  color: var(--brand-secondary) !important;
}
html[data-theme="light"] .card.bg-dark .text-info,
html[data-theme="light"] .card .bg-dark .text-info {
  color: var(--brand-accent) !important;
}
html[data-theme="light"] .card.bg-dark .text-danger,
html[data-theme="light"] .card .bg-dark .text-danger {
  color: #dc3545 !important;
}
html[data-theme="light"] .card.bg-dark .badge,
html[data-theme="light"] .card .bg-dark .badge {
  color: #fff !important;
}
html[data-theme="light"] .card.bg-dark .avatar-sm,
html[data-theme="light"] .card.bg-dark .avatar-sm * {
  color: #fff !important;
}

/* Form Controls in Light Mode */
html[data-theme="light"] .form-control,
html[data-theme="light"] .form-select,
html[data-theme="light"] .input-group-text {
  background-color: var(--input-bg) !important;
  border-color: var(--input-border) !important;
  color: var(--text-primary) !important;
}
html[data-theme="light"] .form-control::placeholder {
  color: var(--text-muted) !important;
}

