:root{
  --dc-deep:#12372a;
  --dc-green:#1f6f54;
  --dc-emerald:#2f9e75;
  --dc-mint:#dff6ea;
  --dc-graphite:#263238;
  --dc-bg:#f4f7f5;
  --dc-border:#dfe7e2;
  --dc-muted:#6b7b73;
  --sidebar-width:275px;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--dc-bg);color:#1e2b25}
.app-shell{display:flex;min-height:100vh}
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-width);min-width:var(--sidebar-width);padding:24px 18px;display:flex;flex-direction:column;background:linear-gradient(180deg,#12372a 0%,#173f31 55%,#202d27 100%);box-shadow:10px 0 28px rgba(18,55,42,.12);z-index:1040}
.brand-wrap{display:flex;gap:12px;align-items:center;padding:0 8px 24px}
.brand-mark{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#46c38a,#1f8d67);color:white;font-weight:900;box-shadow:0 10px 22px rgba(31,141,103,.22)}
.brand-mark-lg{width:62px;height:62px;border-radius:18px;margin-bottom:28px}
.brand-name{font-size:1.08rem;font-weight:850;color:white}
.brand-module{font-size:.82rem;color:#a7f3d0;font-weight:700;letter-spacing:.05em}
.section-label{font-size:.67rem;letter-spacing:.12em;font-weight:800;color:rgba(255,255,255,.38);padding:0 12px 8px}
.sidebar-nav{display:flex;flex-direction:column;gap:4px}
.nav-item{display:flex;align-items:center;gap:12px;text-decoration:none;color:rgba(255,255,255,.75);padding:11px 13px;border-radius:12px;font-size:.91rem;font-weight:650;transition:.16s ease}
.nav-item:hover{color:white;background:rgba(255,255,255,.07)}
.nav-item.active{color:white;background:linear-gradient(90deg,rgba(70,195,138,.25),rgba(255,255,255,.05));box-shadow:inset 3px 0 0 #6ee7b7}
.nav-item.disabled{opacity:.36;cursor:default}
.nav-icon{width:22px;text-align:center}
.sidebar-footer{margin-top:auto;border-top:1px solid rgba(255,255,255,.08);padding:18px 12px 0;color:rgba(255,255,255,.4);font-size:.75rem}
.main-area{flex:1;min-width:0;margin-left:var(--sidebar-width)}
.topbar{height:72px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.95);border-bottom:1px solid var(--dc-border);position:sticky;top:0;z-index:1020;backdrop-filter:blur(12px)}
.topbar-context{font-size:.88rem;font-weight:650;color:var(--dc-muted)}
.mobile-menu{display:none;border:0;background:transparent;font-size:1.45rem}
.user-box{display:flex;align-items:center;gap:10px}
.avatar{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--dc-green),var(--dc-emerald));color:white;display:flex;align-items:center;justify-content:center;font-weight:850}
.user-name{font-size:.84rem;font-weight:750}.user-role{font-size:.72rem;color:var(--dc-muted)}
.content{padding:30px;max-width:1700px;margin:0 auto}
.page-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:26px}
.page-heading h1{font-size:clamp(1.7rem,2.4vw,2.2rem);font-weight:850;letter-spacing:-.035em;margin:0 0 6px;color:#17251f}
.page-heading p{color:var(--dc-muted);margin:0}
.eyebrow{font-size:.7rem;letter-spacing:.14em;font-weight:850;color:var(--dc-green);margin-bottom:5px}
.corporate-card,.kpi-card{border:1px solid rgba(223,231,226,.95)!important;border-radius:16px!important;background:white}
.kpi-card{position:relative;overflow:hidden}
.kpi-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--dc-green),#54c693)}
.kpi-card .card-body{padding:22px 24px}
.kpi-label{font-size:.82rem;color:var(--dc-muted);font-weight:700}.kpi-value{font-size:2.15rem;font-weight:900;letter-spacing:-.04em;color:var(--dc-deep);margin-top:6px}.kpi-note{font-size:.75rem;color:#91a29a;margin-top:4px}
.btn-corporativo{background:linear-gradient(135deg,var(--dc-green),#278b68);color:white;border:0;font-weight:750;box-shadow:0 8px 20px rgba(31,111,84,.15)}
.btn-corporativo:hover,.btn-corporativo:focus{color:white;background:linear-gradient(135deg,#185a44,#207a5b)}
.btn-outline-corporativo{border-color:#8dcab0;color:var(--dc-green);font-weight:700;background:white}
.btn-outline-corporativo:hover{background:var(--dc-green);border-color:var(--dc-green);color:white}
.form-control,.form-select{min-height:44px;border-radius:10px;border-color:#cbd9d1}.form-control:focus,.form-select:focus{border-color:#6fc49e;box-shadow:0 0 0 .2rem rgba(47,158,117,.11)}
.table thead th{white-space:nowrap;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:#718178;background:#f7faf8;font-weight:850;padding:13px 16px;border-bottom:1px solid var(--dc-border)}
.table tbody td{padding:13px 16px;border-color:#eef3f0}.table-hover tbody tr:hover{--bs-table-hover-bg:#f7faf8}
.status-active{background:#dff6ea;color:#166544}.status-inactive{background:#eceff1;color:#59666d}.badge-type{background:#e7f0ec;color:#315e4c}
.workflow{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.workflow-step{padding:16px 10px;border:1px solid var(--dc-border);border-radius:14px;background:#fbfdfc;text-align:center;font-size:.82rem;font-weight:700;color:#345447}.workflow-number{width:30px;height:30px;margin:0 auto 8px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--dc-mint);color:var(--dc-green);font-weight:900}
.login-page{min-height:100vh;background:#f6f8f7}.login-layout{min-height:100vh;display:grid;grid-template-columns:minmax(430px,1.05fr) minmax(420px,.95fr)}
.login-brand{display:flex;align-items:center;padding:70px;background:radial-gradient(circle at 12% 10%,rgba(89,222,160,.20),transparent 30%),linear-gradient(145deg,#12372a,#1b4b39 58%,#263238);color:white;overflow:hidden;position:relative}
.login-inner{max-width:620px;position:relative;z-index:2}.login-brand h1{font-size:clamp(2.3rem,4vw,4rem);line-height:1.02;letter-spacing:-.05em;font-weight:900;margin-bottom:22px}.login-brand p{max-width:550px;color:rgba(255,255,255,.72);font-size:1.08rem;line-height:1.65}.login-points{margin-top:32px;display:grid;gap:12px;color:rgba(255,255,255,.86)}.login-points div::first-letter{color:#6ee7b7}
.login-form-wrap{display:flex;align-items:center;justify-content:center;padding:45px}.login-card{width:min(100%,460px);padding:38px;background:white;border-radius:22px;box-shadow:0 25px 70px rgba(25,50,40,.12)}.demo-box{background:#eef5f1;color:#53665d;padding:13px 15px;border-radius:12px;font-size:.88rem}
.menu-overlay{display:none}
@media(max-width:1100px){.workflow{grid-template-columns:repeat(3,1fr)}}
@media(max-width:991.98px){.sidebar{transform:translateX(-100%);transition:transform .22s ease}.main-area{margin-left:0}.mobile-menu{display:inline-block}body.menu-open .sidebar{transform:translateX(0)}body.menu-open .menu-overlay{display:block;position:fixed;inset:0;background:rgba(20,35,29,.45);z-index:1030}.content{padding:22px}.login-layout{grid-template-columns:1fr}.login-brand{display:none}}
@media(max-width:575.98px){.topbar{padding:0 16px}.topbar-context{display:none}.content{padding:18px 14px}.page-heading{flex-direction:column}.workflow{grid-template-columns:repeat(2,1fr)}.login-form-wrap{padding:22px}.login-card{padding:26px 22px}}


.priority-baja{background:#e7f5ee;color:#32735a}
.priority-media{background:#e8f1f5;color:#315f72}
.priority-alta{background:#fff0d6;color:#946200}
.priority-urgente{background:#fde6e3;color:#a3392e}

.estado-borrador{background:#eef1f0;color:#5c6963}
.estado-pendiente_aprobacion{background:#fff0d6;color:#946200}
.estado-aprobada{background:#dff6ea;color:#166544}
.estado-rechazada{background:#fde6e3;color:#a3392e}

.approval-result{
  padding:18px;
  border-radius:14px;
  border:1px solid var(--dc-border);
}
.approval-result.approved{background:#effbf5;color:#166544;border-color:#bde8d2}
.approval-result.rejected{background:#fff3f1;color:#963e35;border-color:#f1c8c2}

.timeline{
  padding:12px 24px 22px;
}
.timeline-item{
  position:relative;
  display:grid;
  grid-template-columns:24px 1fr;
  gap:12px;
  padding:14px 0;
}
.timeline-item:not(:last-child)::before{
  content:"";
  position:absolute;
  left:8px;
  top:34px;
  bottom:-14px;
  width:2px;
  background:#dce9e2;
}
.timeline-dot{
  width:18px;
  height:18px;
  margin-top:3px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--dc-green),var(--dc-emerald));
  border:4px solid #e8f6ef;
  position:relative;
  z-index:2;
}
.timeline-content{
  padding-bottom:4px;
}

.table-selected{--bs-table-bg:#eefaf4!important;box-shadow:inset 4px 0 0 var(--dc-emerald)}


.estado-emitida{background:#e8f1f5;color:#315f72}
.estado-parcial{background:#fff0d6;color:#946200}
.estado-recibida{background:#dff6ea;color:#166544}
.badge-overdue{background:#fde6e3;color:#a3392e}
.row-overdue{--bs-table-bg:#fff8f7}
.progress-thin{height:5px;background:#e5ece8}
.progress-thin .progress-bar{background:linear-gradient(90deg,var(--dc-green),var(--dc-emerald))}


.metric-card{
  border:1px solid var(--dc-border)!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,#fff,#fbfdfc);
}
.metric-card .card-body{padding:20px 22px}
.metric-value{font-size:1.9rem;font-weight:900;letter-spacing:-.035em;color:var(--dc-deep)}
.metric-money{font-size:1.5rem}
.metric-label{font-size:.84rem;font-weight:750;margin-top:5px}
.metric-note{font-size:.75rem;color:var(--dc-muted);margin-top:3px}
.kpi-money{font-size:1.7rem}
.chart-wrap{height:330px;position:relative}
.chart-wrap-small{height:330px}
.alert-critical{background:#fde6e3;color:#a3392e}
.alert-warning-soft{background:#fff0d6;color:#946200}
.alert-info-soft{background:#e8f1f5;color:#315f72}

@media(max-width:767.98px){
  .chart-wrap,.chart-wrap-small{height:280px}
}


.about-card{
  border-radius:18px!important;
}
.about-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding:28px 32px;
  background:linear-gradient(135deg,var(--dc-deep),var(--dc-green));
  color:#fff;
}
.about-brand{
  font-size:1.75rem;
  font-weight:900;
  letter-spacing:-.025em;
}
.about-version{
  margin-top:3px;
  font-size:.85rem;
  opacity:.82;
}
.about-badge{
  border:1px solid rgba(255,255,255,.28);
  background:rgba(255,255,255,.12);
  padding:8px 14px;
  border-radius:999px;
  font-size:.8rem;
  font-weight:700;
}
.about-lead{
  font-size:1.05rem;
  line-height:1.75;
  color:var(--dc-text);
  max-width:920px;
}
.about-section{
  height:100%;
}
.about-list{
  margin:14px 0 0 0;
  padding-left:1.15rem;
  color:var(--dc-text);
}
.about-list li{
  margin-bottom:8px;
}
.about-tech-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  margin-top:14px;
}
.about-tech-item{
  display:flex;
  flex-direction:column;
  padding:12px 14px;
  background:#f8fbf9;
  border:1px solid var(--dc-border);
  border-radius:12px;
}
.about-tech-item strong{
  font-size:.76rem;
  color:var(--dc-muted);
  text-transform:uppercase;
  letter-spacing:.04em;
}
.about-tech-item span{
  margin-top:2px;
  font-weight:700;
  color:var(--dc-deep);
}

@media(max-width:767.98px){
  .about-header{
    align-items:flex-start;
    flex-direction:column;
    padding:24px;
  }
}