:root {
  /* Color de marca del centro (lo define cada centro en Configuración → Mi centro; antes de
     iniciar sesión se usa el del producto). Botones primarios, ítem activo, foco, enlaces.
     Los demás tonos se calculan a partir de --acento para que cualquier color funcione. */
  --acento:#2563EB;--sobre-acento:#ffffff;
  --acento-h:color-mix(in srgb,var(--acento) 88%,#ffffff);
  --acento-claro:color-mix(in srgb,var(--acento) 18%,#111B2E);
  --acento-oscuro:color-mix(in srgb,var(--acento) 55%,#ffffff);
  --acento-foco:color-mix(in srgb,var(--acento) 30%,transparent);
  /* Colores de ESTADO (cobrado, vencido, pendiente...): separados del acento de marca. */
  --verde:#22C55E;--verde-h:#16A34A;--verde-claro:#0F2A1E;--verde-oscuro:#4ADE80;
  --sidebar-bg:#0F172A;--sidebar-hover:#1E293B;--sidebar-text:#94A3B8;--sidebar-section:#F1F5F9;
  --gris-bg:#0B1220;--gris-border:#1E2A41;--gris-border-strong:#2F3E5C;--gris-text:#94A3B8;--gris-text-dim:#64748B;--texto:#E2E8F0;--blanco:#111B2E;
  --rojo:#F87171;--rojo-claro:#2D1518;--rojo-oscuro:#FCA5A5;
  --amarillo:#FBBF24;--amarillo-claro:#2B2108;--amarillo-oscuro:#FCD34D;
  --azul:#60A5FA;--azul-claro:#12223F;--azul-oscuro:#93C5FD;
  --violeta:#A78BFA;--violeta-claro:#1D1838;--violeta-oscuro:#C4B5FD;
  --app-bg:#0B1220;
  --sidebar-w:256px;--header-h:64px;
  /* Bordes: 10px en tarjetas, 8px en botones y campos, 4px en etiquetas. Nada de píldoras. */
  --radius:10px;--radius-sm:8px;--radius-xs:4px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.25);--shadow:0 16px 40px -12px rgba(0,0,0,.6);--shadow-md:0 16px 40px -12px rgba(0,0,0,.6);
  /* Escala tipográfica y de espaciado - un solo set de pasos, en vez de valores sueltos. */
  --text-2xs:12px;--text-xs:13px;--text-sm:14px;--text-base:15px;--text-md:16px;
  --text-lg:18px;--text-xl:22px;--text-2xl:28px;--text-3xl:36px;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:40px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{color-scheme:dark}

/* ── TEMA DÍA ────────────────────────────────────────────── */
/* Mismas variables, valores claros. El tema se elige en el menú del usuario (Día / Noche /
   Auto = sigue al teléfono o PC) y se aplica en <html data-theme> antes de pintar. */
:root[data-theme="light"]{
  color-scheme:light;
  --app-bg:#F1F5F9;
  --acento-h:color-mix(in srgb,var(--acento) 86%,#000000);
  --acento-claro:color-mix(in srgb,var(--acento) 10%,#ffffff);
  --acento-oscuro:color-mix(in srgb,var(--acento) 78%,#000000);
  --acento-foco:color-mix(in srgb,var(--acento) 24%,transparent);
  --verde:#16A34A;--verde-h:#15803D;--verde-claro:#DCFCE7;--verde-oscuro:#15803D;
  --gris-bg:#F1F5F9;--gris-border:#E2E8F0;--gris-border-strong:#CBD5E1;--gris-text:#64748B;--gris-text-dim:#94A3B8;--texto:#0F172A;--blanco:#FFFFFF;
  --rojo:#DC2626;--rojo-claro:#FEE2E2;--rojo-oscuro:#B91C1C;
  --amarillo:#D97706;--amarillo-claro:#FEF3C7;--amarillo-oscuro:#B45309;
  --azul:#2563EB;--azul-claro:#DBEAFE;--azul-oscuro:#1D4ED8;
  --violeta:#7C3AED;--violeta-claro:#EDE9FE;--violeta-oscuro:#6D28D9;
  --shadow-sm:0 1px 2px rgba(15,23,42,.06);--shadow:0 16px 40px -12px rgba(15,23,42,.22);--shadow-md:0 16px 40px -12px rgba(15,23,42,.22);
}

body{font-family:'Inter',-apple-system,sans-serif;background:var(--app-bg);color:var(--texto);font-size:var(--text-base);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}

/* Etiquetas de apoyo (nombres de campo, títulos de tarjeta, encabezados): Inter chica y gris, en
   minúscula natural. Lo que importa (datos, títulos) es lo que más pesa; lo de apoyo, lo que menos. */
.nav-section,.login-label,.field-label,.stat-label,.panel-card-title,.cobro-title,
.hora-label,.brand-sub,.mini-cal-dias-semana span,.cobros-kpi-card .stat-label{
  font-family:inherit;font-weight:500;font-size:var(--text-xs);letter-spacing:0;
}

/* LOGIN */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--app-bg)}
.login-card{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);width:380px;max-width:95vw;padding:36px}
.login-logo{display:block;height:64px;width:auto;margin:0 auto 18px}
.login-sub{font-size:var(--text-sm);line-height:1.5;color:var(--gris-text);text-align:center;margin-bottom:var(--space-7)}
.login-field{margin-bottom:var(--space-4)}
.login-label{font-weight:500;color:var(--gris-text);display:block;margin-bottom:var(--space-2)}
.login-input{width:100%;padding:11px 12px;border:1px solid var(--gris-border);border-radius:var(--radius-sm);font-size:var(--text-base);font-family:inherit;outline:none;transition:border-color .15s;background:var(--blanco);color:var(--texto)}
.login-input:focus{border-color:var(--acento);box-shadow:0 0 0 3px var(--acento-foco)}
.login-btn{width:100%;padding:12px;background:var(--acento);color:var(--sobre-acento);border:none;border-radius:var(--radius-sm);font-size:var(--text-base);font-weight:600;cursor:pointer;font-family:inherit;transition:background .15s;margin-top:var(--space-1)}
.login-btn:hover{background:var(--acento-h)}
.login-btn:disabled{background:var(--gris-text);cursor:not-allowed}
.login-error{background:var(--rojo-claro);border:1px solid var(--rojo);border-radius:var(--radius-sm);padding:10px 12px;font-size:var(--text-sm);line-height:1.5;color:var(--rojo);margin-bottom:var(--space-4);display:none}

/* APP */
.app{display:flex;flex-direction:column;height:100vh;overflow:hidden;display:none}
.topbar{height:var(--header-h);background:var(--blanco);border-bottom:1px solid var(--gris-border);display:flex;align-items:center;flex-shrink:0;z-index:100}
.topbar-brand{width:var(--sidebar-w);height:100%;background:var(--sidebar-bg);display:flex;align-items:center;padding:0 14px 0 16px;gap:9px;flex-shrink:0}
.brand-logo{width:34px;height:34px;object-fit:contain;flex-shrink:0}
.brand-name{font-size:var(--text-md);font-weight:800;color:var(--texto);letter-spacing:-.4px}
.brand-sub{color:var(--sidebar-text)}
.topbar-content{flex:1;display:flex;align-items:center;padding:0 20px}
.topbar-date{font-size:var(--text-base);color:var(--gris-text)}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.user-pill{display:flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;border-radius:3px;background:var(--gris-bg);border:1px solid var(--gris-border);cursor:pointer}
.user-av{width:26px;height:26px;border-radius:50%;background:var(--acento);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--sobre-acento)}
.user-name{font-size:var(--text-sm);font-weight:600}
.user-role{font-size:var(--text-2xs);color:var(--gris-text)}
.btn-logout{font-size:var(--text-xs);font-weight:600;padding:7px 14px;border:1.5px solid var(--gris-border);border-radius:var(--radius-sm);background:var(--blanco);cursor:pointer;color:var(--gris-text);font-family:inherit;transition:all .15s}
.btn-logout:hover{background:var(--rojo-claro);color:var(--rojo);border-color:var(--rojo)}

.main-layout{display:flex;flex:1;overflow:hidden}
.sidebar{width:var(--sidebar-w);background:var(--sidebar-bg);border-right:1px solid var(--gris-border);display:flex;flex-direction:column;flex-shrink:0;overflow-y:auto;padding:10px 8px}
.nav-section{padding:var(--space-4) var(--space-2) var(--space-1);font-weight:600;color:var(--sidebar-section)}
.nav-item{display:flex;align-items:center;gap:10px;padding:7px 10px;cursor:pointer;border-radius:var(--radius-sm);margin:1px 0;font-size:var(--text-base);font-weight:500;color:var(--sidebar-text);transition:background .12s,color .12s}
.nav-item:hover{background:var(--sidebar-hover);color:var(--texto)}
.nav-item.active{background:var(--acento-claro);color:var(--acento-oscuro);font-weight:600}
.nav-item i{width:18px;text-align:center;font-size:15px;flex-shrink:0;color:var(--gris-text-dim)}
.nav-item:hover i{color:var(--texto)}
.nav-item.active i{color:var(--acento-oscuro)}
.nav-badge{margin-left:auto;background:var(--acento);color:var(--sobre-acento);font-size:11px;font-weight:600;padding:1px 7px;border-radius:3px}

.content{flex:1;overflow-y:auto;padding:var(--space-6);background:var(--gris-bg)}
.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--space-6)}
.page-title{font-size:var(--text-2xl);font-weight:600;color:var(--texto);letter-spacing:-.02em;line-height:1.25}
.page-sub{font-size:var(--text-sm);color:var(--gris-text);margin-top:3px}

.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);margin-bottom:var(--space-6)}
.stat-card{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-4) var(--space-5);display:flex;align-items:center;gap:var(--space-4);box-shadow:var(--shadow-sm)}
.stat-icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.stat-label{color:var(--gris-text);font-weight:500;margin-top:2px}
.stat-val{font-size:var(--text-2xl);font-weight:700;line-height:1.1;letter-spacing:-.02em}
.stat-sub{font-size:var(--text-xs);color:var(--gris-text);margin-top:3px}

.btn{padding:7px 13px;border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:500;cursor:pointer;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:background .12s,border-color .12s,color .12s;font-family:inherit;line-height:1.25}
.btn-primary{background:var(--acento);color:var(--sobre-acento)}
.btn-primary:hover{background:var(--acento-h)}
.btn-outline{background:var(--blanco);color:var(--texto);border-color:var(--gris-border-strong)}
.btn-outline:hover{background:var(--gris-bg);border-color:var(--gris-text-dim)}
.btn-sm{padding:4px 9px;font-size:var(--text-xs)}

.cat-filter{display:flex;gap:var(--space-2);margin-bottom:var(--space-4);flex-wrap:wrap;align-items:center}
.prof-chip{padding:6px 13px;border-radius:3px;font-size:var(--text-sm);font-weight:500;cursor:pointer;border:1px solid var(--gris-border-strong);background:var(--blanco);color:var(--gris-text);transition:background .12s,border-color .12s,color .12s}
.prof-chip:hover{border-color:var(--acento);color:var(--acento-oscuro)}
.prof-chip.active{background:var(--acento);color:var(--sobre-acento);border-color:var(--acento)}

/* Switch tipo iOS (on/off) */
.switch-row{display:flex;align-items:center;gap:var(--space-2);margin-left:auto;font-size:var(--text-sm);color:var(--gris-text);font-weight:600}
.switch{position:relative;display:inline-block;width:40px;height:23px;flex-shrink:0}
.switch input{opacity:0;width:0;height:0}
.switch-slider{position:absolute;cursor:pointer;inset:0;background:var(--gris-border-strong);border-radius:23px;transition:background .18s}
.switch-slider::before{content:"";position:absolute;width:17px;height:17px;left:3px;bottom:3px;background:var(--blanco);border-radius:50%;transition:transform .18s;box-shadow:0 1px 2px rgba(0,0,0,.3)}
.switch input:checked+.switch-slider{background:var(--verde)}
.switch input:checked+.switch-slider::before{transform:translateX(17px)}

/* Selector de vista (Lista / Semana) debajo del mini-calendario */
.vista-agenda-toggle{display:flex;gap:4px;margin-top:10px;background:var(--gris-bg);border-radius:var(--radius-xs);padding:3px}
.vista-agenda-btn{flex:1;text-align:center;padding:6px 4px;border-radius:var(--radius-xs);font-size:var(--text-xs);font-weight:500;cursor:pointer;color:var(--gris-text);transition:all .15s;border:none;background:transparent;font-family:inherit}
.vista-agenda-btn.active{background:var(--acento);color:var(--sobre-acento)}

.fecha-nav{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-4)}
.fecha-nav-btn{width:32px;height:32px;border-radius:var(--radius-sm);border:1px solid var(--gris-border-strong);background:var(--blanco);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--gris-text);transition:all .15s;font-family:inherit}
.fecha-nav-btn:hover{background:var(--gris-bg)}
.fecha-nav-label{font-size:var(--text-base);font-weight:600;min-width:170px;text-align:center}

