/* ===================== Tema «iOS» (HFC, 2026-10-08) =====================
   Tercer tema, además de noche y día: estilo Apple/iOS en tonos rojos. Se activa con body.day.ios (hereda los ajustes de
   body.day y encima aplica estos). Rasgos de iOS: fondo gris agrupado #f2f2f7, tarjetas blancas sin borde con esquinas
   grandes y sombra suave, barra superior translúcida con desenfoque, tipografía del sistema (San Francisco en equipos Apple),
   controles segmentados, menú lateral con íconos de color al estilo de Ajustes y acento rojo frambuesa (systemPink de iOS),
   distinto del rojo de «fuera de meta». */
body.day.ios{
  --bg:#f2f2f7;      --surface:#ffffff;  --surface2:#f2f2f7;  --surface3:#e5e5ea;
  --border:#e5e5ea;  --text:#1c1c1e;     --muted:#6e6e73;     --dim:#aeaeb2;
  --accent:#ff2d55;  --accent-ink:#d3003f; --accent2:#ff6482; --accent2-ink:#c41a46;
  --good:#248a3d;    --good-bg:#e4f7e9;
  --warn:#c93400;    --warn-bg:#fff0e0;
  --bad:#d70015;     --bad-bg:#ffe6e4;
  --sep:rgba(60,60,67,.14);  --fill:rgba(118,118,128,.12);  --fill2:rgba(118,118,128,.2);
  --shadow:0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.06);
  --sans:-apple-system,BlinkMacSystemFont,'SF Pro Text','SF Pro Display','Helvetica Neue','Inter',system-ui,sans-serif;
  --mono:var(--sans);
  --r-sm:10px; --r-md:12px; --r-lg:18px;
  background:var(--bg);color:var(--text);font-family:var(--sans);
  font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;
}

