/* =============================================
   GESTIÓN DE DOCUMENTOS - NOVA S.A.
   Modern Business Interface
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg-primary: #f6f7f9;
  --bg-secondary: #eef0f4;
  --surface: #ffffff;
  --surface-hover: #f7f8fb;
  --surface-2: #fbfcfd;
  --bg-card: var(--surface);
  --text-primary: #0f1522;
  --text-secondary: #5d6577;
  --text-muted: #9aa1b2;
  --accent: #E4181D;
  --accent-soft: #eef3fe;
  --accent-hover: #B01015;
  --ring: 0 0 0 3px var(--accent-soft);
  --success: #0e9f6e;
  --success-soft: #e4f6ee;
  --warning: #d97706;
  --warning-soft: #fdf2e2;
  --danger: #e23b3b;
  --danger-soft: #fdeded;
  --info: #0891b2;
  --info-soft: #e3f6fa;
  --border: #eaedf2;
  --border-strong: #dfe3ea;
  --shadow-sm: 0 1px 2px rgba(15,21,34,0.04), 0 1px 3px rgba(15,21,34,0.05);
  --shadow-md: 0 6px 24px rgba(15,21,34,0.07);
  --shadow-lg: 0 20px 56px rgba(15,21,34,0.14);
  --radius-sm: 9px;
  --radius-md: 13px;
  --radius-lg: 18px;
  --radius-full: 999px;
  --font-main: 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --transition: 200ms ease;

  /* Sidebar — claro y aireado */
  --sidebar-width: 264px;
  --sidebar-bg: #ffffff;
  --sidebar-border: #eaedf2;
  --sidebar-text: #5d6577;
  --sidebar-hover: #f7f8fb;
  --sidebar-active: var(--accent-soft);
  --sidebar-active-text: var(--accent);
  --header-height: 66px;
}

[data-theme="dark"] {
  --bg-primary: #0b0e14;
  --bg-secondary: #12161f;
  --surface: #12161f;
  --surface-hover: #161b26;
  --surface-2: #161b26;
  --text-primary: #e8ebf2;
  --text-secondary: #98a1b4;
  --text-muted: #5e6776;
  --accent: #FF4249;
  --accent-soft: rgba(255,66,73,0.13);
  --accent-hover: #E4181D;
  --ring: 0 0 0 3px rgba(255,66,73,0.30);
  --success: #34d39e;
  --success-soft: rgba(52,211,158,0.12);
  --warning: #f0a943;
  --warning-soft: rgba(240,169,67,0.12);
  --danger: #f4615f;
  --danger-soft: rgba(244,97,95,0.13);
  --info: #38bdf8;
  --info-soft: rgba(56,189,248,0.12);
  --border: #1e2531;
  --border-strong: #29313e;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-md: 0 8px 28px rgba(0,0,0,0.45);
  --shadow-lg: 0 24px 60px rgba(0,0,0,0.55);
  --sidebar-bg: #0d1119;
  --sidebar-border: #1b222d;
  --sidebar-text: #98a1b4;
  --sidebar-hover: rgba(255,255,255,0.04);
  --sidebar-active: var(--accent-soft);
  --sidebar-active-text: var(--accent);
}

html { font-size: 16px; }
body {
  font-family: var(--font-main);
  background: var(--bg-primary);
  color: var(--text-primary);
  line-height: 1.6;
  letter-spacing: -0.01em;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  transition: background .3s ease, color .3s ease;
}
.mono, .td-numero, .stat-value { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ===================== LOGIN ===================== */
.login-wrapper {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background:
    radial-gradient(900px 500px at 18% 8%, rgba(228,24,29,0.10), transparent 60%),
    radial-gradient(700px 600px at 88% 96%, rgba(122,162,255,0.10), transparent 55%),
    var(--bg-primary);
}

.login-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  width: 100%;
  max-width: 420px;
  padding: 2.5rem;
  animation: fadeUp 0.5s ease;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.login-card h1 {
  font-size: 1.6rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-bottom: 0.25rem;
  color: var(--text-primary);
}

.login-card .subtitle {
  color: var(--text-secondary);
  font-size: 0.9rem;
  margin-bottom: 2rem;
}

.login-card .logo-area {
  text-align: center;
  margin-bottom: 1.5rem;
}

.login-card .logo-area .icon {
  width: 56px;
  height: 56px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, var(--accent), #FF4249);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 1.5rem;
  font-weight: 800;
  margin-bottom: 0.75rem;
  box-shadow: 0 8px 22px rgba(228,24,29,0.32);
}

.login-tabs {
  display: flex;
  gap: 4px;
  background: var(--bg-secondary);
  border-radius: var(--radius-full);
  padding: 4px;
  margin-bottom: 1.5rem;
}

.login-tabs button {
  flex: 1;
  padding: 0.5rem;
  border: none;
  border-radius: var(--radius-full);
  background: transparent;
  font-family: var(--font-main);
  font-weight: 500;
  font-size: 0.85rem;
  cursor: pointer;
  color: var(--text-secondary);
  transition: var(--transition);
}

.login-tabs button.active {
  background: var(--surface);
  color: var(--text-primary);
  box-shadow: var(--shadow-sm);
}

/* ===================== LOGIN SPLIT (rediseño showcase) ===================== */
.login-split { min-height: 100vh; display: grid; grid-template-columns: 1.05fr 0.95fr; }
.login-brand {
  position: relative; overflow: hidden; padding: clamp(2rem, 5vw, 4rem);
  display: flex; flex-direction: column; justify-content: space-between;
  border-right: 1px solid var(--border);
  background:
    radial-gradient(900px 500px at 18% 8%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 60%),
    radial-gradient(700px 600px at 92% 96%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 55%),
    var(--surface);
}
.login-brand .lb-grid {
  position: absolute; inset: 0;
  background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size: 46px 46px; opacity: 0.4;
  -webkit-mask-image: radial-gradient(60% 60% at 50% 40%, #000, transparent);
  mask-image: radial-gradient(60% 60% at 50% 40%, #000, transparent);
}
.login-brand > *:not(.lb-grid) { position: relative; z-index: 1; }
.lb-top { display: flex; align-items: center; gap: 0.8rem; }
.lb-logo { width: 44px; height: 44px; border-radius: 12px; overflow: hidden; flex: none; display: inline-grid; place-items: center; background: linear-gradient(135deg, var(--accent), #FF4249); box-shadow: 0 6px 18px rgba(228,24,29,0.32); color: #fff; font-weight: 800; font-size: 1.3rem; }
.lb-logo img { width: 100%; height: 100%; object-fit: contain; }
.lb-name { font-weight: 800; font-size: 1.2rem; letter-spacing: -0.02em; line-height: 1.1; color: var(--text-primary); }
.lb-name small { display: block; font-size: 0.68rem; font-weight: 600; color: var(--text-muted); letter-spacing: 0.06em; text-transform: uppercase; }
.lb-mid h1 { font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.05; font-weight: 800; letter-spacing: -0.03em; max-width: 13ch; color: var(--text-primary); }
.lb-mid h1 .hl { color: var(--accent); }
.lb-mid p { margin-top: 1.25rem; color: var(--text-secondary); font-size: 1rem; line-height: 1.6; max-width: 42ch; }
.lb-stats { display: flex; gap: 2rem; margin-top: 2.25rem; }
.lb-stats .n { font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; color: var(--text-primary); }
.lb-stats .l { font-size: 0.8rem; color: var(--text-muted); font-weight: 600; margin-top: 2px; }
.lb-foot { font-size: 0.8rem; color: var(--text-muted); font-weight: 500; }

.login-form-panel { display: grid; place-items: center; padding: 2.5rem; background: var(--bg-primary); }
.login-box { width: 100%; max-width: 380px; text-align: center; }
.login-box .eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); }
.login-box h2 { font-size: 1.7rem; font-weight: 800; letter-spacing: -0.02em; margin: 0.6rem 0 0.35rem; color: var(--text-primary); }
.login-box .login-sub { color: var(--text-secondary); font-size: 0.92rem; margin-bottom: 1.75rem; }
.login-box .field { margin-bottom: 1rem; text-align: left; }
.login-box .field label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--text-secondary); margin-bottom: 0.4rem; }
.login-box .field input {
  width: 100%; height: 46px; padding: 0 0.9rem; font-family: var(--font-main); font-size: 0.92rem;
  color: var(--text-primary); background: var(--surface-2); border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  transition: var(--transition); box-sizing: border-box;
}
.login-box .field input:focus { outline: none; border-color: var(--accent); background: var(--surface); box-shadow: var(--ring); }
.btn-login {
  width: 100%; height: 46px; font-family: var(--font-main); font-size: 0.95rem; font-weight: 700; cursor: pointer;
  border: none; border-radius: var(--radius-sm); background: var(--accent); color: #fff;
  box-shadow: 0 4px 14px rgba(228,24,29,0.28); transition: var(--transition);
}
.btn-login:hover { background: var(--accent-hover); transform: translateY(-1px); }
.login-box .divider { display: flex; align-items: center; gap: 0.9rem; margin: 1.4rem 0; color: var(--text-muted); font-size: 0.78rem; font-weight: 600; }
.login-box .divider::before, .login-box .divider::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.login-legal { margin-top: 1.75rem; padding-top: 1.25rem; border-top: 1px solid var(--border); font-size: 0.76rem; color: var(--text-muted); text-align: center; line-height: 1.7; }
.login-box #googleBtnContainer { display: flex; justify-content: center; }
.login-theme-toggle { position: fixed; top: 1.1rem; right: 1.1rem; z-index: 10; width: 40px; height: 40px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--text-secondary); cursor: pointer; font-size: 1.05rem; display: grid; place-items: center; box-shadow: var(--shadow-sm); }
.login-theme-toggle:hover { color: var(--accent); border-color: var(--accent-soft); background: var(--accent-soft); }
@media (max-width: 880px) {
  .login-split { grid-template-columns: 1fr; }
  .login-brand { display: none; }
}

/* ===================== FORMS ===================== */
.form-group {
  margin-bottom: 1rem;
}

.form-group label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-secondary);
  margin-bottom: 0.35rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.form-group input, .form-group select, .form-group textarea {
  width: 100%;
  padding: 0.65rem 0.85rem;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-family: var(--font-main);
  font-size: 0.9rem;
  color: var(--text-primary);
  background: var(--surface);
  transition: var(--transition);
  outline: none;
}

.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}

.form-group textarea { resize: vertical; min-height: 80px; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.6rem 1.2rem;
  border: none;
  border-radius: var(--radius-sm);
  font-family: var(--font-main);
  font-weight: 600;
  font-size: 0.85rem;
  cursor: pointer;
  transition: var(--transition);
  text-decoration: none;
}

.btn-primary {
  background: var(--accent);
  color: white;
  box-shadow: 0 4px 14px rgba(228,24,29,0.26);
}
.btn-primary:hover { background: var(--accent-hover); transform: translateY(-1px); }

.btn-success { background: var(--success); color: white; }
.btn-success:hover { background: #047857; }

.btn-warning { background: var(--warning); color: white; }
.btn-danger { background: var(--danger); color: white; }

.btn-outline {
  background: transparent;
  border: 1.5px solid var(--border);
  color: var(--text-secondary);
}
.btn-outline:hover { border-color: var(--accent); color: var(--accent); }

.btn-sm { padding: 0.4rem 0.8rem; font-size: 0.8rem; }
.btn-block { width: 100%; }
.btn-icon { padding: 0.5rem; min-width: 36px; }

/* ===================== LAYOUT ===================== */
.app-layout {
  display: flex;
  min-height: 100vh;
}

/* Sidebar */
.sidebar {
  width: var(--sidebar-width);
  background: var(--sidebar-bg);
  border-right: 1px solid var(--sidebar-border);
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 50;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease;
}

.sidebar-header {
  padding: 1.1rem 1.25rem;
  border-bottom: 1px solid var(--sidebar-border);
}

.sidebar-header .logo {
  display: flex;
  align-items: center;
  gap: 0.7rem;
}

.sidebar-header .logo-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--accent), #FF4249);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  color: #fff;
  font-weight: 800;
  font-size: 1.15rem;
  box-shadow: 0 4px 14px rgba(228, 24, 29, 0.32);
}