.turno-list{display:flex;flex-direction:column;gap:var(--space-2)}
.hora-label{font-weight:600;color:var(--gris-text);padding:var(--space-4) 0 var(--space-2);display:flex;align-items:center;gap:var(--space-2)}
.hora-label::after{content:'';flex:1;height:1px;background:var(--gris-border)}
.turno-card{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:14px 16px;display:grid;grid-template-columns:64px 1fr auto;gap:var(--space-4);align-items:center;cursor:pointer;transition:all .15s;box-shadow:var(--shadow-sm)}
.turno-card:hover{border-color:var(--acento)}
.turno-card.presente{border-left:3px solid var(--violeta)}
.turno-card.confirmado{border-left:3px solid var(--verde)}
.turno-card.pendiente{border-left:3px solid var(--amarillo)}
.turno-card.ausente{border-left:3px solid var(--rojo)}
.turno-card.realizado{border-left:3px solid var(--gris-text);opacity:.65}
.turno-hora{font-size:var(--text-lg);font-weight:600;text-align:center;letter-spacing:-.01em}
.turno-dur{font-size:var(--text-2xs);color:var(--gris-text);text-align:center;margin-top:2px;font-weight:500}
.turno-nombre{font-size:var(--text-md);font-weight:600;letter-spacing:-.005em}
.turno-det{font-size:var(--text-xs);line-height:1.6;color:var(--gris-text);margin-top:var(--space-1);display:flex;gap:var(--space-2);flex-wrap:wrap;align-items:center}
.turno-os{font-size:12px;font-weight:600;padding:2px 8px;border-radius:3px;background:var(--azul-claro);color:var(--azul)}
/* Acciones en grilla de 2 columnas iguales (el ancho lo marca el botón más largo): 4 botones
   quedan 2 arriba y 2 abajo. El badge de estado va arriba, alineado a la derecha; un botón
   solo (o el último si son 3) ocupa todo el ancho para que no quede un hueco. */
.turno-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-2);align-items:stretch}
.turno-actions .estado-badge{grid-column:1/-1;justify-self:end}
.turno-actions .btn-checkin{width:100%;text-align:center;white-space:nowrap}
.turno-actions .btn-checkin:last-child:nth-of-type(odd){grid-column:1/-1}
.estado-badge{font-size:var(--text-2xs);font-weight:600;padding:4px 10px;border-radius:3px}
.eb-confirmado{background:var(--verde-claro);color:var(--verde-oscuro)}
.eb-pendiente{background:var(--amarillo-claro);color:var(--amarillo-oscuro)}
.eb-presente{background:var(--violeta-claro);color:var(--violeta-oscuro)}
.eb-realizado{background:var(--gris-bg);color:var(--gris-text)}
.eb-ausente{background:var(--rojo-claro);color:var(--rojo-oscuro)}
.btn-checkin{font-size:var(--text-xs);font-weight:600;padding:6px 12px;border-radius:var(--radius-sm);cursor:pointer;border:1px solid var(--verde);background:var(--verde-claro);color:var(--verde-oscuro);transition:all .15s;font-family:inherit}
.btn-checkin:hover{background:#15803D;color:white}
.btn-checkin.done{background:var(--violeta-claro);color:var(--violeta-oscuro);border-color:var(--violeta);cursor:default}
.prof-tag{font-size:12px;font-weight:600;padding:2px 8px;border-radius:3px}

.alert{display:flex;gap:var(--space-3);padding:12px 16px;border-radius:var(--radius-sm);margin-bottom:var(--space-4);font-size:var(--text-sm);line-height:1.5;align-items:center;font-weight:500}
.alert-warn{background:var(--amarillo-claro);border:1px solid color-mix(in srgb,var(--amarillo) 35%,transparent);color:var(--amarillo-oscuro)}
.alert-info{background:var(--azul-claro);border:1px solid color-mix(in srgb,var(--azul) 35%,transparent);color:var(--azul-oscuro)}

.modal-overlay{position:fixed;inset:0;background:rgba(16,24,40,.5);z-index:200;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .2s}
.modal-overlay.open{opacity:1;pointer-events:all}
.modal{background:var(--blanco);border:1px solid var(--gris-border);border-radius:3px;box-shadow:var(--shadow);width:540px;max-width:95vw;max-height:90vh;overflow-y:auto;transform:translateY(8px);transition:transform .18s}
.modal-overlay.open .modal{transform:translateY(0)}
.modal-lg{width:680px}
.modal-header{padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--gris-border);display:flex;align-items:center;justify-content:space-between}
.modal-title{font-size:var(--text-lg);font-weight:600;letter-spacing:-.01em}
.modal-close{width:28px;height:28px;border-radius:var(--radius-sm);border:none;background:transparent;cursor:pointer;font-size:15px;display:flex;align-items:center;justify-content:center;color:var(--gris-text);transition:background .12s,color .12s}
.modal-close:hover{background:var(--gris-bg);color:var(--texto)}
.modal-body{padding:var(--space-6)}
.modal-footer{padding:var(--space-4) var(--space-6);border-top:1px solid var(--gris-border);display:flex;gap:var(--space-2);justify-content:flex-end;background:var(--gris-bg);border-radius:0 0 12px 12px}

.field-group{margin-bottom:var(--space-4)}
.field-label{font-weight:500;color:var(--gris-text);margin-bottom:6px;display:block}
.field-input,.field-select{width:100%;padding:8px 11px;border:1px solid var(--gris-border-strong);border-radius:var(--radius-sm);font-size:var(--text-base);font-family:inherit;background:var(--blanco);outline:none;transition:border-color .12s,box-shadow .12s;color:var(--texto)}
.field-input:focus,.field-select:focus{border-color:var(--acento);box-shadow:0 0 0 3px var(--acento-foco)}
textarea.field-input{resize:vertical}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}

.search-bar{display:flex;gap:var(--space-2);margin-bottom:var(--space-4)}
.search-wrap{flex:1;position:relative}
.search-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--gris-text);font-size:15px}
.search-input{width:100%;padding:8px 12px 8px 34px;border:1px solid var(--gris-border-strong);border-radius:var(--radius-sm);font-size:var(--text-base);font-family:inherit;outline:none;background:var(--blanco);transition:border-color .15s}
.search-input:focus{border-color:var(--acento)}
.table-wrap{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.paciente-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
.paciente-table th{padding:9px 14px;text-align:left;font-size:var(--text-xs);font-weight:500;color:var(--gris-text);background:var(--gris-bg);border-bottom:1px solid var(--gris-border)}
.paciente-table td{padding:11px 14px;border-bottom:1px solid var(--gris-border);vertical-align:middle}
.paciente-table tr:last-child td{border-bottom:none}
.paciente-table tbody tr:hover td{background:var(--gris-bg);cursor:pointer}
.os-chip{font-size:12px;font-weight:600;padding:2px 8px;border-radius:3px;background:var(--azul-claro);color:var(--azul);white-space:nowrap}
.particular-chip{background:var(--gris-bg);color:var(--gris-text)}
.coseguro-val{font-size:var(--text-sm);font-weight:600;color:var(--verde-oscuro)}
.pag-bar{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-3);font-size:var(--text-sm);color:var(--gris-text)}
.pag-btns{display:flex;gap:4px}

.tabs{display:flex;border-bottom:1px solid var(--gris-border);margin-bottom:var(--space-5)}
.tab{padding:8px 14px;font-size:var(--text-sm);font-weight:500;cursor:pointer;color:var(--gris-text);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .12s}
.tab:hover{color:var(--texto)}
.tab.active{color:var(--texto);border-bottom-color:var(--acento);font-weight:600}

.cobro-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin-bottom:var(--space-6)}
.cobro-card{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-5);box-shadow:var(--shadow-sm)}
.cobro-title{font-weight:600;color:var(--texto);font-size:var(--text-sm);margin-bottom:var(--space-3)}
.cobro-item{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--gris-border);font-size:var(--text-sm)}
.cobro-item:last-child{border-bottom:none}
.cobro-monto{font-weight:600;color:var(--verde-oscuro)}
.total-cobro{display:flex;justify-content:space-between;padding:12px 14px;background:var(--verde-claro);border-radius:var(--radius-sm);margin-top:var(--space-3);font-weight:700;font-size:var(--text-base);color:var(--verde-oscuro)}

.panel-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.panel-card{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-5);box-shadow:var(--shadow-sm)}
.panel-card-title{font-weight:600;color:var(--texto);font-size:var(--text-sm);margin-bottom:var(--space-4)}
.prog-item{display:flex;align-items:center;gap:10px;padding:5px 0}
.prog-name{font-size:var(--text-sm);flex:1;font-weight:500}
.prog-bar-wrap{width:90px;height:7px;background:var(--gris-border);border-radius:4px;overflow:hidden}
.prog-bar{height:100%;background:var(--verde);border-radius:4px}
.prog-val{font-size:var(--text-xs);font-weight:700;color:var(--gris-text);min-width:28px;text-align:right}

.hc-sesion{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius-sm);padding:16px;margin-bottom:var(--space-2);box-shadow:var(--shadow-sm)}
.hc-sesion-hdr{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.hc-num{font-size:13px;font-weight:700;color:var(--verde-oscuro);background:var(--verde-claro);padding:2px 9px;border-radius:4px}
.hc-fecha{font-size:var(--text-xs);color:var(--gris-text);font-weight:500}
.hc-texto{font-size:var(--text-sm);color:var(--texto);line-height:1.6}
.eva-row{display:flex;gap:3px;margin-top:8px;align-items:center}
.eva-picker{display:flex;gap:4px;flex-wrap:wrap}
.eva-btn{width:34px;height:34px;border-radius:var(--radius-xs);border:1.5px solid var(--gris-border);background:var(--blanco);color:var(--texto);font-size:var(--text-sm);font-weight:700;cursor:pointer;font-family:inherit}
.eva-dot{width:15px;height:15px;border-radius:4px;border:1.5px solid var(--gris-border-strong);background:var(--gris-bg)}
.eva-dot.on{background:var(--verde);border-color:var(--verde-oscuro)}
.eva-dot.on-med{background:var(--amarillo);border-color:var(--amarillo-oscuro)}
.eva-dot.on-alto{background:var(--rojo);border-color:var(--rojo-oscuro)}
.eva-label{font-size:var(--text-2xs);color:var(--gris-text);margin-left:var(--space-2);font-weight:600}

.view{display:none}
.view.active{display:block}
.empty{text-align:center;padding:48px 20px;color:var(--gris-text)}
.empty-icon{width:52px;height:52px;border-radius:3px;background:var(--gris-bg);display:flex;align-items:center;justify-content:center;font-size:24px;margin:0 auto 12px;opacity:.7}
.empty p{font-size:var(--text-base);font-weight:500}
.empty span{font-size:var(--text-sm);color:var(--gris-text);margin-top:var(--space-1);display:block}

/* Loading spinner */
.spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top-color:white;border-radius:50%;animation:spin .6s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:999;display:flex;align-items:center;justify-content:center;display:none}
.loading-card{background:var(--blanco);border:1px solid var(--gris-border);color:var(--texto);border-radius:var(--radius);padding:24px 32px;display:flex;align-items:center;gap:var(--space-4);font-size:var(--text-md);font-weight:500}
.spinner-dark{width:20px;height:20px;border:2px solid var(--gris-border);border-top-color:var(--acento);border-radius:50%;animation:spin .6s linear infinite}

.toast{position:fixed;bottom:22px;right:22px;background:var(--blanco);border:1px solid var(--gris-border-strong);color:var(--texto);padding:12px 18px;border-radius:var(--radius-sm);font-size:var(--text-base);font-weight:500;z-index:9999;display:flex;align-items:center;gap:var(--space-2);animation:slideUp .2s ease}
@keyframes slideUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--gris-border);border-radius:3px}

/* ── AGENDA LAYOUT CON MINI-CALENDARIO ────────────────── */
.agenda-layout{display:grid;grid-template-columns:224px 1fr;gap:16px;align-items:start}
.agenda-turnos-col{min-width:0}

