/* =========================================================
   eCASILLA MUNICIPAL · IDENTIDAD VISUAL UNIFICADA 2026
   Paleta única institucional + tipografía única
   ========================================================= */
:root{
  --ecasilla:#123f4a;
  --ecasilla-rgb:18,63,74;
  --ecasilla-dark:#0d313a;
  --ecasilla-deep:#09272f;
  --ecasilla-mid:#1a5661;
  --ecasilla-soft:#edf4f5;
  --ecasilla-soft-2:#f5f8f8;
  --ecasilla-line:#d8e4e5;
  --ecasilla-text:#182f36;
  --ecasilla-muted:#667b80;
  --ecasilla-white:#ffffff;
  --ecasilla-shadow:0 8px 24px rgba(var(--ecasilla-rgb),.07);
  --ecasilla-font:"Segoe UI",Tahoma,Arial,sans-serif;
}

html,body,button,input,select,textarea,table,a,label,small,strong,h1,h2,h3,h4,h5,h6,
.swal2-popup,.swal2-title,.swal2-html-container{
  font-family:var(--ecasilla-font)!important;
}
body{color:var(--ecasilla-text)!important}

/* ===== LOGOTIPO: SIEMPRE TRANSPARENTE, SIN CAJA BLANCA ===== */
.logo-area img,
.institution-brand-single img,
.recovery-brand img,
.recovery-emblem img,
.logo-box img,
.register-brand img,
.cargo-brand img,
.official-brand img,
.official-logo img,
.brand-logo img,
.document-brand img,
img.logo,
img.brand-logo{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  border-radius:0!important;
}
.logo-area img{width:46px!important;height:46px!important;filter:none!important}
.institution-brand-single img{filter:none!important;background:transparent!important}