.sidebar-header .logo-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 12px;
}

.sidebar-header .logo-text-block { line-height: 1.2; }
.sidebar-header .logo-text {
  color: var(--text-primary);
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.sidebar-header .logo-subtitle {
  color: var(--text-muted);
  font-size: 0.65rem;
  margin-top: 1px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.sidebar-header h2 {
  color: var(--text-primary);
  font-size: 1rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.sidebar-header h2 .icon {
  width: 32px;
  height: 32px;
  border-radius: var(--radius-sm);
  background: var(--accent);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
}

.sidebar-header .company {
  color: var(--text-muted);
  font-size: 0.75rem;
  margin-top: 0.2rem;
}

.sidebar-nav {
  padding: 0.5rem 0.75rem;
  flex: 1;
  overflow-y: auto;
}

.sidebar-nav .section-title {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--text-muted);
  padding: 1rem 0.7rem 0.45rem;
  font-weight: 700;
}

.nav-item {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.6rem 0.75rem;
  border-radius: 10px;
  color: var(--sidebar-text);
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition);
  margin-bottom: 2px;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
  font-family: var(--font-main);
  position: relative;
}

.nav-item .nav-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  transition: var(--transition);
}
.nav-item span:not(.badge) { flex: 1; }
.nav-item:hover { background: var(--sidebar-hover); color: var(--text-primary); }
.nav-item.active { background: var(--sidebar-active); color: var(--sidebar-active-text); }
.nav-item.active::before {
  content: "";
  position: absolute;
  left: -0.75rem;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 20px;
  border-radius: 0 3px 3px 0;
  background: var(--accent);
}

.nav-item .badge {
  margin-left: auto;
  background: var(--accent);
  color: white;
  font-size: 0.65rem;
  padding: 0.1rem 0.5rem;
  border-radius: var(--radius-full);
  font-weight: 700;
}

.sidebar-footer {
  padding: 1rem 1.25rem;
  border-top: 1px solid var(--sidebar-border);
}

.user-info {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.user-avatar {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-full);
  background: linear-gradient(135deg, #FF4249, var(--accent));
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: 700;
  font-size: 0.85rem;
  object-fit: cover;
  overflow: hidden;
}

.user-details { flex: 1; min-width: 0; }
.user-details .name { color: var(--text-primary); font-size: 0.82rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-details .role { color: var(--text-muted); font-size: 0.7rem; font-weight: 600; }

.btn-logout {
  background: var(--surface-2);
  border: 1px solid var(--border);
  color: var(--text-secondary);
  padding: 0.5rem;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: var(--transition);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn-logout:hover { background: var(--danger-soft); color: var(--danger); border-color: transparent; }

/* Main content */
.main-content {
  margin-left: var(--sidebar-width);
  flex: 1;
  min-height: 100vh;
}

.main-header {
  height: var(--header-height);
  background: color-mix(in srgb, var(--bg-primary) 82%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1.5rem;
  position: sticky;
  top: 0;
  z-index: 30;
}

.main-header h1 {
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.header-actions { display: flex; align-items: center; gap: 0.5rem; }

.search-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--bg-secondary);
  border-radius: var(--radius-full);
  padding: 0.4rem 0.85rem;
  width: 280px;
}

.search-bar input {
  border: none;
  background: none;
  outline: none;
  font-family: var(--font-main);
  font-size: 0.85rem;
  color: var(--text-primary);
  width: 100%;
}

.search-bar input::placeholder { color: var(--text-muted); }

.main-body { padding: 1.5rem; }

/* Hamburger mobile */
.hamburger {
  display: none;
  background: none;
  border: none;
  font-size: 1.3rem;
  cursor: pointer;
  color: var(--text-primary);
  padding: 0.3rem;
}

/* ===================== STATS CARDS ===================== */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.stat-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 1.25rem;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
}

.stat-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); border-color: var(--border-strong); }

.stat-card .stat-icon {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  margin-bottom: 0.75rem;
}

.stat-card .stat-icon.blue { background: var(--accent-soft); color: var(--accent); }
.stat-card .stat-icon.green { background: var(--success-soft); color: var(--success); }
.stat-card .stat-icon.orange { background: var(--warning-soft); color: var(--warning); }
.stat-card .stat-icon.red { background: var(--danger-soft); color: var(--danger); }
.stat-card .stat-icon.cyan { background: var(--info-soft); color: var(--info); }

.stat-card .stat-value { font-size: 1.85rem; font-weight: 800; line-height: 1.15; letter-spacing: -0.03em; }
.stat-card .stat-label { font-size: 0.8rem; color: var(--text-secondary); font-weight: 600; margin-top: 0.15rem; }

/* ===================== RESUMEN ===================== */
.resumen-cols { display: grid; grid-template-columns: 1.6fr 1fr; gap: 1.25rem; align-items: start; }
@media (max-width: 1100px) { .resumen-cols { grid-template-columns: 1fr; } }
.act-row { display: flex; align-items: center; gap: 0.8rem; padding: 0.85rem 1.25rem; border-top: 1px solid var(--border); }
.act-row:first-child { border-top: none; }
.act-row .act-ic { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex: none; }
.act-row .act-ic svg { width: 16px; height: 16px; }
.act-row .act-ic.oc { background: var(--accent-soft); color: var(--accent); }
.act-row .act-ic.tr { background: var(--warning-soft); color: var(--warning); }
.act-row .act-ic.an { background: var(--danger-soft); color: var(--danger); }
.act-row .act-tx { flex: 1; min-width: 0; }
.act-row .act-tx .t { font-size: 0.86rem; font-weight: 600; }
.act-row .act-tx .d { font-size: 0.76rem; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.act-row .act-when { font-size: 0.74rem; color: var(--text-muted); font-weight: 600; white-space: nowrap; }

/* ===================== TABLE ===================== */
.table-wrapper {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.table-header {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.table-header h3 { font-size: 1rem; font-weight: 700; }

.table-filters { display: flex; gap: 0.5rem; flex-wrap: wrap; }

.filter-btn {
  padding: 0.35rem 0.75rem;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-full);
  background: transparent;
  font-family: var(--font-main);
  font-size: 0.78rem;
  font-weight: 500;
  color: var(--text-secondary);
  cursor: pointer;
  transition: var(--transition);
}

.filter-btn:hover { border-color: var(--accent); color: var(--accent); }
.filter-btn.active { background: var(--accent); border-color: var(--accent); color: white; }

table {
  width: 100%;
  border-collapse: collapse;
}

table thead th {
  padding: 0.75rem 1rem;
  text-align: left;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-muted);
  border-bottom: 1px solid var(--border);
  background: var(--bg-secondary);
}

table tbody tr {
  border-bottom: 1px solid var(--border);
  transition: var(--transition);
  cursor: pointer;
}

table tbody tr:hover { background: var(--surface-hover); }
table tbody tr:last-child { border-bottom: none; }

table td {
  padding: 0.75rem 1rem;
  font-size: 0.85rem;
  vertical-align: middle;
}

.td-numero { font-family: var(--font-mono); font-size: 0.8rem; font-weight: 500; color: var(--accent); }
.td-cliente { font-weight: 500; }
.td-muted { color: var(--text-muted); font-size: 0.8rem; }

/* Status badges */
.badge-status {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.2rem 0.6rem;
  border-radius: var(--radius-full);
  font-size: 0.72rem;
  font-weight: 600;
}

.badge-status.pendiente { background: var(--warning-soft); color: var(--warning); }
.badge-status.en_proceso { background: var(--accent-soft); color: var(--accent); }
.badge-status.completado { background: var(--success-soft); color: var(--success); }
.badge-status.cancelado { background: var(--danger-soft); color: var(--danger); }

.badge-tipo {
  display: inline-flex;
  padding: 0.2rem 0.55rem;
  border-radius: var(--radius-full);
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.badge-tipo.traslado { background: var(--info-soft); color: var(--info); }
.badge-tipo.oc { background: #f3e8ff; color: #7c3aed; }

.table-empty {
  text-align: center;
  padding: 3rem 1rem;
  color: var(--text-muted);
}

.table-empty .empty-icon { font-size: 2.5rem; margin-bottom: 0.75rem; }
.table-empty p { font-size: 0.9rem; }

/* ===================== MODAL ===================== */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(26,29,46,0.5);
  backdrop-filter: blur(4px);
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: var(--transition);
}

.modal-overlay.active { opacity: 1; visibility: visible; }

.modal {
  background: var(--surface);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  width: 100%;
  max-width: 700px;
  max-height: 90vh;
  overflow-y: auto;
  transform: translateY(20px) scale(0.97);
  transition: 0.3s ease;
}

.modal-overlay.active .modal { transform: translateY(0) scale(1); }

.modal-header {
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  background: var(--surface);
  z-index: 5;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.modal-header h2 { font-size: 1.1rem; font-weight: 700; }

.modal-close {
  background: none;
  border: none;
  font-size: 1.3rem;
  cursor: pointer;
  color: var(--text-muted);
  padding: 0.25rem;
  border-radius: var(--radius-sm);
  transition: var(--transition);
}
.modal-close:hover { background: var(--bg-secondary); color: var(--text-primary); }

.modal-body { padding: 1.5rem; }
.modal-footer {
  padding: 1rem 1.5rem;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

/* ===================== DETAIL VIEW ===================== */
.detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.detail-field {
  padding: 0.75rem;
  background: var(--bg-secondary);
  border-radius: var(--radius-sm);
}

.detail-field .label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-muted);
  font-weight: 600;
  margin-bottom: 0.2rem;
}

.detail-field .value {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--text-primary);
}

.detail-field.full { grid-column: 1 / -1; }
.detail-field .value.mono { font-family: var(--font-mono); }
.detail-field .value.big { font-size: 1.2rem; font-weight: 700; color: var(--accent); }

/* Items table inside modal */
.items-section { margin-top: 1rem; }
.items-section h4 { font-size: 0.85rem; font-weight: 700; margin-bottom: 0.5rem; }

.items-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.items-table th {
  padding: 0.5rem 0.65rem;
  text-align: left;
  background: var(--bg-secondary);
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  color: var(--text-muted);
  font-weight: 700;
  border-bottom: 1px solid var(--border);
}

.items-table td {
  padding: 0.5rem 0.65rem;
  border-bottom: 1px solid var(--border);
}

.items-table tr:last-child td { border-bottom: none; }

.items-table td.right { text-align: right; font-family: var(--font-mono); }

/* ===================== COMMENTS ===================== */
.comments-section {
  margin-top: 1.5rem;
  border-top: 1px solid var(--border);
  padding-top: 1.25rem;
}

.comments-section h4 {
  font-size: 0.9rem;
  font-weight: 700;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.comment {
  display: flex;
  gap: 0.75rem;
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border);
}

.comment:last-of-type { border-bottom: none; }

.comment-avatar {
  width: 32px;
  height: 32px;
  border-radius: var(--radius-full);
  background: var(--accent-soft);
  color: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.75rem;
  flex-shrink: 0;
}

.comment-body { flex: 1; min-width: 0; }

.comment-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.25rem;
}

.comment-header .name { font-weight: 600; font-size: 0.82rem; }
.comment-header .time { color: var(--text-muted); font-size: 0.72rem; }
.comment-header .role-badge {
  font-size: 0.6rem;
  padding: 0.1rem 0.4rem;
  border-radius: var(--radius-full);
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 700;
  text-transform: uppercase;
}