.mini-cal{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-4);box-shadow:var(--shadow-sm);position:sticky;top:0}
.mini-cal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3)}
.mini-cal-nav{width:28px;height:28px;border:1px solid var(--gris-border);background:var(--gris-bg);border-radius:var(--radius-xs);cursor:pointer;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;color:var(--gris-text);transition:all .15s;font-family:inherit}
.mini-cal-nav:hover{background:var(--acento-claro);color:var(--acento-oscuro);border-color:var(--acento)}
.mini-cal-titulo{font-size:var(--text-base);font-weight:600;color:var(--texto);text-align:center;flex:1;letter-spacing:-.01em;text-transform:capitalize}
.mini-cal-dias-semana{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}
.mini-cal-dias-semana span{text-align:center;font-weight:600;color:var(--gris-text);padding:4px 0}
.mini-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.mini-cal-celda{text-align:center;font-size:var(--text-sm);padding:6px 2px;border-radius:var(--radius-xs);cursor:pointer;color:var(--texto);font-weight:500;transition:all .12s;line-height:1.4}
.mini-cal-celda:hover:not(.vacia){background:var(--acento-claro);color:var(--acento-oscuro)}
.mini-cal-celda.vacia{cursor:default}
.mini-cal-celda.finde{color:var(--gris-text)}
.mini-cal-celda.hoy{background:var(--acento-claro);color:var(--acento-oscuro);font-weight:700}
.mini-cal-celda.sel{background:var(--acento);color:var(--sobre-acento);font-weight:700}
.mini-cal-celda.hoy.sel{background:var(--acento);color:var(--sobre-acento)}

/* ── PACIENTES: FILTROS AVANZADOS ─────────────────────── */
.pac-filtros{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-4);margin-bottom:var(--space-4);box-shadow:var(--shadow-sm)}
.pac-filtros-row{display:flex;gap:var(--space-2);align-items:center;flex-wrap:wrap;margin-bottom:var(--space-2)}
.pac-filtros-row:last-child{margin-bottom:0}
.pac-filtros .search-input{height:36px;padding:6px 12px;font-size:var(--text-sm)}
.pac-filtros .field-select{height:36px;padding:6px 10px;font-size:var(--text-sm);min-width:0}

/* Tipo chip en tabla pacientes */
.tipo-chip{font-size:var(--text-2xs);font-weight:600;padding:2px 8px;border-radius:3px}
.tipo-kinesio{background:var(--azul-claro);color:var(--azul-oscuro)}
.tipo-gym{background:var(--violeta-claro);color:var(--violeta-oscuro)}
.tipo-ambos{background:var(--verde-claro);color:var(--verde-oscuro)}

/* ── GYM MODULE ───────────────────────────────────────── */
.gym-layout{display:grid;grid-template-columns:280px 1fr;gap:var(--space-4);align-items:start;min-height:400px}
.gym-alumnos-panel{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.gym-alumnos-buscar{padding:var(--space-3);border-bottom:1px solid var(--gris-border)}
.gym-alumnos-buscar input{width:100%;padding:8px 10px;border:1px solid var(--gris-border-strong);border-radius:var(--radius-xs);font-size:var(--text-sm);font-family:inherit;outline:none;background:var(--blanco);color:var(--texto)}
.gym-alumnos-buscar input:focus{border-color:var(--acento)}
.gym-alumnos-lista{max-height:560px;overflow-y:auto}
.gym-alumno-item{padding:12px 14px;border-bottom:1px solid var(--gris-border);cursor:pointer;transition:background .12s}
.gym-alumno-item:last-child{border-bottom:none}
.gym-alumno-item:hover{background:var(--gris-bg)}
.gym-alumno-item.activo{background:var(--acento-claro)}
.gym-alumno-nombre{font-size:var(--text-base);font-weight:600;color:var(--texto)}
.gym-alumno-os{font-size:var(--text-xs);color:var(--gris-text);margin-top:2px}

.gym-rutina-panel{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-5);box-shadow:var(--shadow-sm);min-height:300px}
.gym-rutina-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}
.gym-rutina-titulo{font-size:var(--text-lg);font-weight:600;letter-spacing:-.01em}

.rutina-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);margin-bottom:var(--space-3)}
.rutina-table th{padding:8px 10px;text-align:left;font-size:var(--text-xs);font-weight:500;color:var(--gris-text);background:var(--gris-bg);border-bottom:1px solid var(--gris-border)}
.rutina-table td{padding:5px 6px;border-bottom:1px solid var(--gris-border);vertical-align:middle}
.rutina-table tr:last-child td{border-bottom:none}
.rutina-input{width:100%;padding:6px 8px;border:1.5px solid transparent;border-radius:var(--radius-xs);font-size:var(--text-sm);font-family:inherit;background:transparent;outline:none;transition:all .12s;min-width:0}
.rutina-input:focus,.rutina-input:hover{border-color:var(--gris-border);background:var(--blanco)}
.rutina-input:focus{border-color:var(--acento)}
.rutina-ord-btn{width:24px;height:24px;border:1px solid var(--gris-border);background:var(--gris-bg);border-radius:4px;cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center;color:var(--gris-text);font-family:inherit;transition:all .12s}
.rutina-ord-btn:hover{background:var(--acento-claro);color:var(--acento-oscuro)}
.rutina-drag-handle{width:16px;padding:3px 2px;text-align:center;cursor:grab;color:var(--gris-text);opacity:.35;font-size:12px;user-select:none}
.rutina-drag-handle:active{cursor:grabbing}
.rutina-table tr.rutina-dragging{opacity:.4}
.rutina-table tr.rutina-drag-over td{border-top:2px solid var(--acento)}
.rutina-icon-btn{width:22px;height:22px;border:none;background:transparent;cursor:pointer;color:var(--gris-text);font-size:13px;border-radius:3px;transition:all .12s;padding:0;vertical-align:middle}
.rutina-icon-btn:hover{background:var(--gris-bg);color:var(--texto)}
.rutina-icon-del:hover{background:var(--rojo-claro);color:var(--rojo)}
.badge-estado{display:inline-flex;align-items:center;padding:3px 9px;border-radius:3px;font-size:var(--text-2xs);font-weight:700;letter-spacing:.03em}
.badge-activo{background:var(--verde-claro);color:var(--verde-oscuro)}
.badge-inactivo{background:var(--gris-bg);color:var(--gris-text);border:1px solid var(--gris-border)}

/* Horarios gym — legacy cards (kept for safety) */
.gym-horarios-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.gym-horario-card{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-4);box-shadow:var(--shadow-sm)}
.gym-horario-alumno{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;background:var(--gris-bg);border-radius:var(--radius-xs);font-size:var(--text-sm)}
.gym-horario-alumno button{width:20px;height:20px;border:none;background:transparent;cursor:pointer;color:var(--gris-text);font-size:14px;border-radius:3px;display:flex;align-items:center;justify-content:center;transition:all .12s;font-family:inherit}
.gym-horario-alumno button:hover{background:var(--rojo-claro);color:var(--rojo)}

/* ── GYM CALENDAR (Horarios grilla) ─────────────────────── */
.gym-cal-wrap{overflow-x:auto;margin-top:4px}
.gym-cal-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);min-width:860px}
.gym-cal-table thead th{padding:10px;text-align:center;font-size:var(--text-sm);font-weight:600;color:var(--gris-text);background:var(--gris-bg);border-bottom:1px solid var(--gris-border-strong)}
.gym-cal-th-time{text-align:left!important;width:80px;min-width:80px}
.gym-cal-th-prof{text-align:left!important;width:100px;min-width:100px;border-right:2px solid var(--gris-border)}
.gym-cal-td-time{padding:8px 12px;background:var(--gris-bg);border-right:1px solid var(--gris-border);border-bottom:1px solid var(--gris-border);font-size:var(--text-lg);font-weight:600;color:var(--texto);white-space:nowrap;vertical-align:top}
.gym-cal-td-prof{padding:8px 10px;background:var(--gris-bg);border-right:2px solid var(--gris-border);border-bottom:1px solid var(--gris-border);font-size:var(--text-xs);color:var(--verde-oscuro);font-weight:600;white-space:nowrap;vertical-align:middle}
.gym-cal-td-cell{padding:6px 7px;border-right:1px solid var(--gris-border);border-bottom:1px solid var(--gris-border);vertical-align:top;min-width:120px;height:88px;max-height:88px;overflow:hidden}
.gym-cal-td-cell:last-child{border-right:none}

/* ── AGENDA (vista semana) ──────────────────────────────── */
.agenda-cal-td-cell{padding:5px 6px;border-right:1px solid var(--gris-border);border-bottom:1px solid var(--gris-border);vertical-align:top;min-width:130px;max-height:120px;overflow-y:auto}
.agenda-cal-td-cell:last-child{border-right:none}
.agenda-chip{display:block;width:100%;text-align:left;cursor:pointer;background:var(--verde-claro);border:1px solid var(--verde);border-radius:4px;padding:3px 6px;font-size:12px;font-weight:600;color:var(--verde-oscuro);margin-bottom:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:inherit}
.agenda-chip:hover{filter:brightness(1.15)}
.agenda-chip.ac-cancelado{background:var(--gris-bg);border-color:var(--gris-border-strong);color:var(--gris-text);text-decoration:line-through}
.agenda-chip.ac-pendiente{background:var(--amarillo-claro);border-color:var(--amarillo);color:var(--amarillo-oscuro)}
.agenda-chip.ac-ausente{background:var(--rojo-claro);border-color:var(--rojo);color:var(--rojo-oscuro)}
.agenda-semana-header{display:flex;align-items:center;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-3);font-weight:700}
.gym-cell-cupo-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;min-height:18px}
.gym-chip{display:flex;align-items:center;gap:3px;background:var(--verde-claro);border:1px solid var(--verde);border-radius:4px;padding:2px 5px;font-size:12px;font-weight:600;color:var(--verde-oscuro);max-width:100%;overflow:hidden}
.gym-chip-x{width:13px;height:13px;border:none;background:transparent;cursor:pointer;color:var(--verde-oscuro);font-size:11px;padding:0;opacity:.6;transition:opacity .1s;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-family:inherit}
.gym-chip-x:hover{opacity:1;color:var(--rojo)}
.gym-cell-mas{font-size:12px;color:var(--verde-oscuro);cursor:pointer;font-weight:600;margin-top:3px;line-height:1.3}
.gym-cell-mas:hover{text-decoration:underline}
.gym-cal-cupo{font-size:12px;font-weight:700}
.gym-cal-cupo-ok{color:var(--verde-oscuro)}
.gym-cal-cupo-warn{color:var(--amarillo-oscuro)}
.gym-cal-cupo-lleno{color:var(--rojo)}
.gym-cell-verde{background:rgba(34,197,94,.10)}
.gym-cell-amarillo{background:rgba(245,166,35,.12)}
.gym-cell-rojo{background:rgba(239,68,68,.10)}
.gym-popover{position:fixed;background:var(--blanco);border:1px solid var(--gris-border-strong);border-radius:var(--radius);box-shadow:0 8px 24px rgba(0,0,0,.4);z-index:1500;min-width:220px;max-width:280px;overflow:hidden}
.gym-popover-header{display:flex;align-items:center;justify-content:space-between;padding:11px 12px 9px;border-bottom:1px solid var(--gris-border)}
.gym-popover-close{width:22px;height:22px;border:none;background:transparent;cursor:pointer;color:var(--gris-text);font-size:14px;border-radius:4px;transition:all .1s;font-family:inherit;display:flex;align-items:center;justify-content:center}
.gym-popover-close:hover{background:var(--gris-bg);color:var(--texto)}
.gym-popover-list{padding:6px 12px;max-height:220px;overflow-y:auto}
.gym-popover-item{display:flex;align-items:center;justify-content:space-between;padding:6px 0;font-size:var(--text-sm);border-bottom:1px solid var(--gris-border)}
.gym-popover-item:last-child{border-bottom:none}
.gym-popover-agregar{display:flex;align-items:center;gap:var(--space-2);width:100%;padding:10px 12px;border:none;border-top:1px solid var(--gris-border);background:transparent;cursor:pointer;color:var(--verde-oscuro);font-size:var(--text-sm);font-weight:600;font-family:inherit;transition:background .1s;text-align:left}
.gym-popover-agregar:hover{background:var(--verde-claro)}
.gym-cal-add-btn{border:1.5px dashed var(--gris-border);background:transparent;border-radius:4px;cursor:pointer;color:var(--gris-text);font-size:12px;padding:2px 7px;transition:all .12s;font-family:inherit;line-height:1.4}
.gym-cal-add-btn:hover{border-color:var(--acento);color:var(--acento);background:var(--acento-claro)}

/* ── COBROS REDESIGN ─────────────────────────────────────── */
.cobros-kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:var(--space-3);margin-bottom:var(--space-4)}
.cobros-kpi-card{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-4);box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:14px}
.kpi-chip{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;background:color-mix(in srgb,var(--c) 15%,transparent);color:var(--c)}
.kpi-val{font-size:var(--text-xl);font-weight:700;letter-spacing:-.02em;line-height:1.15}
.kpi-label{font-size:var(--text-xs);color:var(--gris-text);font-weight:500;margin-top:2px}
.badge{display:inline-block;font-size:var(--text-2xs);font-weight:600;padding:2px 8px;border-radius:3px;white-space:nowrap}
.badge-verde{background:var(--verde-claro);color:var(--verde-oscuro)}
.badge-amarillo{background:var(--amarillo-claro);color:var(--amarillo-oscuro)}
.badge-rojo{background:var(--rojo-claro);color:var(--rojo-oscuro)}
.badge-azul{background:var(--azul-claro);color:var(--azul-oscuro)}
.badge-gris{background:var(--gris-bg);color:var(--gris-text);border:1px solid var(--gris-border)}

