/* SUPERATE FIX 24 — Diseño Admin/Centro Global Propuesta 3 */
:root{
  --sup-blue:#045796;
  --sup-cyan:#00B6DE;
  --sup-green:#8DC63F;
  --sup-bg:#e8f8fc;
  --sup-card:#fff;
  --sup-border:rgba(4,87,150,.10);
  --sup-shadow:0 14px 35px rgba(4,87,150,.08);
}
body{
  background:
    radial-gradient(circle at top left, rgba(0,182,222,.16), transparent 38%),
    linear-gradient(135deg, #eaf9fd 0%, #f7fdff 100%) !important;
}
.sup-admin-shell{
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  gap:24px;
  align-items:start;
}
.sup-sidebar{
  position:sticky;
  top:86px;
  background:rgba(255,255,255,.9);
  border:1px solid var(--sup-border);
  border-radius:24px;
  box-shadow:var(--sup-shadow);
  padding:18px 14px;
}
.sup-sidebar-brand{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 10px 16px;
  margin-bottom:12px;
  border-bottom:1px solid rgba(4,87,150,.10);
  color:#0f477a;
  font-weight:800;
}
.sup-sidebar-logo{
  width:36px;
  height:36px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,var(--sup-blue),var(--sup-cyan));
  color:white;
  box-shadow:0 8px 18px rgba(4,87,150,.20);
}
.sup-sidebar-nav{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.sup-sidebar-link{
  display:flex;
  align-items:center;
  gap:10px;
  color:#344054;
  text-decoration:none;
  font-weight:700;
  padding:10px 12px;
  border-radius:14px;
  transition:.16s ease;
  font-size:.94rem;
}
.sup-sidebar-link:hover{
  background:#eef9fd;
  color:var(--sup-blue);
  transform:translateX(2px);
}
.sup-sidebar-link.active{
  background:linear-gradient(135deg,var(--sup-blue),#0c8fc2);
  color:#fff;
  box-shadow:0 12px 25px rgba(4,87,150,.22);
}
.sup-main-panel{min-width:0}
.sup-page-title{margin-bottom:18px}
.sup-page-title h1{
  font-weight:800;
  letter-spacing:-.03em;
  color:#172235;
  margin-bottom:4px;
}
.sup-page-title p{color:#667085;font-size:1rem}
.sup-kpi-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(105px,1fr));
  gap:14px;
  margin-bottom:18px;
}
.sup-kpi-card{
  background:rgba(255,255,255,.94);
  border:1px solid var(--sup-border);
  border-radius:18px;
  box-shadow:0 10px 24px rgba(4,87,150,.06);
  padding:14px;
  min-height:112px;
  text-decoration:none;
  color:#172235;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
  overflow:hidden;
}
.sup-kpi-card::after{
  content:"";
  position:absolute;
  width:70px;
  height:70px;
  right:-28px;
  top:-24px;
  background:rgba(0,182,222,.12);
  border-radius:999px;
}
.sup-kpi-label{
  color:#667085;
  font-size:.82rem;
  line-height:1.15;
  font-weight:700;
  max-width:95px;
}
.sup-kpi-value{
  font-size:2rem;
  font-weight:800;
  line-height:1;
  color:#0f172a;
  margin:8px 0 4px;
}
.sup-kpi-help{font-size:.86rem;color:#475467}
.sup-kpi-icon{
  position:absolute;
  right:13px;
  top:14px;
  width:34px;
  height:34px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:#eef9fd;
  z-index:1;
}
.sup-module-section{
  background:rgba(255,255,255,.45);
  border:1px solid rgba(255,255,255,.72);
  border-radius:24px;
  padding:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 16px 35px rgba(4,87,150,.06);
}
.sup-section-title{
  text-transform:uppercase;
  font-size:.82rem;
  letter-spacing:.08em;
  color:#64748b;
  font-weight:900;
  margin:2px 0 14px;
}
.sup-module-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.sup-module-card{
  background:rgba(255,255,255,.96);
  border:1px solid var(--sup-border);
  border-radius:18px;
  padding:16px;
  min-height:92px;
  display:flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
  color:#1f2937;
  box-shadow:0 8px 20px rgba(4,87,150,.055);
  transition:.16s ease;
}
.sup-module-card:hover{
  transform:translateY(-2px);
  border-color:rgba(0,182,222,.35);
  box-shadow:0 16px 30px rgba(4,87,150,.10);
}
.sup-module-icon{
  flex:0 0 44px;
  width:44px;
  height:44px;
  border-radius:14px;
  display:grid;
  place-items:center;
  font-size:1.18rem;
  background:#eff9ff;
}
.sup-module-card h4{
  font-size:1.02rem;
  line-height:1.12;
  font-weight:850;
  color:#045796;
  margin:0 0 4px;
}
.sup-module-card p{
  margin:0;
  color:#667085;
  font-size:.88rem;
  line-height:1.22;
}
/* Mejora visual global para páginas admin internas */
.card{
  border-radius:18px!important;
  border-color:var(--sup-border)!important;
  box-shadow:0 8px 20px rgba(4,87,150,.045)!important;
}
.btn{border-radius:12px!important}
.table-responsive{border-radius:18px!important}
.table thead th{
  font-weight:800;
  color:#101828;
  background:rgba(255,255,255,.78);
}
form .form-control, form .form-select{
  border-radius:12px;
  min-height:44px;
}
@media (max-width: 1100px){
  .sup-admin-shell{grid-template-columns:1fr}
  .sup-sidebar{position:relative;top:auto}
  .sup-sidebar-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .sup-kpi-grid{grid-template-columns:repeat(3,minmax(120px,1fr))}
}
@media (max-width: 720px){
  .sup-kpi-grid,.sup-module-grid{grid-template-columns:1fr}
  .sup-sidebar-nav{grid-template-columns:1fr}
}


/* FIX FINAL ADMIN — títulos/KPIs uniformes */
.sup-kpi-grid{align-items:stretch}
.sup-kpi-card{min-height:116px}
@media (max-width: 1280px){
  .sup-kpi-grid{grid-template-columns:repeat(4,minmax(120px,1fr));}
}
@media (max-width: 900px){
  .sup-kpi-grid{grid-template-columns:repeat(2,minmax(120px,1fr));}
}


/* Analytics Admin - Propuesta 3 */
.sup-analytics-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.sup-analytics-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.sup-analytics-card{padding:18px;border-radius:18px;background:#fff;border:1px solid rgba(4,87,150,.10);box-shadow:0 12px 30px rgba(4,87,150,.06)}
.sup-analytics-card.wide{grid-column:span 2}
.sup-card-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.sup-card-title span{font-weight:800;color:#045796}
.sup-card-title small{color:#6b7280}
.sup-analytics-table thead th{color:#045796;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;border-bottom-color:rgba(4,87,150,.15)}
.sup-tag-status{display:grid;gap:10px}
.sup-tag-status div{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:14px;background:#eefaff}
.sup-tag-status strong{color:#045796}
.sup-tag-status span{font-family:monospace;color:#0f172a}
@media (max-width: 992px){
  .sup-analytics-grid{grid-template-columns:1fr}
  .sup-analytics-card.wide{grid-column:span 1}
}


/* Analytics página dedicada - corrección de layout */
.sup-analytics-shell{
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  gap:24px;
  align-items:start;
}
.sup-analytics-shell .sup-main-panel{
  min-width:0;
  position:relative;
  z-index:1;
}
.sup-analytics-shell .sup-sidebar{
  z-index:2;
}
.sup-analytics-shell .sup-kpi-row{
  display:grid;
  grid-template-columns:repeat(4,minmax(150px,1fr));
  gap:14px;
  margin-bottom:18px;
}
.sup-analytics-shell .sup-kpi-card{
  min-height:112px;
  border-radius:18px;
  background:rgba(255,255,255,.96);
  border:1px solid var(--sup-border);
  box-shadow:0 8px 20px rgba(4,87,150,.055);
  padding:16px;
  position:relative;
  overflow:hidden;
}
.sup-analytics-shell .sup-kpi-card:after{
  content:"";
  position:absolute;
  right:-10px;
  top:-18px;
  width:62px;
  height:62px;
  border-radius:50%;
  background:rgba(0,182,222,.13);
}
.sup-analytics-shell .sup-kpi-card span{
  display:block;
  color:#475467;
  font-weight:800;
  margin-bottom:8px;
}
.sup-analytics-shell .sup-kpi-card strong{
  display:block;
  color:#0f172a;
  font-size:1.8rem;
  line-height:1;
  margin-bottom:8px;
}
.sup-analytics-shell .sup-kpi-card small{
  color:#667085;
}
@media (max-width:1100px){
  .sup-analytics-shell{grid-template-columns:1fr}
  .sup-analytics-shell .sup-kpi-row{grid-template-columns:repeat(2,minmax(140px,1fr))}
}
@media (max-width:720px){
  .sup-analytics-shell .sup-kpi-row{grid-template-columns:1fr}
}


/* PATCH UI PUBLIC FORMS — Fondo con más contraste
   Nota: dashboard-v3.css se carga después de app.css, por eso este override debe vivir aquí. */
body{
  background:
    radial-gradient(circle at 8% 18%, rgba(0,182,222,.24) 0%, rgba(0,182,222,0) 30%),
    radial-gradient(circle at 94% 18%, rgba(4,87,150,.16) 0%, rgba(4,87,150,0) 30%),
    linear-gradient(135deg,#c6eaf4 0%,#d4ebf3 42%,#c9e1ec 72%,#eaf7fb 100%) !important;
}

main.container > .card,
main.container .card,
main.container .sup-public-card,
main.container .form-section,
main.container .section-card{
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(0,182,222,.24) !important;
  box-shadow: 0 14px 38px rgba(4,87,150,.11) !important;
}

main.container{
  position: relative;
  z-index: 1;
}