.comment-text { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.5; }

.comment-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.5rem;
}

.comment-attachment {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.25rem 0.6rem;
  background: var(--bg-secondary);
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  color: var(--accent);
  text-decoration: none;
  transition: var(--transition);
}
.comment-attachment:hover { background: var(--accent-soft); }

.comment-form {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.75rem;
  align-items: flex-start;
}

.comment-form textarea {
  flex: 1;
  padding: 0.6rem 0.85rem;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-family: var(--font-main);
  font-size: 0.85rem;
  resize: vertical;
  min-height: 60px;
  outline: none;
  transition: var(--transition);
}

.comment-form textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }

.comment-form-actions {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

/* File upload area */
.upload-area {
  border: 2px dashed var(--border);
  border-radius: var(--radius-md);
  padding: 2rem;
  text-align: center;
  cursor: pointer;
  transition: var(--transition);
  background: var(--bg-secondary);
}

.upload-area:hover { border-color: var(--accent); background: var(--accent-soft); }
.upload-area.dragover { border-color: var(--accent); background: var(--accent-soft); }
.upload-area .upload-icon { font-size: 2rem; margin-bottom: 0.5rem; }
.upload-area p { font-size: 0.85rem; color: var(--text-secondary); }
.upload-area .upload-hint { font-size: 0.75rem; color: var(--text-muted); margin-top: 0.25rem; }

.file-preview {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 0.85rem;
  background: var(--bg-secondary);
  border-radius: var(--radius-sm);
  margin-top: 0.5rem;
}

.file-preview .file-info { flex: 1; min-width: 0; }
.file-preview .file-name { font-size: 0.82rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.file-preview .file-size { font-size: 0.7rem; color: var(--text-muted); }
.file-preview .file-remove {
  background: none;
  border: none;
  color: var(--danger);
  cursor: pointer;
  font-size: 1rem;
  padding: 0.2rem;
}

/* Upload form inline files */
.attached-files {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.5rem;
}

.attached-file {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.2rem 0.5rem;
  background: var(--accent-soft);
  border-radius: var(--radius-sm);
  font-size: 0.72rem;
  color: var(--accent);
}

.attached-file button {
  background: none;
  border: none;
  color: var(--danger);
  cursor: pointer;
  font-size: 0.8rem;
  padding: 0;
  margin-left: 0.2rem;
}

/* ===================== PDF VIEWER ===================== */
.pdf-viewer {
  background: var(--bg-secondary);
  border-radius: var(--radius-sm);
  padding: 0.5rem;
  margin-bottom: 1rem;
}

.pdf-viewer iframe {
  width: 100%;
  height: 300px;
  border: none;
  border-radius: var(--radius-sm);
}

.pdf-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  color: var(--accent);
  font-size: 0.82rem;
  text-decoration: none;
  font-weight: 500;
}
.pdf-link:hover { text-decoration: underline; }

/* ===================== ADMIN USERS TABLE ===================== */
.user-table-actions { display: flex; gap: 0.3rem; }

/* ===================== TOAST NOTIFICATIONS ===================== */
.toast-container {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 200;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.toast {
  padding: 0.75rem 1.25rem;
  border-radius: var(--radius-sm);
  color: white;
  font-size: 0.85rem;
  font-weight: 500;
  box-shadow: var(--shadow-md);
  animation: slideIn 0.3s ease;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  max-width: 350px;
}

.toast.success { background: var(--success); }
.toast.error { background: var(--danger); }
.toast.info { background: var(--accent); }

@keyframes slideIn {
  from { opacity: 0; transform: translateX(40px); }
  to { opacity: 1; transform: translateX(0); }
}

/* ===================== LOADING ===================== */
.spinner {
  width: 20px;
  height: 20px;
  border: 2.5px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  display: inline-block;
}

@keyframes spin { to { transform: rotate(360deg); } }

.loading-overlay {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  border-radius: inherit;
}

/* ===================== RESPONSIVE ===================== */
@media (max-width: 768px) {
  .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); }
  .main-content { margin-left: 0; }
  .hamburger { display: block; }
  .search-bar { width: 100%; order: 10; }
  .main-header { flex-wrap: wrap; height: auto; padding: 0.75rem 1rem; gap: 0.5rem; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .detail-grid { grid-template-columns: 1fr; }
  .modal { max-width: 95vw; }
  table { font-size: 0.8rem; }
  table td, table thead th { padding: 0.5rem 0.65rem; }

  /* 🆕 29/06/2026 — Módulos de datos (Ventas, Quiebres, Monitor Digip, Finanzas) en mobile:
     el header (título + toolbar) se apila, y las tablas anchas scrollean adentro de su
     tarjeta en vez de aplastarse o romper el ancho de la página. */
  .table-header { flex-direction: column; align-items: stretch !important; gap: 0.5rem; }
  .table-header > h3 { margin: 0; }
  .data-table th, .data-table td { white-space: nowrap; }
  /* Filas de botones de período/tabs: que no fuercen ancho */
  .ventas-per, .ventas-tab, .quiebres-per, .btn-sm { white-space: nowrap; }
}

@media (max-width: 480px) {
  .stats-grid { grid-template-columns: 1fr; }
  .main-body { padding: 1rem 0.75rem; }
  .table-header { padding: 0.85rem 0.9rem; }
  .btn-sm { padding: 0.45rem 0.7rem; font-size: 0.78rem; }
  /* KPIs cómodos en pantallas chicas: 2 columnas máx */
  #ventas-kpis, #quiebres-kpis, #finanzas-kpis { grid-template-columns: 1fr 1fr !important; }
}

/* ===================== SCROLLBAR ===================== */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }

/* ===================== MISC ===================== */
.text-center { text-align: center; }
.text-right { text-align: right; }
.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.gap-row { display: flex; gap: 0.75rem; }
.gap-row > * { flex: 1; }
.hidden { display: none !important; }
.overflow-x { overflow-x: auto; }

/* Sidebar overlay for mobile */
.sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(26,29,46,0.4);
  z-index: 40;
}
.sidebar-overlay.active { display: block; }

/* Select for status change */
.status-select {
  padding: 0.25rem 0.5rem;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-family: var(--font-main);
  font-size: 0.78rem;
  font-weight: 500;
  cursor: pointer;
  outline: none;
  background: var(--surface);
}

/* ---------- Paneles / tablas ---------- */
.table-wrapper {
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: var(--shadow-sm);
}
.table-header {
  padding: 1.05rem 1.35rem;
  background: var(--surface-2);
}
.table-header h3 { font-weight: 700; letter-spacing: -0.01em; color: var(--text-primary); }
table thead th {
  font-size: 0.71rem !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  color: var(--text-muted) !important;
  background: var(--bg-secondary) !important;
}
table tbody tr { transition: background 120ms ease; }
table tbody tr:hover { background: var(--surface-hover); }

/* ---------- Botones ---------- */
.btn {
  border-radius: 10px;
  font-weight: 600;
  letter-spacing: -0.01em;
  transition: transform 140ms ease, box-shadow 140ms ease, background 140ms ease, border-color 140ms ease;
}
.btn-primary { background: var(--accent); box-shadow: 0 1px 2px rgba(228,24,29,0.25); }
.btn-primary:hover { background: var(--accent-hover); transform: translateY(-1px); box-shadow: 0 6px 16px rgba(228,24,29,0.28); }
.btn-outline { border: 1px solid var(--border-strong); }
.btn-outline:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.btn:active { transform: translateY(0); }

/* ---------- Inputs / selects (anillo de foco elegante) ---------- */
input:focus, select:focus, textarea:focus {
  outline: none;
  box-shadow: var(--ring);
  border-color: var(--accent) !important;
}

/* ---------- Badges de estado ---------- */
.badge-status, .badge-tipo { border-radius: 999px; font-weight: 600; letter-spacing: 0.01em; }

/* ---------- Modales ---------- */
.modal-overlay { background: rgba(17,22,38,0.55); backdrop-filter: blur(3px); }
.modal { border-radius: 16px; box-shadow: var(--shadow-lg); border: 1px solid var(--border); }
.modal-header { border-bottom: 1px solid var(--border); }

/* ---------- Scrollbar ---------- */
* { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 999px; border: 2px solid transparent; background-clip: content-box; }
*::-webkit-scrollbar-thumb:hover { background: var(--text-muted); background-clip: content-box; }
*::-webkit-scrollbar-track { background: transparent; }

/* ---------- Accesibilidad ---------- */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

/* =====================================================================
   MÓDULO EN DESARROLLO (placeholder genérico — usado por «Tiendas»)
   ===================================================================== */
.dev-placeholder {
  display: flex; align-items: center; justify-content: center;
  min-height: calc(100vh - var(--header-height) - 6rem);
  padding: 2rem 1rem;
}
.dev-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: var(--shadow-md);
  padding: 3rem 2.5rem;
  max-width: 460px; width: 100%;
  text-align: center;
  animation: devUp 0.5s ease;
}
@keyframes devUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
.dev-icon {
  width: 76px; height: 76px; margin: 0 auto 1.4rem;
  display: flex; align-items: center; justify-content: center;
  border-radius: 20px;
  background: linear-gradient(135deg, #4A1012, #E4181D);
  color: #fff;
  box-shadow: 0 10px 26px rgba(228,24,29,0.32);
}
.dev-icon svg { width: 38px; height: 38px; }
.dev-tag {
  display: inline-block;
  font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--warning); background: var(--warning-soft);
  padding: 4px 12px; border-radius: 999px; margin-bottom: 0.9rem;
}
.dev-title { font-size: 1.7rem; font-weight: 700; letter-spacing: -0.02em; color: var(--text-primary); margin-bottom: 0.6rem; }
.dev-text { font-size: 0.98rem; color: var(--text-secondary); line-height: 1.6; margin-bottom: 1.6rem; }
.dev-text strong { color: var(--accent); }
.dev-progress { height: 7px; background: var(--bg-secondary); border-radius: 999px; overflow: hidden; margin-bottom: 0.8rem; }
.dev-progress-bar {
  height: 100%; width: 38%;
  background: linear-gradient(90deg, #E4181D, #FF4249);
  border-radius: 999px;
  animation: devProg 2.4s ease-in-out infinite;
}
@keyframes devProg {
  0% { width: 18%; margin-left: 0; }
  50% { width: 55%; }
  100% { width: 18%; margin-left: 82%; }
}
.dev-hint { font-size: 0.8rem; color: var(--text-muted); }

/* ============================================================
   Barra lateral colapsable (09/09/2026)
   ============================================================ */
.main-content { transition: margin-left .28s ease; }
.sidebar { transition: transform .28s ease; }

.sidebar-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 10px; flex: none;
  border: 1px solid var(--border); background: var(--surface);
  color: var(--text-secondary); cursor: pointer; transition: var(--transition);
}
.sidebar-toggle:hover { background: var(--surface-hover); color: var(--text-primary); border-color: var(--border-strong); }
.sidebar-toggle svg { display: block; }

/* Colapsada: se esconde y el contenido ocupa todo el ancho. */
body.sidebar-collapsed .sidebar { transform: translateX(-100%); }
body.sidebar-collapsed .main-content { margin-left: 0; }

/* ============================================================
   Modulo OC - rediseno profesional (09/09/2026)
   ============================================================ */
