/* Tema del clon: ROSADO OSCURO.
 *
 * Mantiene la estructura, las medidas y el contraste del "Office365Dark" que
 * usa el original, pero con una paleta ciruela/rosa para poder distinguir de un
 * vistazo esta aplicacion del sistema ASP.NET cuando ambos estan abiertos.
 *
 * Todo el color sale de estos tokens: cambiando el bloque :root se cambia el
 * tema entero.
 */

:root{
  /* superficies, de la mas clara a la mas oscura */
  --fondo:#241019;          /* fondo de pagina        (era #222) */
  --panel:#1c0c14;          /* barras, pies, tarjetas (era #191919) */
  --barra:#1c0b13;          /* barra de menu superior (era #1b1b1b) */
  --barra-activa:#3a1826;
  --fondo-fila:#180a10;     /* filas de la grilla     (era #000) */
  --fondo-fila-alt:#1f0e16;
  --campo:#150910;          /* interior de los editores */

  /* controles */
  --control:#3a1c2a;
  --control-borde:#562c3d;
  --menu:#3a1c2a;           /* desplegables y popups */

  /* texto y lineas */
  --texto:#fbe9f1;
  --texto-tenue:#b58ba0;
  --linea:#4a2634;
  --linea-fina:#2a1119;

  /* acento */
  --acento:#ff5c99;
  --acento-texto:#1a0a11;   /* texto legible sobre el acento */
  --acento-suave:#4a1b30;   /* celda con edicion pendiente */
  --seleccion:#74234d;      /* fila seleccionada */

  /* semanticos (se mantienen para que el significado no cambie) */
  --ok:#2fa84f;
  --aviso:#e0a32f;
  --error:#e04b4b;
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html,body{margin:0;padding:0}
body{
  background:var(--fondo);
  color:var(--texto);
  font:13px/1.35 "Segoe UI",Tahoma,Geneva,sans-serif;
}
a{color:inherit;text-decoration:none}
button{font:inherit}

/* ------------------------------------------------------------------ */
/* Barra de menu superior: Gestion | Ganado | Maestros | Otros         */
/* ------------------------------------------------------------------ */
.barra-menu{display:flex;background:var(--barra);border-bottom:1px solid #000}
.menu-raiz{
  position:relative;display:flex;align-items:center;gap:8px;
  padding:0 22px;height:42px;cursor:pointer;color:var(--texto);
  border-right:1px solid #000;white-space:nowrap;
}
.menu-raiz:hover,.menu-raiz:focus,.menu-raiz.activo{background:var(--barra-activa);color:#fff;outline:none}
.menu-icono{width:18px;height:18px;border-radius:3px;display:inline-block}
.icono-1{background:linear-gradient(#2fa84f,#1c7a37)}
.icono-2{background:linear-gradient(#c78ba0,#8a5c6e)}
.icono-3{background:
  linear-gradient(90deg,#e04b7d 0 50%,#4bb7e0 50% 100%),
  linear-gradient(90deg,#e0c04b 0 50%,#5ad06a 50% 100%);
  background-size:100% 50%;background-position:0 0,0 100%;background-repeat:no-repeat}
.icono-4{background:linear-gradient(#e0518b,#a8124e)}
.chevron{color:var(--texto-tenue);font-size:11px}
.submenu{
  display:none;position:absolute;top:42px;left:0;min-width:200px;z-index:60;
  background:var(--menu);border:1px solid #000;box-shadow:0 6px 18px rgba(0,0,0,.6);
}
.menu-raiz:hover .submenu,.menu-raiz:focus-within .submenu{display:block}
.submenu a{display:block;padding:9px 16px;color:var(--texto)}
.submenu a:hover{background:var(--acento);color:var(--acento-texto)}
.menu-usuario{margin-left:auto;padding:0 18px;display:flex;align-items:center;color:var(--texto-tenue)}

.contenido{padding:8px}

/* ------------------------------------------------------------------ */
/* Login                                                               */
/* ------------------------------------------------------------------ */
body.tema-login{
  background:linear-gradient(160deg,#3d1729 0%,#2a1019 60%,#1c0b13 100%);
  min-height:100vh;
  display:flex;align-items:flex-start;justify-content:center;
}
/* La pantalla de acceso no lleva barra de menu, igual que en el original. */
body.tema-login .barra-menu{display:none}
.caja-login{
  width:380px;margin-top:14px;background:#43182f;border:1px solid #5c2340;
  border-radius:6px;padding:24px;box-shadow:0 6px 22px rgba(0,0,0,.45);
}
.avatar-login{width:82px;height:82px;border-radius:50%;background:var(--acento);
  margin:0 auto 18px;display:flex;align-items:center;justify-content:center;
  font-size:44px;color:var(--acento-texto)}
.caja-login label{display:block;color:#f4d3e2;font-size:20px;margin-bottom:6px}
.caja-login input[type=text],.caja-login input[type=password]{
  width:100%;height:62px;font-size:30px;padding:0 8px;border:none;border-radius:10px;
  background:#fdf3f7;color:#2a1019;
}
.fila-pass{display:flex}
.fila-pass input{border-radius:10px 0 0 10px !important;flex:1}
.ver-pass{width:56px;border:none;border-radius:0 10px 10px 0;background:var(--acento);
  color:var(--acento-texto);font-size:22px;cursor:pointer}
.fila-recordar{display:flex;align-items:center;justify-content:flex-end;gap:8px;
  margin:14px 0;color:#f4d3e2}
.interruptor{position:relative;width:56px;height:26px;background:var(--error);
  border-radius:14px;cursor:pointer}
.interruptor input{display:none}
.interruptor .bola{position:absolute;top:3px;left:3px;width:20px;height:20px;
  border-radius:50%;background:#fff;transition:.2s}
.interruptor .etiqueta{position:absolute;right:8px;top:4px;font-size:12px;color:#fff;font-weight:700}
.interruptor.si{background:var(--ok)}
.interruptor.si .bola{left:33px}
.btn-entrar{
  display:block;margin:0 auto;background:var(--acento);color:var(--acento-texto);
  border:none;border-radius:8px;font-size:30px;font-weight:700;padding:8px 26px;cursor:pointer;
}
.error-login{background:#8e1d3f;color:#fff;padding:8px 10px;border-radius:6px;margin-bottom:12px}

/* ------------------------------------------------------------------ */
/* Portada de mosaicos (index.aspx)                                    */
/* ------------------------------------------------------------------ */
/* Los colores de los mosaicos NO se tocan: son datos copiados del original
   (core/navegacion.py) y las simulaciones los verifican uno a uno. */
.mosaicos{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:6px;padding:6px;
}
.mosaico{
  min-height:150px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:12px;font-weight:700;font-size:15px;text-align:center;
  padding:14px;border:none;cursor:pointer;letter-spacing:.3px;
}
.mosaico .glifo{font-size:40px;line-height:1}
.mosaico.bloqueado{opacity:.45;cursor:not-allowed}

/* ------------------------------------------------------------------ */
/* Grilla (ASPxGridView)                                               */
/* ------------------------------------------------------------------ */
.pantalla{display:flex;flex-direction:column;height:calc(100vh - 58px)}
.barra-herramientas{
  display:flex;align-items:center;gap:6px;padding:6px;background:var(--panel);
  border:1px solid var(--linea);border-bottom:none;position:relative;
}
.tb-btn{
  background:var(--control);border:1px solid var(--control-borde);color:var(--texto);
  border-radius:3px;padding:5px 10px;cursor:pointer;display:flex;align-items:center;gap:6px;
}
.tb-btn:hover{background:var(--acento);color:var(--acento-texto);border-color:var(--acento)}
.tb-menu{position:relative}
.tb-menu .desplegable{
  display:none;position:absolute;top:32px;left:0;min-width:170px;z-index:50;
  background:var(--menu);border:1px solid #000;box-shadow:0 6px 18px rgba(0,0,0,.6);
}
.tb-menu.abierto .desplegable{display:block}
.desplegable button{display:block;width:100%;text-align:left;padding:9px 14px;
  background:none;border:none;color:var(--texto);cursor:pointer}
.desplegable button:hover{background:var(--acento);color:var(--acento-texto)}
.titulo-pantalla{margin-left:auto;font-size:20px;font-weight:700;letter-spacing:2px;
  padding-right:14px;color:var(--acento)}

.barra-filtros{
  display:flex;align-items:center;gap:14px;padding:6px;background:var(--panel);
  border:1px solid var(--linea);border-top:none;border-bottom:none;
}
.buscador{background:var(--control);border:1px solid var(--control-borde);color:var(--texto);
  padding:5px 8px;border-radius:3px;width:220px}
.buscador::placeholder{color:var(--texto-tenue)}
.conmutador{display:flex;align-items:center;gap:7px;cursor:pointer;user-select:none}
.conmutador .pista{width:38px;height:18px;border-radius:9px;background:#6b4354;
  position:relative;transition:.15s}
.conmutador .pista i{position:absolute;top:2px;left:2px;width:14px;height:14px;
  border-radius:50%;background:#fff;transition:.15s}
.conmutador.on .pista{background:var(--acento)}
.conmutador.on .pista i{left:22px}

.marco-grilla{flex:1;overflow:auto;border:1px solid var(--linea);background:var(--fondo-fila)}
table.grilla{border-collapse:collapse;width:100%;font-size:12px}
table.grilla th{
  position:sticky;top:0;z-index:5;background:var(--fondo);color:#fff;font-weight:600;
  text-align:left;padding:6px 8px;border:1px solid var(--linea);white-space:nowrap;
  cursor:pointer;
}
table.grilla th .embudo{float:right;color:var(--texto-tenue);margin-left:6px}
table.grilla th.orden-asc::after{content:" ▲";color:var(--acento)}
table.grilla th.orden-desc::after{content:" ▼";color:var(--acento)}
table.grilla td{
  padding:4px 8px;border:1px solid var(--linea-fina);color:var(--texto);white-space:nowrap;
}
table.grilla tbody tr{background:var(--fondo-fila)}
table.grilla tbody tr:nth-child(even){background:var(--fondo-fila-alt)}
table.grilla tbody tr.seleccionada{background:var(--seleccion)}
table.grilla tbody tr.enfocada td{outline:1px solid var(--acento);outline-offset:-1px}
table.grilla td.editada{background:var(--acento-suave)}
td.num,th.num{text-align:right}
.celda-check{width:34px;text-align:center}
.casilla-sel{accent-color:var(--acento)}
.fila-filtros input{width:100%;background:var(--campo);border:1px solid var(--control-borde);
  color:var(--texto);padding:3px 5px;font-size:11px}
.editor-celda{width:100%;background:var(--campo);border:1px solid var(--acento);
  color:#fff;padding:2px 4px;font-size:12px}

.pie-resumen{
  padding:5px 8px;background:var(--panel);border:1px solid var(--linea);border-top:none;
  color:var(--texto);font-size:12px;
}
.barra-paginas{
  display:flex;align-items:center;gap:6px;padding:6px;background:var(--panel);
  border:1px solid var(--linea);border-top:none;
}
.barra-paginas button{background:var(--control);border:1px solid var(--control-borde);
  color:var(--texto);min-width:28px;padding:3px 7px;cursor:pointer;border-radius:2px}
.barra-paginas button.actual{background:var(--acento);color:var(--acento-texto);
  border-color:var(--acento)}
.barra-acciones{display:flex;justify-content:flex-end;gap:8px;padding:8px;
  background:var(--panel);border:1px solid var(--linea);border-top:none}
.btn{background:var(--control);border:1px solid var(--control-borde);color:var(--texto);
  border-radius:3px;padding:6px 16px;cursor:pointer}
.btn:hover{background:var(--barra-activa)}
.btn-primario{background:var(--acento);border-color:var(--acento);
  color:var(--acento-texto);font-weight:600}
.barra-info{padding:6px 8px;background:var(--panel);border:1px solid var(--linea);
  border-top:none;color:var(--texto)}

/* Popups -------------------------------------------------------------- */
.popup{position:fixed;inset:0;background:rgba(20,6,12,.7);display:flex;
  align-items:center;justify-content:center;z-index:100}
.popup-caja{background:var(--menu);border:1px solid #000;min-width:360px;max-width:90vw;
  box-shadow:0 10px 40px rgba(0,0,0,.7)}
.popup-cabecera{background:var(--panel);padding:9px 14px;font-weight:600;
  border-bottom:1px solid #000;color:var(--acento)}
.popup-cuerpo{padding:16px 14px}
.popup-pie{padding:10px 14px;display:flex;justify-content:flex-end;gap:8px;
  border-top:1px solid #000;background:var(--barra-activa)}
.campo{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.campo label{width:110px;color:var(--texto-tenue)}
.campo input,.campo select{flex:1;background:var(--campo);border:1px solid var(--control-borde);
  color:var(--texto);padding:5px 7px;border-radius:2px}

/* Alertas temporales --------------------------------------------------- */
.alerta{position:fixed;top:16px;right:16px;z-index:200;display:flex;align-items:center;gap:10px;
  background:var(--menu);border-left:4px solid var(--ok);color:var(--texto);padding:11px 14px;
  box-shadow:0 6px 20px rgba(0,0,0,.5);opacity:0;transform:translateX(20px);transition:.35s}
.alerta.mostrar{opacity:1;transform:none}
.alerta.ocultar{opacity:0;transform:translateX(20px)}
.alerta-warning{border-left-color:var(--aviso)}
.alerta-error{border-left-color:var(--error)}
.alerta-cerrar{background:none;border:none;color:var(--texto-tenue);font-size:18px;cursor:pointer}

/* Formularios de proceso ---------------------------------------------- */
.tarjeta{background:var(--panel);border:1px solid var(--linea);padding:14px;margin-bottom:8px}
.tarjeta h2{margin:0 0 12px;font-size:15px;letter-spacing:1px;color:var(--acento)}
.rejilla-campos{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
table.simple{border-collapse:collapse;width:100%;font-size:12px}
table.simple th{background:var(--fondo);padding:6px 8px;border:1px solid var(--linea);
  text-align:left}
table.simple td{padding:4px 8px;border:1px solid var(--linea-fina)}
table.simple tfoot td{background:var(--panel);font-weight:700}
.totales{display:flex;gap:22px;flex-wrap:wrap;margin-top:12px;color:var(--texto)}
.totales b{color:var(--acento)}