/* ── GYM ALUMNOS TABLE ───────────────────────────────────── */
.gym-tab-toolbar{display:flex;gap:var(--space-3);margin-bottom:var(--space-4);align-items:center;flex-wrap:wrap}

/* ── GRILLAS REUTILIZABLES ───────────────────────────────── */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.resumen-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:4px}

/* ── MENÚ LATERAL EN PANTALLAS CHICAS ────────────────────── */
/* En escritorio el botón y el fondo no existen; se activan en los media queries de abajo. */
.btn-menu{display:none;width:36px;height:36px;flex-shrink:0;border:1px solid var(--gris-border);border-radius:var(--radius-sm);background:transparent;color:var(--texto);font-size:17px;cursor:pointer;align-items:center;justify-content:center}
.sidebar-backdrop{display:none}

/* ── RESPONSIVE: TABLET (≤ 900px) ────────────────────────── */
@media (max-width:900px){
  .btn-menu{display:inline-flex}
  .topbar-brand{width:auto;padding:0 12px;background:transparent}
  .topbar-content{padding:0 12px 0 4px}
  .topbar-date{display:none}

  /* La barra lateral sale de la grilla y entra deslizando desde la izquierda. */
  .sidebar{position:fixed;top:var(--header-h);bottom:0;left:0;z-index:150;width:min(280px,82vw);transform:translateX(-100%);transition:transform .22s ease;box-shadow:none}
  .app.sidebar-open .sidebar{transform:translateX(0);box-shadow:8px 0 24px rgba(0,0,0,.5)}
  .sidebar-backdrop{display:block;position:fixed;inset:var(--header-h) 0 0 0;z-index:140;background:rgba(0,0,0,.55);opacity:0;pointer-events:none;transition:opacity .22s}
  .app.sidebar-open .sidebar-backdrop{opacity:1;pointer-events:auto}

  .content{padding:var(--space-4)}
  .page-header{flex-wrap:wrap;gap:var(--space-3)}
  .stats-row{grid-template-columns:repeat(2,1fr);gap:var(--space-3)}
  .agenda-layout,.gym-layout,.panel-grid,.cobro-row{grid-template-columns:1fr}
  .resumen-grid{grid-template-columns:repeat(3,1fr)}

  /* Tablas anchas: se desplazan horizontalmente dentro de su caja en vez de romper la página. */
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .table-wrap > table{min-width:640px}
  .tabs{overflow-x:auto;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tab{white-space:nowrap;flex-shrink:0}

  #view-conversaciones.active{margin:calc(-1 * var(--space-4));height:calc(100dvh - var(--header-h))}
  .conv-list-col{width:260px}
}

/* ── RESPONSIVE: CELULAR (≤ 640px) ───────────────────────── */
@media (max-width:640px){
  .brand-sub,.user-pill > div:last-child{display:none}
  .user-pill{padding:4px}
  .btn-logout{padding:7px 10px;font-size:0}
  .btn-logout i{font-size:15px}

  .content{padding:var(--space-3)}
  .page-title{font-size:var(--text-xl)}
  .page-header .btn{width:100%}
  .stat-card{padding:var(--space-3);gap:var(--space-3)}
  .grid-2,.field-row,.resumen-grid{grid-template-columns:1fr}
  .resumen-grid{grid-template-columns:repeat(2,1fr)}

  /* Tarjeta de turno: hora + datos arriba, acciones a lo ancho debajo. */
  .turno-card{grid-template-columns:56px 1fr;padding:12px}
  .turno-card > :last-child{grid-column:1 / -1}

  .pac-filtros-row > *{flex:1 1 100% !important;width:100% !important}

  /* Modales como hoja que ocupa casi toda la pantalla. */
  .modal-overlay{align-items:flex-end}
  .modal,.modal-lg{width:100%;max-width:100%;max-height:92dvh;border-radius:var(--radius) var(--radius) 0 0}
  .modal-header{padding:var(--space-4)}
  .modal-body{padding:var(--space-4)}
  .modal-footer{padding:var(--space-3) var(--space-4);flex-wrap:wrap}
  .modal-footer .btn{flex:1}

  .toast{left:12px;right:12px;bottom:12px}

  .conv-wrap{flex-direction:column}
  .conv-list-col{width:100%;height:42%;border-right:none;border-bottom:1px solid var(--gris-border)}
}

/* ── iOS: SIN ZOOM AUTOMÁTICO AL ESCRIBIR ────────────────── */
/* Safari en iPhone agranda la página al enfocar un campo con letra menor a 16px y la deja
   ampliada. En pantallas táctiles todos los campos van a 16px (el !important gana a los
   tamaños inline que ponen algunas vistas). No se bloquea el zoom manual (accesibilidad). */
@media (max-width:900px), (pointer:coarse){
  input,select,textarea,.field-input,.field-select,.search-input{font-size:16px !important}
}

/* ── MARCA DEL CENTRO ────────────────────────────────────── */
.login-marca{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:14px}
.login-marca-icono{width:56px;height:56px;border-radius:3px;background:var(--acento);color:var(--sobre-acento);display:flex;align-items:center;justify-content:center;font-size:26px}
.login-marca-nombre{font-size:var(--text-xl);font-weight:800;letter-spacing:-.4px}
.brand-iniciales{width:34px;height:34px;border-radius:3px;flex-shrink:0;background:var(--acento);color:var(--sobre-acento);display:none;align-items:center;justify-content:center;font-size:14px;font-weight:800;letter-spacing:-.3px}
.brand-iniciales.visible{display:flex}
.brand-name{max-width:172px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2;font-size:18px;font-weight:800;letter-spacing:-.3px}
/* Nombre y eslogan del centro: una línea cada uno, alineados con el logo. El eslogan tiene un
   límite de caracteres (ver MARCA_ESLOGAN_MAX) para que siempre entre completo, sin cortarse. */
.brand-sub{font-family:'Inter',-apple-system,sans-serif;font-size:12.5px;font-weight:500;letter-spacing:0;line-height:1.2;color:var(--sidebar-text);max-width:172px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.marca-card{margin-bottom:var(--space-4)}
.marca-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--space-6);align-items:start}
.marca-campos{display:flex;flex-direction:column;gap:14px}
.marca-logo-fila{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.marca-logo-caja{width:64px;height:64px;border-radius:3px;border:1px dashed var(--gris-border-strong);background:var(--gris-bg);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.marca-logo-caja img{width:100%;height:100%;object-fit:contain}
.marca-colores{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.marca-color{width:30px;height:30px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.marca-color.sel{border-color:var(--texto)}
.marca-color-input{width:38px;height:32px;border:1px solid var(--gris-border);border-radius:var(--radius-xs);background:none;cursor:pointer;padding:2px}
.marca-preview{border:1px solid var(--gris-border);border-radius:var(--radius);overflow:hidden;background:var(--gris-bg)}
.marca-preview-top{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--sidebar-bg);border-bottom:1px solid var(--gris-border)}
.marca-preview-top img,.marca-preview-ini{width:34px;height:34px;border-radius:3px;object-fit:contain;flex-shrink:0}
.marca-preview-ini{display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px}
.marca-preview-body{padding:14px;display:flex;flex-direction:column;gap:10px}
.marca-preview-nav{padding:9px 12px;border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:600}
.marca-preview-btn{align-self:flex-start;padding:8px 14px;border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:600}
.marca-aviso{font-size:var(--text-xs);color:var(--amarillo-oscuro)}
@media (max-width:900px){
  .marca-grid{grid-template-columns:1fr}
  .brand-name,.brand-sub{max-width:40vw}
}

/* ── AGENDA: FILTRO POR PROFESIONAL Y GRILLA DE HORARIOS ─── */
.filtro-profesional{width:auto;min-width:230px;height:auto;padding:8px 12px;font-size:var(--text-sm)}
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:6px;max-height:228px;overflow-y:auto;padding:2px}
.slot-btn{display:flex;flex-direction:column;align-items:center;gap:1px;padding:7px 4px;border-radius:var(--radius-sm);border:1.5px solid var(--verde);background:var(--verde-claro);color:var(--texto);cursor:pointer;font-family:inherit;transition:all .12s}
.slot-btn:hover{border-color:var(--acento)}
.slot-hora{font-size:var(--text-sm);font-weight:700}
.slot-estado{font-size:11px;color:var(--verde-oscuro);font-weight:600}
.slot-btn.ocupado{border-color:var(--gris-border-strong);background:var(--gris-bg)}
.slot-btn.ocupado .slot-estado{color:var(--amarillo-oscuro)}
.slot-btn.pasado{opacity:.45}
.slot-btn.sel{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento)}
.slot-btn.sel .slot-estado{color:var(--sobre-acento)}
.nt-hora-manual{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:var(--text-xs);color:var(--gris-text)}
.nt-hora-manual .field-input{width:130px;padding:6px 10px}
@media (max-width:640px){
  .filtro-profesional{flex:1 1 100%;min-width:0}
  .slot-grid{grid-template-columns:repeat(4,1fr)}
}

/* ── MENÚ DEL USUARIO ────────────────────────────────────── */
.user-menu-wrap{position:relative}
button.user-pill{font-family:inherit;color:var(--texto);text-align:left}
.user-pill-chev{font-size:10px;color:var(--gris-text);margin-left:2px}
.user-menu{position:absolute;right:0;top:calc(100% + 8px);width:270px;background:var(--blanco);border:1px solid var(--gris-border-strong);border-radius:var(--radius);box-shadow:0 12px 32px rgba(0,0,0,.35);padding:8px;z-index:260}
.user-menu-head{display:flex;align-items:center;gap:10px;padding:8px 8px 12px;border-bottom:1px solid var(--gris-border);margin-bottom:6px}
.user-av-lg{width:38px;height:38px;font-size:15px;flex-shrink:0}
.user-menu-nombre{font-weight:700;font-size:var(--text-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-menu-sub{font-size:var(--text-2xs);color:var(--gris-text)}
.user-menu-seccion{font-size:11px;font-weight:600;color:var(--gris-text-dim);padding:8px 8px 6px}
.tema-opciones{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:0 4px 6px}
.tema-op{display:flex;flex-direction:column;align-items:center;gap:4px;padding:9px 4px;border-radius:var(--radius-sm);border:1.5px solid var(--gris-border);background:var(--gris-bg);color:var(--texto);font-family:inherit;font-size:var(--text-xs);font-weight:600;cursor:pointer}
.tema-op i{font-size:15px}
.tema-op.sel{border-color:var(--acento);background:var(--acento-claro);color:var(--acento-oscuro)}
.user-menu-sep{height:1px;background:var(--gris-border);margin:6px 0}
.user-menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:11px 10px;border:none;background:none;border-radius:var(--radius-sm);color:var(--texto);font-family:inherit;font-size:var(--text-sm);font-weight:500;cursor:pointer;text-align:left}
.user-menu-item i{width:18px;text-align:center;color:var(--gris-text)}
.user-menu-item:hover{background:var(--gris-bg)}
.user-menu-item.peligro,.user-menu-item.peligro i{color:var(--rojo)}

/* ── AGENDA: FECHA COMPACTA (solo celular) ───────────────── */
.fecha-compacta{display:none}
.turnos-paciente-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--gris-border);font-size:var(--text-sm)}
.turnos-paciente-item:last-child{border-bottom:none}
.turnos-paciente-fecha{font-weight:700;min-width:92px}

/* ── CELULAR: MENÚ MÁS GRANDE Y AGENDA COMPACTA ──────────── */
@media (max-width:900px){
  /* En el celular el menú lateral quedaba chico: ítems más altos y letra más grande. */
  .nav-item{padding:13px 14px;font-size:var(--text-md)}
  .nav-item i{font-size:18px;width:22px}
  .user-menu{position:fixed;top:calc(var(--header-h) + 6px);right:10px;left:auto;width:min(300px,calc(100vw - 20px))}
}
@media (max-width:640px){
  .user-pill-chev{display:none}
  /* KPIs en una sola fila compacta */
  .stats-row{grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:var(--space-3)}
  .stat-card{flex-direction:column;align-items:flex-start;gap:2px;padding:8px 10px}
  .stat-card .stat-icon,.stat-card .stat-sub{display:none}
  .stat-card .stat-label{font-size:11px;letter-spacing:.01em}
  .stat-card .stat-val{font-size:var(--text-xl)}
  /* Calendario plegado: se ve la fecha con ‹ › y se despliega al tocarla */
  .fecha-compacta{display:flex;align-items:center;gap:6px}
  .fecha-compacta-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:9px;border-radius:var(--radius-sm);border:1px solid var(--gris-border);background:var(--gris-bg);color:var(--texto);font-family:inherit;font-size:var(--text-base);font-weight:700;cursor:pointer}
  .mini-cal:not(.abierto) .mini-cal-header,.mini-cal:not(.abierto) .mini-cal-dias-semana,.mini-cal:not(.abierto) .mini-cal-grid,.mini-cal:not(.abierto) > .btn{display:none}
  .mini-cal.abierto .fecha-compacta{margin-bottom:10px}
  .mini-cal .vista-agenda-toggle{margin-top:8px}
  .mini-cal{padding:10px}
}