.oc-hero {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap; padding: 1.15rem 1.35rem; margin-bottom: 1.15rem;
  border: 1px solid var(--border); border-radius: var(--radius-lg);
  background:
    radial-gradient(120% 150% at 0% 0%, color-mix(in srgb, var(--accent) 13%, transparent), transparent 55%),
    var(--surface);
  box-shadow: var(--shadow-sm);
}
.oc-hero-main { display: flex; align-items: center; gap: 0.9rem; }
.oc-hero-icon {
  width: 46px; height: 46px; border-radius: 13px; flex: none;
  display: inline-flex; align-items: center; justify-content: center; font-size: 1.35rem;
  background: linear-gradient(135deg, var(--accent), #FF4249); color: #fff;
  box-shadow: 0 6px 18px rgba(228, 24, 29, 0.30);
}
.oc-hero-title { font-size: 1.22rem; font-weight: 800; letter-spacing: -0.02em; margin: 0; }
.oc-hero-sub { font-size: 0.83rem; color: var(--text-secondary); margin: 0.2rem 0 0; max-width: 68ch; line-height: 1.5; }
.oc-steps { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.oc-step {
  display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.75rem; font-weight: 600;
  color: var(--text-secondary); background: var(--surface-2); border: 1px solid var(--border);
  border-radius: var(--radius-full); padding: 0.3rem 0.75rem;
}
.oc-step b {
  display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%;
  background: var(--accent-soft); color: var(--accent); font-size: 0.7rem;
}

.oc-tabs { display: flex; gap: 0.4rem; margin-bottom: 1.1rem; flex-wrap: wrap; }

.oc-card {
  border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface);
  margin-bottom: 1.1rem; overflow: hidden; box-shadow: var(--shadow-sm);
}
.oc-card-head {
  display: flex; align-items: center; gap: 0.7rem; padding: 0.8rem 1.15rem;
  border-bottom: 1px solid var(--border); background: var(--surface-2);
}
.oc-card-num {
  display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%;
  background: var(--accent); color: #fff; font-weight: 800; font-size: 0.82rem; flex: none;
  box-shadow: 0 3px 8px rgba(228, 24, 29, 0.28);
}
.oc-card-head h3 { margin: 0; font-size: 0.98rem; font-weight: 700; }
.oc-card-hint { margin-left: auto; font-size: 0.75rem; color: var(--text-muted); font-weight: 600; }
.oc-card-body { padding: 1.15rem; }

/* Panel SAP integrado */
.oc-sap {
  border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface);
  overflow: hidden; box-shadow: var(--shadow-sm); margin-top: 1.1rem;
}
.oc-sap-head {
  display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; padding: 0.8rem 1.15rem;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 9%, var(--surface-2)), var(--surface-2));
}
.oc-sap-title { display: flex; align-items: center; gap: 0.5rem; font-weight: 700; font-size: 0.95rem; }
.oc-sap-title .dot { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); flex: none; }
.oc-sap-body { padding: 1rem 1.15rem; }

/* =====================================================================
   NOVA GESTIÓNDOCS v2.0.0 · EXECUTIVE UI
   Rediseño global: rail lateral + panel gerencial + login corporativo
   ===================================================================== */
:root {
  --nova-blue: #B01015;
  --nova-blue-2: #E4181D;
  --nova-blue-soft: #FFF0F1;
  --nova-ink: #101828;
  --nova-muted: #667085;
  --nova-line: #e6eaf0;
  --sidebar-width: 76px;
  --header-height: 72px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --shadow-sm: 0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.04);
  --shadow-md: 0 10px 30px rgba(16,24,40,.08);
}

/* ---------- Login corporativo ---------- */
body.nova-login-page {
  min-height: 100vh;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 10% 12%, rgba(228,24,29,.08), transparent 28%),
    radial-gradient(circle at 92% 90%, rgba(29,78,216,.06), transparent 26%),
    linear-gradient(180deg, #f8fafc 0%, #f5f7fb 100%);
}
[data-theme="dark"] body.nova-login-page {
  background:
    radial-gradient(circle at 10% 12%, rgba(255,66,73,.13), transparent 28%),
    radial-gradient(circle at 92% 90%, rgba(228,24,29,.08), transparent 26%),
    #0b0f17;
}
.nova-login-stage {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 48px 20px 70px;
  position: relative;
}
.nova-login-stage::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .34;
  background-image:
    linear-gradient(rgba(148,163,184,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,163,184,.08) 1px, transparent 1px);
  background-size: 46px 46px;
  -webkit-mask-image: radial-gradient(circle at center, #000 10%, transparent 72%);
  mask-image: radial-gradient(circle at center, #000 10%, transparent 72%);
}
.nova-login-card {
  width: min(100%, 430px);
  background: color-mix(in srgb, var(--surface) 96%, transparent);
  border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
  border-radius: 22px;
  padding: 34px 34px 28px;
  box-shadow: 0 24px 70px rgba(16,24,40,.12), 0 2px 8px rgba(16,24,40,.04);
  backdrop-filter: blur(18px);
  position: relative;
  z-index: 1;
}
[data-theme="dark"] .nova-login-card { box-shadow: 0 26px 80px rgba(0,0,0,.5); }
.nova-login-brandmark { display:flex; align-items:center; gap:12px; margin-bottom:34px; }
.nova-login-logo {
  width: 48px; height: 48px; border-radius: 15px; overflow:hidden; background:#fff;
  display:grid; place-items:center; box-shadow: 0 8px 22px rgba(228,24,29,.17);
}
.nova-login-logo img { width:100%; height:100%; object-fit:cover; }
.nova-login-wordmark { font-size:1.22rem; font-weight:800; line-height:1; letter-spacing:-.03em; color:var(--text-primary); }
.nova-login-product { margin-top:5px; font-size:.64rem; color:var(--text-muted); font-weight:800; letter-spacing:.16em; }
.nova-login-kicker { font-size:.69rem; font-weight:800; letter-spacing:.15em; color:var(--accent); }
.nova-login-heading h1 { margin:8px 0 8px; font-size:2rem; line-height:1.08; letter-spacing:-.04em; font-weight:800; color:var(--text-primary); }
.nova-login-heading p { color:var(--text-secondary); font-size:.9rem; line-height:1.6; margin-bottom:25px; }
.nova-login-form { display:grid; gap:16px; }
.nova-field { margin:0 !important; }
.nova-field label { font-size:.77rem !important; font-weight:700 !important; text-transform:none !important; letter-spacing:0 !important; color:var(--text-secondary) !important; margin-bottom:7px !important; }
.nova-input-wrap { position:relative; }
.nova-input-wrap svg {
  position:absolute; left:14px; top:50%; transform:translateY(-50%); width:17px; height:17px;
  fill:none; stroke:var(--text-muted); stroke-width:1.8; pointer-events:none;
}
.nova-input-wrap input {
  width:100%; height:49px; padding:0 14px 0 42px !important; border:1px solid var(--border-strong) !important;
  border-radius:11px !important; background:var(--surface-2) !important; color:var(--text-primary) !important;
  font:inherit; font-size:.9rem !important; outline:none; transition:.18s ease;
}
.nova-input-wrap input:focus { border-color:var(--accent) !important; background:var(--surface) !important; box-shadow:var(--ring) !important; }
.nova-login-submit {
  margin-top:2px; height:49px; border-radius:11px; font-size:.92rem; letter-spacing:-.01em;
  box-shadow:0 8px 22px rgba(228,24,29,.22);
}
.nova-login-submit:disabled { opacity:.65; transform:none; cursor:wait; }
.nova-login-error {
  display:none; margin:14px 0 0; padding:11px 13px; border:1px solid color-mix(in srgb,var(--danger) 24%,transparent);
  border-radius:10px; background:var(--danger-soft); color:var(--danger); font-size:.8rem; line-height:1.45; text-align:left;
}
.nova-login-divider { display:flex; align-items:center; gap:12px; color:var(--text-muted); font-size:.72rem; margin:22px 0 17px; }
.nova-login-divider::before,.nova-login-divider::after { content:""; height:1px; background:var(--border); flex:1; }
.nova-login-divider span { width:22px; text-align:center; }
.nova-google-wrap { min-height:42px; display:flex; justify-content:center; align-items:center; }
.nova-login-spinner { min-height:42px; display:flex; justify-content:center; align-items:center; gap:10px; color:var(--text-secondary); font-size:.8rem; }
.nova-login-foot {
  display:flex; justify-content:center; align-items:center; gap:7px; margin-top:24px; padding-top:18px;
  border-top:1px solid var(--border); color:var(--text-muted); font-size:.72rem; font-weight:600;
}
.nova-login-foot svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.8; }
.nova-login-meta { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); color:var(--text-muted); font-size:.68rem; white-space:nowrap; z-index:1; }
.nova-login-theme { top:18px; right:18px; width:38px; height:38px; font-size:1rem; box-shadow:none; }
@media (max-width:520px) {
  .nova-login-stage { padding:36px 14px 64px; }
  .nova-login-card { padding:28px 22px 24px; border-radius:18px; }
  .nova-login-meta { font-size:.62rem; }
}