/* ===== NAVEGACIÓN ===== */
.sidebar{
  background:linear-gradient(180deg,var(--ecasilla-dark),var(--ecasilla))!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
  box-shadow:7px 0 24px rgba(var(--ecasilla-rgb),.08)!important;
}
.logo-area{background:rgba(255,255,255,.025)!important}
.logo-area h2,.logo-area h2 small{color:#fff!important}
.logo-area h2 small{opacity:.66!important}
.nav-section{color:rgba(255,255,255,.55)!important}
.sidebar nav a{color:rgba(255,255,255,.86)!important}
.sidebar nav a .svg-icon{color:rgba(255,255,255,.72)!important}
.sidebar nav a:hover{background:rgba(255,255,255,.075)!important;color:#fff!important}
.sidebar nav a.active{
  background:#fff!important;
  color:var(--ecasilla)!important;
  box-shadow:0 5px 14px rgba(0,0,0,.09)!important;
}
.sidebar nav a.active .svg-icon{color:var(--ecasilla)!important}
.sidebar-user{background:rgba(255,255,255,.075)!important;border-color:rgba(255,255,255,.12)!important}
.role-pill{background:rgba(255,255,255,.11)!important;border-color:rgba(255,255,255,.13)!important;color:#fff!important}

/* ===== TOPBAR ===== */
.app-topbar{background:rgba(248,250,250,.97)!important;border-color:var(--ecasilla-line)!important}
.app-dot{background:var(--ecasilla)!important;box-shadow:0 0 0 4px rgba(var(--ecasilla-rgb),.09)!important}
.notification-button{color:var(--ecasilla)!important;border-color:var(--ecasilla-line)!important}
.notification-button:hover{background:var(--ecasilla-soft)!important}
.notification-badge{background:var(--ecasilla)!important;border-color:#fff!important}

/* ===== ENCABEZADOS / HERO ===== */
.hero-banner,.hero-card,.gestion-hero,.fisico-hero,.compact-page-head,.dashboard-welcome,
.page-hero,.profile-hero,.security-hero{
  background:linear-gradient(110deg,var(--ecasilla-dark),var(--ecasilla))!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 10px 26px rgba(var(--ecasilla-rgb),.13)!important;
}
.hero-banner h1,.hero-card h1,.gestion-hero h1,.fisico-hero h1,.compact-page-head h1,.dashboard-welcome h1,
.hero-banner p,.hero-card p,.gestion-hero p,.fisico-hero p,.compact-page-head p,.dashboard-welcome p{color:#fff!important}
.hero-banner p,.hero-card p,.gestion-hero p,.fisico-hero p,.compact-page-head p,.dashboard-welcome p{opacity:.82!important}
.page-eyebrow,.welcome-kicker,.eyebrow{color:rgba(255,255,255,.72)!important}
.user-mail,.hero-chip,.security-status{background:rgba(255,255,255,.09)!important;border:1px solid rgba(255,255,255,.18)!important;color:#fff!important}

/* ===== KPI: UN SOLO COLOR ===== */
.stat-card:before,.metric-item:before,
.stat-card:nth-child(2):before,.metric-item:nth-child(2):before,
.stat-card:nth-child(3):before,.metric-item:nth-child(3):before,
.stat-card:nth-child(4):before,.metric-item:nth-child(4):before,
.stat-card:nth-child(5):before,.metric-item:nth-child(5):before{background:var(--ecasilla)!important}
.stat-icon,.metric-icon,.tile-icon,.quick-card .icon,.action-icon{
  background:var(--ecasilla-soft)!important;
  color:var(--ecasilla)!important;
  border-color:#d8e6e7!important;
}
.stat-card h2,.metric-item strong,.metric-value{color:var(--ecasilla)!important}
.tile-arrow,.quick-arrow,.action-arrow{color:var(--ecasilla)!important}

/* ===== TARJETAS / SUPERFICIES ===== */
.panel,.quick-access,.perfil-card,.seguridad-formulario,.seguridad-card,.profile-form,.security-main-card,
.profile-summary,.recepcion-card,.dashboard-actions,.metric-item,.stat-card,.action-tile,.quick-card,.card,
.form-card,.content-card{
  border-color:var(--ecasilla-line)!important;
  box-shadow:var(--ecasilla-shadow)!important;
}
.panel h2,.panel h3,.quick-access h2,.security-main-card h2,.profile-form h2,.section-cap h2{color:var(--ecasilla-text)!important}
.section-cap>div>span,.section-label,.section-kicker{color:var(--ecasilla)!important}
.quick-card:hover,.action-tile:hover{background:var(--ecasilla-soft-2)!important;border-color:rgba(var(--ecasilla-rgb),.30)!important}

/* ===== FORMULARIOS ===== */
.field label,.campo label,label.form-label{color:#38545a!important}
.field input,.field select,.field textarea,.campo input,.campo select,.campo textarea,.form-control,.form-select,
input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="tel"],select,textarea{
  border-color:var(--ecasilla-line)!important;
}
.field input:focus,.field select:focus,.field textarea:focus,.campo input:focus,.campo select:focus,.campo textarea:focus,
.form-control:focus,.form-select:focus,input:focus,select:focus,textarea:focus{
  border-color:rgba(var(--ecasilla-rgb),.55)!important;
  box-shadow:0 0 0 3px rgba(var(--ecasilla-rgb),.09)!important;
  outline:none!important;
}
input[type="checkbox"],input[type="radio"]{accent-color:var(--ecasilla)!important}

/* ===== BOTONES ===== */
.btn-link.primary,.btn-primary,.btn-guardar,.btn-seguridad,.btn-registrar,.btn-codigo,
button.primary,.primary-login,.btn-primary-recovery,#btnEnviarCodigo,.btn-action.primary{
  background:var(--ecasilla)!important;
  border-color:var(--ecasilla)!important;
  color:#fff!important;
  box-shadow:none!important;
}
.btn-link.primary:hover,.btn-primary:hover,.btn-guardar:hover,.btn-seguridad:hover,.btn-registrar:hover,
.primary-login:hover,.btn-primary-recovery:hover,#btnEnviarCodigo:hover{background:var(--ecasilla-dark)!important;filter:none!important}
.btn-secondary,.btn-link:not(.primary),.btn-secondary-recovery,.create-account,.btn-outline{
  background:#fff!important;
  border-color:rgba(var(--ecasilla-rgb),.34)!important;
  color:var(--ecasilla)!important;
}
.btn-secondary:hover,.btn-link:not(.primary):hover,.btn-secondary-recovery:hover,.create-account:hover,.btn-outline:hover{background:var(--ecasilla-soft)!important}
a{color:var(--ecasilla)}

/* ===== TABLAS ===== */
.table-wrap,.data-table-wrap,.docs-list{border-color:var(--ecasilla-line)!important}
.data-table thead th,table thead th{background:var(--ecasilla-soft)!important;color:#38545a!important;border-color:var(--ecasilla-line)!important}
.data-table tbody tr:hover,table tbody tr:hover{background:#f7faf9!important}

/* ===== ESTADOS Y ALERTAS: IDENTIDAD COHERENTE ===== */
.status-badge,.badge,.pill,.state-pill,.fisico-status{border-color:rgba(var(--ecasilla-rgb),.18)!important}
.status-badge:not(.danger):not(.warning),.badge:not(.danger):not(.warning),.pill:not(.danger):not(.warning){background:var(--ecasilla-soft)!important;color:var(--ecasilla)!important}
.alert.info,.info-box,.notice-info{background:var(--ecasilla-soft)!important;border-color:#d2e2e4!important;color:#31565d!important}
.alert.success,.success-box{background:#f0f6f5!important;border-color:#d5e4e2!important;color:var(--ecasilla)!important}

/* ===== DOCUMENTOS, CARGOS Y CONSTANCIAS ===== */
.official-header{border-top-color:var(--ecasilla)!important}
.official-brand strong,.official-doc-title h1,.official-doc-title small,.official-highlight-icon{color:var(--ecasilla)!important}
.official-highlight{background:var(--ecasilla-soft)!important;border-color:#d5e4e5!important}
.official-highlight-icon{background:#ddebed!important}
.cargo-side,.cargo-hero,.cargo-fisico-doc .cargo-hero{background:var(--ecasilla)!important}
.document-page,.cargo-fisico-body{background:#eef3f4!important}

/* ===== LOGIN ===== */
body.login-page{background:linear-gradient(135deg,var(--ecasilla-deep),var(--ecasilla-dark) 58%,var(--ecasilla))!important}
.institution-panel{background:linear-gradient(155deg,var(--ecasilla),var(--ecasilla-dark) 65%,var(--ecasilla-deep))!important}
.institution-panel:after{background:rgba(255,255,255,.18)!important}
.institution-brand-single img{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;filter:none!important}
.institution-brand-single span,.institution-brand-single small,.official-pill,.institution-features .svg-icon{color:#fff!important}
.institution-brand-single span,.institution-brand-single small{opacity:.72!important}
.official-pill{border-color:rgba(255,255,255,.22)!important;background:rgba(255,255,255,.07)!important}
.access-kicker,.label-row a,.create-account,.security-note>.svg-icon{color:var(--ecasilla)!important}
.access-kicker:before{background:var(--ecasilla)!important}
.access-heading h2{color:var(--ecasilla-dark)!important}
.control-wrap input:focus,.control-wrap select:focus{border-color:rgba(var(--ecasilla-rgb),.55)!important;box-shadow:0 0 0 4px rgba(var(--ecasilla-rgb),.08)!important}
.security-note{background:var(--ecasilla-soft)!important;border-color:#d8e4e5!important}

/* ===== REGISTRO ===== */
.register-header,.registro-header,.register-top,.form-header{
  background:linear-gradient(100deg,var(--ecasilla-dark),var(--ecasilla))!important;
}
.logo-box,.register-logo-box{background:transparent!important;border:0!important;box-shadow:none!important}
.logo-box img,.register-logo-box img{background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important}
.badge-registro{background:rgba(255,255,255,.1)!important;border-color:rgba(255,255,255,.2)!important;color:#fff!important}
.section-title{color:var(--ecasilla-text)!important}
.section-title:before{background:var(--ecasilla)!important}
.security-alert,.secure-note{background:var(--ecasilla-soft)!important;border-color:#d8e4e5!important;color:#38545a!important}

/* ===== RECUPERACIÓN ===== */
body.recovery-page{background:linear-gradient(135deg,var(--ecasilla-deep),var(--ecasilla-dark) 58%,var(--ecasilla))!important}
.recovery-aside{background:linear-gradient(155deg,var(--ecasilla-dark),var(--ecasilla))!important}
.recovery-title span,.recovery-meta a,.resend-line button{color:var(--ecasilla)!important}
.recovery-title h2{color:var(--ecasilla-dark)!important}
.step.active,.step.done{background:var(--ecasilla-soft)!important;border-color:#cfe0e1!important;color:var(--ecasilla)!important}
.step.active .step-number,.step.done .step-number{background:var(--ecasilla)!important;color:#fff!important}
.password-rule.ok{color:var(--ecasilla)!important}.password-rule.ok:before{background:var(--ecasilla)!important}
.recovery-notice{background:var(--ecasilla-soft)!important;border-color:#d5e4e5!important}.recovery-notice .svg-icon{color:var(--ecasilla)!important}

/* ===== TEXTO LEGAL ===== */
.legal h1,.legal h2{color:var(--ecasilla)!important}
.legal .meta span{background:var(--ecasilla-soft)!important;color:var(--ecasilla)!important}
.legal .important{background:var(--ecasilla-soft)!important;border-left-color:var(--ecasilla)!important}

/* ===== SWEETALERT ===== */
.swal2-confirm{background:var(--ecasilla)!important}
.swal2-styled.swal2-confirm:focus{box-shadow:0 0 0 3px rgba(var(--ecasilla-rgb),.14)!important}

/* ===== RESPONSIVE ===== */
@media(max-width:760px){
  .logo-area img{width:40px!important;height:40px!important}
  .sidebar{box-shadow:none!important}
}

/* Evita que estilos previos introduzcan múltiples colores decorativos */
*[style*="#123f4a"],*[style*="#123f4a"],*[style*="#123f4a"]{border-color:var(--ecasilla-line)}


/* =========================================================
   AJUSTE FINAL 2026-08-27 · IDENTIDAD MONOCROMÁTICA
   Un único color institucional para toda la interfaz.
   ========================================================= */
:root{
  --ecasilla:#123f4a!important;
  --ecasilla-dark:#123f4a!important;
  --ecasilla-deep:#123f4a!important;
  --ecasilla-mid:#123f4a!important;
}
/* Sin degradados cromáticos: todas las grandes superficies usan el mismo tono. */
.sidebar,
.hero-banner,.hero-card,.gestion-hero,.fisico-hero,.compact-page-head,.dashboard-welcome,
.register-header,.registro-header,.register-top,.form-header,
.institution-panel,.recovery-aside,.cargo-side,.cargo-hero,.cargo-fisico-doc .cargo-hero,
.login-brand-panel,.official-strip{
  background:#123f4a!important;
  background-image:none!important;
}
/* Encabezados de trámite y páginas internas */
[class*="hero"], [class*="banner"]{
  --brand-surface:#123f4a;
}
.hero-banner,.dashboard-welcome,.gestion-hero,.fisico-hero,.compact-page-head{
  background-color:#123f4a!important;
  background-image:none!important;
}
/* Iconografía/acento: misma identidad, variando solo opacidad/tinte */
.metric-icon,.tile-icon,.doc-iconbox,.official-highlight-icon,.mpv-section-number,
.recepcion-icon,.section-icon,.flow-icon,.timeline-icon{
  color:#123f4a!important;
  background:#edf4f5!important;
}
.metric-item,.stat-card,.action-tile,.quick-card,.panel,.content-card,.form-card{
  border-top-color:#123f4a!important;
}
/* Elimina líneas decorativas doradas/azules heredadas */
*[class*="accent"],*[class*="eyebrow"],.welcome-kicker,.page-eyebrow,.mpv-eyebrow,
.section-cap>div>span,.official-doc-title small{
  color:#123f4a!important;
}
/* Sidebar activo mantiene fondo claro y texto institucional */
.sidebar nav a.active{background:#fff!important;color:#123f4a!important}
/* Logos: jamás caja blanca/fondo propio */
.logo-area,.logo-box,.register-logo-box,.institution-brand-single,
.logo-area img,.logo-box img,.register-logo-box img,.institution-brand-single img,
.official-brand img,.cargo-brand img,.recovery-brand img,.recovery-emblem img{
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
/* Tipografía única real en toda la app, incluidos pseudo-componentes. */
*,*::before,*::after{
  font-family:"Segoe UI",Tahoma,Arial,sans-serif!important;
}
/* Evitar gradientes introducidos por estilos antiguos en componentes de marca. */
.primary-login,.btn-primary,.btn-link.primary,.btn-registrar,.btn-codigo,.btn-primary-recovery,
button.primary,#btnEnviarCodigo,.btn-action.primary{
  background:#123f4a!important;
  background-image:none!important;
}
@media(max-width:900px){
  .sidebar{background:#123f4a!important;background-image:none!important}
}

/* =========================================================
   eCASILLA MDE · REFINAMIENTO VISUAL FINAL 2026-08-27
   Diseño tipo SIGEL · una sola identidad cromática
   ========================================================= */
:root{
  --ecasilla:#0b5a5b!important;
  --ecasilla-rgb:11,90,91!important;
  --ecasilla-dark:#0b5a5b!important;
  --ecasilla-deep:#0b5a5b!important;
  --ecasilla-mid:#0b5a5b!important;
  --ecasilla-soft:#eef6f6!important;
  --ecasilla-soft-2:#f7fbfb!important;
  --ecasilla-line:#d9e7e7!important;
  --ecasilla-text:#172c33!important;
  --ecasilla-muted:#677b80!important;
  --ecasilla-font:"Segoe UI Variable","Segoe UI",Inter,Arial,sans-serif!important;
  --ecasilla-radius:14px;
  --ecasilla-shadow:0 8px 24px rgba(11,90,91,.055);
}

html,body,button,input,select,textarea,table,a,label,small,strong,h1,h2,h3,h4,h5,h6,
.swal2-popup,.swal2-title,.swal2-html-container{font-family:var(--ecasilla-font)!important}
body{background:#f4f8f8!important;color:var(--ecasilla-text)!important;-webkit-font-smoothing:antialiased}

/* Navegación: mismo color, sin degradados ni cajas alrededor del escudo */
.sidebar{width:238px!important;background:var(--ecasilla)!important;background-image:none!important;box-shadow:none!important;border-right:1px solid rgba(255,255,255,.12)!important}
.logo-area{height:126px!important;padding:18px 17px!important;display:flex!important;align-items:center!important;gap:12px!important;text-align:left!important;background:transparent!important;border-bottom:1px solid rgba(255,255,255,.13)!important}
.logo-area img{width:48px!important;height:48px!important;object-fit:contain!important;margin:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;filter:none!important}
.logo-area h2{font-size:14px!important;line-height:1.12!important;font-weight:760!important;letter-spacing:-.015em!important;margin:0!important;color:#fff!important}
.logo-area h2 small{display:block!important;margin-top:5px!important;font-size:7.2px!important;line-height:1.28!important;font-weight:650!important;text-transform:uppercase!important;letter-spacing:.07em!important;color:rgba(255,255,255,.64)!important}
.sidebar nav{padding:16px 10px 118px!important}
.nav-section{padding:9px 8px 6px!important;font-size:7px!important;font-weight:800!important;letter-spacing:.14em!important;color:rgba(255,255,255,.58)!important}
.sidebar nav a{min-height:38px!important;padding:9px 10px!important;margin:2px 0!important;border-radius:9px!important;gap:10px!important;color:rgba(255,255,255,.9)!important;font-size:9.5px!important;font-weight:560!important}
.sidebar nav a .svg-icon{width:15px!important;height:15px!important;color:rgba(255,255,255,.78)!important}
.sidebar nav a:hover{background:rgba(255,255,255,.10)!important;color:#fff!important}
.sidebar nav a.active{background:rgba(255,255,255,.96)!important;color:var(--ecasilla)!important;box-shadow:none!important;font-weight:730!important}
.sidebar nav a.active .svg-icon{color:var(--ecasilla)!important}
.sidebar-user{left:10px!important;right:10px!important;bottom:10px!important;width:auto!important;padding:12px!important;border-radius:12px!important;background:rgba(255,255,255,.085)!important;border:1px solid rgba(255,255,255,.13)!important;box-shadow:none!important}
.sidebar-user strong{font-size:9px!important;color:#fff!important}.sidebar-user>span{font-size:7.4px!important;color:rgba(255,255,255,.7)!important}.sidebar-user .role-pill{margin-top:7px!important;padding:4px 7px!important;font-size:7px!important;background:rgba(255,255,255,.12)!important;color:#fff!important}

/* Topbar: mismo verde petróleo del sistema */
.app-topbar{left:238px!important;height:58px!important;padding:0 20px!important;background:var(--ecasilla)!important;background-image:none!important;border:0!important;box-shadow:none!important}
.app-topbar-title{font-size:10px!important;font-weight:740!important;color:#fff!important}.app-dot{background:#fff!important;box-shadow:0 0 0 4px rgba(255,255,255,.12)!important}
.app-topbar-actions{display:flex;align-items:center;gap:9px}.notification-button{width:36px!important;height:36px!important;border-radius:10px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.18)!important;color:#fff!important;box-shadow:none!important}.notification-button:hover{background:rgba(255,255,255,.14)!important}.notification-badge{background:#fff!important;color:var(--ecasilla)!important;border:2px solid var(--ecasilla)!important;font-weight:800!important}
.topbar-user{display:flex;align-items:center;gap:8px;min-width:150px;padding:4px 8px 4px 5px;border-radius:11px;text-decoration:none;color:#fff!important;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10)}.topbar-user:hover{background:rgba(255,255,255,.11)}.topbar-avatar{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--ecasilla);font-size:10px;font-weight:800}.topbar-user-copy{display:flex;flex-direction:column;min-width:0}.topbar-user-copy strong{font-size:8.5px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-user-copy small{font-size:7px;color:rgba(255,255,255,.67);margin-top:1px}

/* Contenido y grandes encabezados */
.main-content{margin-left:238px!important;width:calc(100% - 238px)!important;padding:76px 20px 28px!important;background:#f4f8f8!important}
.dashboard-pro{max-width:1600px!important}
.hero-banner,.hero-card,.gestion-hero,.fisico-hero,.compact-page-head,.dashboard-welcome,.page-hero,.profile-hero,.security-hero{background:var(--ecasilla)!important;background-image:none!important;border:0!important;border-radius:13px!important;box-shadow:none!important;color:#fff!important}
.dashboard-welcome{min-height:105px!important;padding:20px 22px!important;margin-bottom:12px!important}.dashboard-welcome:after{border-color:rgba(255,255,255,.055)!important}.dashboard-welcome h1{font-size:22px!important;font-weight:760!important;letter-spacing:-.025em!important}.dashboard-welcome p{font-size:9px!important;color:rgba(255,255,255,.8)!important}.welcome-kicker,.page-eyebrow,.eyebrow{font-size:7px!important;color:rgba(255,255,255,.68)!important;letter-spacing:.13em!important}.welcome-mark{border-color:rgba(255,255,255,.18)!important;background:rgba(255,255,255,.08)!important}

/* KPI compactos, todos idénticos */
.metric-strip{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:9px!important;margin-bottom:12px!important}.metric-item,.stat-card{min-height:78px!important;padding:11px 13px!important;border:1px solid var(--ecasilla-line)!important;border-top:1px solid var(--ecasilla-line)!important;border-radius:12px!important;background:#fff!important;box-shadow:var(--ecasilla-shadow)!important}.metric-item:before,.stat-card:before{display:none!important}.metric-icon,.stat-icon{width:36px!important;height:36px!important;border-radius:50%!important;background:var(--ecasilla)!important;color:#fff!important;border:0!important}.metric-icon .svg-icon,.stat-icon .svg-icon{width:16px!important;height:16px!important}.metric-item strong,.stat-card h2{font-size:19px!important;color:var(--ecasilla-text)!important;font-weight:770!important}.metric-item div>span,.stat-card p{font-size:8px!important;color:var(--ecasilla-muted)!important}

/* Tarjetas / accesos / superficies */
.dashboard-actions,.panel,.quick-access,.perfil-card,.seguridad-formulario,.seguridad-card,.profile-form,.security-main-card,.profile-summary,.recepcion-card,.card,.form-card,.content-card{border:1px solid var(--ecasilla-line)!important;border-radius:13px!important;background:#fff!important;box-shadow:var(--ecasilla-shadow)!important}.dashboard-actions{padding:15px!important}.section-cap{border-color:#e7eeee!important}.section-cap span,.section-label,.section-kicker{color:var(--ecasilla)!important}.section-cap h2{font-size:13px!important;color:var(--ecasilla-text)!important}.section-cap p{font-size:8px!important;color:var(--ecasilla-muted)!important}
.action-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important}.action-tile,.quick-card{min-height:76px!important;padding:11px!important;border:1px solid var(--ecasilla-line)!important;border-radius:11px!important;background:#fff!important;box-shadow:none!important}.action-tile:hover,.quick-card:hover{background:var(--ecasilla-soft-2)!important;border-color:rgba(var(--ecasilla-rgb),.32)!important;transform:none!important}.tile-icon,.quick-card .icon,.action-icon{width:34px!important;height:34px!important;border-radius:50%!important;background:var(--ecasilla-soft)!important;color:var(--ecasilla)!important;border:0!important}.tile-arrow,.quick-arrow,.action-arrow{color:var(--ecasilla)!important}.action-tile strong{font-size:9px!important;color:var(--ecasilla-text)!important}.action-tile small{font-size:7.3px!important;color:var(--ecasilla-muted)!important}

/* Formularios uniformes */
.field label,.campo label,label.form-label{font-size:8.2px!important;font-weight:680!important;color:#314b50!important}.field input,.field select,.field textarea,.campo input,.campo select,.campo textarea,.form-control,.form-select,input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="tel"],select,textarea{min-height:40px!important;border:1px solid var(--ecasilla-line)!important;border-radius:9px!important;background:#fff!important;color:var(--ecasilla-text)!important;font-size:9px!important;box-shadow:none!important}.field textarea,.campo textarea,textarea{min-height:92px!important}.field input:focus,.field select:focus,.field textarea:focus,.campo input:focus,.campo select:focus,.campo textarea:focus,.form-control:focus,.form-select:focus,input:focus,select:focus,textarea:focus{border-color:var(--ecasilla)!important;box-shadow:0 0 0 3px rgba(var(--ecasilla-rgb),.08)!important}

/* Botones: un único color, sin gradientes */
.btn-link.primary,.btn-primary,.btn-guardar,.btn-seguridad,.btn-registrar,.btn-codigo,button.primary,.primary-login,.btn-primary-recovery,#btnEnviarCodigo,.btn-action.primary,.btn{border-radius:9px!important;font-weight:700!important}.btn-link.primary,.btn-primary,.btn-guardar,.btn-seguridad,.btn-registrar,.btn-codigo,button.primary,.primary-login,.btn-primary-recovery,#btnEnviarCodigo,.btn-action.primary{background:var(--ecasilla)!important;background-image:none!important;border-color:var(--ecasilla)!important;color:#fff!important;box-shadow:none!important}.btn-link.primary:hover,.btn-primary:hover,.btn-guardar:hover,.btn-seguridad:hover,.btn-registrar:hover,.primary-login:hover,.btn-primary-recovery:hover,#btnEnviarCodigo:hover{background:var(--ecasilla)!important;filter:brightness(.92)!important}.btn-secondary,.btn-link:not(.primary),.btn-secondary-recovery,.create-account,.btn-outline{background:#fff!important;border-color:rgba(var(--ecasilla-rgb),.35)!important;color:var(--ecasilla)!important}.btn-secondary:hover,.btn-link:not(.primary):hover,.btn-secondary-recovery:hover,.create-account:hover,.btn-outline:hover{background:var(--ecasilla-soft)!important}

/* Tablas */
.table-wrap,.data-table-wrap,.docs-list{border:1px solid var(--ecasilla-line)!important;border-radius:11px!important;overflow:hidden!important;background:#fff!important}.data-table thead th,table thead th{background:var(--ecasilla-soft)!important;color:#3e565b!important;border-color:var(--ecasilla-line)!important;font-size:7.5px!important;letter-spacing:.08em!important}.data-table td,table td{border-color:#edf2f2!important;color:var(--ecasilla-text)!important;font-size:8.5px!important}.data-table tbody tr:hover,table tbody tr:hover{background:#f7fbfb!important}

/* Todos los azules y verdes decorativos heredados pasan a la única identidad */
.app-topbar .svg-icon,.section-icon,.flow-icon,.timeline-icon,.doc-iconbox,.official-highlight-icon,.mpv-section-number,.recepcion-icon,.status-icon,.tile-icon .svg-icon{color:inherit!important}
.badge:not(.danger):not(.warning),.pill:not(.danger):not(.warning),.status-badge:not(.danger):not(.warning),.state-pill:not(.danger):not(.warning){background:var(--ecasilla-soft)!important;color:var(--ecasilla)!important;border-color:rgba(var(--ecasilla-rgb),.16)!important}
.alert.info,.info-box,.notice-info,.security-alert,.secure-note{background:var(--ecasilla-soft)!important;border-color:var(--ecasilla-line)!important;color:#31595a!important}

/* Documentos oficiales: color de identidad uniforme */
.official-strip,.official-header,.cargo-side,.cargo-hero,.cargo-fisico-doc .cargo-hero{background:var(--ecasilla)!important;background-image:none!important}.official-header{border-top-color:var(--ecasilla)!important}.official-brand strong,.official-doc-title h1,.official-doc-title small,.official-highlight-icon{color:var(--ecasilla)!important}.official-highlight{background:var(--ecasilla-soft)!important;border-color:var(--ecasilla-line)!important}

/* Login, registro y recuperación con la misma identidad */
body.login-page,body.recovery-page{background:var(--ecasilla)!important;background-image:none!important}.institution-panel,.recovery-aside,.register-header,.registro-header,.register-top,.form-header{background:var(--ecasilla)!important;background-image:none!important}.institution-brand-single img,.logo-box img,.register-logo-box img,.recovery-brand img,.recovery-emblem img{background:transparent!important;border:0!important;box-shadow:none!important}.access-kicker,.label-row a,.create-account,.security-note>.svg-icon,.recovery-title span,.recovery-meta a,.resend-line button{color:var(--ecasilla)!important}

/* Evita el aspecto de doble color en cabeceras/títulos heredados */
.hero-banner,.dashboard-welcome,.gestion-hero,.fisico-hero,.compact-page-head,[class*="hero-banner"]{background-color:var(--ecasilla)!important;background-image:none!important}
.hero-banner *,.dashboard-welcome *,.gestion-hero *,.fisico-hero *,.compact-page-head *{--local-accent:#fff}

/* Responsive */
@media(max-width:1120px){.metric-strip{grid-template-columns:repeat(3,1fr)!important}.action-grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:820px){.sidebar{width:min(286px,86vw)!important}.app-topbar{left:0!important;padding:0 11px 0 56px!important}.topbar-user-copy{display:none}.topbar-user{min-width:auto!important;padding:3px!important;border:0!important;background:transparent!important}.main-content{margin-left:0!important;width:100%!important;padding:72px 12px 22px!important}.metric-strip{grid-template-columns:repeat(2,1fr)!important}.action-grid{grid-template-columns:1fr 1fr!important}}
@media(max-width:520px){.metric-strip,.action-grid{grid-template-columns:1fr!important}.metric-item{min-height:65px!important}.dashboard-welcome{min-height:88px!important;padding:16px!important}.dashboard-welcome h1{font-size:18px!important}.main-content{padding-left:9px!important;padding-right:9px!important}}

/* =========================================================
   eCASILLA MUNICIPAL · UI PRO REFINADA 2026 · v4
   Ajuste directo de Gestión, Bandeja, Seguimiento y Físicos
   ========================================================= */
:root{
  --ui-primary:#0b5a5b;
  --ui-primary-dark:#08484a;
  --ui-primary-deep:#06393b;
  --ui-primary-soft:#edf7f7;
  --ui-primary-soft2:#f6fbfb;
  --ui-text:#17333a;
  --ui-muted:#6a7f84;
  --ui-border:#dce7e8;
  --ui-bg:#f3f7f7;
  --ui-shadow:0 8px 24px rgba(9,68,70,.07);
}
body{background:var(--ui-bg)!important;color:var(--ui-text)!important}
.dashboard{min-height:100vh!important}
.main-content{padding:84px 22px 34px 292px!important;max-width:none!important;background:var(--ui-bg)!important}
.app-topbar{height:60px!important;left:270px!important;padding:0 22px!important;background:#fff!important;box-shadow:0 1px 0 var(--ui-border)!important}
.app-topbar-title{font-weight:700!important;color:#47666b!important}
.topbar-user{display:flex!important;align-items:center!important;gap:9px!important;padding:5px 8px!important;border-radius:10px!important;text-decoration:none!important;color:var(--ui-text)!important}
.topbar-user:hover{background:var(--ui-primary-soft)!important}
.topbar-avatar{width:34px!important;height:34px!important;border-radius:50%!important;display:grid!important;place-items:center!important;background:var(--ui-primary)!important;color:#fff!important;font-size:12px!important;font-weight:800!important}
.topbar-user-copy{display:flex!important;flex-direction:column!important;line-height:1.15!important}.topbar-user-copy strong{font-size:12px!important}.topbar-user-copy small{font-size:10px!important;color:var(--ui-muted)!important;margin-top:3px!important}
.sidebar{width:270px!important;background:var(--ui-primary-dark)!important;box-shadow:none!important}
.logo-area{height:120px!important;padding:20px 18px!important;border-bottom:1px solid rgba(255,255,255,.09)!important}
.logo-area img{width:48px!important;height:48px!important;object-fit:contain!important}.logo-area h2{font-size:16px!important;line-height:1.15!important}.logo-area h2 small{font-size:9px!important;line-height:1.25!important;margin-top:5px!important;max-width:150px!important}
.sidebar nav{padding:12px 10px 118px!important}.nav-section{font-size:9px!important;letter-spacing:.15em!important;margin:16px 10px 7px!important}.sidebar nav a{min-height:42px!important;border-radius:10px!important;padding:0 12px!important;gap:12px!important;font-size:12px!important;font-weight:600!important}.sidebar nav a.active{box-shadow:none!important}.sidebar-user{left:12px!important;right:12px!important;bottom:12px!important;border-radius:12px!important;padding:12px!important}.sidebar-user strong{font-size:12px!important}.sidebar-user span{font-size:9.5px!important;margin-top:2px!important}.sidebar-user .role-pill{margin-top:7px!important;font-size:9px!important;padding:4px 7px!important}

.hero-banner,.fisico-hero{min-height:104px!important;padding:20px 24px!important;margin:0 0 16px!important;border-radius:16px!important;background:var(--ui-primary)!important;box-shadow:none!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important}.hero-banner h1,.fisico-hero h1{font-size:25px!important;line-height:1.1!important;margin:3px 0 5px!important;letter-spacing:-.02em!important}.hero-banner p,.fisico-hero p{font-size:12px!important;margin:0!important;max-width:820px!important;opacity:.86!important}.hero-eyebrow{display:block!important;font-size:9px!important;letter-spacing:.16em!important;font-weight:800!important;color:rgba(255,255,255,.72)!important;text-transform:uppercase!important}.hero-side-icon{width:46px;height:46px;border:1px solid rgba(255,255,255,.2);border-radius:13px;display:grid;place-items:center;background:rgba(255,255,255,.07);color:#fff;flex:0 0 auto}.hero-side-icon svg{width:22px;height:22px}.hero-chip{background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.2)!important;color:#fff!important;padding:8px 12px!important}

.panel,.inbox-shell,.fisico-panel{background:#fff!important;border:1px solid var(--ui-border)!important;border-radius:16px!important;box-shadow:var(--ui-shadow)!important}.pro-list-panel{padding:0!important;overflow:hidden!important}.panel-heading-pro{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:18px 20px 14px;border-bottom:1px solid var(--ui-border)}.panel-kicker{display:block;font-size:9px;letter-spacing:.15em;font-weight:800;color:var(--ui-primary);margin-bottom:3px}.panel-heading-pro h2{font-size:17px!important;margin:0!important;color:var(--ui-text)!important}.panel-heading-pro p{font-size:11px!important;color:var(--ui-muted)!important;margin:3px 0 0!important}.count-pill{border:1px solid var(--ui-border);background:var(--ui-primary-soft2);color:var(--ui-primary);font-size:10px;font-weight:700;padding:6px 9px;border-radius:999px;white-space:nowrap}.table-footer-pro{display:flex;justify-content:space-between;padding:10px 18px;border-top:1px solid var(--ui-border);font-size:10px;color:var(--ui-muted)}

.table-wrap{border:0!important;border-radius:0!important;overflow-x:auto!important}.pro-table,.data-table{width:100%!important;border-collapse:collapse!important}.pro-table thead th,.data-table thead th{background:#f5f9f9!important;color:#527075!important;font-size:9px!important;letter-spacing:.07em!important;text-transform:uppercase!important;font-weight:800!important;padding:11px 12px!important;border-bottom:1px solid var(--ui-border)!important;white-space:nowrap!important}.pro-table tbody td,.data-table tbody td{padding:12px!important;border-bottom:1px solid #edf2f2!important;font-size:11px!important;vertical-align:middle!important;line-height:1.35!important}.pro-table tbody tr:last-child td,.data-table tbody tr:last-child td{border-bottom:0!important}.pro-table tbody tr:hover,.data-table tbody tr:hover{background:#fbfdfd!important}.mpv-link{font-weight:800!important;text-decoration:none!important;color:var(--ui-primary)!important}.mpv-link:hover{text-decoration:underline!important}.sgd-value{font-variant-numeric:tabular-nums}.sgd-value.is-pending{color:#8a999c;font-style:italic}.person-cell{display:flex;align-items:center;gap:8px}.person-avatar{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:10px;font-weight:800;flex:0 0 auto}.date-cell{display:flex;flex-direction:column;gap:2px;font-variant-numeric:tabular-nums}.date-cell small{color:var(--ui-muted);font-size:9px}.actions-col{text-align:center!important;width:92px}.table-action,.icon-action{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-height:32px!important;padding:0 10px!important;border:1px solid #cddede!important;border-radius:9px!important;background:#fff!important;color:var(--ui-primary)!important;text-decoration:none!important;font-size:10px!important;font-weight:700!important}.table-action:hover,.icon-action:hover{background:var(--ui-primary-soft)!important;border-color:#a9c8c9!important}.table-action svg,.icon-action svg{width:15px!important;height:15px!important}

.status-chip{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:25px!important;padding:4px 8px!important;border-radius:8px!important;font-size:9px!important;font-weight:800!important;line-height:1.15!important;white-space:normal!important;max-width:150px!important;text-align:center!important;background:var(--ui-primary-soft)!important;color:var(--ui-primary)!important;border:1px solid #cfe3e3!important}.status-chip[data-state*="PRESENTADO"],.status-chip[data-state*="REGISTRADO"]{background:#EDF6F6!important;color:#0B5051!important;border-color:#CFE2E2!important}.status-chip[data-state*="NO_LEIDO"],.status-chip[data-state*="PENDIENTE"]{background:#fff7e7!important;color:#8a5b00!important;border-color:#efdbab!important}.status-chip[data-state*="RECIBIDO"],.status-chip[data-state*="ATENDIDO"],.status-chip[data-state*="NOTIFICADO"]{background:#edf8f2!important;color:#176d4e!important;border-color:#cee9dc!important}.status-chip[data-state*="OBSERVADO"]{background:#fff0f0!important;color:#a24040!important;border-color:#efcdcd!important}

.table-empty{min-height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--ui-muted);gap:5px}.table-empty svg{width:34px;height:34px;padding:8px;border-radius:50%;background:var(--ui-primary-soft);color:var(--ui-primary);box-sizing:content-box}.table-empty strong{color:var(--ui-text);font-size:12px}.table-empty span{font-size:10px}.physical-empty{min-height:130px}

.pro-inbox-shell{overflow:hidden!important}.inbox-toolbar{padding:14px 16px!important;background:#fff!important;border-bottom:1px solid var(--ui-border)!important}.inbox-toolbar strong{font-size:12px!important}.inbox-toolbar span{font-size:10px!important}.inbox-legend{font-size:9px!important;color:var(--ui-muted)!important}.inbox-empty{min-height:300px!important;padding:42px 20px!important}.inbox-empty>div{width:58px!important;height:58px!important;border-radius:50%!important;background:var(--ui-primary-soft)!important;color:var(--ui-primary)!important;display:grid!important;place-items:center!important;margin:0 auto 10px!important}.inbox-empty>div svg{width:27px!important;height:27px!important}.inbox-empty h3{font-size:16px!important;margin:0 0 5px!important}.inbox-empty p{font-size:11px!important;color:var(--ui-muted)!important;max-width:500px!important;margin:auto!important}.inbox-summary{min-width:72px!important;height:54px!important;border-radius:12px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.18)!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important}.inbox-summary strong{font-size:19px!important;line-height:1!important}.inbox-summary span{font-size:8px!important;text-transform:uppercase!important;letter-spacing:.1em!important;margin-top:4px!important}

.fisico-metrics{gap:12px!important;margin-bottom:14px!important}.fisico-metric{padding:13px 15px!important;border-radius:13px!important;box-shadow:none!important;border-color:var(--ui-border)!important}.fisico-metric:hover{border-color:#b9d0d0!important;transform:none!important;background:var(--ui-primary-soft2)!important}.fisico-metric .metric-svg{width:36px!important;height:36px!important;border-radius:10px!important;background:var(--ui-primary-soft)!important;color:var(--ui-primary)!important}.fisico-metric strong{font-size:20px!important;color:var(--ui-text)!important}.fisico-metric span span{font-size:10px!important}.fisico-panel{padding:0!important;overflow:hidden!important}.fisico-toolbar{padding:16px 18px 14px!important;margin:0!important;border-bottom:1px solid var(--ui-border)!important;align-items:center!important}.fisico-toolbar h2{font-size:16px!important;color:var(--ui-text)!important;margin:0 0 3px!important}.fisico-toolbar p{font-size:10px!important}.fisico-search input,.fisico-search select{height:36px!important;border-radius:9px!important;font-size:10px!important}.fisico-search .btn-link{height:36px!important;padding:0 13px!important;border-radius:9px!important;font-size:10px!important}.fisico-table td small{font-size:9px!important}.fisico-status{font-size:9px!important;padding:5px 8px!important;border-radius:8px!important}

@media(max-width:1100px){.main-content{padding-left:286px!important}.topbar-user-copy{display:none!important}.app-topbar{left:270px!important}.pro-table{min-width:900px!important}}
@media(max-width:820px){.main-content{padding:72px 12px 24px!important}.app-topbar{left:0!important}.hero-banner,.fisico-hero{min-height:auto!important;padding:18px!important}.hero-side-icon{display:none}.panel-heading-pro{align-items:flex-start;flex-direction:column}.count-pill{align-self:flex-start}.sidebar{width:270px!important}.fisico-toolbar{align-items:stretch!important}.pro-table{min-width:760px!important}}
@media(max-width:520px){.hero-banner h1,.fisico-hero h1{font-size:21px!important}.hero-banner p,.fisico-hero p{font-size:11px!important}.main-content{padding-left:10px!important;padding-right:10px!important}.panel-heading-pro{padding:15px}.inbox-empty{min-height:230px!important}.fisico-search{gap:6px!important}.fisico-search input,.fisico-search select,.fisico-search .btn-link{width:100%!important;flex:1 1 100%!important}}