:root {
  --bg:#070710;
  --surface:#0e0e1a;
  --surface2:#13131f;
  --surface3:#1a1a2e;
  --border:rgba(255,255,255,0.45);
  --border2:rgba(255,255,255,0.45);
  --text:#f0f4f8;
  --text2:#ffffff;
  --text3:#ffffff;
  --blue:#3b82f6;--blue2:#60a5fa;
  --green:#22c55e;--green2:#4ade80;
  --yellow:#f59e0b;--yellow2:#fbbf24;
  --red:#b51a00;--red2:#f87171;
  --purple:#8b5cf6;--purple2:#a78bfa;
  --orange:#f97316;--orange2:#fb923c;
}

/* Variables extra del tema */
:root {
  --heading:#ffffff;
  --link:#60a5fa;
  --label:#ffffff;
  --muted:#ffffff;
  --card-bg:#0e0e1a;
  --input-bg:#13131f;
}
/* Headings always use heading color */
h1,h2,h3,h4,h5 { color: var(--heading) !important; }
/* Links */
a:not([class]) { color: var(--link); }
/* BASE */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px}
body{background:var(--bg);color:var(--text);font-family:'Poppins',sans-serif;font-weight:400;font-size:1rem;line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh}
a{text-decoration:none;color:inherit}
h1{font-size:2rem;font-weight:800;color:#fff;line-height:1.2}
h2{font-size:1.5rem;font-weight:700;color:#fff}
h3{font-size:1.2rem;font-weight:700;color:#fff}
p{font-size:1rem;color:var(--text2);line-height:1.7}
.sec-title{font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--text3);margin-bottom:14px;display:flex;align-items:center;gap:10px}
.sec-title::after{content:'';flex:1;height:1px;background:var(--border)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:22px 24px}
.card-title{font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--purple2);margin-bottom:16px}
.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px 18px;text-align:center;position:relative;overflow:hidden;transition:border-color .2s,background .2s}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px}
.stat-val{font-size:1.8rem;font-weight:800;display:block;margin-bottom:6px;letter-spacing:-.01em}
.stat-label{font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text3)}
.stat-sub{font-size:.78rem;color:var(--text3);margin-top:4px}
table{width:100%;border-collapse:collapse;font-size:.92rem}
th{text-align:left;padding:10px 12px;border-bottom:2px solid var(--border);font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text3)}
td{padding:10px 12px;border-bottom:1px solid var(--border);vertical-align:middle;color:var(--text2);font-size:.9rem}
tr:hover td{background:rgba(255,255,255,.02)}
td strong,td b{color:#fff;font-weight:700}
.user-name{font-size:1.05rem;font-weight:800;color:#fff}
.user-name-sm{font-size:.92rem;font-weight:700;color:#fff}
.badge{display:inline-block;font-size:.7rem;font-weight:700;padding:3px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.05em}
.btn-primary{background:var(--purple);color:#fff;border:none;font-family:'Poppins',sans-serif;font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:11px 24px;cursor:pointer;border-radius:8px;transition:background .2s,transform .1s}
.btn-primary:hover{background:var(--purple2);transform:translateY(-1px)}
.btn-green{background:var(--green);color:#fff;border:none;font-family:'Poppins',sans-serif;font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:11px 24px;cursor:pointer;border-radius:8px;transition:background .2s}
.btn-green:hover{background:#16a34a}
.btn-ghost{background:none;border:1px solid var(--border2);color:var(--text2);font-family:'Poppins',sans-serif;font-size:.78rem;font-weight:600;padding:8px 18px;cursor:pointer;border-radius:8px;transition:all .2s}
.btn-ghost:hover{color:#fff;border-color:rgba(255,255,255,.35)}
.fg{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.fg label{font-size:.72rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--text2)}
.fg input,.fg select,.fg textarea{background:var(--surface2);border:1px solid var(--border);color:var(--text);font-family:'Poppins',sans-serif;font-size:.95rem;padding:11px 15px;outline:none;border-radius:8px;transition:border-color .2s;width:100%}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--purple)}
.fg select option{background:var(--surface2)}
.flash{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);color:var(--green2);padding:12px 18px;margin-bottom:20px;font-size:.9rem;font-weight:600;border-radius:8px}
.flash-err{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:var(--red2);padding:12px 18px;margin-bottom:20px;font-size:.9rem;font-weight:600;border-radius:8px}
nav{position:sticky;top:0;z-index:100}
.main{max-width:1100px;margin:0 auto;padding:32px 24px}
.page-title{font-size:2rem;font-weight:800;color:#fff;margin-bottom:6px}
.page-title span{color:var(--purple2)}
.page-sub{font-size:.92rem;color:var(--text3);margin-bottom:28px}
/* NAV colors */
.nav-wrap{background:#0a0a14 !important;border-bottom:1px solid rgba(255,255,255,0.44) !important}
/* RESPONSIVE */
@media(max-width:768px){.main{padding:16px 14px}.page-title{font-size:1.4rem}h1{font-size:1.3rem}h2{font-size:1.1rem}.stat-val{font-size:1.3rem}table{font-size:.82rem}th,td{padding:8px 8px}}
@media(max-width:480px){.main{padding:12px 12px}.page-title{font-size:1.2rem}.stat-val{font-size:1.1rem}.stat-label{font-size:.6rem}th{font-size:.6rem}td{font-size:.8rem}.fg input,.fg select,.fg textarea{font-size:.9rem;padding:9px 12px}table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}}
/* OVERRIDE HARDCODED COLORS - aplica tema a elementos especificos */
/* Tablas */
th { color: var(--text3) !important; border-bottom-color: var(--border) !important; }
td { color: var(--text2) !important; border-bottom-color: var(--border) !important; }
td strong, td b { color: var(--text) !important; }
tr:hover td { background: rgba(255,255,255,.02) !important; }
/* Titulos h1-h4 */
h1,h2,h3,h4 { color: var(--text) !important; }
/* Fondos generales */
body { background: var(--bg) !important; color: var(--text) !important; }
/* Inputs */
input:not([type=color]):not([type=range]),
select, textarea {
  background: var(--surface2) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
/* Cards / surfaces */
.stat-box, .form-box, .card, .jornada-item,
.gasto-item, .inc-card, .config-box, .section-box,
.resumen-box, .panel {
  background: var(--surface) !important;
  border-color: var(--border) !important;
}
/* Page backgrounds inner */
.main { background: transparent; }
/* Labels uppercase */
.fg label, .stat-label, .section-label, .form-title,
.sec-title, .card-title { color: var(--text3) !important; }
/* General text */
p, .sub, .page-sub { color: var(--text2) !important; }
/* Stat values stay their accent color (don't override) */
/* Badges keep their colors */
