html, body {
  height: 100%;
}

body {
  margin: 0;
  padding: 0;
}

@media (prefers-color-scheme: dark) {
  body {
    background: black;
  }
}

.root {
  display: flex;
  flex-direction: column;
  height: 100%;
}

@media print {
  * {
    height: auto !important;
    overflow: visible !important;
  }
}


/* === AI System: login minimalista === */
[class*="extraContainer"] { display: none !important; }
[class*="-options"]:has([class*="-flag"]) { display: none !important; }

/* Layout: logo arriba, tarjeta centrada, fondo claro */
main:has(input[name="password"]) {
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 22px !important;
  background: #ececec !important;
}
main:has(input[name="password"]) > [class*="-sidebar"] {
  background: transparent !important;
  position: static !important;
  width: auto !important; min-width: 0 !important; height: auto !important;
  flex: none !important; margin: 0 !important; padding: 0 !important;
  pointer-events: auto !important;
}
main:has(input[name="password"]) > [class*="-sidebar"] img,
main:has(input[name="password"]) .MuiPaper-root img {
  max-height: 92px !important; width: auto !important;
  display: block !important; margin: 0 auto 6px !important;
}
main:has(input[name="password"]) > .MuiPaper-root {
  flex: none !important; width: 360px !important; max-width: 90vw !important; height: auto !important;
  margin: 0 !important; padding: 32px 28px !important; border-radius: 14px !important;
  box-shadow: 0 6px 28px rgba(0,0,0,0.12) !important; background: #ffffff !important;
}

/* Campos: forzar modo CLARO (ignora dark mode del dispositivo) */
main:has(input[name="password"]) .MuiOutlinedInput-root,
main:has(input[name="password"]) .MuiInputBase-root {
  background-color: #ffffff !important;
}
main:has(input[name="password"]) input {
  color: #222 !important; -webkit-text-fill-color: #222 !important;
}
main:has(input[name="password"]) input:-webkit-autofill,
main:has(input[name="password"]) input:-webkit-autofill:hover,
main:has(input[name="password"]) input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
  -webkit-text-fill-color: #222 !important; caret-color: #222 !important;
  transition: background-color 9999s ease-in-out 0s !important;
}
main:has(input[name="password"]) .MuiOutlinedInput-notchedOutline { border-color: #c4c8cc !important; }

/* Etiquetas: texto oscuro, siempre flotadas arriba */
main:has(input[name="password"]) .MuiInputLabel-root,
main:has(input[name="password"]) label {
  color: #555 !important; background: #ffffff !important; padding: 0 6px !important;
  border-radius: 4px !important; transform: translate(14px, -9px) scale(0.75) !important;
  transform-origin: top left !important; pointer-events: none !important;
  max-width: calc(100% - 24px) !important;
}
main:has(input[name="password"]) .MuiOutlinedInput-notchedOutline > legend { max-width: 0.01px !important; }

/* Responsive movil */
@media (max-width: 1199px) {
  main:has(input[name="password"]) > [class*="-sidebar"]:empty { display: none !important; }
  main:has(input[name="password"]) { gap: 0 !important; padding: 16px !important; }
}
@media (max-width: 600px) {
  main:has(input[name="password"]) > .MuiPaper-root { width: 94vw !important; max-width: 94vw !important; padding: 26px 20px !important; }
}
/* === AI System: fin === */

/* === AI System: KPI panel === */
#aisystem-kpi{position:fixed;top:76px;right:12px;width:212px;z-index:1090;background:#fff;border:1px solid #e2e6ea;border-radius:12px;box-shadow:0 6px 24px rgba(0,0,0,.14);font-family:system-ui,Segoe UI,Roboto,sans-serif;font-size:13px;color:#222;overflow:hidden}
#aisystem-kpi .aik-head{display:flex;align-items:center;gap:6px;background:#4771C9;color:#fff;padding:8px 10px;cursor:move;user-select:none}
#aisystem-kpi .aik-head b{font-weight:600}
#aisystem-kpi .aik-dot{width:8px;height:8px;border-radius:50%;background:#8ff0a6;box-shadow:0 0 0 2px rgba(255,255,255,.35)}
#aisystem-kpi .aik-time{margin-left:auto;font-size:11px;opacity:.9}
#aisystem-kpi .aik-toggle{background:transparent;border:0;color:#fff;cursor:pointer;font-size:16px;line-height:1;padding:0 2px}
#aisystem-kpi .aik-body{padding:6px 10px 8px}
#aisystem-kpi .aik-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid #f0f2f4}
#aisystem-kpi .aik-row:last-child{border-bottom:0}
#aisystem-kpi .aik-loading{color:#888;padding:6px 0}
@media (max-width:900px){#aisystem-kpi{display:none}}
/* === AI System: KPI fin === */