/* --- barra superior translúcida --- */
body.ios .app-header{
  background:rgba(255,255,255,.72);border-bottom:.5px solid var(--sep);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
}
body.ios .app-header .ah-brand{font-weight:700;letter-spacing:-.02em;font-size:15px}
body.ios .app-header .ah-brand .mark{background:linear-gradient(135deg,#ff2d55,#ff6482);color:#fff;border-radius:9px}
body.ios .badge-perfil{font-family:var(--sans);font-weight:600;letter-spacing:.01em;background:var(--accent);color:#fff}
body.ios :is(.btn-hdr,.tglTheme,.btn-menu,.btn-export){
  background:var(--fill);border:0;color:var(--text);box-shadow:none;font-family:var(--sans);
}
body.ios :is(.btn-hdr,.tglTheme,.btn-menu,.btn-export):hover{background:var(--fill2);color:var(--accent-ink);border:0}
body.ios .btn-hdr.logout:hover{color:var(--bad)}
body.ios #btn-theme{font-size:11px;font-weight:700;letter-spacing:-.01em}

/* --- menú lateral estilo Ajustes: ícono blanco sobre cuadro de color; el ítem activo se rellena con el acento --- */
body.ios .sidebar{background:rgba(255,255,255,.6);border-right:.5px solid var(--sep);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
body.ios .sb-sect{font-family:var(--sans);text-transform:none;letter-spacing:0;font-size:13px;font-weight:600;color:var(--muted)}
body.ios .sb-nav button{border-left:0;margin-left:0;font-size:14px;color:var(--text);border-radius:10px;padding:8px 10px}
body.ios .sb-nav button:hover{background:var(--fill);transform:none;color:var(--text)}
body.ios .sb-nav button .ic{color:#fff;border-radius:7px;background:#8e8e93}
body.ios .sb-nav button[data-tab="diario"] .ic{background:#ff3b30}
body.ios .sb-nav button[data-tab="intervalos"] .ic{background:#ff9500}
body.ios .sb-nav button[data-tab="supervisores"] .ic{background:#34c759}
body.ios .sb-nav button[data-tab="asesores"] .ic{background:#007aff}
body.ios .sb-nav button[data-tab="horas"] .ic{background:#af52de}
body.ios .sb-nav button.on{background:var(--accent);color:#fff;font-weight:600}
body.ios .sb-nav button.on .ic{box-shadow:0 0 0 1.5px rgba(255,255,255,.85)}
body.ios .sb-nav button.on::after{display:none}

/* --- títulos grandes al estilo iOS --- */
body.ios .tab-title{
  font-family:var(--sans);font-size:30px;font-weight:700;letter-spacing:-.025em;text-transform:none;
  background:none;border:0;padding:0;margin:4px 0 16px;gap:10px;
}
body.ios .tab-title::before,body.ios .tab-title svg{display:none}
body.ios .tab-title .tp{color:var(--accent);font-weight:700}

/* --- filtros y controles --- */
body.ios .filtros label,body.ios .chk-dia1{font-family:var(--sans);font-size:13px;font-weight:600;color:var(--muted)}
body.ios :is(select.ctl,input.ctl){
  background:#fff;border:0;border-radius:10px;font-family:var(--sans);font-size:14px;padding:8px 12px;
  box-shadow:0 0 0 .5px rgba(60,60,67,.22),0 1px 2px rgba(0,0,0,.04);
}
body.ios select.ctl.filtro-activo{box-shadow:0 0 0 2px var(--accent)}
body.ios :is(select.ctl,input.ctl):focus{outline:none;box-shadow:0 0 0 3px rgba(255,45,85,.3)}
body.ios .dias-btn{font-family:var(--sans);font-size:13px;font-weight:500;border:0;border-radius:9px;background:var(--fill);color:var(--text);padding:6px 13px}
body.ios .dias-btn:hover{background:var(--fill2);color:var(--text)}
body.ios .dias-btn.on{background:var(--accent);color:#fff;font-weight:600}
/* control segmentado */
body.ios .vista-tgl{background:var(--fill);border:0;border-radius:9px;padding:2px}
body.ios .vista-tgl button{border-radius:7px;color:var(--text);font-weight:500;font-size:13px}
body.ios .vista-tgl button.on{background:#fff;color:var(--text);font-weight:600;box-shadow:0 3px 8px rgba(0,0,0,.12),0 3px 1px rgba(0,0,0,.04)}

/* --- tarjetas, paneles y gráficos: blancos, sin borde, esquinas grandes --- */
body.ios :is(.panel,.chart-card){border:0;border-radius:18px;box-shadow:var(--shadow)}
body.ios .panel-head{border-bottom:.5px solid var(--sep)}
body.ios .panel-head h3{letter-spacing:-.015em}
body.ios .kpi-v2 .kpi-card{border:0;border-radius:18px;box-shadow:var(--shadow);padding:14px 16px 12px}
body.ios .kpi-v2 .kpi-card::before{display:none}
body.ios .kpi-v2 .kpi-card .ico{border-radius:8px;background:var(--kc);color:#fff}
body.ios .kpi-v2 .kpi-card:hover{box-shadow:0 0 0 2px color-mix(in srgb,var(--kc) 45%,transparent),0 14px 30px rgba(0,0,0,.1)}
body.ios .kpi-card .kv{letter-spacing:-.03em}

/* --- tablas: separadores finos, encabezado gris --- */
body.ios table.datos thead th{background:#fafafc;color:var(--muted);font-weight:600;letter-spacing:.02em;border-bottom:.5px solid var(--sep)}
body.ios table.datos tbody td{border-bottom:.5px solid var(--sep);font-family:var(--sans)}
body.ios table.datos tbody tr:hover td{background:#f7f7fa}
body.ios table.datos tr.fila-total td{background:#fafafc;border-top:1px solid rgba(60,60,67,.25)}
body.ios :is(.cond-badge,.sv){font-family:var(--sans);border-width:0}

/* --- barras de desplazamiento finas --- */
body.ios ::-webkit-scrollbar{width:10px;height:10px}
body.ios ::-webkit-scrollbar-thumb{background:rgba(60,60,67,.25);border-radius:10px;border:3px solid transparent;background-clip:padding-box}

/* ajustes tras la primera revisión: tarjetas neutras con ícono gris (no rosado, que se confundía con «fuera de meta»),
   títulos de gráficos sin mayúsculas y el botón de fechas con el mismo aspecto que los selectores */
body.ios .kpi-v2 .kpi-card{--kc:#8e8e93}
body.ios .kpi-v2 .kpi-card:has(.kv.v), body.ios .kpi-v2 .kpi-card:has(.kv.verde){--kc:#34c759}
body.ios .kpi-v2 .kpi-card:has(.kv.a){--kc:#ff9500}
body.ios .kpi-v2 .kpi-card:has(.kv.r), body.ios .kpi-v2 .kpi-card:has(.kv.rojo){--kc:#ff3b30}
body.ios .kpi-v2 .kpi-card:has(.kv.cat){--kc:var(--accent)}
body.ios .chart-lbl{font-family:var(--sans);text-transform:none;letter-spacing:-.01em;font-size:14px;font-weight:600;color:var(--text)}
body.ios .fecha-multi-btn{background:#fff;border:0;border-radius:10px;font-family:var(--sans);font-size:14px;padding:8px 12px;
  box-shadow:0 0 0 .5px rgba(60,60,67,.22),0 1px 2px rgba(0,0,0,.04);color:var(--text)}