/* Tarjeta de turno: se puede tocar para ver la ficha del paciente */
.turno-ficha-ico{font-size:12px;color:var(--gris-text);margin-left:4px;opacity:.7}
.turno-card[title]:hover .turno-ficha-ico{color:var(--acento);opacity:1}

/* ── LOGIN ───────────────────────────────────────────────── */
.login-titulo{font-size:var(--text-lg);font-weight:600;text-align:center;letter-spacing:-.3px}
.login-card .login-sub{margin-bottom:var(--space-5)}
.login-ok{background:var(--verde-claro);border:1px solid var(--verde);border-radius:var(--radius-sm);padding:10px 12px;font-size:var(--text-sm);line-height:1.5;color:var(--verde-oscuro);margin-bottom:var(--space-4);display:none}
.login-pass-wrap{position:relative}
.login-pass-wrap .login-input{padding-right:44px}
.login-ojo{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:none;background:none;color:var(--gris-text);cursor:pointer;font-size:15px;border-radius:var(--radius-xs)}
.login-ojo:hover{color:var(--texto)}
.login-opciones{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:2px 0 var(--space-4)}
.login-recordar{display:flex;align-items:center;gap:7px;font-size:var(--text-sm);color:var(--gris-text);cursor:pointer}
.login-recordar input{width:16px;height:16px;accent-color:var(--acento)}
.login-link{border:none;background:none;padding:0;font-family:inherit;font-size:var(--text-sm);font-weight:600;color:var(--acento-oscuro);cursor:pointer}
.login-link:hover{text-decoration:underline}
.login-volver{display:block;margin:14px auto 0}
.login-btn i{margin-left:6px;font-size:13px}

/* ── DISCIPLINAS ─────────────────────────────────────────── */
.chips-disciplinas{display:contents}
.disciplina-tag{background:color-mix(in srgb,var(--dc) 16%,transparent);color:var(--dc);font-size:13px;font-weight:600;padding:2px 7px;border-radius:3px}
.disciplina-fila{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--gris-border)}
.disciplina-fila.inactiva{opacity:.55}
.disciplina-ico{width:34px;height:34px;border-radius:3px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:color-mix(in srgb,var(--dc) 16%,transparent);color:var(--dc)}
.cprof-disciplinas{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:4px}
.cprof-disciplina{display:flex;align-items:center;gap:6px;font-size:14px;cursor:pointer}
.disc-iconos{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.disc-icono{height:40px;border-radius:var(--radius-sm);border:1.5px solid var(--gris-border);background:var(--gris-bg);color:var(--texto);cursor:pointer;font-size:16px}
.disc-icono.sel{border-color:var(--acento);background:var(--acento-claro);color:var(--acento-oscuro)}
/* ── FICHA COMPLETA ──────────────────────────────────────── */
.ficha-grupo-titulo{grid-column:1/-1;font-size:var(--text-2xs);font-weight:600;color:var(--gris-text);margin-top:6px;padding-top:10px;border-top:1px solid var(--gris-border)}
.ficha-mas{margin:4px 0 12px;border:1px solid var(--gris-border);border-radius:var(--radius-sm);padding:10px 12px}
.ficha-mas summary{cursor:pointer;font-size:var(--text-sm);font-weight:600;color:var(--acento-oscuro)}
.ficha-mas[open] summary{margin-bottom:6px}

/* ── PLATAFORMA ──────────────────────────────────────────── */
.plataforma-centro{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--gris-border)}
.plataforma-centro:last-child{border-bottom:none}
.plataforma-centro img,.plataforma-ini{width:40px;height:40px;border-radius:3px;object-fit:contain;flex-shrink:0}
.plataforma-ini{display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px}

.tags-disciplinas{display:inline-flex;flex-wrap:wrap;gap:4px;justify-content:flex-end}
td .tags-disciplinas{justify-content:flex-start}

/* ── TURNOS EN SERIE ─────────────────────────────────────── */
.serie-box{border:1px dashed var(--gris-border-strong);border-radius:var(--radius-sm);padding:12px;margin-top:4px}
.serie-toggle{display:flex;align-items:center;gap:9px;font-size:var(--text-sm);cursor:pointer}
.serie-toggle input{width:17px;height:17px;accent-color:var(--acento)}
.serie-dias{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.serie-dias button{min-width:48px;padding:7px 10px;border-radius:var(--radius-sm);border:1.5px solid var(--gris-border);background:var(--gris-bg);color:var(--texto);font-family:inherit;font-weight:600;cursor:pointer}
.serie-dias button.sel{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento)}
.serie-aviso{font-size:var(--text-xs);color:var(--gris-text);margin:8px 0 6px}
.serie-fechas{display:flex;flex-wrap:wrap;gap:5px;max-height:110px;overflow-y:auto}
.serie-fechas span{font-size:12px;font-weight:600;padding:3px 8px;border-radius:3px;background:var(--acento-claro);color:var(--acento-oscuro)}

/* ── FACTURACIÓN A OBRAS SOCIALES ────────────────────────── */
.fact-cabecera{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.fact-mes{display:flex;align-items:center;gap:10px;font-size:var(--text-md)}
.fact-totales{flex:1;color:var(--gris-text);font-size:var(--text-sm)}
.fact-os{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:12px 14px;margin-bottom:8px}
.fact-os summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;flex-wrap:wrap}
.fact-os-nombre{font-weight:700;font-size:var(--text-md)}
.fact-os-num{font-size:var(--text-sm);color:var(--gris-text)}
.fact-nota{font-size:var(--text-xs);color:var(--gris-text);margin-top:10px}

