:root{
  --p-bg:#f1f5f9;
  --p-card:#ffffff;
  --p-side:#0a1628;
  --p-side-soft:#11203a;
  --p-text:#0f172a;
  --p-muted:#6b7280;
  --p-primary:#2563eb;
  --p-primary-hover:#1d4ed8;
  --p-border:#e5e7eb;
  --p-success:#10b981;
  --p-warn:#f59e0b;
  --p-danger:#ef4444;
  --p-radius:14px;
  --p-shadow:0 4px 14px rgba(15,23,42,0.06);
}
@media (prefers-color-scheme: dark){
  :root{ --p-bg:#0b1326; --p-card:#0f1b30; --p-text:#e5e7eb; --p-muted:#94a3b8; --p-border:rgba(255,255,255,0.08); --p-shadow:0 4px 14px rgba(0,0,0,0.4); }
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--p-bg);
  color:var(--p-text);
  font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-size:.95rem;
}
a{color:var(--p-primary);text-decoration:none}
a:hover{color:var(--p-primary-hover);text-decoration:underline}
.bg-primary-soft{background:rgba(37,99,235,.12);color:#2563eb}

/* Topbar */
.portal-topbar{
  position:sticky;top:0;z-index:50;
  background:var(--p-card);border-bottom:1px solid var(--p-border);
  box-shadow:0 1px 6px rgba(15,23,42,.04);
}
.portal-topbar-inner{
  max-width:1480px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:.7rem 1.2rem;gap:1rem;
}
.portal-brand{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.1rem;color:var(--p-text)}
.portal-brand .bi-cloud-fill{font-size:1.4rem;color:var(--p-primary)}
.portal-brand b{color:var(--p-primary)}
.portal-burger{background:transparent;border:0;color:var(--p-text);font-size:1.4rem;cursor:hidden;padding:.2rem .4rem}
.portal-user .btn{border-radius:8px}

/* Shell */
.portal-shell{max-width:1480px;margin:0 auto;display:grid;grid-template-columns:240px 1fr;gap:1.6rem;padding:1.6rem;align-items:start}
@media (max-width:991px){.portal-shell{grid-template-columns:1fr}}

/* Sidebar */
.portal-sidebar{
  position:sticky;top:84px;
  background:linear-gradient(180deg,var(--p-side),var(--p-side-soft));
  border-radius:var(--p-radius);
  color:#e5e7eb;padding:1rem;
  box-shadow:var(--p-shadow);
}
.portal-nav ul{list-style:none;margin:0;padding:0}
.portal-nav a{
  display:flex;align-items:center;gap:.65rem;
  padding:.65rem .9rem;border-radius:10px;color:#cbd5e1;
  font-weight:500;font-size:.92rem;text-decoration:none;
  transition:background .15s,color .15s;
}
.portal-nav a:hover{background:rgba(255,255,255,.08);color:#fff;text-decoration:none}
.portal-nav a.active{background:var(--p-primary);color:#fff}
.portal-nav a i{font-size:1.05rem;width:1.2rem;text-align:center}
.portal-nav a.text-danger{color:#fb7185}
.portal-nav-divider{height:1px;background:rgba(255,255,255,.08);margin:.8rem 0}

@media (max-width:991px){
  .portal-sidebar{position:static;margin-bottom:1rem}
  .portal-burger{display:inline-flex}
  .portal-sidebar .portal-nav ul{display:flex;flex-wrap:wrap;gap:.4rem}
  .portal-sidebar .portal-nav a{padding:.4rem .6rem;font-size:.85rem}
  .portal-nav-divider{display:none}
}
@media (min-width:992px){ .portal-burger{display:none} }

/* Main */
.portal-main{min-width:0;display:flex;flex-direction:column;gap:1.2rem}
.portal-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.8rem}
.portal-head h1{font-size:1.5rem;font-weight:700;margin:0}
.portal-head .sub{color:var(--p-muted);font-size:.9rem;margin:0}

.card-portal{background:var(--p-card);border:1px solid var(--p-border);border-radius:var(--p-radius);box-shadow:var(--p-shadow)}
.card-portal .card-portal-head{padding:1rem 1.3rem;border-bottom:1px solid var(--p-border);font-weight:600;display:flex;justify-content:space-between;align-items:center}
.card-portal .card-portal-body{padding:1.3rem}

/* Stat grid */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media (max-width:991px){.stat-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.stat-grid{grid-template-columns:1fr}}
.stat-card{background:var(--p-card);border:1px solid var(--p-border);border-radius:var(--p-radius);padding:1.2rem;box-shadow:var(--p-shadow)}
.stat-card .stat-icon{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:.5rem}
.stat-card .stat-label{color:var(--p-muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.stat-card .stat-value{font-size:1.6rem;font-weight:700;margin:0}
.stat-ico-blue{background:rgba(37,99,235,.12);color:#2563eb}
.stat-ico-green{background:rgba(16,185,129,.14);color:#10b981}
.stat-ico-amber{background:rgba(245,158,11,.16);color:#f59e0b}
.stat-ico-red{background:rgba(239,68,68,.14);color:#ef4444}

/* Tablas */
.table-portal{background:var(--p-card);border:1px solid var(--p-border);border-radius:var(--p-radius);overflow:hidden;box-shadow:var(--p-shadow)}
.table-portal table{margin:0}
.table-portal thead th{background:rgba(0,0,0,.02);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--p-muted);font-weight:600;padding:.9rem 1rem;border-bottom:1px solid var(--p-border)}
.table-portal tbody td{padding:.85rem 1rem;border-color:var(--p-border);vertical-align:middle}
.table-portal tbody tr:hover{background:rgba(0,0,0,.02)}

/* Badges */
.badge-status{font-size:.7rem;font-weight:600;padding:.4em .65em;border-radius:6px}
.st-activo{background:rgba(16,185,129,.16);color:#0f9d6f}
.st-pendiente{background:rgba(245,158,11,.18);color:#b45309}
.st-suspendido{background:rgba(239,68,68,.16);color:#b91c1c}
.st-cancelado{background:rgba(107,114,128,.18);color:#4b5563}
.st-terminado{background:rgba(107,114,128,.18);color:#4b5563}
.st-abierto{background:rgba(37,99,235,.16);color:#2563eb}
.st-respondido{background:rgba(16,185,129,.16);color:#0f9d6f}
.st-en_proceso{background:rgba(245,158,11,.18);color:#b45309}
.st-cerrado{background:rgba(107,114,128,.18);color:#4b5563}
.st-pagada{background:rgba(16,185,129,.16);color:#0f9d6f}
.st-vencida{background:rgba(239,68,68,.16);color:#b91c1c}
.st-borrador{background:rgba(107,114,128,.18);color:#4b5563}
.st-anulada{background:rgba(239,68,68,.16);color:#b91c1c}

/* Buttons */
.btn-portal-primary{background:var(--p-primary);color:#fff;border:0;border-radius:10px;padding:.55rem 1rem;font-weight:600}
.btn-portal-primary:hover{background:var(--p-primary-hover);color:#fff}

/* Forms */
.form-control, .form-select{border-radius:10px}
.form-control:focus, .form-select:focus{border-color:var(--p-primary);box-shadow:0 0 0 .2rem rgba(37,99,235,.18)}

/* Empty state */
.portal-empty{padding:3rem 1rem;text-align:center;color:var(--p-muted)}
.portal-empty i{font-size:3rem;opacity:.25;margin-bottom:.6rem;display:block}

/* Footer */
.portal-footer{padding:1rem;border-top:1px solid var(--p-border);background:var(--p-card)}
.portal-footer a{text-decoration:none}
.portal-footer a:hover{text-decoration:underline}

/* Auth layout */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;background:linear-gradient(135deg,#0a1628 0%,#11203a 100%)}
.auth-card{width:100%;max-width:460px;background:#fff;border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.35);padding:2.2rem}
@media (prefers-color-scheme: dark){.auth-card{background:#0f1b30;color:#e5e7eb}}
.auth-brand{font-size:1.4rem;font-weight:700;text-align:center;margin-bottom:.4rem}
.auth-brand b{color:var(--p-primary)}
.auth-sub{text-align:center;color:var(--p-muted);margin-bottom:1.4rem;font-size:.92rem}

/* Detail rows */
.detail-row{display:flex;justify-content:space-between;padding:.6rem 0;border-bottom:1px dashed var(--p-border)}
.detail-row:last-child{border-bottom:0}
.detail-row .lbl{color:var(--p-muted);font-size:.85rem}
.detail-row .val{font-weight:600}