:root{
  --red:#cb2b4f;--red-dark:#8d1c35;--rose:#f43f5e;--magenta:#db2777;--purple:#7c3aed;--purple-dark:#5b21b6;
  --ink:#0f172a;--slate:#334155;--muted:#64748b;--line:#e2e8f0;--soft:#f8fafc;--bg:#f1f5f9;
  --green:#059669;--amber:#d97706;--blue:#2563eb;--cyan:#0891b2;--teal:#0f766e;
  --shadow:0 14px 40px rgba(15,23,42,.08);--shadow-soft:0 8px 24px rgba(15,23,42,.06)
}

*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;font-family:Inter,Segoe UI,Arial,Helvetica,sans-serif;background:var(--bg);color:var(--ink);line-height:1.45}
a{text-decoration:none;color:inherit}
h1,h2,h3{margin:0 0 8px;line-height:1.2}h1{font-size:29px}h2{font-size:19px}p{margin:0 0 12px}
.top{position:sticky;top:0;z-index:30;background:linear-gradient(110deg,#111827,#1f2937);color:#fff;padding:12px 24px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 4px 20px rgba(0,0,0,.12)}
.brand{font-size:18px;font-weight:800;letter-spacing:.2px}.version{font-size:11px;color:#d1d5db;margin-top:2px}.user-box{display:flex;align-items:center;gap:10px;font-size:13px}.user-box span{background:rgba(255,255,255,.12);padding:4px 8px;border-radius:999px}.user-box a{border-left:1px solid rgba(255,255,255,.25);padding-left:10px;color:#fecaca}
.wrap{display:flex;min-height:calc(100vh - 59px)}
.side{position:sticky;top:59px;height:calc(100vh - 59px);overflow:auto;width:258px;background:#fff;border-right:1px solid var(--line);padding:18px 14px}
.side a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:10px;margin-bottom:4px;color:#374151;font-size:14px;font-weight:600}.side a span{width:20px;text-align:center;color:#9ca3af}.side a:hover{background:#f9fafb;color:#111827}.side a.active{background:#fef2f2;color:var(--red-dark);box-shadow:inset 3px 0 0 var(--red)}.side a.active span{color:var(--red)}
.main{flex:1;min-width:0;padding:26px;max-width:1800px}
.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:18px}.page-head p,.section-title p{color:var(--muted);margin:0}.section-title{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:18px;box-shadow:var(--shadow)}
.grid{display:grid;gap:14px}.grid.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.metric-card{position:relative;overflow:hidden}.metric-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--red)}.metric-card span{display:block;color:var(--muted);font-size:13px}.metric-card strong{display:block;font-size:34px;margin:5px 0 1px}.metric-card small{color:#9ca3af}
.muted{color:var(--muted)}.center{text-align:center}.empty{text-align:center;color:var(--muted);padding:30px!important}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:7px;background:var(--red);color:#fff;padding:10px 15px;border:0;border-radius:9px;cursor:pointer;font:inherit;font-size:14px;font-weight:700;transition:.15s}.btn:hover{background:var(--red-dark);transform:translateY(-1px)}.btn.secondary{background:#374151}.btn.secondary:hover{background:#1f2937}.btn.green{background:var(--green)}.btn.green:hover{background:#065f46}.btn.full{width:100%;margin-top:15px}.btn.small{padding:7px 10px;font-size:12px}
.icon-btn{width:36px;height:36px;border:0;border-radius:8px;background:#fee2e2;color:#991b1b;font-size:21px;cursor:pointer}.icon-btn:hover{background:#fecaca}
.flash{padding:13px 15px;border-radius:10px;margin-bottom:16px;font-weight:600}.flash.ok{background:#d1fae5;color:#065f46;border:1px solid #a7f3d0}.flash.err{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}.warning-box{background:#fffbeb;color:#92400e;border:1px solid #fde68a;margin-top:16px}
.status{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}.status.success{background:#d1fae5;color:#065f46}.status.danger{background:#fee2e2;color:#991b1b}.status.warning{background:#fef3c7;color:#92400e}.status.neutral{background:#e5e7eb;color:#374151}
.table-wrap{width:100%;overflow:auto;border:1px solid var(--line);border-radius:10px}.table-wrap.compact{max-height:440px}table{width:100%;border-collapse:collapse;background:#fff;min-width:760px}th,td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:left;font-size:13px;vertical-align:top}th{position:sticky;top:0;z-index:2;background:#f3f4f6;color:#374151;font-size:12px;text-transform:uppercase;letter-spacing:.035em}tbody tr:hover{background:#fafafa}td small{display:block;color:var(--muted);margin-top:3px}tbody tr:last-child td{border-bottom:0}
input,select,textarea{width:100%;padding:10px 11px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:var(--ink);font:inherit;font-size:14px;outline:none}input:focus,select:focus,textarea:focus{border-color:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.10)}textarea{min-height:88px;resize:vertical}label{display:block;font-weight:700;font-size:12px;color:#374151;margin-bottom:5px}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.span-2{grid-column:span 2}.span-3{grid-column:span 3}.actions{display:flex;align-items:flex-end}.actions.right{justify-content:flex-end;margin-top:16px}.check-stack{display:flex;flex-direction:column;justify-content:center;gap:7px}.check-stack label{display:flex;align-items:center;gap:8px;margin:0}.check-stack input{width:auto}
.filters{display:grid;grid-template-columns:minmax(240px,2fr) minmax(180px,1fr) auto auto;gap:10px}.filter-card{padding:14px}.inline-filter select{min-width:210px}
.item-list{display:flex;flex-direction:column;gap:9px}.item-row{display:grid;grid-template-columns:minmax(260px,2fr) minmax(110px,.65fr) minmax(130px,.8fr) minmax(140px,.8fr) 36px;gap:9px;align-items:center;padding:10px;background:#f9fafb;border:1px solid var(--line);border-radius:10px}.item-row.req-row{grid-template-columns:minmax(220px,1.4fr) minmax(220px,1.4fr) 110px 100px 130px minmax(170px,1fr) 36px}
.status-form{display:flex;gap:7px;min-width:290px}.status-form select{min-width:190px}.action-stack{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.action-stack form{margin:0}.reset-form{display:flex;gap:6px}.reset-form input{width:150px;padding:7px 8px;font-size:12px}
details summary{cursor:pointer;font-weight:800;color:#7f1d1d}.details-form{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.login-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 15% 15%,#fee2e2 0,transparent 28%),radial-gradient(circle at 85% 80%,#e5e7eb 0,transparent 30%),#f8fafc}.login{width:min(430px,100%);padding:28px}.install-card{width:min(520px,100%)}.updater-card{width:min(760px,100%)}.login-mark{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,var(--red),#450a0a);color:#fff;display:grid;place-items:center;font-size:18px;font-weight:900;box-shadow:0 10px 25px rgba(185,28,28,.22);margin-bottom:16px}.login form label{margin-top:12px}.login hr,.card hr{border:0;border-top:1px solid var(--line);margin:18px 0}.login h2{font-size:15px;margin-top:10px}
.update-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.update-grid div{background:#f9fafb;border:1px solid var(--line);border-radius:12px;padding:14px;text-align:center}.update-grid strong{display:block;font-size:28px}.update-grid span{font-size:12px;color:var(--muted)}.feature-list{padding-left:20px;color:#374151}.feature-list li{margin-bottom:8px}.update-details{background:#f9fafb;border:1px solid var(--line);border-radius:12px;padding:15px;margin:16px 0}.update-details ul{margin:0;padding-left:20px}
@media(max-width:1200px){.grid.metrics{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.span-3{grid-column:span 2}.item-row,.item-row.req-row{grid-template-columns:1fr 1fr 1fr}.item-row .icon-btn{grid-column:auto}.filters{grid-template-columns:1fr 1fr auto}}
@media(max-width:860px){.top{position:relative}.wrap{display:block}.side{position:relative;top:0;width:auto;height:auto;display:flex;overflow:auto;border-right:0;border-bottom:1px solid var(--line);padding:10px}.side a{white-space:nowrap;margin:0 3px}.main{padding:16px}.page-head{display:block}.inline-filter{margin-top:12px}.form-grid{grid-template-columns:1fr}.span-2,.span-3{grid-column:span 1}.filters{grid-template-columns:1fr}.item-row,.item-row.req-row{grid-template-columns:1fr}.grid.metrics{grid-template-columns:1fr 1fr}.section-title{display:block}.section-title .btn{margin-top:10px}.user-box span{display:none}}
@media(max-width:560px){.grid.metrics,.update-grid{grid-template-columns:1fr}.main{padding:12px}.card{padding:14px}.top{padding:11px 14px}.user-box strong{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}h1{font-size:24px}.side a span{display:none}}
/* V2.4 demo operativa */
.danger-btn{background:#991b1b}.danger-btn:hover{background:#7f1d1d}
.demo-banner{margin-top:0;margin-bottom:18px}
.check-line{display:flex;align-items:center;gap:9px;margin:14px 0;font-size:13px}.check-line input{width:auto}
.item-row.wide-row{grid-template-columns:minmax(220px,1.5fr) minmax(170px,1fr) minmax(170px,1fr) 90px 90px 115px minmax(150px,1fr) 36px}
.item-row.receipt-row{grid-template-columns:minmax(260px,2fr) 110px 130px 145px 135px 36px}
.item-row.supply-row{grid-template-columns:minmax(320px,2fr) 120px 170px}
.item-label{display:flex;flex-direction:column;gap:3px}.item-label small{color:var(--muted)}
.action-stack.horizontal{flex-wrap:nowrap}
.approval-card{border-left:5px solid var(--amber)}
@media(max-width:1350px){.item-row.wide-row{grid-template-columns:1fr 1fr 1fr 110px}.item-row.receipt-row{grid-template-columns:1fr 1fr 1fr}.item-row.supply-row{grid-template-columns:1fr 140px 180px}}
@media(max-width:860px){.item-row.wide-row,.item-row.receipt-row,.item-row.supply-row{grid-template-columns:1fr}.action-stack.horizontal{flex-wrap:wrap}}


/* V2.5 presencia visual */
body{background:linear-gradient(180deg,#eff6ff 0,#f8fafc 18%,#f8fafc 100%)}
.top{background:linear-gradient(115deg,#0f172a,#1e1b4b 55%,#312e81);padding:14px 24px}
.brand{font-size:20px}.version{font-size:12px;color:#cbd5e1}.user-box strong{font-size:14px}
.user-box span{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.08)}
.wrap{align-items:stretch}
.side{background:linear-gradient(180deg,#ffffff 0,#f8fafc 100%);border-right:1px solid #dbe3ef;box-shadow:inset -1px 0 0 rgba(255,255,255,.65)}
.side a{border:1px solid transparent;border-radius:14px;font-weight:700;transition:.18s;position:relative;overflow:hidden}
.side a:hover{background:linear-gradient(90deg,#fff1f2,#ffffff);border-color:#ffe4e6;transform:translateX(2px)}
.side a.active{background:linear-gradient(90deg,#fff1f2,#fdf2f8);box-shadow:0 8px 20px rgba(203,43,79,.12), inset 3px 0 0 var(--red);border-color:#fecdd3}
.main{padding:28px}
.page-head{margin-bottom:20px}
.page-head h1{font-size:32px;letter-spacing:-.02em}
.card{border-radius:18px;box-shadow:var(--shadow-soft);border:1px solid rgba(226,232,240,.95)}
.flash{border-radius:14px}
.metric-card{padding:18px 18px 16px 18px;border:0;color:#fff;min-height:122px;box-shadow:0 16px 30px rgba(15,23,42,.12)}
.metric-card:before{display:none}
.metric-card span{font-size:13px;color:rgba(255,255,255,.86);font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.metric-card strong{font-size:32px;color:#fff;letter-spacing:-.03em}
.metric-card small{color:rgba(255,255,255,.8)}
.metric-card .metric-icon{position:absolute;right:16px;top:14px;font-size:24px;opacity:.9}
.metric-card.inventory{background:linear-gradient(135deg,#2563eb,#06b6d4)}
.metric-card.value{background:linear-gradient(135deg,#0f766e,#10b981)}
.metric-card.alert{background:linear-gradient(135deg,#ea580c,#f59e0b)}
.metric-card.reqs{background:linear-gradient(135deg,#7c3aed,#a855f7)}
.metric-card.supervisor{background:linear-gradient(135deg,#db2777,#fb7185)}
.metric-card.cedis{background:linear-gradient(135deg,#0f172a,#334155)}
.metric-card.expiry{background:linear-gradient(135deg,#b45309,#f97316)}
.metric-card.patients{background:linear-gradient(135deg,#0369a1,#38bdf8)}
.metric-card .pill{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;margin-top:8px;background:rgba(255,255,255,.14);font-size:11px;font-weight:700;color:#fff}
.hero-banner{position:relative;overflow:hidden;background:linear-gradient(135deg,#1e293b 0,#1e1b4b 55%,#7c3aed 100%);color:#fff;padding:26px;border-radius:24px;box-shadow:0 18px 38px rgba(49,46,129,.2)}
.hero-banner:before,.hero-banner:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.08)}
.hero-banner:before{width:280px;height:280px;right:-80px;top:-120px}
.hero-banner:after{width:220px;height:220px;left:-70px;bottom:-120px}
.hero-banner h1,.hero-banner h2{color:#fff;margin-bottom:10px}
.hero-banner p{color:rgba(255,255,255,.84);max-width:820px}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;align-items:stretch}
.hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.hero-badge{display:inline-flex;gap:8px;align-items:center;padding:10px 12px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.12);font-size:13px;font-weight:700}
.hero-side{display:grid;grid-template-columns:1fr;gap:14px}
.info-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;padding:18px;box-shadow:var(--shadow-soft)}
.info-card.dark{background:linear-gradient(135deg,#0f172a,#1d4ed8);color:#fff;border:0}
.info-card.dark p,.info-card.dark .muted{color:rgba(255,255,255,.82)}
.section-split{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}
.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.kpi-chip{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;padding:10px 12px;border-radius:14px;font-weight:700;font-size:13px}
.branch-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.branch-card{background:linear-gradient(180deg,#ffffff,#f8fafc);border:1px solid #e2e8f0;border-radius:18px;padding:16px;box-shadow:var(--shadow-soft)}
.branch-card h3{font-size:18px;margin-bottom:8px}
.branch-card .branch-meta{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted);margin-bottom:10px}
.progress{height:10px;background:#e2e8f0;border-radius:999px;overflow:hidden}
.progress > span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#22c55e,#16a34a)}
.progress.warn > span{background:linear-gradient(90deg,#f59e0b,#f97316)}
.progress.alert > span{background:linear-gradient(90deg,#f43f5e,#db2777)}
.chart-bars{display:flex;align-items:flex-end;gap:14px;height:220px;padding:14px 12px 8px;border:1px solid #e2e8f0;border-radius:18px;background:linear-gradient(180deg,#ffffff,#f8fafc)}
.chart-col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;min-width:0}
.chart-bar{width:100%;max-width:48px;border-radius:14px 14px 6px 6px;background:linear-gradient(180deg,#60a5fa,#2563eb);box-shadow:inset 0 -6px 12px rgba(255,255,255,.16)}
.chart-bar.alt{background:linear-gradient(180deg,#f472b6,#db2777)}
.chart-bar.warn{background:linear-gradient(180deg,#fbbf24,#f97316)}
.chart-col label{font-size:12px;color:var(--muted);font-weight:700;text-align:center}
.chart-col strong{font-size:12px;color:var(--ink)}
.bar-list{display:flex;flex-direction:column;gap:12px}
.bar-item{display:grid;grid-template-columns:200px 1fr 64px;gap:12px;align-items:center}
.bar-item .bar-track{height:12px;border-radius:999px;background:#e2e8f0;overflow:hidden}
.bar-item .bar-track span{display:block;height:100%;background:linear-gradient(90deg,#8b5cf6,#ec4899);border-radius:999px}
.legend{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.legend span{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
.legend i{width:10px;height:10px;border-radius:50%;display:inline-block}
.table-wrap{border-radius:14px}
.table-wrap thead th{background:#f8fafc}
.supplier-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.supplier-card{border:1px solid #e2e8f0;border-radius:18px;padding:16px;background:linear-gradient(180deg,#ffffff,#f8fafc);box-shadow:var(--shadow-soft)}
.supplier-card h3{font-size:17px;margin-bottom:6px}
.supplier-card .meta{font-size:13px;color:var(--muted);display:flex;flex-direction:column;gap:4px}
.tag{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800;background:#eef2ff;color:#4338ca}
.form-grid.suppliers-form{grid-template-columns:repeat(4,minmax(0,1fr))}
.receipt-head{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;margin-bottom:18px}
.receipt-row{grid-template-columns:minmax(260px,2fr) 100px 120px 130px 120px 36px}
.subtle-box{background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid #e2e8f0;border-radius:16px;padding:14px}
.small-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.small-stat{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:14px}
.small-stat strong{display:block;font-size:24px;margin-bottom:4px}
.small-stat span{font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase}
@media(max-width:1450px){.branch-cards{grid-template-columns:repeat(3,1fr)}.supplier-grid{grid-template-columns:repeat(2,1fr)}.receipt-head,.section-split,.hero-grid{grid-template-columns:1fr}.mini-grid{grid-template-columns:1fr 1fr}}
@media(max-width:980px){.branch-cards,.supplier-grid,.mini-grid,.small-stats{grid-template-columns:1fr}.bar-item{grid-template-columns:1fr}.form-grid.suppliers-form{grid-template-columns:1fr}.page-head h1{font-size:28px}}