/* ── WHATSAPP ────────────────────────────────────────────── */
.wa-btn{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;margin-left:8px;border-radius:50%;background:#25D366;color:#fff;font-size:15px;vertical-align:middle;text-decoration:none;transition:transform .12s}
.wa-btn:hover{transform:scale(1.1)}
.btn-wa{background:#25D366;color:#fff;border-color:#1DA851}
.btn-wa:hover{background:#1DA851}

/* ── RESERVAS DE CLASES ──────────────────────────────────── */
.reserva-lista{display:flex;flex-wrap:wrap;gap:6px}
.reserva-chip{display:inline-flex;align-items:center;gap:6px;font-size:14px;padding:4px 10px;border-radius:3px;background:var(--gris-bg);border:1px solid var(--gris-border)}
.reserva-chip small{font-size:11px;color:var(--gris-text)}
.reserva-extra{background:var(--acento-claro);border-color:transparent}
.reserva-ok{background:var(--verde-claro)}
.reserva-opcion{padding:9px 12px;border:1px solid var(--gris-border);border-radius:var(--radius-xs);margin-bottom:5px;cursor:pointer;font-size:15px}
.reserva-opcion:hover{background:var(--acento-claro)}

/* ── IMPORTAR DESDE EXCEL ────────────────────────────────── */
.import-drop{display:flex;flex-direction:column;align-items:center;gap:10px;padding:22px;border:2px dashed var(--gris-border-strong);border-radius:var(--radius);background:var(--gris-bg)}
.import-resumen{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.import-num{flex:1;min-width:120px;padding:10px 12px;border-radius:var(--radius-sm);background:var(--gris-bg);border:1px solid var(--gris-border);display:flex;flex-direction:column}
.import-num b{font-size:22px}
.import-num span{font-size:13px;color:var(--gris-text)}
.import-num-ok{background:var(--verde-claro);border-color:transparent}
.import-aviso{margin-top:10px;padding:9px 12px;border-radius:var(--radius-sm);background:var(--amarillo-claro);font-size:14px}
.import-aviso-mal{background:var(--rojo-claro);color:var(--rojo)}

/* ── PRIMEROS PASOS ──────────────────────────────────────── */
.pasos-card{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:16px 18px;margin-bottom:var(--space-5);box-shadow:var(--shadow)}
.pasos-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.pasos-titulo{font-size:var(--text-lg);font-weight:700}
.pasos-sub{font-size:var(--text-sm);color:var(--gris-text);margin-top:2px}
.pasos-barra{height:6px;border-radius:3px;background:var(--gris-border);margin:12px 0;overflow:hidden}
.pasos-barra span{display:block;height:100%;background:var(--acento);border-radius:3px;transition:width .3s}
.paso{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--gris-border)}
.paso:first-child{border-top:0}
.paso-ico{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--acento-claro);color:var(--acento-oscuro);flex-shrink:0}
.paso-ok .paso-ico{background:var(--verde-claro);color:var(--verde-oscuro)}
.paso-txt{flex:1;min-width:0;display:flex;flex-direction:column}
.paso-txt span{font-size:13px;color:var(--gris-text)}
.paso-ok .paso-txt b{text-decoration:line-through;color:var(--gris-text)}
.paso-listo{font-size:12px;font-weight:700;color:var(--verde-oscuro)}
@media (max-width:600px){.paso{flex-wrap:wrap}.paso .btn{margin-left:46px}}

/* ── PEDIDOS DE PRUEBA (plataforma) ──────────────────────── */
.solicitud{align-items:flex-start}
.solicitud-nueva{border-left:3px solid var(--acento);padding-left:10px}

/* ── REPORTES ────────────────────────────────────────────── */
.rep-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:var(--space-5)}
.rep-kpi{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:16px;display:flex;flex-direction:column;gap:2px}
.rep-kpi>i{font-size:18px;margin-bottom:4px}
.rep-kpi-val{font-size:26px;font-weight:600;letter-spacing:-.5px}
.rep-kpi-et{font-size:12px;color:var(--gris-text);font-weight:600}
.rep-var{font-size:13px;font-weight:600;margin-top:4px}
.rep-var-bien{color:var(--verde-oscuro)}
.rep-var-mal{color:var(--rojo)}
.rep-var-igual{color:var(--gris-text);font-weight:500}
@media (max-width:820px){.rep-kpis{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.rep-kpis{grid-template-columns:1fr}}
.pasos-reabrir{margin-bottom:var(--space-4);font-size:var(--text-sm)}
.pasos-reabrir a{color:var(--acento);font-weight:600}

/* ── CAJAS ───────────────────────────────────────────────── */
.cajas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.caja-card{display:flex;align-items:center;gap:12px;padding:16px;background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);cursor:pointer;transition:border-color .15s,transform .12s}
.caja-card:hover{border-color:var(--acento);transform:translateY(-1px)}
.caja-card-ico{width:40px;height:40px;border-radius:3px;background:var(--acento-claro);color:var(--acento);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0}
.caja-card-txt{flex:1;min-width:0}
.caja-card-nombre{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.caja-card-sub{font-size:13px;color:var(--gris-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.caja-card-saldo{font-weight:600;font-size:var(--text-md);white-space:nowrap}
.tipo-otro{background:var(--gris-bg);color:var(--gris-text);border:1px solid var(--gris-border)}

/* ── MENÚ: secciones visibles y plegables ────────────────── */
.nav-section{display:flex;align-items:center;gap:8px;padding:7px 10px;margin-top:12px;font-size:var(--text-xs);font-weight:600;color:var(--gris-text);cursor:pointer;border-radius:var(--radius-sm);user-select:none}
.nav-section:hover{background:var(--sidebar-hover)}
.nav-sec-ico{width:18px;height:18px;color:var(--gris-text-dim);display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0}
.nav-sec-txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-sec-chev{font-size:11px;color:var(--sidebar-section);transition:transform .15s}
.nav-section.colapsada .nav-sec-chev{transform:rotate(-90deg)}
.nav-item.nav-colapsado{display:none!important}

/* ── PAQUETES DE CLASES ──────────────────────────────────── */
.reserva-fuera{background:transparent;border:1px dashed var(--gris-border-strong);color:var(--gris-text)}

/* ── CLASES DE PRUEBA ────────────────────────────────────── */
.reserva-prueba{background:var(--violeta-claro);border-color:transparent}

/* ── DOCUMENTACIÓN: consentimiento y firma ───────────────── */
.firma-texto{white-space:pre-wrap;font-size:14px;line-height:1.5;background:var(--gris-bg);border:1px solid var(--gris-border);border-radius:var(--radius-sm);padding:12px 14px;max-height:220px;overflow:auto}
.firma-canvas{display:block;width:100%;max-width:480px;height:170px;background:#fff;border:1.5px dashed var(--gris-border-strong);border-radius:var(--radius-sm);touch-action:none;cursor:crosshair}

/* ── REPORTES DE CLASES: mapa de calor ───────────────────── */
.heat-table{border-collapse:separate;border-spacing:3px;width:100%;font-size:13px}
.heat-table th{font-weight:600;color:var(--gris-text);text-align:center;padding:4px 6px;white-space:nowrap}
.heat-table td{text-align:center;padding:9px 6px;border-radius:3px;font-weight:700;min-width:46px}
.heat-vacia{background:var(--gris-bg)}

/* ── CHECK-IN ────────────────────────────────────────────── */
.ci-wrap{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:20px;align-items:start}
.ci-panel{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:16px}
.ci-dni{font-size:28px;font-weight:600;letter-spacing:.12em;text-align:center;margin-bottom:12px}
.ci-teclado{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ci-tecla{padding:16px 0;font-size:22px;font-weight:700;font-family:inherit;border-radius:var(--radius-sm);border:1px solid var(--gris-border);background:var(--gris-bg);color:var(--texto);cursor:pointer;transition:background .1s,transform .08s}
.ci-tecla:active{transform:scale(.96);background:var(--acento-claro)}
.ci-tecla-sec{color:var(--gris-text)}
.ci-tecla-ok{background:var(--acento);color:var(--sobre-acento);border-color:transparent}
.ci-resultado{min-height:260px;display:flex;align-items:center;justify-content:center;background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:24px;text-align:center}
.ci-vacio{color:var(--gris-text)}.ci-vacio i{font-size:44px;margin-bottom:10px;opacity:.6}
.ci-msg i{font-size:60px;margin-bottom:12px}
.ci-msg-t{font-size:26px;font-weight:600}.ci-msg-s{font-size:16px;color:var(--gris-text);margin-top:6px}
.ci-ok i{color:var(--verde)}.ci-mal i{color:var(--rojo)}.ci-aviso i{color:var(--amarillo)}
.ci-ficha{width:100%;max-width:460px;text-align:left}
.ci-ficha-nombre{font-size:26px;font-weight:600}.ci-ficha-sub{color:var(--gris-text);font-size:15px}
.ci-btn-presente{width:100%;justify-content:center;font-size:18px;padding:16px}
.ci-auto .ci-dni{font-size:36px}.ci-auto .ci-tecla{padding:22px 0;font-size:28px}.ci-auto .ci-msg-t{font-size:34px}
@media (max-width:760px){.ci-wrap{grid-template-columns:1fr}}

/* ── LISTA DE ESPERA ─────────────────────────────────────── */
.reserva-espera{background:var(--amarillo-claro);border-color:transparent}
.espera-aviso{display:flex;align-items:center;gap:10px;flex-wrap:wrap;width:100%;margin-top:6px;padding:9px 12px;border-radius:var(--radius-sm);background:var(--verde-claro);font-size:14px}

/* ── PRODUCTOS Y VENTAS ──────────────────────────────────── */
.prod-grid{display:grid;grid-template-columns:1fr minmax(260px,340px);gap:16px;align-items:start}
.prod-lista{display:flex;flex-direction:column;gap:8px}
.prod-fila{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius)}
.prod-cant{display:flex;align-items:center;gap:10px}
.prod-cant b{min-width:22px;text-align:center;font-size:16px}
@media (max-width:820px){.prod-grid{grid-template-columns:1fr}}

/* ── CELULAR: tarjetas y pestañas que no se cortan ───────── */
.panel-grid > *, .rep-kpis > *, .prod-grid > *, .ci-wrap > *{min-width:0}
.panel-card{min-width:0}
.panel-card-title{overflow-wrap:anywhere}
@media (max-width:760px){
  .panel-grid{grid-template-columns:1fr}
  .tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tab{flex-shrink:0;white-space:nowrap;padding:10px 14px}
}

/* ── AVISOS A SOCIOS ─────────────────────────────────────── */
.aviso-fila{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--gris-border)}
.aviso-enviado{opacity:.6}

/* ── INICIO Y SOCIOS ─────────────────────────────────────── */
.home-banner{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-5) var(--space-6,24px);margin-bottom:var(--space-4);box-shadow:var(--shadow-sm)}
.home-hola{font-size:24px;font-weight:600;letter-spacing:-.01em}
.home-centro{font-size:15px;font-weight:600;color:var(--gris-text);margin-top:2px}
.home-fecha{font-size:13px;color:var(--gris-text);margin-top:2px;}
.home-fecha::first-letter{text-transform:uppercase}
.home-grupo{margin-top:22px}
.home-grupo-titulo{font-size:12px;font-weight:600;color:var(--gris-text);margin-bottom:8px}
.home-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.home-acceso{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius-sm,10px);color:inherit;font:inherit;font-weight:600;font-size:14px;cursor:pointer;text-align:left;min-width:0}
.home-acceso i{font-size:16px;width:20px;text-align:center;color:var(--gris-text);flex:none}
.home-acceso span{line-height:1.2}
.home-acceso:hover{border-color:var(--gris-text)}
.socios-barra{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.socios-barra .field-input{flex:1;min-width:220px}
.socios-barra .field-select{width:auto;min-width:200px}
.socio-chips{display:flex;gap:6px;flex-wrap:wrap}
.socio-chip{border:1px solid var(--gris-border);background:transparent;color:var(--gris-text);border-radius:3px;padding:3px 11px;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.socio-chip.on{background:color-mix(in srgb,var(--dc,var(--azul)) 16%,transparent);border-color:color-mix(in srgb,var(--dc,var(--azul)) 55%,transparent);color:var(--texto)}

/* ── AYUDA: NOVEDADES, TUTORIALES, PREGUNTAS ─────────────── */
.novedad{margin-bottom:var(--space-4)}
.novedad-fecha{font-size:12px;font-weight:600;color:var(--gris-text)}
.novedad-titulo{font-size:17px;font-weight:700;margin:2px 0 8px}
.novedad ul{margin:0;padding-left:20px;display:grid;gap:5px;font-size:14px;line-height:1.5}
.tuto-lista{display:grid;gap:8px;max-width:820px}
.tuto{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius-sm,10px)}
.tuto summary{display:flex;align-items:center;gap:12px;padding:13px 16px;cursor:pointer;font-weight:600;font-size:14.5px;list-style:none}
.tuto summary::-webkit-details-marker{display:none}
.tuto summary>i:first-child{width:20px;text-align:center;color:var(--gris-text);flex:none}
.tuto summary>span{flex:1;min-width:0}
.tuto-chev{font-size:12px;color:var(--gris-text);transition:transform .15s}
.tuto[open] .tuto-chev{transform:rotate(180deg)}
.tuto-cuerpo{padding:0 16px 16px 48px;font-size:14px;line-height:1.55}
.tuto-cuerpo ol{margin:0 0 12px;padding-left:20px;display:grid;gap:6px}
.tuto-cuerpo p{margin:0}
@media (max-width:760px){.tuto-cuerpo{padding-left:16px}}
.home-grupo:first-of-type{margin-top:22px}
#home-kpis{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}
.dot-verde{background:var(--verde)}.dot-amarillo{background:var(--amarillo)}.dot-rojo{background:var(--rojo)}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   DISEÑO v3
   Barra lateral azul marino con títulos de sección en color y subítems apagados, barra superior
   con buscador y accesos (campana, día/noche, ayuda, perfil, salir), tarjetas blancas con íconos
   de color y un banner de bienvenida. El color de marca del centro manda en botones, ítem activo
   y foco; el color de área (verde, naranja, celeste...) ordena el menú y los accesos de Inicio.
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
body{font-family:'Inter',-apple-system,'Segoe UI',sans-serif;line-height:1.5;font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--acento);outline-offset:2px}

/* Barra superior */
.topbar{height:var(--header-h);background:var(--blanco);border-bottom:1px solid var(--gris-border)}
.topbar-brand{background:var(--sidebar-bg);padding:0 16px;gap:12px;border-bottom:1px solid rgba(255,255,255,.06)}
.brand-name{color:#fff;font-size:15px;font-weight:700;letter-spacing:-.01em}
.brand-sub{color:#94A3B8;font-size:12px;font-weight:400}
.topbar-content{padding:0 24px;gap:16px}
.busqueda-global{position:relative;flex:1;max-width:440px}
.busqueda-global>i{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--gris-text-dim);font-size:13px;pointer-events:none}
.busqueda-global input{width:100%;padding:9px 12px 9px 36px;background:var(--gris-bg);border:1px solid var(--gris-border);border-radius:var(--radius-sm);font:inherit;font-size:var(--text-sm);color:var(--texto);outline:none}
.busqueda-global input:focus{border-color:var(--acento);box-shadow:0 0 0 3px var(--acento-foco);background:var(--blanco)}
.busqueda-res,.notif-menu{position:absolute;top:calc(100% + 8px);background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);box-shadow:var(--shadow);z-index:300;overflow:hidden}
.busqueda-res{left:0;right:0;max-height:360px;overflow-y:auto}
.busqueda-item{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:11px 16px;border:none;border-bottom:1px solid var(--gris-border);background:none;color:var(--texto);font:inherit;font-size:var(--text-sm);font-weight:500;text-align:left;cursor:pointer}
.busqueda-item:last-child{border-bottom:none}
.busqueda-item:hover{background:var(--gris-bg)}
.busqueda-sub{display:flex;gap:4px;flex-shrink:0}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:2px}
.notif-wrap{position:relative}
.tb-btn{position:relative;width:40px;height:40px;border:none;background:transparent;border-radius:var(--radius-sm);color:var(--gris-text);cursor:pointer;font-size:17px;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s}
.tb-btn:hover{background:var(--gris-bg);color:var(--texto)}
.tb-salir:hover{background:var(--rojo-claro);color:var(--rojo)}
.tb-badge{position:absolute;top:3px;right:2px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#DC2626;color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid var(--blanco)}
.tb-avatar{width:30px;height:30px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--acento);color:var(--sobre-acento);font-size:12px;font-weight:700}
.tb-avatar img,.perfil-avatar img{width:100%;height:100%;object-fit:cover}
.tb-avatar i{font-size:13px}
.notif-menu{right:0;width:340px}
.notif-titulo{padding:14px 16px;font-weight:700;font-size:var(--text-sm);border-bottom:1px solid var(--gris-border)}
.notif-item{display:flex;align-items:center;gap:12px;width:100%;padding:13px 16px;border:none;border-bottom:1px solid var(--gris-border);background:none;color:var(--texto);font:inherit;font-size:var(--text-sm);text-align:left;cursor:pointer}
.notif-item:last-child{border-bottom:none}
.notif-item:hover{background:var(--gris-bg)}
.notif-ico{width:20px;text-align:center;flex-shrink:0}
.notif-vacio{padding:22px 16px;text-align:center;color:var(--gris-text);font-size:var(--text-sm)}

/* Barra lateral */
.sidebar{background:var(--sidebar-bg);border-right:none;padding:12px 12px 32px}
.nav-item{display:flex;align-items:center;gap:12px;padding:10px 12px;margin:2px 0;border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:500;color:#E2E8F0;transition:background .12s,color .12s}
.nav-item i{display:inline-block;width:20px;text-align:center;font-size:15px;color:#94A3B8}
.nav-item:hover{background:rgba(255,255,255,.06);color:#fff}
.nav-item.active{background:color-mix(in srgb,var(--acento) 30%,#0F172A);color:#fff;font-weight:600}
.nav-item.active i{color:#fff}
/* Títulos de sección: texto claro e ícono del color del área */
.nav-section{display:flex;align-items:center;gap:12px;margin:20px 0 4px;padding:9px 12px;border-radius:var(--radius-sm);font-family:inherit;font-size:var(--text-sm);font-weight:600;letter-spacing:0;text-transform:none;color:#F1F5F9;cursor:pointer}
.nav-section:hover{background:rgba(255,255,255,.05);color:#fff}
.nav-sec-ico{display:flex;width:20px;height:auto;background:none;align-items:center;justify-content:center;font-size:15px;color:#C3CBD9}  /* íconos del menú sin color por área: más sobrio; el color queda para la marca y los estados */
.nav-sec-chev{margin-left:auto;font-size:11px;color:#64748B}
/* Subítems (todo lo que cuelga de un título): misma letra, tono apagado, sin ícono */
.nav-section ~ .nav-item{padding:7px 12px 7px 44px;margin:1px 0;font-size:var(--text-xs);font-weight:400;color:#94A3B8}
.nav-section ~ .nav-item i{display:none}
.nav-section ~ .nav-item:hover{background:rgba(255,255,255,.04);color:#fff}
.nav-section ~ .nav-item.active{background:rgba(255,255,255,.08);color:#fff;font-weight:600;box-shadow:inset 3px 0 0 var(--acento)}
.nav-badge{font-size:11px;padding:1px 7px}

/* Contenido */
.content{padding:28px 32px 56px;background:var(--app-bg)}
.page-header{margin-bottom:24px}
.page-title{font-size:var(--text-2xl);font-weight:700;letter-spacing:-.025em;line-height:1.2}
.page-sub{font-size:var(--text-sm);margin-top:4px}
.stats-row,.cobros-kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.panel-card,.cobro-card,.table-wrap,.mini-cal,.pac-filtros,.turno-card,.hc-sesion,.gym-alumnos-panel,.gym-rutina-panel,.gym-horario-card,.caja-card{box-shadow:var(--shadow-sm)}
.panel-card-title,.cobro-title{font-size:var(--text-md);font-weight:700;letter-spacing:-.01em}

/* Tablas, botones y campos */
.paciente-table th,.rutina-table th{padding:12px 16px;background:var(--gris-bg);font-size:var(--text-2xs);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--gris-text)}
.paciente-table td{padding:14px 16px}
.btn{padding:9px 16px;font-weight:600}
.btn-outline{border-color:var(--gris-border-strong)}
.btn-sm{padding:6px 12px}
.btn-peligro{color:var(--rojo);border-color:color-mix(in srgb,var(--rojo) 40%,transparent)}
.btn-peligro:hover{background:var(--rojo-claro)}
.field-input,.field-select,.search-input,.login-input{padding:10px 12px;border-radius:var(--radius-sm)}
.search-wrap .search-input{padding-left:38px}
.search-icon{left:13px}
.tab{padding:11px 18px}
.prof-chip{border-radius:var(--radius-sm)}
.prof-chip.active{background:var(--acento);color:var(--sobre-acento);border-color:var(--acento)}
.modal{border-radius:12px}

/* Etiquetas de estado: fondo suave y esquinas casi rectas */
.estado-badge,.badge,.badge-estado,.tipo-chip,.os-chip,.prof-tag,.turno-os,.hc-num{border-radius:4px;font-weight:600}
.toast{background:var(--texto);color:var(--blanco);border:none;border-radius:var(--radius-sm);box-shadow:var(--shadow);bottom:24px;right:24px}

/* Inicio */
.home-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:32px 36px;margin-bottom:20px;border-radius:14px;color:#fff;
  background:radial-gradient(120% 160% at 100% 0%,color-mix(in srgb,var(--acento) 70%,#0F172A) 0%,transparent 60%),#0F172A}
.home-eyebrow{font-size:var(--text-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.home-hola{font-size:var(--text-3xl);font-weight:700;letter-spacing:-.03em;line-height:1.1;margin-top:8px}
.home-resumen{font-size:var(--text-md);color:rgba(255,255,255,.78);margin-top:8px}
.home-grupo{margin-top:28px}
.home-grupo-titulo{display:flex;align-items:center;gap:10px;font-size:var(--text-sm);font-weight:700;color:var(--texto);margin-bottom:12px}
.home-grupo-titulo::before{content:'';width:4px;height:16px;border-radius:2px;background:var(--g)}
.home-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.home-acceso{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);box-shadow:var(--shadow-sm);color:var(--texto);font:inherit;font-size:var(--text-sm);font-weight:600;text-align:left;cursor:pointer;min-width:0;transition:transform .12s,border-color .12s}
.home-acceso i{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:var(--radius-sm);flex-shrink:0;font-size:14px;color:var(--g);background:color-mix(in srgb,var(--g) 16%,transparent)}
.home-acceso span{line-height:1.25}
.home-acceso:hover{border-color:var(--g);transform:translateY(-1px)}
.home-paneles{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px;margin-top:20px}
.home-paneles:empty{display:none}
.home-panel-cab{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3)}
.home-panel-cab .panel-card-title{margin-bottom:0}
.home-panel-ver{font-size:var(--text-xs);font-weight:600;color:var(--acento-oscuro);text-decoration:none}
.home-panel-vacio{padding:20px 0;color:var(--gris-text);font-size:var(--text-sm)}
.home-fila{display:flex;align-items:center;gap:14px;padding:11px 0;border-top:1px solid var(--gris-border);font-size:var(--text-sm);font-weight:500}
.home-hora{min-width:44px;font-weight:700}
.home-fila-txt{flex:1;min-width:0}
.home-fila-sub{font-size:var(--text-xs);color:var(--gris-text);font-weight:400}
.home-barra{height:6px;border-radius:3px;background:var(--gris-border);margin-top:6px;overflow:hidden}
.home-barra i{display:block;height:100%;border-radius:3px}
.home-cupo{font-size:var(--text-xs);font-weight:700;color:var(--gris-text);min-width:38px;text-align:right}

/* Perfil */
.perfil-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:16px;max-width:1040px}
.perfil-foto{display:flex;align-items:center;gap:18px;margin-bottom:22px}
.perfil-avatar{width:84px;height:84px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--acento);color:var(--sobre-acento);font-size:28px;font-weight:700;flex-shrink:0}
.perfil-ayuda{font-size:var(--text-xs);color:var(--gris-text);margin-top:6px}
.perfil-check{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:var(--text-sm);font-weight:500;cursor:pointer}
@media (max-width:900px){.perfil-grid{grid-template-columns:1fr}}

@media (max-width:760px){
  .brand-name{color:var(--texto)}.brand-sub{color:var(--gris-text)}
  .topbar-brand{background:transparent;width:auto;padding:0 12px;border-bottom:none}
  .busqueda-global{display:none!important}
  .topbar-content{padding:0 8px}
  .tb-btn{width:36px;height:36px}
  .tb-btn:nth-child(3){display:none}
  .content{padding:20px 16px 48px}
  .home-hero{padding:24px 22px}
  .notif-menu{position:fixed;left:12px;right:12px;top:68px;width:auto}
}

#home-kpis{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-thumb{background:#334155;border-radius:3px}



/* Accesos rápidos de Inicio: una fila compacta */

.home-accesos-titulo{font-size:var(--text-sm);font-weight:700;margin:24px 0 12px}

.home-chips{display:flex;flex-wrap:wrap;gap:10px}

.home-chips .home-acceso{padding:8px 16px 8px 8px;gap:10px;border-radius:var(--radius-sm)}

.home-chips .home-acceso i{width:30px;height:30px}



/* Ventanas: fondo desenfocado y botón de cerrar bien visible; la ficha de la persona es más ancha */

.modal-overlay{background:rgba(15,23,42,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}

.modal-close{width:38px;height:38px;font-size:18px;background:var(--gris-bg);color:var(--texto)}

.modal-close:hover{background:var(--rojo-claro);color:var(--rojo)}

#modal-paciente .modal{width:960px}

#modal-pac-footer{flex-wrap:wrap}



/* Ayuda: soporte por WhatsApp */

.soporte-card{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:20px 24px;margin-bottom:16px;max-width:820px;background:var(--blanco);border:1px solid var(--gris-border);border-left:4px solid #22C55E;border-radius:var(--radius);box-shadow:var(--shadow-sm)}

.soporte-titulo{font-weight:700;font-size:var(--text-md)}

.soporte-sub{font-size:var(--text-sm);color:var(--gris-text);margin-top:2px}

/* Ventanas: encabezado y botones siempre a la vista; solo el contenido se desplaza */
.modal{display:flex;flex-direction:column;overflow:hidden}
.modal-header,.modal-footer{flex-shrink:0}
.modal-body{overflow-y:auto;min-height:0}
#modal-pac-footer{justify-content:flex-end}

/* Pacientes: sesiones restantes con títulos legibles */
.pac-ses{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:var(--text-xs);color:var(--gris-text)}
.pac-ses-t{font-weight:600;color:var(--texto)}
.pac-ses label{display:flex;align-items:center;gap:6px}
.pac-filtros .pac-ses input{width:88px}



/* Cajas: filtros, anulados y acciones por movimiento */

.caja-filtros{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}

.caja-filtros .field-select{width:auto;min-width:170px}

.mov-sub{font-size:var(--text-xs);color:var(--gris-text);margin-top:2px}

.mov-sub-anulado{color:var(--rojo)}

.mov-anulado td{opacity:.62}

.mov-anulado .mov-desc,.mov-anulado td:nth-child(5),.mov-anulado td:nth-child(6){text-decoration:line-through}

.mov-anulado .mov-sub,.mov-anulado .badge{text-decoration:none}

.mov-acciones{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}

.mov-origen-nota{font-size:var(--text-xs);color:var(--gris-text-dim);white-space:nowrap}

.mov-pie{margin-top:10px;font-size:var(--text-xs);color:var(--gris-text)}

.hist-item{padding:12px 0;border-bottom:1px solid var(--gris-border)}

.hist-item:last-child{border-bottom:none}

.hist-cab{font-size:var(--text-xs);color:var(--gris-text);margin-bottom:6px;font-weight:600}

.hist-cambio{font-size:var(--text-sm);margin-top:3px}

.hist-antes{color:var(--gris-text);text-decoration:line-through}
.table-wrap{overflow-x:auto}
/* Pantallas: ajustes de la pasada pantalla por pantalla */

.pac-filtros .field-select{width:auto;flex:1 1 170px}

.btn-checkin{background:var(--blanco);color:var(--texto);border:1px solid var(--gris-border-strong);border-radius:var(--radius-sm);font-weight:500;padding:7px 12px}

.btn-checkin:hover{background:var(--gris-bg);color:var(--texto)}

.btn-checkin.ci-primario{background:var(--acento);color:var(--sobre-acento);border-color:var(--acento);font-weight:600}

.btn-checkin.ci-primario:hover{background:var(--acento-h);color:var(--sobre-acento)}

.btn-checkin.ci-peligro{color:var(--rojo)}

.btn-checkin.ci-peligro:hover{background:var(--rojo-claro);color:var(--rojo)}

.login-wrap{background:radial-gradient(90% 120% at 0% 0%,color-mix(in srgb,var(--acento) 45%,#0F172A) 0%,transparent 55%),#0F172A}

.login-card{border:none;border-radius:14px;box-shadow:var(--shadow)}


/* ── Ingreso con la marca Kynexo ─────────────────────────── */
/* Antes de iniciar sesión todavía no se sabe de qué centro es la persona: se muestra la marca del producto.
   El naranja vale solo para esta pantalla; al entrar, la app usa el color de cada centro. */
.login-wrap{--acento:#FF4D1A;--sobre-acento:#111111;
  --acento-h:color-mix(in srgb,var(--acento) 88%,#ffffff);--acento-oscuro:color-mix(in srgb,var(--acento) 62%,#ffffff);--acento-foco:color-mix(in srgb,var(--acento) 30%,transparent)}
:root[data-theme="light"] .login-wrap{--acento-h:color-mix(in srgb,var(--acento) 86%,#000000);--acento-oscuro:color-mix(in srgb,var(--acento) 78%,#000000);--acento-foco:color-mix(in srgb,var(--acento) 24%,transparent)}
.login-kynexo{height:30px;width:auto;max-width:100%}
.login-marca{margin-bottom:22px}
.lk-claro{display:none}.lk-oscuro{display:block}
:root[data-theme="light"] .lk-claro{display:block}:root[data-theme="light"] .lk-oscuro{display:none}
.login-btn{font-weight:700}

/* Importar socios: casillas de disciplinas */
.imp-discs{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.imp-disc{display:flex;align-items:center;gap:8px;border:1.5px solid var(--gris-border);border-radius:99px;padding:6px 14px 6px 10px;cursor:pointer;background:var(--blanco)}
.imp-disc input{width:16px;height:16px;accent-color:var(--acento)}

/* Datos que dependen de la disciplina elegida (alta y edición de personas) */
[data-dato][hidden]{display:none!important}
/* Disciplinas: grupos del menú, pestañas de horarios y franja de filtro */
.nav-fuera{display:none!important}
.disc-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.disc-tab{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--gris-border);background:var(--blanco);color:var(--texto);font:inherit;font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:border-color .15s,background .15s}
.disc-tab i{color:var(--dc)}
.disc-tab:hover{border-color:var(--dc)}
.disc-tab.active{border-color:var(--dc);background:color-mix(in srgb,var(--dc) 14%,var(--blanco))}
.disc-filtro{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;margin-bottom:14px;border:1px solid var(--gris-border);border-radius:var(--radius-sm,10px);background:var(--blanco);font-size:var(--text-sm)}
.disc-filtro .btn{margin-left:auto}
.disc-filtro-ico{width:28px;height:28px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;color:var(--dc);background:color-mix(in srgb,var(--dc) 16%,transparent)}
.ci-opciones{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.ci-opcion{justify-content:center;font-size:var(--text-base);padding:14px}
.alert[hidden]{display:none!important}
@media (max-width:640px){.view.active{padding-bottom:84px}}
.gym-cell-sin{background:transparent}
.gym-cal-sin{font-size:12px;color:var(--gris-text-dim, var(--gris-text));font-weight:500}
.gym-cell-sin .gym-cal-add-btn{opacity:.55}
.gym-cell-sin:hover .gym-cal-add-btn{opacity:1}
/* ── Configuración guiada (configuracion-guiada.js) ── */
.cg-overlay{position:fixed;inset:0;z-index:400;background:rgba(15,23,42,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:16px}
.cg-overlay.open{display:flex}
.cg-caja{background:var(--blanco);border-radius:16px;box-shadow:0 24px 60px rgba(15,23,42,.28);width:560px;max-width:100%;max-height:calc(100vh - 32px);display:flex;flex-direction:column;overflow:hidden}
.cg-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 22px 0}
.cg-puntos{display:flex;align-items:center;gap:6px}
.cg-puntos span:not(.cg-paso-txt){width:22px;height:5px;border-radius:99px;background:var(--gris-border)}
.cg-puntos span.hecho{background:color-mix(in srgb,var(--acento) 45%,transparent)}
.cg-puntos span.actual{background:var(--acento);width:34px}
.cg-paso-txt{font-size:12px;color:var(--gris-text);margin-left:6px}
.cg-omitir{background:none;border:0;color:var(--gris-text);font-size:13px;cursor:pointer;padding:8px 4px;text-decoration:underline;text-underline-offset:3px}
.cg-cuerpo{padding:18px 22px 8px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}
.cg-cuerpo h2{font-size:22px;line-height:1.25;margin:0;font-weight:800;letter-spacing:-.01em}
.cg-sub{margin:-6px 0 2px;color:var(--gris-text);font-size:14.5px;line-height:1.5}
.cg-opc{font-weight:400;color:var(--gris-text)}
.cg-ico{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-size:24px;background:color-mix(in srgb,var(--acento) 12%,transparent);color:var(--acento)}
.cg-ico.ok{background:var(--verde-claro);color:var(--verde-oscuro)}
.cg-pie{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 22px 18px;border-top:1px solid var(--gris-border)}
.cg-logo-fila{display:flex;align-items:center;gap:12px}
.cg-logo{width:56px;height:56px;border-radius:14px;overflow:hidden;border:1px solid var(--gris-border);display:grid;place-items:center}
.cg-logo img{width:100%;height:100%;object-fit:contain}
.cg-logo span{width:100%;height:100%;display:grid;place-items:center;font-weight:800;font-size:18px}
.cg-chips{display:flex;flex-wrap:wrap;gap:8px}
.cg-chip{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:8px 14px;border-radius:99px;border:1.5px solid var(--gris-border);background:var(--blanco);color:inherit;font:inherit;font-size:14px;cursor:pointer;transition:border-color .15s,background .15s}
.cg-chip i:first-child{color:var(--dc,var(--gris-text))}
.cg-chip:hover{border-color:var(--dc,var(--acento))}
.cg-chip.sel{border-color:var(--dc,var(--acento));background:color-mix(in srgb,var(--dc,var(--acento)) 12%,transparent);font-weight:600}
.cg-otra{display:flex;gap:8px;flex-wrap:wrap}
.cg-otra .field-input{flex:1 1 160px;min-width:0}
.cg-opciones{display:flex;flex-direction:column;gap:10px}
.cg-opcion{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1.5px solid var(--gris-border);border-radius:12px;cursor:pointer}
.cg-opcion:has(input:checked){border-color:var(--acento);background:color-mix(in srgb,var(--acento) 7%,transparent)}
.cg-opcion input{margin-top:3px;accent-color:var(--acento)}
.cg-opcion span{display:flex;flex-direction:column;gap:3px}
.cg-opcion small{color:var(--gris-text);font-size:13px;line-height:1.45}
.cg-siguientes{display:flex;flex-direction:column;gap:8px}
.cg-sig{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:13px 14px;border:1px solid var(--gris-border);border-radius:12px;background:var(--blanco);color:inherit;font:inherit;font-size:14.5px;cursor:pointer}
.cg-sig:hover{border-color:var(--acento)}
.cg-sig i:first-child{color:var(--acento);width:20px;text-align:center}
.cg-sig span{flex:1}
.cg-sig i:last-child{color:var(--gris-text);font-size:12px}
@media (max-width:640px){.cg-overlay{padding:0;align-items:flex-end}.cg-caja{border-radius:16px 16px 0 0;max-height:94vh}.cg-cuerpo h2{font-size:20px}}
/* ── Verificación en dos pasos ── */
.login-mfa-ayuda{font-size:13px;line-height:1.45;opacity:.75;margin-top:8px}
.perfil-mfa{margin-top:12px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.perfil-mfa-ok{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--verde-oscuro)}
.perfil-mfa-alta{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--gris-border);border-radius:12px;width:100%}
.perfil-mfa-qr{width:180px;height:180px;background:#fff;border-radius:8px;padding:6px}
.perfil-mfa-alta code{font-size:12px;word-break:break-all;background:var(--gris-claro,rgba(0,0,0,.05));padding:2px 6px;border-radius:4px}
.gym-cell-prof{font-size:11px;color:var(--gris-text);margin:-2px 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wod-card{background:var(--blanco);border:1px solid var(--gris-border);border-left:4px solid var(--acento);border-radius:var(--radius);padding:14px 16px;margin:0 0 14px}
.wod-vacio{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;color:var(--gris-text);font-size:14px;border-left-color:var(--gris-border)}
.wod-cab{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap}
.wod-kicker{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gris-text)}
.wod-titulo{font-size:18px;font-weight:800;margin-top:2px}
.wod-detalle{white-space:pre-wrap;font-size:14px;margin-top:8px;line-height:1.5}
.wod-ranking{margin-top:10px;border-top:1px solid var(--gris-border);padding-top:8px}
.wod-fila{display:grid;grid-template-columns:28px 1fr auto 28px;gap:8px;align-items:center;padding:4px 0;font-size:14px}
.wod-res{font-weight:700}
.gym-lugar{margin-left:auto;margin-right:6px;border:1px dashed var(--gris-border);background:none;color:var(--gris-text);border-radius:6px;font-size:12px;padding:2px 6px;cursor:pointer}
.plan-banda{display:flex;gap:8px;align-items:center;font-size:14px;padding:8px 12px;border-radius:var(--radius-sm);background:var(--gris-bg);border:1px solid var(--gris-border);margin-bottom:12px;color:var(--texto)}
.plan-banda.cerca{background:var(--amarillo-claro);border-color:var(--amarillo);color:var(--amarillo-oscuro)}
.plan-banda.lleno{background:var(--rojo-claro, #fee2e2);border-color:var(--rojo);color:var(--rojo)}
.gym-chip-res{border-style:dashed!important;background:transparent!important}
td[data-hid]{cursor:grab}.gym-arrastrando{opacity:.4}.gym-destino{outline:2px dashed var(--acento);outline-offset:-3px;background:var(--acento-claro)!important}
.fr-grid{display:grid;grid-template-columns:44px repeat(7,1fr);gap:2px;user-select:none;touch-action:none;max-height:60vh;overflow:auto}
.fr-dia{font-size:12px;font-weight:700;text-align:center;color:var(--gris-text);position:sticky;top:0;background:var(--blanco);padding:4px 0}
.fr-hora{font-size:11px;color:var(--gris-text);text-align:right;padding-right:4px;line-height:14px}
.fr-c{height:14px;border-radius:3px;background:var(--gris-bg);cursor:pointer;transition:background .12s}
.fr-c.on{background:var(--acento)}
.toast-deshacer{overflow:hidden;padding-right:12px}
.toast-undo{margin-left:10px;border:0;background:none;color:var(--acento);font-weight:700;cursor:pointer;font-size:inherit}
.toast-barra{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--acento);transform-origin:left;animation:toast-cuenta linear forwards}
@keyframes toast-cuenta{to{transform:scaleX(0)}}
.busqueda-tit{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gris-text);padding:8px 12px 4px}
/* Cargas con esqueleto: el circulito de "cargando" se reemplaza por renglones grises que brillan. */
.empty:has(> .spinner-dark:only-child){padding:16px 0;display:block;text-align:left}
.empty > .spinner-dark:only-child{display:block;width:100%!important;height:150px!important;border:0!important;border-radius:0!important;animation:esq-brillo 1.4s ease-in-out infinite!important;
  background:
    linear-gradient(var(--gris-bg),var(--gris-bg)) 0 0/60% 16px no-repeat,
    linear-gradient(var(--gris-bg),var(--gris-bg)) 0 34px/100% 44px no-repeat,
    linear-gradient(var(--gris-bg),var(--gris-bg)) 0 90px/100% 44px no-repeat;opacity:.9}
@keyframes esq-brillo{50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){.empty > .spinner-dark:only-child{animation:none!important}}
.toast.toast-deshacer{left:50%;right:auto;transform:translateX(-50%);animation:none}
.barra-acciones{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:300;display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--blanco);border:1px solid var(--gris-border-strong);border-radius:14px;padding:10px 14px;box-shadow:0 12px 30px rgba(0,0,0,.35);animation:sube-barra .25s cubic-bezier(.2,.8,.2,1);max-width:calc(100vw - 32px)}
@keyframes sube-barra{from{transform:translate(-50%,30px);opacity:0}}
.notif-tabs{display:flex;gap:4px;padding:0 10px 6px;border-bottom:1px solid var(--gris-border)}
.notif-tabs button{flex:1;border:0;background:none;padding:6px;border-radius:8px;font-size:13px;font-weight:600;color:var(--gris-text);cursor:pointer}
.notif-tabs button.on{background:var(--acento-claro);color:var(--texto)}
.notif-tabs button span{background:var(--acento);color:#fff;border-radius:99px;padding:0 6px;font-size:11px;margin-left:4px}
.matriz-perm th span{display:inline-block;writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;max-height:140px;white-space:nowrap}
.mini-switch{position:relative;display:inline-block;width:34px;height:20px;cursor:pointer}
.mini-switch input{opacity:0;width:0;height:0;position:absolute}
.mini-switch i{position:absolute;inset:0;border-radius:99px;background:var(--gris-border-strong);transition:background .2s}
.mini-switch i::after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
.mini-switch input:checked + i{background:var(--acento)}.mini-switch input:checked + i::after{transform:translateX(14px)}
.mini-switch input:disabled + i{opacity:.35;cursor:not-allowed}
.mini-switch input:focus-visible + i{outline:2px solid var(--acento);outline-offset:2px}
.gastos-graf{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.gasto-arco{opacity:0;animation:aparece-arco .5s ease forwards}@keyframes aparece-arco{to{opacity:1}}
.gastos-ley{display:grid;gap:4px;flex:1;min-width:220px}
.gastos-ley button{display:grid;grid-template-columns:12px 1fr auto 40px;gap:8px;align-items:center;border:0;background:none;padding:5px 6px;border-radius:8px;cursor:pointer;color:var(--texto);font-size:14px;text-align:left}
.gastos-ley button:hover{background:var(--gris-bg)}.gastos-ley i{width:12px;height:12px;border-radius:3px}.gastos-ley small{color:var(--gris-text);text-align:right}
#ky-tour{position:fixed;inset:0;z-index:5000}
.tour-foco{position:fixed;border-radius:12px;box-shadow:0 0 0 9999px rgba(10,12,20,.62);transition:all .35s cubic-bezier(.2,.8,.2,1);pointer-events:none;outline:2px solid var(--acento)}
.tour-globo{position:fixed;width:320px;background:var(--blanco);color:var(--texto);border-radius:14px;padding:14px 16px;box-shadow:0 20px 40px rgba(0,0,0,.35);transition:all .35s cubic-bezier(.2,.8,.2,1)}
.tour-globo p{font-size:14px;color:var(--gris-text);margin:6px 0 12px}
.tour-n{font-size:12px;color:var(--gris-text);margin-bottom:2px}
.tour-btns{display:flex;gap:6px;justify-content:flex-end}
@media (prefers-reduced-motion:reduce){.tour-foco,.tour-globo{transition:none}}
.bal-graficos{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin:14px 0}
.bal-barra{transform-box:fill-box;transform-origin:bottom;animation:bal-sube .6s cubic-bezier(.2,.8,.2,1) both}
@keyframes bal-sube{from{transform:scaleY(0)}}
.bal-ley{font-size:12px;font-weight:500;color:var(--gris-text);margin-left:8px}.bal-ley i{display:inline-block;width:9px;height:9px;border-radius:2px;margin:0 4px 0 8px}
@media (prefers-reduced-motion:reduce){.bal-barra{animation:none}}
.card{background:var(--blanco);border:1px solid var(--gris-border);border-radius:var(--radius);padding:var(--space-5);box-shadow:var(--shadow-sm)}
.card-title{font-size:var(--text-md);font-weight:700;margin-bottom:8px}
.dash-anillos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:12px 0}
.dash-anillo{display:flex;align-items:center;gap:16px}
.dash-aro{transition:stroke-dashoffset 1.2s cubic-bezier(.2,.8,.2,1)}
@media (prefers-reduced-motion:reduce){.dash-aro{transition:none}}