/* =====================================================================
  ORVEX CMS — Panel de administración
   Sistema de diseño inspirado en Apple: claridad, deferencia y profundidad.
   Blanco como base · esquinas redondeadas · iconos monocromos de línea ·
   control segmentado, interruptores tipo iOS y barras translúcidas.
   (Inspiración de estilo; no usa logotipos, imágenes ni tipografías de Apple.)
  Ver docs/ORVEX-CMS-DISENO.md
   ===================================================================== */
:root{
  --bg:#ffffff;--sup:#ffffff;--sup2:#ffffff;--hover:rgba(0,0,0,.04);
  --tinta:#1d1d1f;--on-tinta:#ffffff;
  --m:#6e6e73;--m2:#6e6e73;
  --b:rgba(0,0,0,.14);--b2:rgba(0,0,0,.09);
  --acento:#2d7df6;--acento-t:#1a63d1;--acento-s:#6ba1f8;
  --a-suave:rgba(45,125,246,.1);--a-borde:rgba(45,125,246,.45);
  /* Estados: legibles sobre blanco */
  --ok:#1d8a45;--ok-f:#e6f6ec;--mal:#c9252d;--mal-f:#fdeceb;--av:#a24f00;--av-f:#fff1dc;--info:#1a63d1;--info-f:#e8f0fe;
  /* Colores de estado (indicadores, gráficos, interruptores) */
  --c-azul:#0a84ff;--c-verde:#30b350;--c-naranja:#ff9500;--c-morado:#af52de;--c-rosa:#ff375f;--c-turq:#32ade6;--c-gris:#8e8e93;
  /* Forma: esquinas redondeadas */
  --r:12px;--r-l:18px;--r-s:8px;
  --f:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --sombra-s:0 1px 2px rgba(0,0,0,.05);
  --sombra-m:0 1px 2px rgba(0,0,0,.04),0 8px 28px -10px rgba(0,0,0,.12);
  --sombra-l:0 24px 64px -16px rgba(0,0,0,.28),0 0 0 .5px rgba(0,0,0,.08);
  --ease:cubic-bezier(.32,.72,0,1);
  --ancho-lat:264px;
  /* Compatibilidad con vistas anteriores */
  --primario:var(--acento);--p-suave:var(--a-suave);--p-borde:var(--a-borde);
  --borde:var(--b);--suave:var(--m);--okf:var(--ok-f);
}
:root[data-tema=oscuro]{
  --bg:#000000;--sup:#1c1c1e;--sup2:#161618;--hover:rgba(235,235,245,.08);
  --tinta:#f5f5f7;--on-tinta:#1d1d1f;
  --m:#a1a1a6;--m2:#8e8e93;
  --b:rgba(235,235,245,.16);--b2:rgba(235,235,245,.09);
  --acento-t:#6ba1f8;
  --a-suave:rgba(45,125,246,.18);
  --ok:#32d74b;--ok-f:rgba(50,215,75,.14);--mal:#ff6961;--mal-f:rgba(255,105,97,.15);--av:#ffb340;--av-f:rgba(255,179,64,.15);--info:#6ba1f8;--info-f:rgba(107,161,248,.16);
  --sombra-m:0 1px 2px rgba(0,0,0,.5),0 8px 28px -10px rgba(0,0,0,.7);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:400 14px/1.55 var(--f);letter-spacing:0;color:var(--tinta);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-variant-numeric:tabular-nums}
body.app{display:grid;grid-template-columns:var(--ancho-lat) minmax(0,1fr);min-height:100vh}
body.solo{display:block;padding:0}
a{color:var(--acento-t);text-decoration:none}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.018em}
h1{font-size:clamp(1.6rem,2.8vw,2rem);line-height:1.2}
h2{font-size:1.2rem;margin-bottom:14px;font-weight:650;letter-spacing:-.018em}
h3{font:600 .8rem/1 var(--f);text-transform:uppercase;letter-spacing:.04em;color:var(--m2);margin:22px 0 10px}
p{margin:0}
.suave{color:var(--m)}
.ic{flex:none;vertical-align:-3px}
kbd{font:500 11px/1 var(--f);background:var(--sup);border:1px solid var(--b);border-bottom-width:2px;border-radius:6px;padding:3px 6px;color:var(--m)}
code{font:500 12px var(--mono);background:var(--hover);padding:2px 7px;border-radius:6px}
:focus-visible{outline:0;box-shadow:0 0 0 4px rgba(45,125,246,.32)}
::selection{background:rgba(45,125,246,.25)}
*{scrollbar-width:thin;scrollbar-color:var(--b) transparent}
.mono{font-family:var(--mono)}
.eyebrow{font:600 .72rem/1 var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--acento-t)}

/* ---------- Iconos en cuadros de color (estilo Ajustes) ---------- */
.ico{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:var(--tinta);flex:none}

/* ---------- Lateral ---------- */
.lateral{background:color-mix(in srgb,var(--bg) 88%,var(--sup));color:var(--m);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:hidden;z-index:40;border-right:1px solid var(--b2);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px)}
.marca{display:flex;align-items:center;gap:12px;padding:20px 20px 14px;color:var(--tinta)}
.orvex-sim{display:block;flex:none}
.marca-t{display:flex;flex-direction:column;min-width:0;line-height:1}
.marca-t strong{font:700 1.15rem/1 var(--f);letter-spacing:.14em;color:var(--tinta)}
.marca-t small{font:600 .7rem/1 var(--f);color:var(--acento-t);margin-top:6px;letter-spacing:.02em}
.tienda-chip{margin:6px 16px 6px;padding:10px 14px;border-radius:var(--r);display:flex;flex-direction:column;gap:3px;background:var(--sup);min-width:0;box-shadow:var(--sombra-s),0 0 0 .5px var(--b)}
.tienda-chip span{font:600 .68rem/1 var(--f);letter-spacing:.05em;text-transform:uppercase;color:var(--m2)}
.tienda-chip b{font-weight:650;font-size:.97rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--tinta)}
.nav{flex:1;overflow-y:auto;padding:6px 12px 14px}
.nav-sec{font:600 .72rem/1 var(--f);letter-spacing:.04em;text-transform:uppercase;color:var(--m2);padding:20px 12px 8px}
.nav a{position:relative;display:flex;align-items:center;gap:11px;padding:6px 10px;border-radius:10px;color:var(--tinta);font-weight:500;font-size:.95rem;margin-bottom:2px;transition:background .2s var(--ease)}
.nav a:hover{background:var(--hover)}
.nav a.on{background:var(--sup);font-weight:650;box-shadow:var(--sombra-s),0 0 0 .5px var(--b)}
.nav a.pronto{opacity:.6}
.nav a em{margin-left:auto;font:600 .66rem/1 var(--f);letter-spacing:.02em;background:var(--hover);padding:4px 8px;border-radius:99px;color:var(--m);font-style:normal}
.lat-pie{padding:12px 16px 16px;display:grid;gap:8px}
.estado-tienda{display:flex;align-items:center;gap:9px;padding:2px 4px;font:500 .82rem/1 var(--f);color:var(--ok)}
.estado-tienda i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--ok-f)}
.lat-ver{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--r);color:var(--tinta);font-size:.9rem;font-weight:500;background:var(--sup);box-shadow:var(--sombra-s),0 0 0 .5px var(--b);transition:background .2s}
.lat-ver:hover{background:var(--hover)}
html.lat-min{--ancho-lat:76px}
html.lat-min .marca-t,html.lat-min .nav-t,html.lat-min .nav a em,html.lat-min .tienda-chip{display:none}
html.lat-min .nav-sec{font-size:0;padding:0;margin:10px 14px;height:1px;background:var(--b2)}
html.lat-min .nav a,html.lat-min .lat-ver,html.lat-min .estado-tienda{justify-content:center;padding-inline:0}
html.lat-min .marca{justify-content:center;padding-inline:0}
[data-tip]{position:relative}
html.lat-min .lateral [data-tip]:hover::after,.barra [data-tip]:hover::after{content:attr(data-tip);position:absolute;white-space:nowrap;background:var(--tinta);color:var(--on-tinta);font:500 .78rem var(--f);padding:6px 11px;border-radius:8px;z-index:80;pointer-events:none}
html.lat-min .lateral [data-tip]:hover::after{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}
.barra [data-tip]:hover::after{top:calc(100% + 8px);right:0}

