/* CRM Abogados v2 · temas (6-oct-2026)
   «Clásico» = tema Lujo de app.css (no se toca). Los otros 4 siguen el estilo de Asesor-IA y se activan
   con <html data-tema="oscuro|claro|rosado|azul" class="moderno"> (lo pone js/tema.js).
   Cada tema solo define colores (--m-*); la forma es común y está en el bloque «.moderno». */

/* ═══ selector de tema (vale para los 5) ═══ */
.temas-titulo{display:block;margin-top:12px;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;opacity:.8;}
.temas{display:flex;gap:8px;margin-top:7px;flex-wrap:wrap;}
.sidebar-pie button.tema-btn{width:24px;height:24px;padding:0;margin:0;border-radius:50%;border:2px solid rgba(255,255,255,.25);cursor:pointer;transition:transform .15s,box-shadow .15s;}
.sidebar-pie button.tema-btn:hover{transform:scale(1.1);background-color:transparent;}
.sidebar-pie button.tema-btn[aria-pressed="true"]{border-color:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.35),0 0 0 4px var(--gold);}
.sidebar-pie button.tema-btn.t-clasico{background:linear-gradient(135deg,#0E1420 50%,#C8A45C 50%);}
.sidebar-pie button.tema-btn.t-oscuro{background:linear-gradient(135deg,#0a1114 50%,#46d3c1 50%);}
.sidebar-pie button.tema-btn.t-claro{background:linear-gradient(135deg,#f3f6f5 50%,#0e8577 50%);}
.sidebar-pie button.tema-btn.t-rosado{background:linear-gradient(135deg,#fbf3f6 50%,#c73a74 50%);}
.sidebar-pie button.tema-btn.t-azul{background:linear-gradient(135deg,#0b1428 50%,#5b9cff 50%);}

/* ═══ paletas ═══ */
html[data-tema="oscuro"]{
  --m-bg:#0a1114; --m-bg2:#0d171b; --m-panel:#111d22; --m-panel2:#15252b; --m-panel3:#1b2f36;
  --m-line:rgba(255,255,255,.07); --m-line2:rgba(255,255,255,.12);
  --m-text:#e9f2f1; --m-muted:#8ca3a6; --m-soft:#5f7679;
  --m-pri:#46d3c1; --m-pri2:#2aa899; --m-ink:#04201d; --m-link:#46d3c1;
  --m-acc:#e0b66d; --m-acc2:#8a6a2f; --m-acc-ink:#1b1305;
  --m-green:#4fd69c; --m-amber:#f2c14e; --m-red:#f27b6b; --m-blue:#7aa8f7;
  --m-glow:0 0 0 1px rgba(70,211,193,.25),0 10px 40px -10px rgba(70,211,193,.35);
  --m-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 20px 40px -24px rgba(0,0,0,.6);
  --m-hero:radial-gradient(1200px 400px at 0% 0%,rgba(70,211,193,.14),transparent 60%),radial-gradient(800px 400px at 100% 0%,rgba(224,182,109,.10),transparent 60%);
  color-scheme:dark;
}
html[data-tema="claro"]{
  --m-bg:#f3f6f5; --m-bg2:#eaf0ef; --m-panel:#ffffff; --m-panel2:#f6f9f8; --m-panel3:#edf3f2;
  --m-line:rgba(10,40,45,.08); --m-line2:rgba(10,40,45,.15);
  --m-text:#0f2a30; --m-muted:#587074; --m-soft:#7d9396;
  --m-pri:#0e8577; --m-pri2:#0a6b60; --m-ink:#ffffff; --m-link:#0a6b60;
  --m-acc:#d2a656; --m-acc2:#9a7330; --m-acc-ink:#1b1305;
  --m-green:#13875a; --m-amber:#a87b07; --m-red:#c8442f; --m-blue:#3461c4;
  --m-glow:0 0 0 1px rgba(14,133,119,.2),0 10px 30px -12px rgba(14,133,119,.35);
  --m-shadow:0 1px 2px rgba(10,40,45,.05),0 12px 32px -20px rgba(10,40,45,.25);
  --m-hero:radial-gradient(1200px 400px at 0% 0%,rgba(14,133,119,.09),transparent 60%),radial-gradient(800px 400px at 100% 0%,rgba(182,136,53,.08),transparent 60%);
  color-scheme:light;
}
html[data-tema="rosado"]{
  --m-bg:#fbf4f6; --m-bg2:#f6e8ee; --m-panel:#ffffff; --m-panel2:#fdf8fa; --m-panel3:#f7eaf0;
  --m-line:rgba(90,20,50,.08); --m-line2:rgba(90,20,50,.15);
  --m-text:#3b1528; --m-muted:#7c5668; --m-soft:#a5838f;
  --m-pri:#c73a74; --m-pri2:#a72d60; --m-ink:#ffffff; --m-link:#a72d60;
  --m-acc:#dcae8e; --m-acc2:#a8735a; --m-acc-ink:#2a140b;
  --m-green:#1f8a5e; --m-amber:#a6720a; --m-red:#c43b3b; --m-blue:#5a5fc8;
  --m-glow:0 0 0 1px rgba(199,58,116,.2),0 10px 30px -12px rgba(199,58,116,.35);
  --m-shadow:0 1px 2px rgba(90,20,50,.05),0 12px 32px -20px rgba(90,20,50,.25);
  --m-hero:radial-gradient(1200px 400px at 0% 0%,rgba(199,58,116,.10),transparent 60%),radial-gradient(800px 400px at 100% 0%,rgba(220,174,142,.16),transparent 60%);
  color-scheme:light;
}
html[data-tema="azul"]{
  --m-bg:#0a1222; --m-bg2:#0c1629; --m-panel:#111d33; --m-panel2:#16243e; --m-panel3:#1c2d4b;
  --m-line:rgba(255,255,255,.07); --m-line2:rgba(255,255,255,.12);
  --m-text:#e8eef9; --m-muted:#93a3bf; --m-soft:#62728f;
  --m-pri:#5b9cff; --m-pri2:#3d7ee6; --m-ink:#04112a; --m-link:#7fb2ff;
  --m-acc:#d9b46a; --m-acc2:#8f6c2c; --m-acc-ink:#1b1305;
  --m-green:#4fd69c; --m-amber:#f2c14e; --m-red:#f27b6b; --m-blue:#9cc2ff;
  --m-glow:0 0 0 1px rgba(91,156,255,.28),0 10px 40px -10px rgba(91,156,255,.38);
  --m-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 20px 40px -24px rgba(0,0,0,.65);
  --m-hero:radial-gradient(1200px 400px at 0% 0%,rgba(91,156,255,.16),transparent 60%),radial-gradient(800px 400px at 100% 0%,rgba(217,180,106,.10),transparent 60%);
  color-scheme:dark;
}

/* ═══ forma común de los 4 temas modernos ═══ */
.moderno{
  --navy:var(--m-text); --navy-2:var(--m-pri); --gold:var(--m-pri); --gold-2:var(--m-pri2); --gold-text:var(--m-link);
  --bg:var(--m-bg); --surface:var(--m-panel); --surface-2:var(--m-panel2); --border:var(--m-line2);
  --text:var(--m-text); --mute:var(--m-muted); --danger:var(--m-red); --success:var(--m-green);
  --radius:14px; --focus:var(--m-pri);
  --oro:linear-gradient(135deg,var(--m-pri) 0%,var(--m-pri2) 100%);
  --sombra:var(--m-shadow); --sombra-alta:var(--m-glow);
  --sans:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",sans-serif;
  --sans-display:"Segoe UI Variable Display","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",sans-serif;
  scrollbar-color:var(--m-panel3) transparent;
}
.moderno body{background:var(--m-hero),var(--m-bg);background-repeat:no-repeat;background-attachment:fixed;color:var(--m-text);font-family:var(--sans);letter-spacing:0;-webkit-font-smoothing:antialiased;}
.moderno h1,.moderno h2,.moderno h3,.moderno .brand-name,.moderno .kpi,.moderno .etapa b{font-family:var(--sans-display);color:var(--m-text);letter-spacing:-.02em;font-weight:700;}
.moderno h1{font-size:30px;} .moderno h2{font-size:22px;} .moderno h3{font-size:16px;font-weight:650;letter-spacing:-.01em;}
.moderno a{color:var(--m-link);}
.moderno ::selection{background:color-mix(in srgb,var(--m-pri) 30%,transparent);color:var(--m-text);}
.moderno .muted,.moderno .ayuda,.moderno .empty{color:var(--m-muted);}
.moderno .saltar{background:var(--m-panel);color:var(--m-text);}

/* casco */
.moderno .sidebar{background:var(--m-bg2);border-right:1px solid var(--m-line);color:var(--m-text);}
.moderno .brand{border-bottom:1px solid var(--m-line);}
.moderno .brand-name{font-size:17px;color:var(--m-text);letter-spacing:-.02em;}
.moderno .logo-letra{background:linear-gradient(135deg,var(--m-acc),var(--m-acc2));color:var(--m-acc-ink);border-radius:10px;box-shadow:none;}
.moderno .brand img{border-radius:10px;box-shadow:0 0 0 1px var(--m-line2);}
.moderno .nav{padding:6px 12px;gap:2px;}
.moderno .nav-item{position:relative;border-radius:11px;padding:10px 12px;color:var(--m-muted);font-weight:500;letter-spacing:0;}
.moderno .nav-item:hover{background:var(--m-panel);color:var(--m-text);}
.moderno .nav-item[aria-current="page"]{background:var(--m-panel2);color:var(--m-text);box-shadow:inset 0 0 0 1px var(--m-line2);}
.moderno .nav-item[aria-current="page"]::before{content:"";position:absolute;left:-12px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--m-pri);}
.moderno .nav-item[aria-current="page"] .nav-ico{color:var(--m-pri);}
.moderno .nav-badge{background:var(--m-red);color:#fff;}
.moderno .sidebar-pie{border-top:1px solid var(--m-line);color:var(--m-muted);}
.moderno .sidebar-pie button:not(.tema-btn){background:transparent;border:1px solid var(--m-line2);color:var(--m-text);border-radius:10px;}
.moderno .sidebar-pie button:not(.tema-btn):hover{background:var(--m-panel);}
.moderno .sidebar-pie button.tema-btn{border-color:var(--m-line2);}
.moderno .sidebar-pie button.tema-btn[aria-pressed="true"]{border-color:var(--m-panel);box-shadow:0 0 0 2px var(--m-pri);}
.moderno .main{padding:28px 36px 44px;}
.moderno .pie-neferalis{color:var(--m-soft);letter-spacing:.12em;text-transform:uppercase;font-size:10.5px;}
.moderno .banda-demo{background:color-mix(in srgb,var(--m-pri) 12%,var(--m-bg2));border-bottom:1px solid var(--m-line);color:var(--m-text);}

/* botones */
.moderno .btn{background:var(--m-panel3);color:var(--m-text);border:1px solid var(--m-line2);border-radius:12px;box-shadow:none;letter-spacing:0;}
.moderno .btn:hover{background:var(--m-panel2);border-color:var(--m-pri);transform:translateY(-1px);}
.moderno .btn.gold{background:var(--m-pri);color:var(--m-ink);border-color:transparent;box-shadow:var(--m-glow);}
.moderno .btn.gold:hover{background:var(--m-pri2);filter:none;}
.moderno .btn.ghost{background:transparent;color:var(--m-text);border-color:var(--m-line2);backdrop-filter:none;}
.moderno .btn.ghost:hover{background:var(--m-panel2);border-color:var(--m-pri);}
.moderno .btn.danger{background:transparent;color:var(--m-red);border-color:color-mix(in srgb,var(--m-red) 55%,transparent);}
.moderno .btn.danger:hover{background:color-mix(in srgb,var(--m-red) 12%,transparent);}
.moderno .btn.ok{background:color-mix(in srgb,var(--m-green) 16%,transparent);color:var(--m-green);border-color:color-mix(in srgb,var(--m-green) 45%,transparent);}

/* tarjetas e indicadores */
.moderno .card{background:var(--m-panel);border:1px solid var(--m-line);border-radius:18px;box-shadow:var(--m-shadow);color:var(--m-text);}
.moderno .kpi-card{background:radial-gradient(360px 140px at 100% 0%,color-mix(in srgb,var(--m-pri) 9%,transparent),transparent 70%),var(--m-panel);}
.moderno .kpi-card::before{height:2px;background:linear-gradient(90deg,var(--m-pri),var(--m-acc));opacity:.9;}
.moderno button.kpi-card:hover{border-color:color-mix(in srgb,var(--m-pri) 45%,transparent);box-shadow:var(--m-glow);}
.moderno .kpi{font-size:34px;color:var(--m-text);}
.moderno .kpi.red{color:var(--m-red);}
.moderno .kpi.gold{background:linear-gradient(90deg,var(--m-pri),var(--m-acc));-webkit-background-clip:text;background-clip:text;color:transparent;}
.moderno .kpi-label{color:var(--m-muted);letter-spacing:.08em;font-size:11px;}
.moderno .note{background:color-mix(in srgb,var(--m-amber) 11%,var(--m-panel));border:1px solid color-mix(in srgb,var(--m-amber) 32%,transparent);color:var(--m-text);border-radius:14px;}
.moderno .note.blue{background:color-mix(in srgb,var(--m-blue) 11%,var(--m-panel));border-color:color-mix(in srgb,var(--m-blue) 32%,transparent);}
.moderno .note.green{background:color-mix(in srgb,var(--m-green) 11%,var(--m-panel));border-color:color-mix(in srgb,var(--m-green) 32%,transparent);}
.moderno .note.red{background:color-mix(in srgb,var(--m-red) 11%,var(--m-panel));border-color:color-mix(in srgb,var(--m-red) 36%,transparent);}
.moderno .pill{letter-spacing:0;}
.moderno .pill.gray{background:var(--m-panel3);color:var(--m-muted);}
.moderno .pill.green{background:color-mix(in srgb,var(--m-green) 16%,transparent);color:var(--m-green);}
.moderno .pill.gold{background:color-mix(in srgb,var(--m-amber) 18%,transparent);color:var(--m-amber);}
.moderno .pill.red{background:color-mix(in srgb,var(--m-red) 16%,transparent);color:var(--m-red);}
.moderno .pill.blue{background:color-mix(in srgb,var(--m-blue) 16%,transparent);color:var(--m-blue);}
.moderno .chip,.moderno .var-chip{background:var(--m-panel3);color:var(--m-text);}
.moderno .chip button{color:var(--m-muted);}
.moderno .chip button:hover{background:var(--m-line2);}
.moderno .tabs{border-bottom-color:var(--m-line);}
.moderno .tab{color:var(--m-muted);}
.moderno .tab[aria-selected="true"]{color:var(--m-text);border-bottom-color:var(--m-pri);}
.moderno .filtro{background:var(--m-panel);border-color:var(--m-line2);color:var(--m-muted);}
.moderno .filtro:hover{border-color:var(--m-pri);color:var(--m-text);}
.moderno .filtro[aria-pressed="true"]{background:var(--m-pri);border-color:var(--m-pri);color:var(--m-ink);}

/* formularios */
.moderno input,.moderno select,.moderno textarea{background:var(--m-panel2);border:1px solid var(--m-line2);color:var(--m-text);border-radius:12px;}
.moderno input::placeholder,.moderno textarea::placeholder{color:var(--m-soft);}
.moderno input:focus,.moderno select:focus,.moderno textarea:focus{border-color:var(--m-pri);box-shadow:0 0 0 4px color-mix(in srgb,var(--m-pri) 18%,transparent);}
.moderno label{color:var(--m-muted);}

/* tablas */
.moderno th{background:transparent;color:var(--m-soft);border-bottom-color:var(--m-line);}
.moderno td{border-bottom-color:var(--m-line);}
.moderno tbody tr:hover td{background:color-mix(in srgb,var(--m-pri) 6%,transparent);}
.moderno table.resp tr{border-bottom-color:var(--m-line);}

/* modal y avisos */
.moderno .modal-bg{background:rgba(4,8,12,.6);backdrop-filter:blur(8px);}
.moderno .modal{background:var(--m-panel);color:var(--m-text);border:1px solid var(--m-line2);border-radius:20px;box-shadow:0 30px 80px -20px rgba(0,0,0,.55);}
.moderno .close-x{color:var(--m-muted);}
.moderno .close-x:hover{background:var(--m-panel3);}
.moderno .toast{background:var(--m-panel3);color:var(--m-text);border:1px solid var(--m-line2);border-radius:14px;}
.moderno .toast.error{background:var(--m-red);color:#fff;border-color:transparent;}

/* calendario */
.moderno .cal-cell{background:var(--m-panel);border-color:var(--m-line);border-radius:12px;}
.moderno .cal-cell.out{background:var(--m-bg2);}
.moderno .cal-cell.feriado{background:color-mix(in srgb,var(--m-acc) 12%,var(--m-panel));}
.moderno .cal-cell.hoy{border-color:var(--m-pri);box-shadow:inset 0 0 0 1px var(--m-pri),var(--m-glow);}
.moderno .cal-evt{background:color-mix(in srgb,var(--m-pri) 22%,var(--m-panel));color:var(--m-text);border-left:3px solid var(--m-pri);border-radius:6px;}
.moderno .cal-evt.auto{background:color-mix(in srgb,var(--m-green) 20%,var(--m-panel));border-left-color:var(--m-green);}
.moderno .cal-evt.urgent{background:color-mix(in srgb,var(--m-red) 22%,var(--m-panel));border-left-color:var(--m-red);}

/* prospectos, documentos, correos */
.moderno .etapa{background:var(--m-panel);border-color:var(--m-line);border-radius:16px;box-shadow:var(--m-shadow);}
.moderno .etapa span{color:var(--m-muted);}
.moderno .etapa[aria-pressed="true"]{border-color:var(--m-pri);box-shadow:inset 0 0 0 1px var(--m-pri),var(--m-glow);}
.moderno .toque{background:color-mix(in srgb,var(--m-acc) 9%,var(--m-panel));border-color:color-mix(in srgb,var(--m-acc) 32%,transparent);border-radius:14px;}
.moderno .toque.hecho{background:color-mix(in srgb,var(--m-green) 9%,var(--m-panel));border-color:color-mix(in srgb,var(--m-green) 30%,transparent);}
.moderno .toque pre{background:var(--m-panel2);border-color:var(--m-line2);color:var(--m-text);}
.moderno .checklist li{border-bottom-color:var(--m-line);}
.moderno .file-chip,.moderno .correo-original{background:var(--m-panel2);border-color:var(--m-line);color:var(--m-text);}
.moderno .correo-original mark{background:color-mix(in srgb,var(--m-amber) 35%,transparent);color:var(--m-text);}
.moderno .json{background:var(--m-bg);border:1px solid var(--m-line);}
.moderno .historial{border-left-color:var(--m-line2);}
.moderno .historial li::before{background:var(--m-pri);}

/* acceso */
.moderno .acceso{background:var(--m-hero),var(--m-bg);}
.moderno .acceso::before{background-image:linear-gradient(color-mix(in srgb,var(--m-pri) 6%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--m-pri) 6%,transparent) 1px,transparent 1px);}
.moderno .acceso .card{background:var(--m-panel);border:1px solid var(--m-line2);border-radius:22px;box-shadow:var(--m-glow),0 40px 90px -30px rgba(0,0,0,.5);}

@media (max-width:900px){
  .moderno .barra-movil{background:var(--m-bg2);border-bottom:1px solid var(--m-line);color:var(--m-text);}
  .moderno .barra-movil .brand{border:0;}
  .moderno .barra-movil button{border-color:var(--m-line2);color:var(--m-text);}
  .moderno .main{padding:18px 16px 30px;}
}
@media (max-width:640px){ .moderno h1{font-size:24px;} .moderno .kpi{font-size:27px;} }
@media (prefers-reduced-motion:reduce){ .tema-btn,.moderno .btn{transition:none;transform:none!important;} }

/* Inicio dinámico en los temas modernos (6-oct) */
.moderno .heroe{background:var(--m-hero),var(--m-panel);color:var(--m-text);border:1px solid var(--m-line2);box-shadow:var(--m-shadow);}
.moderno .heroe h1{color:var(--m-text);font-size:32px;}
.moderno .heroe-acento{color:var(--m-pri);}
.moderno .heroe-sup,.moderno .heroe-p,.moderno .heroe-graf-t{color:var(--m-muted);opacity:1;}
.moderno .heroe .btn.ghost{color:var(--m-text);border-color:var(--m-line2);}
.moderno .heroe-graf{background:var(--m-panel2);border-color:var(--m-line);}
.moderno .barra{background:linear-gradient(180deg,var(--m-pri),var(--m-pri2));}
.moderno .barra-dia.hoy .barra{box-shadow:0 0 0 2px color-mix(in srgb,var(--m-pri) 40%,transparent);}
.moderno .spark-linea{stroke:var(--m-pri);}
.moderno .spark-area{fill:var(--m-pri);}
@media (max-width:900px){ .moderno .heroe h1{font-size:25px;} }