/* ---------- Shell gerencial ---------- */
.app-container { min-height:100vh; background:var(--bg-primary); }
.sidebar {
  width:var(--sidebar-width);
  background:var(--surface);
  border-right:1px solid var(--border);
  box-shadow:none;
  overflow:visible;
}
.sidebar-header { height:var(--header-height); padding:0; display:grid; place-items:center; border-bottom:1px solid var(--border); }
.nova-rail-brand {
  width:42px; height:42px; padding:0; border:0; border-radius:13px; overflow:hidden; background:#fff;
  cursor:pointer; display:grid; place-items:center; box-shadow:0 5px 16px rgba(228,24,29,.15); transition:.18s ease;
}
.nova-rail-brand:hover { transform:translateY(-1px) scale(1.02); box-shadow:0 8px 20px rgba(228,24,29,.2); }
.nova-rail-brand img { width:100%; height:100%; object-fit:cover; }
.sidebar-nav { padding:11px 9px 12px; overflow-y:auto; overflow-x:hidden; scrollbar-width:none; }
.sidebar-nav::-webkit-scrollbar { display:none; }
.sidebar-nav .section-title { height:9px; margin:5px 10px 8px; padding:0; font-size:0; border-top:1px solid var(--border); opacity:.9; }
.sidebar-nav .section-title:first-child { display:none; }
.nav-item {
  position:relative; width:54px; height:46px; padding:0; margin:2px 1px; border-radius:11px;
  justify-content:center; gap:0; color:var(--text-secondary); background:transparent; overflow:visible;
}
.nav-item .nav-icon { width:20px; height:20px; flex:none; }
.nav-item > span:not(.badge) { display:none; }
.nav-item:hover { background:var(--surface-hover); color:var(--text-primary); }
.nav-item.active { background:var(--accent-soft); color:var(--accent); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 11%,transparent); }
.nav-item.active::before { display:none; }
.nav-item .badge { position:absolute; top:3px; right:2px; margin:0; min-width:16px; height:16px; padding:0 4px; font-size:.58rem; line-height:16px; box-shadow:0 0 0 2px var(--surface); }
.nav-item .badge:not(#badge-ssr) { display:none !important; }
.sidebar-footer { margin-top:auto; padding:10px 9px 14px; border-top:1px solid var(--border); display:flex; justify-content:center; }
.rail-help { width:42px; height:42px; border-radius:11px; margin:0 !important; font-weight:800; }
.main-content { margin-left:var(--sidebar-width); min-width:0; }
.main-header {
  height:var(--header-height); padding:0 18px 0 20px; background:color-mix(in srgb,var(--surface) 92%,transparent);
  backdrop-filter:blur(16px); border-bottom:1px solid var(--border); box-shadow:0 1px 0 rgba(16,24,40,.01);
}
.nova-header-left { display:flex; align-items:center; gap:12px; min-width:0; }
.sidebar-toggle {
  width:38px; height:38px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2);
  color:var(--text-secondary); display:grid; place-items:center; cursor:pointer; transition:.18s ease;
}
.sidebar-toggle:hover { color:var(--accent); border-color:color-mix(in srgb,var(--accent) 30%,var(--border)); background:var(--accent-soft); }
.nova-header-context { min-width:0; }
.nova-header-eyebrow { font-size:.59rem; line-height:1.1; font-weight:800; letter-spacing:.15em; color:var(--text-muted); margin-bottom:3px; }
.nova-header-context h2 { font-size:1.08rem; line-height:1.2; font-weight:800; letter-spacing:-.025em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nova-header-actions { gap:8px !important; }
.nova-icon-btn {
  position:relative; width:37px; height:37px; display:grid; place-items:center; border:1px solid var(--border); border-radius:10px;
  background:var(--surface); color:var(--text-secondary); cursor:pointer; transition:.18s ease; font-size:.9rem;
}
.nova-icon-btn:hover { color:var(--accent); background:var(--accent-soft); border-color:color-mix(in srgb,var(--accent) 22%,var(--border)); }
.nova-icon-btn.nova-sound-active { color:var(--accent); background:var(--accent-soft); border-color:color-mix(in srgb,var(--accent) 40%,var(--border)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 8%,transparent); }
.nova-notif-wrap { position:relative; }
.nova-notif-badge { position:absolute; top:-5px; right:-5px; background:var(--danger); color:#fff; border:2px solid var(--surface); border-radius:999px; min-width:18px; height:18px; line-height:14px; text-align:center; padding:0 3px; font-size:.58rem; font-weight:800; }
.nova-novedades-panel {
  position:absolute; right:0; top:calc(100% + 10px); width:350px; max-height:470px; overflow-y:auto;
  background:var(--surface); border:1px solid var(--border); border-radius:14px; box-shadow:var(--shadow-lg); z-index:2000;
}
.nova-novedades-head { padding:13px 14px 10px; position:sticky; top:0; background:var(--surface); border-bottom:1px solid var(--border); z-index:2; display:flex; justify-content:space-between; align-items:center; gap:10px; }
.nova-novedades-title { display:grid; gap:2px; }
.nova-novedades-title strong { font-size:.84rem; }
.nova-novedades-title span { font-size:.67rem; color:var(--text-muted); }
.nova-novedades-head select { border:1px solid var(--border); border-radius:8px; background:var(--surface-2); color:var(--text-primary); padding:5px 7px; font-size:.68rem; }
.nova-novedades-tools { display:flex; gap:6px; padding:9px 12px; border-bottom:1px solid var(--border); }
.nova-novedades-tools .btn { font-size:.65rem; padding:.3rem .48rem; }
.nova-user-pill {
  height:44px; display:flex; align-items:center; gap:9px; padding:4px 5px 4px 6px; min-width:188px;
  border:1px solid var(--border); border-radius:999px; background:var(--surface); box-shadow:var(--shadow-sm);
}
.nova-user-pill .user-avatar { width:34px; height:34px; font-size:.77rem; background:linear-gradient(145deg,#E4181D,#B01015); }
.nova-user-pill .user-details { min-width:0; padding-right:4px; }
.nova-user-pill .user-name { font-size:.74rem; line-height:1.2; }
.nova-user-pill .user-role { font-size:.62rem; margin-top:2px; }
.nova-user-help,.nova-user-logout { width:29px; height:29px; border:0; border-radius:50%; background:transparent; color:var(--text-muted); cursor:pointer; display:grid; place-items:center; font-size:.72rem; transition:.18s ease; }
.nova-user-help:hover { background:var(--accent-soft); color:var(--accent); }
.nova-user-logout:hover { background:var(--danger-soft); color:var(--danger); }
.nova-user-logout svg { width:15px; height:15px; }
.main-body { padding:28px 30px 40px; max-width:1600px; margin:0 auto; }
body.sidebar-collapsed .sidebar { transform:translateX(-100%); }
body.sidebar-collapsed .main-content { margin-left:0; }

/* ---------- Executive home ---------- */
.nova-exec-page { display:grid; gap:22px; }
.nova-exec-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; padding:4px 2px 0; }
.nova-section-kicker { color:var(--accent); font-size:.63rem; font-weight:800; letter-spacing:.14em; line-height:1.25; }
.nova-exec-hero h1 { margin:7px 0 4px; font-size:clamp(1.8rem,2.7vw,2.45rem); line-height:1.08; letter-spacing:-.045em; font-weight:800; color:var(--text-primary); }
.nova-exec-hero p { color:var(--text-secondary); font-size:.9rem; }
.nova-exec-date { display:flex; align-items:center; gap:9px; padding:10px 13px; border:1px solid var(--border); border-radius:12px; background:var(--surface); box-shadow:var(--shadow-sm); }
.nova-date-dot { width:8px; height:8px; border-radius:50%; background:var(--success); box-shadow:0 0 0 4px var(--success-soft); }
.nova-exec-date div { display:grid; gap:1px; }
.nova-exec-date strong { font-size:.72rem; text-transform:capitalize; color:var(--text-primary); }
.nova-exec-date small { font-size:.62rem; color:var(--text-muted); }
.nova-kpi-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:0; }
.nova-kpi-card { padding:17px 18px 16px; border-radius:15px; box-shadow:var(--shadow-sm); min-width:0; }
.nova-kpi-card:hover { transform:translateY(-2px); box-shadow:0 10px 28px rgba(16,24,40,.08); }
.nova-kpi-top { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:12px; }
.nova-kpi-card .stat-icon { width:36px; height:36px; margin:0; border-radius:10px; }
.nova-kpi-card .stat-icon svg { width:18px; height:18px; }
.nova-kpi-tag { font-size:.58rem; color:var(--text-muted); font-weight:700; padding:4px 7px; border-radius:999px; background:var(--bg-secondary); white-space:nowrap; }
.nova-kpi-card .stat-value { font-size:1.85rem; letter-spacing:-.045em; }
.nova-kpi-card .stat-label { margin-top:4px; font-size:.78rem; font-weight:700; color:var(--text-primary); }
.nova-kpi-foot { margin-top:5px; font-size:.64rem; color:var(--text-muted); }
.nova-quick-panel { background:var(--surface); border:1px solid var(--border); border-radius:15px; padding:16px 17px 17px; box-shadow:var(--shadow-sm); }
.nova-panel-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:14px; margin-bottom:13px; }
.nova-panel-heading h3 { font-size:.95rem; margin-top:3px; letter-spacing:-.02em; }
.nova-panel-heading > span { color:var(--text-muted); font-size:.68rem; }
.nova-quick-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.nova-quick-card {
  width:100%; min-width:0; display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:10px; text-align:left;
  padding:12px; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); color:var(--text-primary); cursor:pointer; transition:.18s ease;
}
.nova-quick-card:hover { transform:translateY(-1px); border-color:color-mix(in srgb,var(--accent) 28%,var(--border)); background:var(--surface); box-shadow:var(--shadow-sm); }
.nova-quick-card .qic { width:36px; height:36px; display:grid; place-items:center; border-radius:10px; font-size:1rem; font-weight:800; }
.qic-blue,.qic-indigo { color:var(--accent); background:var(--accent-soft); }.qic-amber{color:var(--warning);background:var(--warning-soft)}.qic-green{color:var(--success);background:var(--success-soft)}
.nova-quick-card div { min-width:0; display:grid; gap:2px; }
.nova-quick-card strong { font-size:.75rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nova-quick-card small { font-size:.62rem; color:var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nova-quick-card b { font-size:1.2rem; line-height:1; color:var(--text-muted); font-weight:400; }
.nova-exec-cols { grid-template-columns:minmax(0,1.55fr) minmax(310px,.85fr); gap:14px; }
.nova-exec-table,.nova-exec-activity { border-radius:15px; box-shadow:var(--shadow-sm); }
.nova-exec-table .table-header,.nova-exec-activity .table-header { padding:15px 17px; }
.nova-exec-table .table-header h3,.nova-exec-activity .table-header h3 { margin-top:3px; font-size:.93rem; }
.nova-panel-sub { margin-top:3px; font-size:.65rem; color:var(--text-muted); }
.nova-exec-table table thead th { background:var(--surface-2); font-size:.63rem; padding:.66rem .9rem; }
.nova-exec-table table td { font-size:.76rem; padding:.72rem .9rem; }
.nova-loading { padding:18px; color:var(--text-secondary); font-size:.78rem; }
.act-row { padding:.75rem 1rem; gap:.65rem; }
.act-row .act-ic { width:31px; height:31px; border-radius:9px; }
.act-row .act-tx .t { font-size:.76rem; }
.act-row .act-tx .d { font-size:.65rem; }
.act-row .act-when { font-size:.62rem; }

/* ---------- Global component polish ---------- */
.table-wrapper { border-color:var(--border); border-radius:15px; box-shadow:var(--shadow-sm); }
.table-header { padding:1rem 1.15rem; }
.table-header h3 { letter-spacing:-.02em; }
table thead th { background:var(--surface-2); }
.btn { border-radius:10px; min-height:35px; letter-spacing:-.01em; }
.btn-primary { box-shadow:0 5px 14px rgba(228,24,29,.18); }
.form-group input,.form-group select,.form-group textarea,input,select,textarea { accent-color:var(--accent); }
.modal { border:1px solid var(--border); border-radius:18px; }
.modal-header { border-radius:18px 18px 0 0; }

/* ---------- Dark ---------- */
[data-theme="dark"] {
  --bg-primary:#0b0f16;
  --bg-secondary:#111721;
  --surface:#111721;
  --surface-2:#151c27;
  --surface-hover:#18212d;
  --text-primary:#f2f4f7;
  --text-secondary:#a8b0bf;
  --text-muted:#707b8c;
  --border:#202937;
  --border-strong:#2a3544;
  --accent:#FF5A5F;
  --accent-soft:rgba(109,156,255,.12);
  --accent-hover:#FF7478;
  --sidebar-bg:#0d131c;
}
[data-theme="dark"] .sidebar,[data-theme="dark"] .main-header { background:#0d131c; }
[data-theme="dark"] .nova-kpi-card,[data-theme="dark"] .nova-quick-panel,[data-theme="dark"] .table-wrapper,[data-theme="dark"] .nova-user-pill { background:#111721; }
[data-theme="dark"] .nova-login-logo,[data-theme="dark"] .nova-rail-brand { background:#f8fafc; }

/* ---------- Responsive ---------- */
@media (max-width:1180px) {
  .nova-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .nova-quick-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .nova-exec-cols { grid-template-columns:1fr; }
}
@media (max-width:900px) {
  .nova-user-pill { min-width:0; }
  .nova-user-pill .user-details { display:none; }
  .nova-user-help { display:none; }
  .main-body { padding:22px 18px 32px; }
}
@media (max-width:768px) {
  :root { --sidebar-width:76px; }
  .sidebar { transform:translateX(-100%); box-shadow:var(--shadow-lg); }
  .sidebar.open { transform:translateX(0); }
  .main-content { margin-left:0; }
  .main-header { padding:0 12px; }
  .nova-header-eyebrow { display:none; }
  .nova-header-context h2 { font-size:.96rem; }
  .nova-header-actions { gap:5px !important; }
  #novedades-voz-btn { display:none; }
  .nova-exec-hero { align-items:flex-start; flex-direction:column; gap:12px; }
  .nova-exec-date { align-self:stretch; }
}
@media (max-width:620px) {
  .main-body { padding:18px 12px 28px; }
  .nova-kpi-grid,.nova-quick-grid { grid-template-columns:1fr; }
  .nova-kpi-card { padding:15px; }
  .nova-novedades-panel { position:fixed; left:10px; right:10px; top:76px; width:auto; max-height:70vh; }
  .nova-user-pill { padding:4px; }
  .nova-user-pill .nova-user-logout { display:none; }
  .nova-icon-btn { width:35px; height:35px; }
  .nova-exec-hero h1 { font-size:1.75rem; }
}


/* ============================================================
   GestiónDocs Nova v2.0.1 · Identidad Alamo
   Se elimina la identidad azul como color de marca.
   ============================================================ */
:root {
  --brand-red: #E4181D;
  --brand-red-dark: #B01015;
  --brand-red-light: #FF4249;
  --brand-red-bg: #FFF0F1;
  --accent: var(--brand-red);
  --accent-soft: var(--brand-red-bg);
  --accent-hover: var(--brand-red-dark);
  --ring: 0 0 0 3px rgba(228,24,29,.18);
}
[data-theme="dark"] {
  --accent:#FF4A50;
  --accent-soft:rgba(228,24,29,.16);
  --accent-hover:#FF6A6F;
  --ring:0 0 0 3px rgba(255,74,80,.22);
}
.alamo-wordmark,
.alamo-header-brand { color:var(--brand-red); font-weight:800; letter-spacing:-.045em; text-transform:lowercase; }
.alamo-wordmark { font-size:2.15rem; line-height:1; }
.alamo-login-brandmark { justify-content:center; text-align:center; }
.alamo-rail-brand { background:var(--brand-red) !important; color:#fff !important; border-color:var(--brand-red) !important; box-shadow:0 5px 16px rgba(228,24,29,.22) !important; }
.alamo-rail-brand:hover { background:var(--brand-red-dark) !important; box-shadow:0 8px 20px rgba(228,24,29,.28) !important; }
.alamo-rail-a { font-size:1.02rem; font-weight:850; line-height:1; color:#fff; }
.nova-user-pill .user-avatar { background:var(--brand-red) !important; }
.nav-item.active { color:var(--brand-red) !important; background:var(--brand-red-bg) !important; }
.nav-item.active::before { background:var(--brand-red) !important; }
.badge:not(.badge-success):not(.badge-warning):not(.badge-danger) { background:var(--brand-red) !important; }
.btn-primary,.nova-login-submit { background:var(--brand-red) !important; border-color:var(--brand-red) !important; box-shadow:0 5px 14px rgba(228,24,29,.18) !important; }
.btn-primary:hover,.nova-login-submit:hover { background:var(--brand-red-dark) !important; border-color:var(--brand-red-dark) !important; }
.nova-login-card { border-top:4px solid var(--brand-red); }
.nova-login-kicker,.nova-section-kicker { color:var(--brand-red) !important; }
.nova-input-wrap:focus-within { border-color:var(--brand-red) !important; box-shadow:var(--ring) !important; }
input:focus,select:focus,textarea:focus { border-color:var(--brand-red) !important; box-shadow:var(--ring) !important; }
a { color:var(--brand-red); }
[data-theme="dark"] .nav-item.active { background:rgba(228,24,29,.14) !important; color:#ff6b70 !important; }
[data-theme="dark"] .alamo-wordmark,[data-theme="dark"] .alamo-header-brand { color:#ff5a60; }


/* =====================================================================
   GESTIÓN DOCS NOVA v2.0.3 · SHELL ALAMO
   Header global + rail lateral profesional + inicio de accesos rápidos
   ===================================================================== */
:root {
  --nova-rail-compact: 68px;
  --nova-rail-expanded: 232px;
  --nova-topbar: 64px;
}

/* Topbar igual al ecosistema Alamo */
.main-header {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  height: var(--nova-topbar) !important;
  padding: 0 18px 0 28px !important;
  background: color-mix(in srgb, var(--surface) 96%, transparent) !important;
  border-bottom: 1px solid var(--border) !important;
  z-index: 120 !important;
  backdrop-filter: blur(16px);
}
.nova-header-left { gap: 14px !important; }
.nova-global-brand {
  display:flex; align-items:center; gap:12px; padding:0; border:0; background:transparent;
  color:var(--text-primary); cursor:pointer; min-width:0; font-family:var(--font-main);
}
.nova-global-brand .brand-alamo {
  color:var(--accent); font-size:1.42rem; line-height:1; font-weight:850; letter-spacing:-.045em;
}
.nova-global-brand .brand-divider { width:1px; height:27px; background:var(--border-strong); }
.nova-global-brand .brand-app { font-size:.98rem; font-weight:700; letter-spacing:.025em; color:var(--text-secondary); }
.nova-global-brand .brand-scope {
  font-size:.58rem; line-height:1; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text-muted); border:1px solid var(--border); border-radius:999px; padding:5px 7px;
}
.nova-route-title {
  margin-left:3px; padding-left:15px; border-left:1px solid var(--border);
  color:var(--text-muted); font-size:.72rem; font-weight:650; white-space:nowrap;
}
.nova-icon-btn svg { width:18px; height:18px; }

/* Rail: debajo del header, iconos visibles siempre; labels al expandir */
.sidebar {
  top: var(--nova-topbar) !important;
  bottom: 0 !important;
  width: var(--nova-rail-compact) !important;
  transform:none !important;
  background:var(--surface) !important;
  border-right:1px solid var(--border) !important;
  z-index:110 !important;
  transition:width .2s ease, transform .22s ease !important;
  overflow:hidden !important;
}
.sidebar-header { display:none !important; }
.sidebar-nav { padding:10px 8px 12px !important; overflow-y:auto !important; overflow-x:hidden !important; }
.sidebar-nav .section-title { display:none !important; }
.nav-item {
  width:50px !important; min-width:50px !important; height:44px !important; margin:2px 1px !important;
  padding:0 !important; gap:0 !important; justify-content:center !important; border-radius:10px !important;
  white-space:nowrap !important; transition:background .16s ease,color .16s ease,width .2s ease !important;
}
.nav-item .nav-icon { width:19px !important; height:19px !important; flex:none !important; }
.nav-item > span:not(.badge) { display:none !important; }
.nav-item:hover { background:var(--surface-hover) !important; color:var(--accent) !important; }
.nav-item.active { background:var(--accent-soft) !important; color:var(--accent) !important; box-shadow:none !important; }
.nav-item.active::before { display:none !important; }
.sidebar-footer { padding:10px 8px 12px !important; }
.rail-help { width:50px !important; height:42px !important; }

/* Tooltip nativo mejorado cuando el rail está contraído */
.nav-item::after {
  content:attr(title); position:absolute; left:58px; top:50%; transform:translateY(-50%) translateX(-4px);
  pointer-events:none; opacity:0; visibility:hidden; padding:7px 9px; border-radius:8px;
  background:#111827; color:#fff; font-size:.7rem; font-weight:650; line-height:1; white-space:nowrap;
  box-shadow:0 8px 24px rgba(0,0,0,.18); transition:.14s ease; z-index:300;
}
body:not(.sidebar-expanded) .nav-item:hover::after { opacity:1; visibility:visible; transform:translateY(-50%) translateX(0); }

body.sidebar-expanded .sidebar { width:var(--nova-rail-expanded) !important; }
body.sidebar-expanded .sidebar-nav { padding:10px 10px 12px !important; }
body.sidebar-expanded .sidebar-nav .section-title {
  display:block !important; height:auto !important; margin:12px 9px 6px !important; padding:0 !important;
  border:0 !important; opacity:1 !important; font-size:.58rem !important; letter-spacing:.11em !important;
  color:var(--text-muted) !important; text-transform:uppercase !important; font-weight:800 !important;
}
body.sidebar-expanded .sidebar-nav .section-title:first-child { display:block !important; }
body.sidebar-expanded .nav-item {
  width:100% !important; min-width:0 !important; padding:0 12px !important; gap:11px !important; justify-content:flex-start !important;
}
body.sidebar-expanded .nav-item > span:not(.badge) { display:block !important; overflow:hidden; text-overflow:ellipsis; }
body.sidebar-expanded .nav-item::after { display:none !important; }
body.sidebar-expanded .sidebar-footer { justify-content:flex-start !important; }
body.sidebar-expanded .rail-help { width:100% !important; }

.main-content {
  margin-left:var(--nova-rail-compact) !important;
  padding-top:var(--nova-topbar) !important;
  transition:margin-left .2s ease !important;
}
body.sidebar-expanded .main-content { margin-left:var(--nova-rail-expanded) !important; }
body.sidebar-collapsed .main-content { margin-left:var(--nova-rail-compact) !important; }
.main-body { padding:28px 28px 40px !important; max-width:none !important; }

/* Dashboard inicial, deliberadamente simple como GDocs Alamo */
.nova-home-page { display:grid; gap:24px; max-width:1440px; margin:0 auto; }
.nova-home-intro { padding:0 1px; }
.nova-home-intro h1 {
  margin:0 0 7px; color:var(--text-primary); font-size:clamp(1.65rem,2.25vw,2.1rem);
  line-height:1.1; font-weight:800; letter-spacing:-.035em;
}
.nova-home-intro p { margin:0; color:var(--text-secondary); font-size:.88rem; }
.nova-home-card {
  background:var(--surface); border:1px solid var(--border); border-radius:13px;
  padding:0 22px 22px; box-shadow:var(--shadow-sm); min-width:0;
}
.nova-home-card-head { min-height:62px; display:flex; align-items:center; border-bottom:1px solid var(--border); }
.nova-home-card-head h2 { margin:0; color:var(--text-primary); font-size:.96rem; font-weight:750; }
.nova-home-card-head p { margin:3px 0 0; color:var(--text-muted); font-size:.67rem; }
.nova-home-links {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; padding-top:16px;
}
.nova-home-link {
  min-width:0; min-height:98px; display:flex; align-items:center; gap:15px; text-align:left;
  padding:16px 17px; border:1px solid var(--border); border-radius:11px; background:var(--surface);
  color:var(--text-primary); cursor:pointer; font-family:var(--font-main); transition:.16s ease;
}
.nova-home-link:hover {
  border-color:color-mix(in srgb,var(--accent) 38%,var(--border)); background:var(--accent-soft);
  transform:translateY(-1px); box-shadow:var(--shadow-sm);
}
.nova-home-link-icon {
  width:40px; height:40px; flex:0 0 40px; display:grid; place-items:center; border-radius:10px;
  background:var(--accent-soft); color:var(--accent);
}
.nova-home-link-icon svg { width:22px; height:22px; }
.nova-home-link-copy { min-width:0; display:grid; gap:5px; }
.nova-home-link-copy strong { font-size:.82rem; line-height:1.2; font-weight:750; color:var(--text-primary); }
.nova-home-link-copy small { font-size:.67rem; line-height:1.45; color:var(--text-muted); }
.nova-home-empty { grid-column:1/-1; padding:28px; text-align:center; color:var(--text-muted); font-size:.8rem; }

[data-theme="dark"] .main-header,
[data-theme="dark"] .sidebar,
[data-theme="dark"] .nova-home-card,
[data-theme="dark"] .nova-home-link { background:#0f141d !important; }
[data-theme="dark"] .nova-home-link:hover { background:rgba(228,24,29,.1) !important; }

@media (max-width:1180px) {
  .nova-home-links { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .nova-route-title { display:none; }
}
@media (max-width:900px) {
  .nova-home-links { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .nova-global-brand .brand-scope { display:none; }
  .nova-user-pill { min-width:0 !important; }
}
@media (max-width:768px) {
  .main-header { padding:0 12px !important; }
  .sidebar { transform:translateX(-100%) !important; width:min(86vw,260px) !important; box-shadow:var(--shadow-lg) !important; }
  .sidebar.open { transform:translateX(0) !important; }
  .sidebar-nav .section-title { display:block !important; height:auto !important; margin:12px 9px 6px !important; border:0 !important; font-size:.58rem !important; }
  .nav-item { width:100% !important; padding:0 12px !important; gap:11px !important; justify-content:flex-start !important; }
  .nav-item > span:not(.badge) { display:block !important; }
  .nav-item::after { display:none !important; }
  .main-content, body.sidebar-expanded .main-content { margin-left:0 !important; }
  .main-body { padding:20px 14px 30px !important; }
  .nova-global-brand .brand-app { font-size:.85rem; }
  .nova-user-pill .user-details, .nova-user-help { display:none !important; }
}
@media (max-width:560px) {
  .nova-home-links { grid-template-columns:1fr; }
  .nova-home-card { padding:0 14px 14px; }
  .nova-global-brand .brand-divider, .nova-global-brand .brand-scope { display:none; }
  .nova-global-brand { gap:8px; }
  .nova-global-brand .brand-alamo { font-size:1.25rem; }
  .nova-header-actions { gap:4px !important; }
  .nova-icon-btn { width:34px !important; height:34px !important; }
}

/* =====================================================================
   GESTIÓNDOCS NOVA v2.1.0 · EXECUTIVE SYSTEM
   Rediseño integral visual. No cambia IDs, flujos ni lógica de negocio.
   ===================================================================== */
:root {
  --exec-canvas: #f5f6f8;
  --exec-panel: #ffffff;
  --exec-panel-soft: #fafbfc;
  --exec-line: #e7e9ee;
  --exec-line-strong: #d9dde5;
  --exec-ink: #111827;
  --exec-muted: #667085;
  --exec-subtle: #98a2b3;
  --exec-red: #e4181d;
  --exec-red-dark: #b01015;
  --exec-red-soft: #fff1f2;
  --exec-radius: 14px;
  --exec-radius-sm: 10px;
  --exec-shadow: 0 1px 2px rgba(16,24,40,.035), 0 8px 28px rgba(16,24,40,.045);
}

body { background: var(--exec-canvas); }
.main-content { background: var(--exec-canvas); }
.main-body { padding: 24px 26px 42px !important; }
.main-body > [id^="page-"] { width: 100%; max-width: 1580px; margin-inline: auto; }

/* --- Rail estable: solo navega el centro; ayuda permanece abajo --- */
.sidebar { display:flex !important; flex-direction:column !important; }
.sidebar-nav { flex:1 1 auto !important; min-height:0 !important; overscroll-behavior:contain; }
.sidebar-footer {
  flex:0 0 auto !important; margin-top:0 !important; background:var(--surface) !important;
  box-shadow:0 -1px 0 var(--border); position:relative; z-index:3;
}
.rail-help { color:var(--text-muted) !important; background:transparent !important; border-color:transparent !important; }
.rail-help:hover { color:var(--accent) !important; background:var(--accent-soft) !important; }
.nav-item { isolation:isolate; }
.nav-item.active { font-weight:750 !important; }
body.sidebar-expanded .nav-item { height:42px !important; border-radius:9px !important; }
body.sidebar-expanded .sidebar-footer .rail-help::after { content:"Ayuda"; margin-left:10px; font-size:.76rem; }

/* --- Topbar más sobria --- */
.main-header { box-shadow:0 1px 0 rgba(16,24,40,.025) !important; }
.nova-global-brand .brand-scope { background:var(--surface-2); }
.nova-route-title { color:var(--text-secondary); }
.nova-user-pill { border:1px solid var(--border) !important; box-shadow:none !important; }
.nova-icon-btn,.sidebar-toggle { box-shadow:none !important; }

/* --- Cabecera ejecutiva común para TODOS los módulos --- */
.nova-module-head {
  display:flex; align-items:center; gap:14px; min-height:88px; margin:0 0 16px; padding:16px 18px;
  border:1px solid var(--exec-line); border-radius:var(--exec-radius); background:var(--exec-panel);
  box-shadow:0 1px 2px rgba(16,24,40,.025);
}
.nova-module-head-icon {
  width:48px; height:48px; flex:0 0 48px; display:grid; place-items:center; border-radius:12px;
  background:var(--exec-red-soft); color:var(--exec-red); border:1px solid rgba(228,24,29,.08);
}
.nova-module-head-icon .nav-icon,.nova-module-head-icon svg { width:23px; height:23px; }
.nova-module-head-copy { min-width:0; }
.nova-module-eyebrow {
  margin-bottom:3px; color:var(--exec-red); font-size:.62rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
}
.nova-module-head h1 { margin:0; color:var(--exec-ink); font-size:1.18rem; font-weight:800; letter-spacing:-.025em; line-height:1.2; }
.nova-module-head p { margin:5px 0 0; color:var(--exec-muted); font-size:.78rem; line-height:1.5; max-width:880px; }

/* --- Dashboard ejecutivo, en la misma familia que GDocs Alamo --- */
.nova-home-page { gap:18px !important; max-width:1580px !important; }
.nova-home-intro { padding:4px 2px 2px !important; }
.nova-home-intro h1 { font-size:1.8rem !important; font-weight:820 !important; }
.nova-home-intro p { color:var(--exec-muted) !important; }
.nova-home-card {
  padding:0 20px 20px !important; border:1px solid var(--exec-line) !important; border-radius:var(--exec-radius) !important;
  box-shadow:0 1px 2px rgba(16,24,40,.025) !important;
}
.nova-home-card-head { min-height:58px !important; }
.nova-home-card-head h2 { font-size:.9rem !important; }
.nova-home-links { grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:11px !important; padding-top:14px !important; }
.nova-home-link {
  min-height:92px !important; padding:14px 15px !important; border-radius:11px !important; box-shadow:none !important;
  background:var(--surface) !important;
}
.nova-home-link:hover { transform:none !important; border-color:rgba(228,24,29,.34) !important; box-shadow:0 6px 18px rgba(16,24,40,.055) !important; }
.nova-home-link-icon { width:38px !important; height:38px !important; flex-basis:38px !important; border-radius:10px !important; }
.nova-home-link-copy strong { font-size:.79rem !important; }
.nova-home-link-copy small { font-size:.64rem !important; }

/* --- Paneles: misma jerarquía visual en todos los módulos --- */
.table-wrapper,
.oc-card,.oc-sap,.cf-card,.cc-card,.cc-stat,.ta-card,.card,
.mon-card,.panel,.section-card {
  background:var(--exec-panel) !important; border:1px solid var(--exec-line) !important;
  border-radius:var(--exec-radius) !important; box-shadow:0 1px 2px rgba(16,24,40,.025) !important;
}
.table-wrapper { overflow:hidden; }
.table-header {
  min-height:60px; display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:12px 16px !important; background:var(--exec-panel) !important; border-bottom:1px solid var(--exec-line) !important;
}
.table-header h3 { margin:0 !important; font-size:.9rem !important; font-weight:800 !important; color:var(--exec-ink) !important; }
.table-header h3 span { font-weight:600 !important; }

/* Barras de filtros internas (incluye varios bloques con estilo inline del proyecto histórico) */
.table-wrapper > div[style*="border-bottom:1px solid var(--border)"],
.table-wrapper > div[style*="border-bottom: 1px solid var(--border)"],
.table-wrapper > div[style*="border-top:1px solid var(--border)"],
.table-wrapper > div[style*="border-top: 1px solid var(--border)"] {
  background:var(--exec-panel-soft) !important; border-color:var(--exec-line) !important;
}

/* --- Formularios y filtros --- */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select,textarea,.form-control,.status-select {
  min-height:38px; border:1px solid var(--exec-line-strong) !important; border-radius:9px !important;
  background:var(--exec-panel) !important; color:var(--exec-ink) !important; box-shadow:none !important;
}
input::placeholder,textarea::placeholder { color:var(--exec-subtle) !important; opacity:1; }
input:focus,select:focus,textarea:focus,.form-control:focus,.status-select:focus {
  border-color:rgba(228,24,29,.65) !important; box-shadow:0 0 0 3px rgba(228,24,29,.09) !important;
}
.form-group label { color:var(--exec-muted) !important; font-size:.7rem !important; letter-spacing:.04em !important; }

/* --- Botonera ejecutiva --- */
.btn {
  min-height:36px !important; padding:.48rem .82rem !important; border-radius:9px !important;
  font-size:.75rem !important; font-weight:700 !important; box-shadow:none !important;
}
.btn-primary { background:var(--exec-red) !important; color:#fff !important; border:1px solid var(--exec-red) !important; }
.btn-primary:hover { background:var(--exec-red-dark) !important; border-color:var(--exec-red-dark) !important; transform:none !important; }
.btn-outline { background:var(--exec-panel) !important; border:1px solid var(--exec-line-strong) !important; color:var(--exec-muted) !important; }
.btn-outline:hover { color:var(--exec-red) !important; border-color:rgba(228,24,29,.4) !important; background:var(--exec-red-soft) !important; transform:none !important; }
.btn-danger { box-shadow:none !important; }
.btn:disabled { opacity:.5; cursor:not-allowed; transform:none !important; }

/* --- Tablas: lectura tipo consola gerencial --- */
.overflow-x { overflow:auto; }
table { border-collapse:separate !important; border-spacing:0 !important; width:100%; }
table thead th {
  position:sticky; top:0; z-index:2; padding:.68rem .85rem !important; background:#f8f9fb !important;
  color:#7c8493 !important; border-bottom:1px solid var(--exec-line) !important;
  font-size:.62rem !important; font-weight:800 !important; letter-spacing:.065em !important; white-space:nowrap;
}
table tbody td {
  padding:.72rem .85rem !important; border-bottom:1px solid #eef0f3 !important; color:#344054;
  font-size:.74rem; vertical-align:middle;
}
table tbody tr:last-child td { border-bottom:0 !important; }
table tbody tr:hover { background:#fbfbfc !important; }
.td-numero,.mono,.num { font-variant-numeric:tabular-nums; }

/* --- Tabs y segmentadores de todos los módulos --- */
.ventas-tab,.costos-tab,.quiebres-tab,.finanzas-tab,.ctrlppp-tab,.sincosto-tab,
.remitoctrl-modo,.informes-per,.ventas-per,.costos-per,.finanzas-per,.ctrlppp-per,
.sincosto-per,.remitoctrl-per,.ta-tab,.mon-tab,.cf-tab,.cc-tab,.oc-tabs .btn {
  min-height:34px !important; border-radius:9px !important; border:1px solid var(--exec-line) !important;
  background:var(--exec-panel) !important; color:var(--exec-muted) !important; font-weight:700 !important;
  box-shadow:none !important;
}
.ventas-tab.active,.costos-tab.active,.quiebres-tab.active,.finanzas-tab.active,.ctrlppp-tab.active,
.sincosto-tab.active,.remitoctrl-modo.active,.informes-per.active,.ventas-per.active,.costos-per.active,
.finanzas-per.active,.ctrlppp-per.active,.sincosto-per.active,.remitoctrl-per.active,.ta-tab.active,
.mon-tab.active,.cf-tab.active,.cc-tab.active,.oc-tabs .btn.active {
  background:var(--exec-red-soft) !important; color:var(--exec-red) !important; border-color:rgba(228,24,29,.22) !important;
}

/* --- Tarjetas analíticas / KPIs --- */
.stat-card,.cc-stat,.ta-card,.cf-card,.oc-card {
  position:relative; overflow:hidden; transition:border-color .16s ease, box-shadow .16s ease;
}
.stat-card:hover,.cc-stat:hover,.ta-card:hover,.cf-card:hover,.oc-card:hover {
  border-color:var(--exec-line-strong) !important; box-shadow:0 8px 24px rgba(16,24,40,.055) !important;
}
.stat-value,.cc-stat .num { color:var(--exec-ink); font-weight:800; letter-spacing:-.025em; }

/* --- Modales y detalle --- */
.modal-overlay { background:rgba(15,23,42,.48) !important; backdrop-filter:blur(5px) !important; }
.modal {
  border:1px solid var(--exec-line) !important; border-radius:16px !important; box-shadow:0 24px 80px rgba(15,23,42,.2) !important;
  background:var(--exec-panel) !important;
}
.modal-header { min-height:58px; padding:12px 16px !important; background:var(--exec-panel) !important; border-bottom:1px solid var(--exec-line) !important; }
.modal-header h3,.modal-header h2 { font-size:.94rem !important; font-weight:800 !important; }
.modal-body { padding:16px !important; }
.modal-footer { padding:12px 16px !important; background:var(--exec-panel-soft) !important; border-top:1px solid var(--exec-line) !important; }
.modal-close { border-radius:8px !important; color:var(--exec-subtle) !important; }

/* --- OC: mantener flujo propio, pero llevarlo al mismo lenguaje --- */
.oc-hero {
  border-radius:var(--exec-radius) !important; border:1px solid var(--exec-line) !important; box-shadow:none !important;
  background:var(--exec-panel) !important;
}
.oc-hero-icon { background:var(--exec-red-soft) !important; color:var(--exec-red) !important; box-shadow:none !important; }
.oc-card-head,.oc-sap-head { background:var(--exec-panel-soft) !important; border-color:var(--exec-line) !important; }
.oc-card-num { background:var(--exec-red) !important; box-shadow:none !important; }

/* --- Estados, badges y notas --- */
.badge,.badge-status,.badge-tipo,.cf-badge,.cc-pill,.badge-st {
  border-radius:999px !important; font-weight:750 !important; box-shadow:none !important;
}
.cf-muted,.td-muted,.ta-muted,.cc-hint,.nova-panel-sub { color:var(--exec-subtle) !important; }

/* --- Login: limpio, sin pie ni leyendas móviles --- */
.nova-login-foot,.nova-login-meta { display:none !important; }
.nova-login-stage { min-height:100vh; padding:28px 18px !important; }
.nova-login-card { box-shadow:0 18px 55px rgba(15,23,42,.09) !important; }
.nova-login-brandmark { margin-bottom:24px !important; }
.nova-login-heading { margin-bottom:20px !important; }

/* --- Dark mode coherente --- */
[data-theme="dark"] {
  --exec-canvas:#0b0f15;
  --exec-panel:#111721;
  --exec-panel-soft:#151c26;
  --exec-line:#222b38;
  --exec-line-strong:#2d3745;
  --exec-ink:#f3f4f6;
  --exec-muted:#a8b0bf;
  --exec-subtle:#737f90;
  --exec-red:#ff5a60;
  --exec-red-dark:#e83b42;
  --exec-red-soft:rgba(228,24,29,.12);
}
[data-theme="dark"] body,[data-theme="dark"] .main-content { background:var(--exec-canvas) !important; }
[data-theme="dark"] .nova-module-head,
[data-theme="dark"] .nova-home-card,[data-theme="dark"] .nova-home-link,
[data-theme="dark"] .table-wrapper,[data-theme="dark"] .table-header,
[data-theme="dark"] .modal,[data-theme="dark"] .oc-card,[data-theme="dark"] .oc-sap,
[data-theme="dark"] .cf-card,[data-theme="dark"] .cc-card,[data-theme="dark"] .cc-stat,[data-theme="dark"] .ta-card {
  background:var(--exec-panel) !important; border-color:var(--exec-line) !important;
}
[data-theme="dark"] .nova-module-head h1,[data-theme="dark"] .table-header h3,[data-theme="dark"] .stat-value,
[data-theme="dark"] .cc-stat .num { color:var(--exec-ink) !important; }
[data-theme="dark"] .nova-module-head p,[data-theme="dark"] table tbody td { color:#c6ccd6 !important; }
[data-theme="dark"] table thead th { background:#151c26 !important; color:#828da0 !important; border-color:var(--exec-line) !important; }
[data-theme="dark"] table tbody td { border-color:#1c2531 !important; }
[data-theme="dark"] table tbody tr:hover { background:#151c26 !important; }
[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
[data-theme="dark"] select,[data-theme="dark"] textarea,[data-theme="dark"] .form-control,[data-theme="dark"] .status-select {
  background:#0f151e !important; color:#e8ebf0 !important; border-color:var(--exec-line-strong) !important;
}
[data-theme="dark"] .btn-outline { background:#111721 !important; border-color:var(--exec-line-strong) !important; color:#b1b9c7 !important; }
[data-theme="dark"] .sidebar-footer { background:#0d131c !important; }
[data-theme="dark"] .table-wrapper > div[style*="border-bottom:1px solid var(--border)"],
[data-theme="dark"] .table-wrapper > div[style*="border-bottom: 1px solid var(--border)"],
[data-theme="dark"] .table-wrapper > div[style*="border-top:1px solid var(--border)"],
[data-theme="dark"] .table-wrapper > div[style*="border-top: 1px solid var(--border)"] { background:var(--exec-panel-soft) !important; }

/* --- Responsive --- */
@media (max-width:1180px) {
  .nova-home-links { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width:900px) {
  .main-body { padding:20px 18px 34px !important; }
  .nova-module-head { padding:14px 15px; }
  .nova-home-links { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:620px) {
  .main-body { padding:14px 10px 28px !important; }
  .nova-module-head { align-items:flex-start; gap:11px; margin-bottom:12px; border-radius:12px; }
  .nova-module-head-icon { width:42px; height:42px; flex-basis:42px; }
  .nova-module-head h1 { font-size:1rem; }
  .nova-module-head p { font-size:.71rem; }
  .nova-home-links { grid-template-columns:1fr !important; }
  .table-header { align-items:flex-start; flex-direction:column; }
}


/* =====================================================================
   GESTIÓNDOCS NOVA v2.1.3 · LEGIBILIDAD + ACCESO GDocs Alamo
   ===================================================================== */
/* Legibilidad general a zoom 100% sin alterar la densidad funcional. */
.nova-home-intro h1 { font-size:2rem !important; }
.nova-home-intro p { font-size:.98rem !important; line-height:1.5 !important; }
.nova-home-card-head h2 { font-size:1.02rem !important; }
.nova-home-card-head p { font-size:.76rem !important; line-height:1.45 !important; }
.nova-home-link { min-height:104px !important; padding:16px 17px !important; gap:16px !important; text-decoration:none !important; position:relative; }
.nova-home-link-icon { width:42px !important; height:42px !important; flex-basis:42px !important; }
.nova-home-link-icon svg { width:23px !important; height:23px !important; }
.nova-home-link-copy strong { font-size:.92rem !important; line-height:1.25 !important; }
.nova-home-link-copy small { font-size:.75rem !important; line-height:1.45 !important; }
.nova-home-link-external { padding-right:38px !important; }
.nova-home-external-mark {
  position:absolute; top:12px; right:13px; color:var(--text-muted); font-size:.82rem; font-weight:800;
  transition:color .16s ease, transform .16s ease;
}
.nova-home-link-external:hover .nova-home-external-mark { color:var(--accent); transform:translate(1px,-1px); }

/* Un punto más de lectura en navegación y cabeceras sin agrandar tablas de forma excesiva. */
.nova-route-title { font-size:.78rem !important; }
.nav-item > span:not(.badge) { font-size:.84rem; }
.user-details .name { font-size:.87rem !important; }
.user-details .role { font-size:.74rem !important; }
.nova-module-head h1 { font-size:1.28rem !important; }
.nova-module-head p { font-size:.84rem !important; }

@media (max-width:1180px) {
  .nova-home-link-copy strong { font-size:.9rem !important; }
  .nova-home-link-copy small { font-size:.73rem !important; }
}


/* =====================================================================
   GESTIÓNDOCS NOVA v2.1.4 · NOTIFICACIONES + SAP
   ===================================================================== */
.nova-notif-admin-modal { max-width:1120px !important; width:min(96vw,1120px) !important; }
.nova-notif-admin-sub { margin:.3rem 0 0; color:var(--text-secondary); font-size:.82rem; line-height:1.45; }
.nova-notif-admin-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 0 14px; }
.nova-notif-admin-note { min-width:0; display:grid; gap:3px; }
.nova-notif-admin-note strong { font-size:.86rem; color:var(--text-primary); }
.nova-notif-admin-note span { font-size:.75rem; color:var(--text-muted); }
.nova-notif-admin-actions { display:flex; flex-wrap:wrap; gap:7px; justify-content:flex-end; }
.nova-notif-admin-table-wrap { border:1px solid var(--border); border-radius:12px; overflow:auto; }
.nova-notif-admin-table { min-width:900px; }
.nova-notif-admin-table th { white-space:nowrap; }
.nova-notif-admin-table td { vertical-align:middle; }
.nova-notif-admin-table input[type="text"], .nova-notif-admin-table select { background:var(--bg-primary); color:var(--text-primary); }
.nova-notif-loading { text-align:center; padding:24px !important; color:var(--text-muted); }

.sap-coming-soon { display:grid; gap:18px; }
.sap-coming-main { display:grid; grid-template-columns:132px minmax(0,1fr); gap:28px; align-items:center; padding:30px; border:1px solid var(--border); border-radius:18px; background:var(--bg-primary); }
.sap-mark { width:132px; height:88px; display:grid; place-items:center; border-radius:18px; background:linear-gradient(145deg,var(--accent-soft),rgba(228,24,29,.04)); border:1px solid rgba(228,24,29,.18); color:var(--accent); font-size:2rem; font-weight:900; letter-spacing:-.08em; }
.sap-copy { min-width:0; }
.sap-kicker { display:inline-block; margin-bottom:8px; color:var(--accent); font-size:.72rem; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.sap-copy h2 { margin:0 0 8px; font-size:1.6rem; letter-spacing:-.025em; color:var(--text-primary); }
.sap-copy p { margin:0; max-width:820px; color:var(--text-secondary); font-size:.9rem; line-height:1.65; }
.sap-status { margin-top:18px; display:flex; align-items:center; flex-wrap:wrap; gap:8px; font-size:.78rem; color:var(--text-muted); }
.sap-status strong { color:var(--text-primary); }
.sap-status-dot { width:9px; height:9px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px var(--accent-soft); }
.sap-roadmap-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.sap-roadmap-grid article { position:relative; min-height:150px; padding:20px; border:1px solid var(--border); border-radius:15px; background:var(--bg-primary); }
.sap-roadmap-grid article > span { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; margin-bottom:18px; border-radius:9px; background:var(--accent-soft); color:var(--accent); font-size:.72rem; font-weight:850; }
.sap-roadmap-grid strong { display:block; margin-bottom:7px; font-size:.9rem; color:var(--text-primary); }
.sap-roadmap-grid p { margin:0; color:var(--text-muted); font-size:.76rem; line-height:1.55; }
.sap-footnote { display:flex; align-items:center; gap:13px; padding:16px 18px; border:1px solid var(--border); border-radius:14px; background:var(--bg-secondary); }
.sap-footnote svg { width:24px; height:24px; flex:0 0 24px; color:var(--success); }
.sap-footnote div { display:grid; gap:2px; }
.sap-footnote strong { font-size:.82rem; color:var(--text-primary); }
.sap-footnote span { font-size:.74rem; color:var(--text-muted); }
[data-theme="dark"] .sap-coming-main,[data-theme="dark"] .sap-roadmap-grid article { background:var(--exec-panel) !important; border-color:var(--exec-line) !important; }
[data-theme="dark"] .sap-footnote { background:var(--exec-panel-soft) !important; border-color:var(--exec-line) !important; }
@media (max-width:900px) { .sap-roadmap-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px) {
  .nova-notif-admin-toolbar { align-items:flex-start; flex-direction:column; }
  .sap-coming-main { grid-template-columns:1fr; padding:22px; }
  .sap-mark { width:100%; max-width:132px; }
  .sap-roadmap-grid { grid-template-columns:1fr; }
}