/* ---------- Barra superior ---------- */
.principal{min-width:0}
.barra{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:14px;height:60px;padding:0 clamp(16px,2.4vw,32px);background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);border-bottom:1px solid var(--b2)}
.icon-btn{width:36px;height:36px;border-radius:10px;border:0;background:none;color:var(--m);display:grid;place-items:center;cursor:pointer;transition:background .2s var(--ease),color .2s}
.icon-btn:hover{background:var(--hover);color:var(--tinta)}
.solo-movil{display:none}
.migas{display:flex;align-items:center;gap:8px;font:500 .92rem/1 var(--f);color:var(--m2);min-width:0;white-space:nowrap}
.migas a{color:var(--m2)}.migas a:hover{color:var(--tinta)}.migas span{color:var(--tinta);font-weight:650}.migas .ic{opacity:.5}
.cmd-trigger{margin-left:auto;display:flex;align-items:center;gap:10px;min-width:270px;height:36px;padding:0 8px 0 12px;border:0;border-radius:10px;background:var(--hover);color:var(--m2);cursor:pointer;font:500 .92rem var(--f);transition:background .2s}
.cmd-trigger:hover{background:rgba(60,60,67,.12)}
.cmd-trigger span{flex:1;text-align:left}
.barra-der{display:flex;align-items:center;gap:4px}
.i-sol{display:none}:root[data-tema=oscuro] .i-sol{display:inline-grid}:root[data-tema=oscuro] .i-luna{display:none}
.usu-btn{display:flex;align-items:center;gap:10px;height:40px;padding:0 10px 0 4px;border:0;border-radius:99px;background:none;cursor:pointer;color:var(--m);font:inherit;transition:background .2s}
.usu-btn:hover,.menu-usu.on .usu-btn{background:var(--hover)}
.avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(180deg,#a8adb8,#7d818c);color:#fff;display:grid;place-items:center;font:600 .85rem var(--f);flex:none}
.usu-txt{display:flex;flex-direction:column;text-align:left;line-height:1.15}
.usu-txt strong{color:var(--tinta);font-size:.9rem;font-weight:600}.usu-txt small{font:500 .72rem/1.3 var(--f);color:var(--m2)}
.menu-usu{position:relative}
.desplegable{position:absolute;right:0;top:calc(100% + 8px);min-width:240px;background:color-mix(in srgb,var(--sup) 92%,transparent);backdrop-filter:blur(24px);border-radius:14px;padding:6px;box-shadow:var(--sombra-l);opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top right;pointer-events:none;transition:opacity .2s,transform .25s var(--ease)}
.menu-usu.on .desplegable{opacity:1;transform:none;pointer-events:auto}
.desp-cab{padding:10px 12px 12px;border-bottom:1px solid var(--b2);margin-bottom:6px;display:flex;flex-direction:column}.desp-cab small{color:var(--m)}
.desplegable a,.desplegable button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border-radius:9px;border:0;background:none;color:var(--tinta);font:500 .92rem var(--f);cursor:pointer;text-align:left}
.desplegable a:hover,.desplegable button:hover{background:var(--acento);color:#fff}
.desplegable form{margin:0}

main{padding:clamp(20px,3vw,40px);max-width:1360px}

/* ---------- Encabezado de página ---------- */
.encabezado{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:26px}
.encabezado p{margin-top:6px;color:var(--m);font-size:1rem}
.encabezado .acciones{display:flex;gap:8px}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border:0;border-radius:var(--r);background:var(--sup);color:var(--tinta);font:600 .92rem var(--f);letter-spacing:-.011em;cursor:pointer;box-shadow:var(--sombra-s),0 0 0 .5px var(--b);transition:background .2s var(--ease),transform .15s var(--ease),box-shadow .2s;white-space:nowrap}
.btn:hover{background:var(--hover)}
.btn:active{transform:scale(.97)}
.btn.primario{background:var(--tinta);color:var(--on-tinta);box-shadow:none}
.btn.primario:hover{background:color-mix(in srgb,var(--tinta) 82%,var(--acento))}
.btn.azul{background:var(--acento);color:#fff;box-shadow:none}.btn.azul:hover{background:var(--acento-s)}
.btn.peligro{color:var(--mal)}.btn.peligro:hover{background:var(--mal-f)}
.btn.peligro-s{background:var(--mal);color:#fff;box-shadow:none}
.btn.chico{height:32px;padding:0 13px;font-size:.85rem;border-radius:10px}
.btn.icono{width:32px;padding:0}
.btn:disabled{opacity:.45;cursor:not-allowed}

/* ---------- Tarjetas y KPIs ---------- */
.tarjeta{background:var(--sup);border-radius:var(--r-l);padding:22px;box-shadow:var(--sombra-s),0 0 0 .5px var(--b2)}
.tarjeta.tabla{padding:0;overflow-x:auto;overflow-y:hidden}
.tarjeta-cab{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.tarjeta-cab h2{margin:0}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:16px}
.kpi{position:relative;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--sombra-m)}
.kpi small{display:flex;align-items:center;gap:10px;font:600 .88rem/1.2 var(--f);color:var(--m)}
.kpi-i{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:var(--tinta);flex:none}
.kpi b{display:block;font:700 clamp(1.8rem,2.6vw,2.2rem)/1.08 var(--f);margin:14px 0 8px;letter-spacing:-.035em}
.kpi span.pie{font-size:.88rem;color:var(--m);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.delta{display:inline-flex;align-items:center;gap:3px;font:650 .76rem/1 var(--f);padding:4px 8px;border-radius:99px}
.delta.up{background:var(--ok-f);color:var(--ok)}.delta.down{background:var(--mal-f);color:var(--mal)}.delta.igual{background:var(--hover);color:var(--m)}
.kpi .spark{position:absolute;bottom:16px;right:18px;width:84px;height:32px;color:var(--acento)}
.kpi.accion{display:grid;place-items:center;background:linear-gradient(135deg,var(--a-suave),transparent 70%),var(--sup)}

/* ---------- Tablas ---------- */
table{width:100%;border-collapse:collapse}
th{font:600 .78rem/1 var(--f);letter-spacing:.01em;color:var(--m2);text-align:left;padding:14px 16px;background:var(--sup2);border-bottom:1px solid var(--b2);white-space:nowrap}
td{padding:13px 16px;border-bottom:1px solid var(--b2);vertical-align:middle}
tbody tr{transition:background .15s}tbody tr:hover{background:var(--sup2)}
tbody tr:last-child td{border-bottom:0}
tr.sel{background:var(--a-suave)!important}
.compacta td{padding-top:6px;padding-bottom:6px}
.der{text-align:right;white-space:nowrap}
.prod{display:flex;gap:12px;align-items:center;min-width:220px}
.prod img,.prod .sinfoto{width:44px;height:52px;border-radius:10px;object-fit:cover;background:var(--hover);flex:none;box-shadow:0 0 0 .5px var(--b)}
.compacta .prod img,.compacta .prod .sinfoto{width:32px;height:38px;border-radius:8px}
.prod b{display:block;font-weight:600}.prod small{color:var(--m2);font-size:.78rem}
.acc-fila{display:inline-flex;gap:6px;align-items:center}
.chk,input.chk{appearance:none;width:20px;height:20px;padding:0;margin:0;border:1.5px solid var(--m2);border-radius:50%;background:var(--sup);cursor:pointer;display:inline-grid;place-items:center;transition:background .15s,border-color .15s;vertical-align:middle;flex:none}
.chk:hover{border-color:var(--acento)}
.chk:checked,.chk:indeterminate{background:var(--acento);border-color:var(--acento)}
.chk:checked::after{content:"";width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translate(1px,-1px)}
.chk:indeterminate::after{content:"";width:9px;height:2px;border-radius:2px;background:#fff}

/* ---------- Etiquetas de estado ---------- */
.chip{display:inline-flex;align-items:center;gap:6px;font:600 .78rem/1 var(--f);padding:5px 10px;border-radius:99px;background:var(--hover);color:var(--m);border:0}
.chip.ok{background:var(--ok-f);color:var(--ok)}.chip.mal{background:var(--mal-f);color:var(--mal)}.chip.aviso{background:var(--av-f);color:var(--av)}.chip.info{background:var(--info-f);color:var(--info)}
.chip.punto::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
button.chip{cursor:pointer;transition:filter .15s}button.chip:hover{filter:brightness(.95)}

/* ---------- Herramientas y control segmentado ---------- */
.herramientas{display:flex;gap:12px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.buscar-in{position:relative;flex:1;min-width:240px}
.buscar-in .ic{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--m2)}
.buscar-in input{padding-left:40px;background:var(--hover);box-shadow:none}
.buscar-in input:focus{background:var(--sup)}
.filtros,.segmentos{display:flex;padding:2px;border-radius:10px;background:rgba(118,118,128,.12)}
.filtros a,.segmentos label,.segmentos button{padding:0 14px;height:32px;display:flex;align-items:center;justify-content:center;gap:6px;color:var(--tinta);font-weight:500;font-size:.88rem;border-radius:8px;transition:background .2s var(--ease),box-shadow .2s;white-space:nowrap;margin:0;cursor:pointer;border:0;background:none;font-family:var(--f)}
.filtros a:hover{background:rgba(118,118,128,.1)}
.filtros a.on,.segmentos input:checked+span,.segmentos button.on{background:var(--sup);font-weight:650;box-shadow:0 1px 3px rgba(0,0,0,.14),0 0 0 .5px rgba(0,0,0,.04)}
.filtros a small{margin-left:5px;color:var(--m2);font-weight:600}
.segmentos label{padding:0;flex:1;position:relative}
.segmentos label input{position:absolute;opacity:0;pointer-events:none;margin:0;width:0;height:0}
.segmentos label span{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:32px;border-radius:8px;padding:0 12px;transition:background .2s var(--ease),box-shadow .2s}
.dens{display:flex;padding:2px;border-radius:10px;background:rgba(118,118,128,.12)}
.dens button{border:0;background:none;width:34px;height:32px;cursor:pointer;color:var(--m);border-radius:8px}
.dens button.on{background:var(--sup);color:var(--tinta);box-shadow:0 1px 3px rgba(0,0,0,.14)}

/* ---------- Formularios ---------- */
input,select,textarea{font:400 .97rem var(--f);letter-spacing:-.011em;color:var(--tinta);background:var(--sup);border:0;border-radius:var(--r);padding:0 14px;height:42px;width:100%;box-shadow:0 0 0 1px var(--b);transition:box-shadow .2s var(--ease),background .2s}
textarea{height:auto;min-height:120px;padding:12px 14px;resize:vertical;line-height:1.5}
input::placeholder,textarea::placeholder{color:var(--m2)}
input:hover,select:hover,textarea:hover{box-shadow:0 0 0 1px var(--m2)}
input:focus,select:focus,textarea:focus{outline:0;box-shadow:0 0 0 1.5px var(--acento),0 0 0 5px rgba(45,125,246,.22)}
select{appearance:none;padding-right:38px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%2386868b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M1 1.5l5 5 5-5'/></svg>");background-repeat:no-repeat;background-position:right 14px center;cursor:pointer}
input[type=checkbox],input[type=radio]{width:auto;height:auto}
input[type=file]{height:auto;padding:10px 12px;cursor:pointer}
input[type=color]{padding:4px;cursor:pointer}
label{display:block;font-weight:600;font-size:.86rem;color:var(--tinta);margin-bottom:14px}
label input,label select,label textarea{margin-top:7px;font-weight:400}
label.marcar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-direction:row-reverse;font-weight:500;font-size:.97rem;cursor:pointer;padding:11px 16px;border-radius:var(--r);background:var(--sup);box-shadow:0 0 0 1px var(--b)}
label.marcar input{appearance:none;width:51px;height:31px;border-radius:99px;background:rgba(120,120,128,.32);position:relative;margin:0;flex:none;cursor:pointer;transition:background .25s var(--ease);box-shadow:none}
label.marcar input::after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 3px 8px rgba(0,0,0,.15),0 1px 1px rgba(0,0,0,.16);transition:transform .25s var(--ease)}
label.marcar input:checked{background:var(--c-verde)}label.marcar input:checked::after{transform:translateX(20px)}
.fila2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.fila3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ancho-form{max-width:580px;margin:0 auto}
.cols{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}
.cols>div:last-child,.cols>.tarjeta:last-child{position:sticky;top:80px}
@media(max-width:1000px){.cols{grid-template-columns:1fr}.cols>*:last-child{position:static}.fila2,.fila3{grid-template-columns:1fr}}

/* ---------- Paginación ---------- */
.pagina{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 18px;border-top:1px solid var(--b2);font-size:.9rem;color:var(--m);background:var(--sup2)}
.pagina nav{display:flex;gap:4px;align-items:center}
.pagina nav a,.pagina nav span{min-width:34px;height:34px;display:grid;place-items:center;border-radius:50%;color:var(--tinta);font-weight:600;font-size:.88rem;padding:0 6px}
.pagina nav a:hover{background:var(--hover)}.pagina nav span.on{background:var(--tinta);color:var(--on-tinta)}
.pp{display:inline-flex;padding:2px;border-radius:9px;margin-left:8px;background:rgba(118,118,128,.12)}
.pp a{padding:3px 11px;font-weight:600;color:var(--m);border-radius:7px}.pp a.on{background:var(--sup);color:var(--tinta);box-shadow:0 1px 3px rgba(0,0,0,.14)}
.ir-a{display:inline-flex;gap:6px;align-items:center}.ir-a input{width:64px;height:34px;padding:0 8px;text-align:center}

/* ---------- Acciones masivas ---------- */
.masiva{position:fixed;left:50%;bottom:26px;transform:translate(-50%,160%);z-index:35;display:flex;align-items:center;gap:6px;background:rgba(29,29,31,.92);backdrop-filter:blur(20px);color:#f5f5f7;padding:9px 10px 9px 20px;border-radius:18px;box-shadow:var(--sombra-l);transition:transform .45s var(--ease);max-width:calc(100vw - 24px);flex-wrap:wrap;width:max-content}
.masiva.on{transform:translate(-50%,0)}
.masiva b{font-weight:650;margin-right:8px;white-space:nowrap}
.masiva button{display:flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:11px;border:0;background:rgba(255,255,255,.12);color:inherit;font:600 .85rem var(--f);cursor:pointer;transition:background .2s}
.masiva button:hover{background:rgba(255,255,255,.22)}
.masiva .sep{width:1px;height:20px;background:#fff;opacity:.2;margin:0 4px}
.masiva .x{background:none;width:34px;padding:0;justify-content:center}.masiva .mal{color:#ff8a84}

/* ---------- Avisos, toasts, modal, paleta ---------- */
.aviso{padding:13px 16px;border-radius:var(--r);margin-bottom:16px;background:var(--a-suave);color:var(--tinta);font-weight:500}
.aviso.error{background:var(--mal-f);color:var(--mal)}
.toasts{position:fixed;right:20px;bottom:20px;z-index:120;display:grid;gap:10px;width:min(380px,calc(100vw - 32px))}
.toast{display:flex;align-items:flex-start;gap:12px;background:color-mix(in srgb,var(--sup) 90%,transparent);backdrop-filter:blur(24px);border-radius:16px;padding:14px 16px;box-shadow:var(--sombra-l);animation:toast-in .5s var(--ease);font-weight:500}
.toast .ic{color:var(--c-verde);margin-top:1px}.toast.error .ic{color:var(--mal)}
.toast p{flex:1}.toast button{border:0;background:none;color:var(--m2);cursor:pointer;padding:0}
.toast.fuera{animation:toast-out .25s forwards}
@keyframes toast-in{from{opacity:0;transform:translateY(16px) scale(.96)}}@keyframes toast-out{to{opacity:0;transform:translateY(8px) scale(.97)}}
.modal,.cmd{position:fixed;inset:0;z-index:110;background:rgba(0,0,0,.32);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;justify-content:center;animation:fade .25s}
.modal{align-items:center}.cmd{align-items:flex-start;padding-top:12vh}
.modal[hidden],.cmd[hidden]{display:none}
@keyframes fade{from{opacity:0}}
.modal-caja{background:var(--sup);border-radius:22px;padding:28px;width:min(420px,calc(100vw - 32px));text-align:center;box-shadow:var(--sombra-l);animation:pop .4s var(--ease)}
@keyframes pop{from{opacity:0;transform:scale(.94)}}
.modal-ic{width:52px;height:52px;border-radius:50%;background:var(--mal-f);color:var(--mal);display:grid;place-items:center;margin:0 auto 14px}
.modal-caja h3{font:700 1.2rem var(--f);text-transform:none;letter-spacing:-.02em;color:var(--tinta);margin:0 0 6px}.modal-caja p{color:var(--m);margin-bottom:22px}
.modal-ac{display:flex;gap:10px;justify-content:center}.modal-ac .btn{flex:1}
.cmd-caja{background:color-mix(in srgb,var(--sup) 94%,transparent);backdrop-filter:blur(30px);border-radius:20px;width:min(660px,calc(100vw - 24px));overflow:hidden;box-shadow:var(--sombra-l);animation:pop .4s var(--ease)}
.cmd-in{display:flex;align-items:center;gap:12px;padding:0 20px;height:62px;border-bottom:1px solid var(--b2);color:var(--m2)}
.cmd-in input{border:0;box-shadow:none!important;height:100%;padding:0;font-size:1.25rem;background:none;margin:0}
.cmd-lista{max-height:min(54vh,420px);overflow-y:auto;padding:8px}
.cmd-g{font:600 .74rem/1 var(--f);letter-spacing:.04em;text-transform:uppercase;color:var(--m2);padding:14px 12px 7px}
.cmd-it{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:11px;color:var(--tinta);cursor:pointer;font-weight:500}
.cmd-it.on{background:var(--acento);color:#fff}
.cmd-it .ic{color:var(--m)}.cmd-it.on .ic{color:#fff}
.cmd-it img{width:30px;height:36px;border-radius:7px;object-fit:cover}
.cmd-it small{margin-left:auto;color:var(--m2);font-weight:500}.cmd-it.on small{color:inherit;opacity:.85}
.cmd-vacio{padding:28px;text-align:center;color:var(--m)}
.cmd-pie{display:flex;gap:18px;padding:10px 20px;border-top:1px solid var(--b2);color:var(--m2);font-size:.78rem}.cmd-pie kbd{margin-right:3px}

/* ---------- Dashboard ---------- */
.saludo{margin-bottom:26px}.saludo p{color:var(--m);margin-top:6px;font-size:1rem}
.dash{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:16px;margin-bottom:16px}
.dash-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:16px}
@media(max-width:1100px){.dash,.dash-3{grid-template-columns:1fr}}
.grafico{position:relative}
.grafico svg{width:100%;height:auto;display:block;overflow:visible}
.g-grid line{stroke:var(--b2);stroke-width:1}.g-eje text{fill:var(--m2);font:500 11px var(--f)}
.g-area{fill:var(--acento);fill-opacity:.1}.g-linea{fill:none;stroke:var(--acento);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.g-pt{fill:var(--sup);stroke:var(--acento);stroke-width:3;opacity:0;transition:opacity .15s}
.g-hit{fill:transparent;cursor:crosshair}.g-hit:hover+.g-pt{opacity:1}
.g-tip{position:absolute;pointer-events:none;background:rgba(29,29,31,.92);backdrop-filter:blur(10px);color:#f5f5f7;padding:8px 12px;border-radius:11px;font:650 .85rem var(--f);white-space:nowrap;transform:translate(-50%,-125%);opacity:0;z-index:5;transition:opacity .15s}
.g-tip small{display:block;opacity:.65;font-weight:500;font-size:.74rem}
.g-tip.on{opacity:1}
.top-lista{list-style:none;padding:0;margin:0;display:grid;gap:15px}
.top-lista li{display:grid;grid-template-columns:30px 1fr auto;gap:12px;align-items:center}
.top-n{width:30px;height:30px;border-radius:50%;background:var(--hover);display:grid;place-items:center;font-weight:650;font-size:.82rem;color:var(--m)}
.top-lista li:first-child .top-n{background:var(--acento);color:#fff}
.top-lista b{display:block;font-weight:600;font-size:.93rem}
.barra-p{height:6px;border-radius:99px;background:var(--hover);margin-top:7px;overflow:hidden}.barra-p i{display:block;height:100%;border-radius:99px;background:var(--acento);transition:width .9s var(--ease)}
.salud-barra{display:flex;height:12px;gap:3px;margin:6px 0 18px}.salud-barra i{display:block;height:100%;border-radius:99px}
.leyenda{list-style:none;padding:0;margin:0;display:grid;gap:11px;font-size:.93rem}.leyenda li{display:flex;align-items:center;gap:10px}.leyenda i{width:10px;height:10px;border-radius:50%}.leyenda b{margin-left:auto;font-weight:650}
.pasos{list-style:none;padding:0;margin:0;display:grid;gap:2px}
.paso{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:11px;color:var(--tinta);transition:background .15s}
a.paso:hover{background:var(--hover)}
.paso .ok-c{width:22px;height:22px;border:1.5px solid var(--m2);border-radius:50%;display:grid;place-items:center;flex:none;color:transparent;transition:.2s}
.paso.hecho .ok-c{background:var(--c-verde);border-color:var(--c-verde);color:#fff}.paso.hecho span{color:var(--m2);text-decoration:line-through}
.paso small{margin-left:auto;color:var(--m2)}
.progreso{display:flex;align-items:center;gap:10px;font-size:.82rem;font-weight:600;color:var(--m)}.progreso .barra-p{width:90px;margin:0}
.rapidas{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rapida{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:14px;background:var(--sup2);box-shadow:0 0 0 .5px var(--b);color:var(--tinta);font-weight:600;transition:transform .3s var(--ease),box-shadow .3s}
.rapida:hover{transform:translateY(-2px);box-shadow:var(--sombra-m),0 0 0 .5px var(--b)}

/* ---------- Varios ---------- */
.fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),190px));align-items:start;gap:14px;margin:0 0 14px}
.fotos>[data-foto-item]{min-width:0;padding:9px;border:1px solid var(--b2);border-radius:15px;background:var(--sup);box-shadow:var(--sombra-s);transition:border-color .15s,box-shadow .15s,opacity .15s}
.fotos>[data-foto-item]:hover{border-color:var(--b);box-shadow:var(--sombra-m)}
.fotos>[data-foto-item]:focus-within{border-color:var(--a-borde);box-shadow:0 0 0 3px var(--a-suave)}
.fotos img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;border-radius:9px;background:var(--sup2)}
.fotos .foto-superior{min-height:32px;margin:0 0 8px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.foto-posicion{display:inline-flex;align-items:center;min-height:26px;padding:0 9px;border-radius:99px;background:var(--a-suave);color:var(--acento-t);font:600 11px/1 var(--f)}
.foto-arrastrar{display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:0 9px;border:1px solid var(--b);border-radius:9px;background:var(--sup);color:var(--tinta);font:600 11px var(--f);cursor:grab;touch-action:none}
.foto-arrastrar:hover{background:var(--hover)}
.foto-arrastrar:active{cursor:grabbing}
.foto-arrastrar span{font-size:17px;line-height:1}
.fotos .foto-color{display:grid;gap:4px;margin:9px 0 8px;color:var(--m);font-size:10px;font-weight:600}
.fotos .foto-color input{width:100%;height:36px;margin:0;padding:0 10px;border:1px solid var(--b);border-radius:9px;background:var(--bg);color:var(--tinta);font:400 12px var(--f);box-shadow:none}
.foto-acciones{display:flex;align-items:center;justify-content:space-between;gap:8px}
.fotos .foto-quitar{position:static;inset:auto;margin:0;padding:0;background:none;backdrop-filter:none;color:var(--m);font:500 11px var(--f);display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.fotos .foto-quitar input.chk{width:16px;height:16px;accent-color:var(--mal)}
.foto-reordenar{display:flex;gap:5px}
.foto-reordenar .btn{width:32px;height:30px;padding:0;font-size:14px}
.foto-reordenar .btn:disabled{opacity:.45;cursor:not-allowed}
.fotos .foto-para-quitar img{opacity:.42}
.fotos .foto-para-quitar{border-color:var(--mal);background:var(--mal-f)}
.fotos .foto-arrastrando{opacity:.4;border-color:var(--acento);box-shadow:0 0 0 2px var(--acento)}
.fotos-ayuda{max-width:72ch;margin:-6px 0 14px;font-size:12px}
.fotos-estado{display:block;min-height:18px;margin:4px 0 10px;font-size:12px}
.drop{display:grid;place-items:center;gap:6px;text-align:center;padding:28px 16px;border:1.5px dashed var(--m2);border-radius:var(--r-l);color:var(--m);transition:border-color .2s,background .2s;cursor:pointer;position:relative}
.drop:hover,.drop.sobre{border-color:var(--acento);background:var(--a-suave);color:var(--acento-t)}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer;height:100%;margin:0;padding:0}
.drop b{color:var(--tinta)}
.previas{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;margin-top:12px}
.previas img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:12px;box-shadow:0 0 0 2px var(--acento)}
.variantes-scroll{overflow-x:auto}.variantes{min-width:760px}.variantes td{padding:5px 6px}.variantes th{background:none;padding:0 6px 8px;border:0}.variantes input{height:38px}.variantes input[type="text"]{min-width:72px}
.variantes-generador{display:grid;grid-template-columns:minmax(150px,1fr) minmax(150px,1fr) auto;align-items:end;gap:8px;margin:0 0 12px;padding:12px;border:1px solid var(--b);border-radius:12px;background:var(--sup2)}.variantes-generador label{margin:0;font-size:12px}.variantes-generador small,.variantes-generador>span{grid-column:1/-1;font-size:11px;line-height:1.4}.variantes-generador>span{color:var(--acento-t);font-weight:600}
.color-variante-control,.color-producto-control{display:grid;justify-items:start;gap:5px}.color-codigo{font-size:11px;color:var(--m)}.color-codigo summary{cursor:pointer;white-space:nowrap;text-underline-offset:2px}.color-codigo[open]{min-width:190px}.color-codigo label{display:grid;gap:3px;margin:6px 0;font-size:11px}.color-codigo select,.color-codigo input{height:32px!important;font-size:12px}.color-codigo small{display:block;max-width:220px;color:var(--av);line-height:1.35}
.color-variante-pendiente{display:block;max-width:140px;color:var(--av);font-size:10px;line-height:1.3}.color-variante-pendiente[hidden]{display:none}
.vacio{padding:56px 20px;text-align:center;color:var(--m)}
.vacio::before{content:"";display:block;width:64px;height:64px;margin:0 auto 14px;border-radius:18px;background:var(--hover) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%2386868b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M21 8l-9-5-9 5v8l9 5 9-5zM3 8l9 5 9-5M12 13v8'/></svg>") center no-repeat}
.barra-guardar{position:sticky;bottom:0;z-index:25;margin:18px calc(-1 * clamp(20px,3vw,40px)) calc(-1 * clamp(20px,3vw,40px));padding:14px clamp(20px,3vw,40px);background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);border-top:1px solid var(--b2);display:flex;justify-content:space-between;align-items:center;gap:12px}
.sin-guardar{display:none;align-items:center;gap:8px;color:var(--av);font:600 .85rem var(--f)}.sin-guardar::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--av)}
.barra-guardar.sucio .sin-guardar{display:inline-flex}

/* ---------- Acceso e instalador ---------- */
.login{display:grid;place-items:center;min-height:100vh;padding:28px;background:radial-gradient(900px 500px at 50% -10%,rgba(45,125,246,.1),transparent 70%),var(--bg)}
.login-caja{width:min(420px,100%);text-align:center}
.login-caja .orvex-sim{margin:0 auto 18px;color:var(--tinta)}
.login-caja .wm-t{font:700 1.5rem/1 var(--f);letter-spacing:.16em}
.login-caja .wm-s{display:inline-block;margin-top:10px;font:600 .74rem/1 var(--f);color:var(--acento-t);background:var(--a-suave);padding:5px 11px;border-radius:99px}
.login-caja h1{margin:26px 0 6px;font-size:1.7rem}
.login-caja .sub{color:var(--m);margin-bottom:24px}
.login-caja form{background:var(--sup);border-radius:22px;padding:26px;text-align:left;box-shadow:var(--sombra-m),0 0 0 .5px var(--b2)}
.login-slogan{margin:26px 0 0;font:600 .95rem/1.4 var(--f);letter-spacing:-.01em;color:var(--tinta);max-width:34ch;margin-inline:auto}
.login-brand{margin:8px 0 0;font-size:.8rem;color:var(--m2)}
.login-brand a{color:var(--acento-t);font-weight:600;text-decoration:none;border-bottom:1px solid var(--a-borde)}
.login-brand a:hover{color:var(--acento);border-color:var(--acento)}
.login-pie{margin-top:10px;font-size:.78rem;color:var(--m2)}
body.solo .tarjeta.ancho-form{margin-top:6vh}
@media(max-width:720px){
  body.solo .login{padding:max(20px,env(safe-area-inset-top)) 16px max(20px,env(safe-area-inset-bottom))}
  body.solo .login-caja form{padding:20px 16px}
  body.solo .login-caja input:not([type=checkbox]):not([type=radio]):not([type=hidden]){min-height:48px;font-size:16px}
  body.solo .login-caja .btn{width:100%;min-height:48px}
}

/* ---------- Responsivo ---------- */
.velo-lat{display:none}
@media(max-width:900px){
  body.app{grid-template-columns:1fr}
  .lateral{position:fixed;left:0;top:0;bottom:0;width:284px;transform:translateX(-102%);transition:transform .45s var(--ease);box-shadow:var(--sombra-l);background:var(--bg)}
  .lateral.on{transform:none}
  .velo-lat{display:block;position:fixed;inset:0;background:rgba(0,0,0,.3);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .3s;z-index:35}
  .velo-lat.on{opacity:1;pointer-events:auto}
  .solo-movil{display:grid}.solo-desk{display:none}
  .cmd-trigger{min-width:0;margin-left:auto;width:36px;padding:0;justify-content:center;background:none}.cmd-trigger span,.cmd-trigger kbd{display:none}
  .usu-txt{display:none}
  html.lat-min{--ancho-lat:264px}html.lat-min .marca-t,html.lat-min .nav-t,html.lat-min .tienda-chip{display:revert}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Casillas y radios: prioridad sobre las reglas generales de formulario */
input.chk[type=checkbox]{width:20px;height:20px;padding:0;margin:0;box-shadow:none}
.fotos label input.chk[type=checkbox]{width:15px;height:15px}
.delta.nuevo{background:var(--a-suave);color:var(--acento-t)}

/* =====================================================================
   v0.7 · Blanco total + iconografía de lujo
   Todo el fondo es blanco; las superficies se separan con líneas finas.
   Iconos de línea ultrafina y monocromos.
   ===================================================================== */
svg.ic{stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}
.paso .ok-c .ic,.chk .ic{stroke-width:2}

/* Iconos: monocromos */
.ico,.kpi-i{background:none;box-shadow:none;color:var(--tinta);border-radius:50%}
.kpi-i{width:34px;height:34px;border:1px solid var(--b)}
.kpi-i .ic{width:17px;height:17px}
.nav .ico{width:22px;height:22px;border:0;border-radius:0}
.nav .ico .ic{width:20px;height:20px}
.nav a:hover .ico,.nav a.on .ico{color:var(--acento)}
.lista .ico,.galeria .ico,.sec-cab .ico,.rapida .ico{border:1px solid var(--b)}
.rapida .kpi-i{width:36px;height:36px}

/* Superficies: línea fina en lugar de sombra o gris */
.lateral{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;border-right:1px solid var(--b2)}
.barra{background:rgba(255,255,255,.88);border-bottom:1px solid var(--b2)}
:root[data-tema=oscuro] .barra{background:rgba(0,0,0,.72)}
:root[data-tema=oscuro] .lateral{background:#000}
.tarjeta,.tienda-chip,.lat-ver,.lista li,.grupo,.op>span.cuerpo,.avanzado,.caja-menu,.rapida,.login-caja form{box-shadow:none;border:1px solid var(--b2)}
.tienda-chip{padding:9px 13px}
.tarjeta:hover,.kpi:hover,.lista li:hover,.rapida:hover{box-shadow:none;border-color:var(--b)}
.kpi:hover,.rapida:hover{transform:none}
.nav a.on{background:var(--hover);box-shadow:none}
.nav a em{border:1px solid var(--b2);background:none}
.kpi.accion{background:none;border-style:dashed;border-color:var(--b)}
.estado-tienda i{box-shadow:none}
.avatar{background:var(--tinta);color:var(--on-tinta)}
.cmd-trigger{background:none;box-shadow:inset 0 0 0 1px var(--b)}
.cmd-trigger:hover{background:var(--hover)}
.buscar-in input{background:#fff;box-shadow:0 0 0 1px var(--b)}
th,.pagina{background:#fff}
.btn{box-shadow:0 0 0 1px var(--b)}
.btn.primario,.btn.azul,.btn.peligro-s{box-shadow:none}
.toast,.desplegable,.cmd-caja,.modal-caja{box-shadow:0 20px 50px -18px rgba(0,0,0,.28),0 0 0 1px var(--b2)}
.barra-guardar{background:rgba(255,255,255,.92);border-top:1px solid var(--b2)}
:root[data-tema=oscuro] .barra-guardar{background:rgba(0,0,0,.8)}
.prod img,.prod .sinfoto,.fotos>div{box-shadow:none;border:1px solid var(--b2)}
.vacio::before{border:1px solid var(--b2);background-color:#fff}

/* Acceso e instalador: blanco puro */
.login{background:#fff}
.login-caja form{box-shadow:none}
.login-caja .wm-s{background:none;border:1px solid var(--b);color:var(--m)}

/* Editor de tienda: escena blanca */
.escena{background:#fff!important;background-image:none!important}
.marco{border:1px solid var(--b);box-shadow:0 24px 60px -24px rgba(0,0,0,.25)}
.izq{background:#fff!important}
.ed-top{background:rgba(255,255,255,.92)!important}
:root[data-tema=oscuro] .escena,:root[data-tema=oscuro] .izq{background:#000!important}
:root[data-tema=oscuro] .ed-top{background:rgba(0,0,0,.8)!important}
.tabs-g{background:#fff}
:root[data-tema=oscuro] .tabs-g{background:#000}
.kpi .spark{top:18px;bottom:auto;right:18px}

/* v0.7.2 · Tipografía Aura (Poppins) y fondo blanco también en la barra de acciones */
.masiva{background:var(--sup);color:var(--tinta);box-shadow:0 20px 50px -16px rgba(0,0,0,.3),0 0 0 1px var(--b);backdrop-filter:none}
.masiva button{background:none;box-shadow:inset 0 0 0 1px var(--b);color:var(--tinta)}
.masiva button:hover{background:var(--hover)}
.masiva .sep{background:var(--b);opacity:1}
.masiva .x{box-shadow:none}.masiva .mal{color:var(--mal);box-shadow:inset 0 0 0 1px var(--mal-f)}
.kpi b{font-weight:600;letter-spacing:-.02em}
.marca-t strong{font-weight:600}
.login-caja .wm-t{font-weight:600}
.kpi .spark{display:none}

/* ---------- Plan Activo ---------- */
.plan-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(280px,400px);gap:30px;align-items:center;padding:34px 36px}
.plan-marca{width:76px;height:76px;border:1px solid var(--b);border-radius:50%;display:grid;place-items:center;color:var(--tinta)}
.plan-marca .ic{stroke-width:1}
.plan-hero-t h2{font-size:clamp(1.9rem,3.2vw,2.6rem);font-weight:600;letter-spacing:-.025em;margin:12px 0 4px}
.plan-hero-t p{color:var(--m);font-size:1.05rem}.plan-hero-t p b{color:var(--tinta);font-weight:600}
.plan-vig{position:relative;z-index:1}
.plan-fechas{display:flex;justify-content:space-between;margin-bottom:14px}
.plan-fechas small{display:block;font:500 .75rem var(--f);color:var(--m2);letter-spacing:.04em;text-transform:uppercase}
.plan-fechas b{font:600 1.15rem var(--f);letter-spacing:-.01em}
.plan-barra{position:relative;height:6px;border-radius:99px;background:var(--hover)}
.plan-barra i{display:block;height:100%;border-radius:99px;background:var(--tinta);transition:width 1s var(--ease)}
.plan-barra span{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px var(--acento)}
.plan-restan{display:flex;align-items:center;gap:8px;margin-top:14px;font-weight:500;color:var(--m)}
.plan-sello{position:absolute;right:-34px;top:-40px;width:230px;height:230px;color:var(--tinta);opacity:.045;pointer-events:none}
.plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px;align-items:start}
.plan-lista{list-style:none;margin:0;padding:0;display:grid}
.plan-lista li{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid var(--b2)}
.plan-lista li:last-child{border-bottom:0;padding-bottom:0}.plan-lista li:first-child{padding-top:0}
.plan-lista li>span:nth-child(2){flex:1;font-weight:500}
.plan-lista small{display:block;color:var(--m2);font-weight:400;font-size:.82rem;margin-top:2px;line-height:1.35}
.plan-lista.bloq li>span:nth-child(2) b{font-weight:600;color:var(--tinta)}
.plan-ico{width:36px;height:36px;border:1px solid var(--b);border-radius:50%;display:grid;place-items:center;flex:none;color:var(--tinta)}
.plan-lista.bloq .plan-ico{color:var(--m2);border-style:dashed}
.plan-adicionales-intro{margin:0 0 8px;font-size:.88rem}
.plan-lista-adicionales li{align-items:flex-start}
.plan-lista-adicionales li>span:nth-child(2){padding-top:3px}
.plan-lista-adicionales .plan-ico{width:32px;height:32px;color:var(--info);border-color:var(--a-borde);background:var(--a-suave)}
.plan-opcional{flex:none;margin:5px 0 0 auto;padding:4px 8px;border-radius:99px;background:var(--hover);color:var(--m);font-size:.68rem;font-weight:600;white-space:nowrap}
.plan-ok{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--ok-f);color:var(--ok);flex:none}
.plan-ok .ic{stroke-width:2}
.plan-precio{display:flex;flex-direction:column}
.plan-monto{font:600 clamp(2.1rem,3.4vw,2.8rem)/1.05 var(--f);letter-spacing:-.03em;margin:4px 0 12px}
.plan-monto small{font:500 1rem var(--f);color:var(--m2);letter-spacing:0;margin-left:8px}
.plan-importes{display:grid;gap:10px;margin:4px 0 6px}
.plan-importes>div{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:3px 12px;padding:14px 15px;border:1px solid var(--b2);border-radius:var(--r);background:var(--sup2)}
.plan-importes>div>span{font-size:.84rem;font-weight:600;color:var(--m)}
.plan-importes>div>small{grid-row:2;color:var(--m2);font-size:.76rem}
.plan-importes>div>strong{grid-column:2;grid-row:1/3;display:flex;align-items:baseline;gap:5px;font:600 clamp(1.12rem,1.8vw,1.45rem)/1.1 var(--f);letter-spacing:-.035em;white-space:nowrap}
.plan-importes>div>strong small{font:500 .7rem var(--f);color:var(--m2);letter-spacing:0}
.plan-importes>div.plan-importe-servicio{border-color:var(--a-borde);background:var(--a-suave)}
.plan-importes>div.plan-importe-servicio>span,.plan-importes>div.plan-importe-servicio>strong{color:var(--tinta)}
.plan-linea{display:flex;gap:12px;align-items:center;margin-top:18px;padding-top:18px;border-top:1px solid var(--b2)}
.pie-admin{padding:14px clamp(16px,2.4vw,32px);border-top:1px solid var(--b2);color:var(--m2);font-size:.78rem;text-align:center}
.pie-admin a{color:inherit;text-underline-offset:2px}
@media(max-width:1100px){.plan-hero{grid-template-columns:auto minmax(0,1fr)}.plan-vig{grid-column:1/-1}}
@media(max-width:640px){.plan-grid{grid-template-columns:1fr}.plan-hero{grid-template-columns:1fr;padding:24px}.plan-marca{width:60px;height:60px}}

/* Funciones fuera del plan */
.bloqueado-nota{display:flex;gap:12px;align-items:center;padding:12px 14px;border:1px dashed var(--b);border-radius:var(--r);color:var(--m);font-size:.9rem;background:#fff}
.bloqueado-nota .ic{flex:none;color:var(--m2)}
.bloqueado-nota a{font-weight:600}

/* Recuadro del plan en la barra lateral */
a.plan-chip{color:inherit;transition:border-color .2s,background .2s}
a.plan-chip:hover{border-color:var(--b);background:var(--hover)}
.plan-chip em{display:flex;align-items:center;gap:7px;font:500 .74rem/1 var(--f);font-style:normal;color:var(--ok);margin-top:5px}
.plan-chip em i{width:6px;height:6px;border-radius:50%;background:currentColor}
.plan-chip em.e-por_vencer{color:var(--av)}.plan-chip em.e-vencido{color:var(--mal)}
html.lat-min .plan-chip{display:none}
.plan-sello{right:-70px!important;top:auto!important;bottom:-96px;width:250px!important;height:250px!important}
.op.bloqueado{cursor:not-allowed}
.op.bloqueado>span.cuerpo{opacity:.5;position:relative;border-style:dashed}
.op.bloqueado:hover>span.cuerpo{transform:none}
.op .cand{position:absolute;right:10px;bottom:10px;width:26px;height:26px;border-radius:50%;background:#fff;border:1px solid var(--b);display:grid;place-items:center;color:var(--m)}
.op.bloqueado>span.cuerpo{opacity:1}
.op.bloqueado .mini-tema,.op.bloqueado .nombre,.op.bloqueado .sub{opacity:.5}

/* Tarjeta de acción del panel: el botón se ajusta al ancho y no se corta */
.kpi.accion { padding: 14px; display: flex; align-items: center; justify-content: center; }
.kpi.accion .btn { width: 100%; max-width: 100%; white-space: normal; text-align: center; justify-content: center; line-height: 1.25; padding-inline: 12px; }
/* Submenús en el editor de menús */
.menu-fila { grid-template-columns: 22px minmax(0,1fr) minmax(0,1fr) 30px 30px; }
.menu-fila.sub { padding-left: 28px; background: var(--hover); }
.menu-fila .niv { border: 0; background: none; color: var(--m2); cursor: pointer; height: 30px; border-radius: 8px; font-size: 1rem; }
.menu-fila .niv:hover, .menu-fila.sub .niv { color: var(--acento); background: var(--hover); }
/* ===== Plan activo: condiciones a todo el ancho + Sección de adicionales ===== */
.plan-precio { grid-column: 1 / -1; }
.plan-precio .plan-importes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.plan-precio .plan-linea { margin-top: 16px; }
.adds { margin-top: 44px; }
.adds-cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px 28px; flex-wrap: wrap; margin-bottom: 22px; }
.adds-cab h2 { margin: 8px 0 6px; font-size: clamp(1.5rem, 2.4vw, 1.9rem); font-weight: 600; letter-spacing: -.025em; }
.adds-intro { margin: 0; max-width: 56ch; color: var(--m); }
.adds-filtros { display: inline-flex; gap: 2px; padding: 3px; border-radius: 99px; background: var(--hover); flex-wrap: wrap; }
.adds-filtros button { display: inline-flex; align-items: center; gap: 7px; border: 0; background: none; color: var(--m); font: 600 .84rem var(--f); padding: 8px 14px; border-radius: 99px; cursor: pointer; transition: background .2s var(--ease), color .2s; }
.adds-filtros button small { font: 600 .7rem var(--f); color: var(--m2); background: var(--hover); padding: 2px 7px; border-radius: 99px; }
.adds-filtros button:hover { color: var(--tinta); }
.adds-filtros button.on { background: var(--sup); color: var(--tinta); box-shadow: 0 1px 3px rgba(0,0,0,.14), 0 0 0 .5px rgba(0,0,0,.04); }
.adds-filtros button.on small { background: var(--a-suave); color: var(--acento-t); }
.adds-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; }
.add { display: flex; flex-direction: column; gap: 10px; padding: 20px; border-radius: var(--r-l); background: var(--sup); border: 1px solid var(--b2); transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.add[hidden] { display: none; }
.add:hover { border-color: var(--a-borde); transform: translateY(-2px); box-shadow: var(--sombra-m); }
.add-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-bottom: 4px; }
.add-ico { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; background: var(--a-suave); color: var(--acento-t); flex: none; }
.add-chips { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.add h3 { margin: 0; font: 600 1.05rem/1.25 var(--f); letter-spacing: -.015em; }
.add-desc { margin: 0; color: var(--m); font-size: .88rem; line-height: 1.55; flex: 1; }
.add-pie { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: end; padding-top: 14px; margin-top: 6px; border-top: 1px solid var(--b2); }
.add-precio { display: flex; align-items: baseline; gap: 6px; grid-column: 1; }
.add-precio strong { font: 600 1.45rem/1 var(--f); letter-spacing: -.03em; }
.add-precio small { color: var(--m2); font-size: .74rem; font-weight: 500; }
.add-cond { grid-column: 1; color: var(--m2); font-size: .76rem; line-height: 1.35; }
.add-cta { grid-column: 2; grid-row: 1 / 3; align-self: center; }
.adds-nota { display: flex; gap: 10px; align-items: flex-start; margin: 20px 0 0; padding: 14px 16px; border-radius: var(--r); background: var(--hover); color: var(--m); font-size: .84rem; line-height: 1.5; }
.adds-nota .ic { flex: none; margin-top: 2px; }
@media (max-width: 640px) { .plan-precio .plan-importes { grid-template-columns: 1fr; } .adds-filtros { width: 100%; } .adds-grid { grid-template-columns: 1fr; } }
.add h3 { text-transform: none; color: var(--tinta); font-size: 1.05rem; letter-spacing: -.015em; }

/* Plan: renovación anual y términos */
.plan-cubre-t{margin:20px 0 10px;font:600 .72rem var(--f);letter-spacing:.09em;text-transform:uppercase;color:var(--m2)}
.plan-cubre{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.plan-cubre li{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--b2);border-radius:var(--r);font-size:.9rem;font-weight:500;color:var(--tinta)}
.plan-cubre-nota{display:flex;gap:9px;align-items:flex-start;margin:12px 0 0;padding:10px 12px;border-radius:var(--r);background:var(--hover);color:var(--m);font-size:.82rem;line-height:1.45}
.plan-cubre-nota .ic{flex:none;margin-top:2px}

/* Tarjetas de adicionales: precio y botón en filas propias (sin solaparse) */
.add { padding: 22px; gap: 12px; }
.add-pie { display: flex; flex-direction: column; align-items: stretch; gap: 8px; padding: 16px 0 0; margin-top: 8px; }
.add-precio { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.add-desde { font: 600 .68rem var(--f); letter-spacing: .09em; text-transform: uppercase; color: var(--m2); }
.add-monto { display: flex; align-items: baseline; gap: 7px; }
.add-monto strong { font: 600 1.7rem/1 var(--f); letter-spacing: -.035em; color: var(--tinta); }
.add-monto small { color: var(--m2); font-size: .74rem; font-weight: 600; }
.add-cond { display: flex; align-items: flex-start; gap: 7px; color: var(--m); font-size: .8rem; line-height: 1.4; }
.add-cond .ic { flex: none; margin-top: 2px; color: var(--ok); }
.add-cond { min-height: 2.8em; }
.add-cta { box-sizing: border-box; width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 8px; min-height: 42px; padding: 0 16px; border-radius: var(--r); border: 1px solid var(--b); background: var(--sup); color: var(--tinta); font: 600 .88rem var(--f); text-decoration: none; transition: background .2s var(--ease), color .2s, border-color .2s; }
.add-cta .ic { transition: transform .2s var(--ease); }
.add:hover .add-cta, .add-cta:focus-visible { background: var(--tinta); border-color: var(--tinta); color: var(--sup); }
.add-cta:hover .ic { transform: translateX(3px); }
.add-cta:focus-visible { outline: 2px solid var(--acento); outline-offset: 2px; }

 /* Planes de ORVEX CMS (Plan Activo) */
.planes-orvex { margin-top: 44px; }
.planes-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 20px; align-items: stretch; }
.plan-card { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 30px 26px 26px; border-radius: var(--r-l); background: var(--sup); border: 1px solid var(--b2); }
.plan-card.tuyo { border-color: var(--a-borde); background: var(--a-suave); box-shadow: 0 0 0 1px var(--a-borde); }
.plan-card.custom { border-style: dashed; justify-content: center; }
.plan-card-chip { position: absolute; top: -11px; left: 24px; background: var(--acento); color: #fff; font: 600 .66rem var(--f); letter-spacing: .08em; text-transform: uppercase; padding: 4px 11px; border-radius: 99px; }
.plan-card-tag { margin: 0; color: var(--m2); font: 600 .7rem var(--f); letter-spacing: .07em; text-transform: uppercase; }
.plan-card h3 { margin: 6px 0 0; font: 600 1.35rem var(--f); letter-spacing: -.02em; text-transform: none; color: var(--tinta); }
/* Precio en dos líneas: el número y, debajo, su condición («COP · pago único» / «COP / mes»), nunca apretados uno junto al otro */
.plan-card-precio { display: flex; flex-direction: column; gap: 4px; margin-top: 16px; }
.plan-card-precio strong { font: 600 1.85rem/1.15 var(--f); letter-spacing: -.03em; color: var(--tinta); }
.plan-card-precio small { color: var(--m2); font-size: .76rem; font-weight: 500; letter-spacing: .02em; }
.plan-card-renueva { margin: 6px 0 0; font-size: .8rem; line-height: 1.5; color: var(--m); }
.plan-card-renueva b { color: var(--tinta); }
.plan-card-lista { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.plan-card-lista li { display: flex; gap: 10px; align-items: flex-start; font-size: .85rem; color: var(--m); line-height: 1.5; }
.plan-card-lista li .ic { flex: none; margin-top: 3px; color: var(--ok); }
.plan-card-cta { margin-top: 22px; display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 20px; border-radius: var(--r); border: 1px solid var(--b); background: var(--sup2); color: var(--tinta); font: 600 .88rem var(--f); text-decoration: none; text-align: center; transition: background .2s var(--ease), color .2s, border-color .2s; }
.plan-card-cta:hover { background: var(--tinta); border-color: var(--tinta); color: var(--sup); }
.plan-card-cta .ic { flex: none; transition: transform .2s var(--ease); }
.plan-card-cta:hover .ic { transform: translateX(3px); }
.plan-card-cta.quieto, .plan-card-cta.quieto:hover { background: none; border-color: var(--a-borde); color: var(--acento-t); cursor: default; }
.plan-card-cta.quieto:hover .ic { transform: none; }
@media (max-width: 480px) { .planes-grid { grid-template-columns: 1fr; } }

/* Términos y condiciones: agrupados por tema, cada uno un acordeón que se abre al tocarlo */
.terms { margin-top: 56px; }
.terms-cab { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; }
.terms-cab h2 { margin: 6px 0 4px; font-size: clamp(1.5rem, 2.4vw, 1.9rem); font-weight: 600; letter-spacing: -.025em; }
.terms-ico { width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; background: var(--a-suave); color: var(--acento-t); flex: none; }
.terms-cats { display: flex; flex-direction: column; gap: 16px; max-width: 880px; }
.terms-cat { border-radius: var(--r-l); background: var(--sup); border: 1px solid var(--b2); overflow: hidden; }
.terms-cat-cab { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--b2); background: var(--hover); }
.terms-cat-cab h3 { flex: 1; margin: 0; font: 600 .92rem var(--f); text-transform: none; letter-spacing: -.01em; color: var(--tinta); }
.terms-cat-ico { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; background: var(--sup); color: var(--m); flex: none; }
.term { border-top: 1px solid var(--b2); }
.term:first-child { border-top: 0; }
.term summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 18px; cursor: pointer; font: 600 .87rem var(--f); color: var(--tinta); list-style: none; }
.term summary::-webkit-details-marker { display: none; }
.term summary .ic { flex: none; color: var(--m2); transition: transform .2s var(--ease); }
.term[open] summary .ic { transform: rotate(180deg); }
.term p { margin: 0; padding: 0 18px 16px; color: var(--m); font-size: .86rem; line-height: 1.6; max-width: 68ch; }
.term-acepta { display: flex; align-items: center; gap: 14px; margin-top: 18px; padding: 16px 20px; border-radius: var(--r-l); background: var(--a-suave); border: 1px solid var(--a-borde); max-width: 880px; }
.term-acepta p { margin: 0; font-size: .9rem; line-height: 1.5; color: var(--tinta); }
@media (max-width: 760px) { .plan-cubre { grid-template-columns: 1fr; } .term summary, .term p { padding-left: 16px; padding-right: 16px; } }

/* Soporte: tickets y acceso */
.sop-acceso{display:grid;gap:16px 24px;align-items:center;margin-bottom:22px}
.sop-acceso-t{display:flex;gap:14px;align-items:center}
.sop-acceso-t h2{margin:0 0 4px;font-size:1.05rem}
.sop-acceso-t p{margin:0;color:var(--m);font-size:.88rem}
.sop-ico{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:var(--a-suave);color:var(--acento-t);flex:none}
.sop-log{list-style:none;margin:0;padding:14px 0 0;border-top:1px solid var(--b2);display:grid;gap:8px;font-size:.84rem}
.sop-log li{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.sop-log small{color:var(--m2)}
.sop-form{max-width:720px;display:grid;gap:16px}
.sop-form label{margin:0}
.sop-form-pie{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.sop-form-pie p{margin:0;display:flex;gap:7px;align-items:center;font-size:.84rem}
.sop-ver{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;align-items:start}
.sop-hilo{display:grid;gap:14px}
.sop-msg{padding:18px 20px;border-radius:var(--r-l);background:var(--sup);border:1px solid var(--b2)}
.sop-msg.soporte{background:var(--a-suave);border-color:var(--a-borde)}
.sop-msg header{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.sop-msg header small{margin-left:auto;color:var(--m2)}
.sop-msg p{margin:0;line-height:1.6;font-size:.93rem;overflow-wrap:anywhere}
.sop-adj{display:inline-block;margin-top:12px}
.sop-adj img{max-width:260px;border-radius:var(--r);border:1px solid var(--b2);display:block}
.sop-resp{display:grid;gap:12px}
.sop-resp label{margin:0}
.sop-resp-pie{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.sop-resp-pie input[type=file]{width:auto;flex:1;min-width:0}
.sop-lado{display:grid;gap:14px}
.sop-lado h2{font-size:1rem;margin:0 0 12px}
.sop-lado p{margin:0 0 12px;font-size:.86rem;line-height:1.5}
.sop-estados{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:900px){.sop-ver{grid-template-columns:1fr}}

/* ===== Móvil: listas como tarjetas, filtros con desplazamiento, encabezados consistentes ===== */
@media (max-width: 900px) { .nav a.solo-pc { display: none; } }
@media (max-width: 720px) {
  .tarjeta.tabla { overflow-x: auto; }
  .herramientas > * { min-width: 0; }
  .filtros { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .filtros::-webkit-scrollbar { display: none; }
  .filtros a { flex: none; }
  .encabezado .acciones { width: 100%; }
  .encabezado .acciones .btn { flex: 1; }
  .tarjeta.tabla table.res, .tarjeta.tabla table.res tbody { display: block; width: 100%; }
  .tarjeta.tabla table.res thead { display: none; }
  .tarjeta.tabla table.res tr { display: grid; gap: 8px 12px; padding: 16px; border-top: 1px solid var(--b2); align-items: center; }
  .tarjeta.tabla table.res tbody tr:first-child { border-top: 0; }
  .tarjeta.tabla table.res td { display: block; padding: 0; border: 0; min-width: 0; max-width: none; text-align: left; }
  .tarjeta.tabla table.res td.der { text-align: left; }
  .tarjeta.tabla table.res .acc-fila { justify-content: flex-start; flex-wrap: wrap; }
  /* Catálogo */
  table.res.cat tr { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "chk prod prod" ". precio stock" ". cat vis" ". acc acc"; }
  table.res.cat .c-chk { grid-area: chk; } table.res.cat .c-prod { grid-area: prod; } table.res.cat .c-precio { grid-area: precio; font-size: 1.05rem; }
  table.res.cat .c-stock { grid-area: stock; justify-self: end; } table.res.cat .c-cat { grid-area: cat; } table.res.cat .c-vis { grid-area: vis; justify-self: end; }
  table.res.cat .c-acc { grid-area: acc; } table.res.cat .c-var { display: none !important; }
  /* Pedidos */
  table.res.ped tr { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "cod estado" "cli cli" "total fecha" "ciu canal" "ver ver"; }
  table.res.ped .p-cod { grid-area: cod; font-size: 1.05rem; } table.res.ped .p-estado { grid-area: estado; justify-self: end; } table.res.ped .p-cli { grid-area: cli; }
  table.res.ped .p-total { grid-area: total; font-size: 1.05rem; } table.res.ped .p-fecha { grid-area: fecha; justify-self: end; font-size: .84rem; }
  table.res.ped .p-ciu { grid-area: ciu; font-size: .86rem; } table.res.ped .p-canal { grid-area: canal; justify-self: end; } table.res.ped .p-ver { grid-area: ver; }
  table.res.ped .p-ver .btn { width: 100%; }
  /* Tickets */
  table.res.tk tr { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "cod estado" "asunto asunto" "plazo fecha"; }
  table.res.tk .t-cod { grid-area: cod; } table.res.tk .t-estado { grid-area: estado; justify-self: end; } table.res.tk .t-asunto { grid-area: asunto; }
  table.res.tk .t-plazo { grid-area: plazo; } table.res.tk .t-fecha { grid-area: fecha; justify-self: end; font-size: .84rem; }
  /* Mensajes */
  table.res.msj tr { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "de fecha" "msg msg" "acc acc"; }
  table.res.msj .m-de { grid-area: de; } table.res.msj .m-fecha { grid-area: fecha; justify-self: end; font-size: .84rem; } table.res.msj .m-msg { grid-area: msg; } table.res.msj .m-acc { grid-area: acc; }
  /* Soporte: bloque de acceso alineado a la izquierda y botones a todo el ancho */
  .sop-acceso { padding: 18px; }
  .sop-log li { flex-direction: column; gap: 2px; }
  .sop-form-pie .btn, .sop-resp-pie .btn { width: 100%; }
}
.t-asunto, .m-msg { max-width: 440px; }
@media (max-width: 720px) { .dens { display: none; } }
.sop-log { max-height: 340px; overflow-y: auto; }

@media (max-width: 720px) {
  .lateral {
    overscroll-behavior: contain;
  }

  .nav a,
  .lat-ver,
  .icon-btn,
  .cmd-trigger,
  .usu-btn,
  .desplegable a,
  .desplegable button {
    min-height: 48px;
  }

  .icon-btn {
    width: 48px;
    height: 48px;
  }

  .btn,
  .admin-app .btn,
  .admin-app .btn.chico,
  .admin-app .btn.icono {
    min-height: 48px;
  }

  .admin-app .btn.icono {
    width: 48px;
  }

  .admin-app input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
  .admin-app select,
  .admin-app textarea {
    min-height: 48px;
    font-size: 16px;
  }

  .admin-app textarea {
    min-height: 120px;
  }

  .fotos .foto-arrastrar,
  .foto-reordenar .btn {
    min-height: 48px;
  }

  .foto-reordenar .btn {
    width: 48px;
  }

  .pagina nav a,
  .pagina nav span {
    min-width: 48px;
    height: 48px;
  }

  .filtros a,
  .pagina .pp a,
  .ir-a .btn {
    min-height: 44px;
  }
}