:root{
  --wine:#7a2233; --wineD:#521623; --wineX:#3f1019; --wineSoft:#f7ecee; --wineSoft2:#fbf4f5;
  --gold:#c19a54; --goldD:#a07d3c; --ink:#22191c; --inkSoft:#5c4f52; --muted:#8f8285;
  --paper:#f6f2f0; --line:#ece2df; --line2:#f3ebe8; --white:#fff;
  --ok:#2f7d55; --okBg:#e7f3ec; --warn:#b26a1a; --warnBg:#fbf1e2; --bad:#b23540; --badBg:#fbe9ea; --info:#3a5d86; --infoBg:#eaf0f8;
  --shadow:0 1px 2px rgba(60,25,30,.04), 0 8px 24px rgba(60,25,30,.05);
}
*{ box-sizing:border-box; }
body{ margin:0; background:var(--paper); color:var(--ink); font-family:'Inter',system-ui,-apple-system,"Segoe UI",sans-serif; font-size:14px; -webkit-font-smoothing:antialiased; }
.serif{ font-family:Georgia,"Times New Roman",serif; }
a{ color:var(--wine); text-decoration:none; }
.text-wine{ color:var(--wine)!important; } .text-gold{ color:var(--gold)!important; } .text-muted2{ color:var(--muted)!important; }
.bg-wine{ background:var(--wine)!important; } .bg-wineD{ background:var(--wineD)!important; } .bg-wineSoft{ background:var(--wineSoft)!important; } .bg-gold{ background:var(--gold)!important; }

/* buttons */
.btn{ border-radius:10px; font-weight:600; }
.btn-primary{ --bs-btn-bg:var(--wine); --bs-btn-border-color:var(--wine); --bs-btn-hover-bg:var(--wineD); --bs-btn-hover-border-color:var(--wineD); --bs-btn-active-bg:var(--wineD); }
.btn-outline-primary{ --bs-btn-color:var(--wine); --bs-btn-border-color:var(--wine); --bs-btn-hover-bg:var(--wine); --bs-btn-hover-border-color:var(--wine); --bs-btn-active-bg:var(--wine); }
.btn-gold{ background:var(--gold); border-color:var(--gold); color:#fff; }
.btn-gold:hover{ background:var(--goldD); border-color:var(--goldD); color:#fff; }
.btn-soft{ background:var(--wineSoft); color:var(--wine); border:1px solid transparent; }
.btn-soft:hover{ background:#f0dfe2; color:var(--wine); }

/* ===== APP SHELL ===== */
.app-shell{ display:flex; min-height:100vh; }
.sidebar{ width:250px; flex:none; background:linear-gradient(185deg,var(--wineX),var(--wineD) 55%,#5e1a27);
  color:#f3e3e6; padding:0; }
.sidebar .sb-brand{ display:flex; align-items:center; gap:10px; padding:20px 20px 16px; }
.sidebar .sb-brand .mk{ width:38px;height:38px;border-radius:10px;background:#fff;color:var(--wineD);
  font-weight:800;display:flex;align-items:center;justify-content:center;font-size:.95rem; box-shadow:inset 0 0 0 3px rgba(193,154,84,.25);}
.sidebar .sb-brand .nm{ font-weight:700; font-size:1.02rem; color:#fff; line-height:1; }
.sidebar .sb-brand .nm b{ color:var(--gold); }
.sidebar .sb-sec{ font-size:.64rem; letter-spacing:1.4px; text-transform:uppercase; color:#c79aa3; padding:14px 22px 6px; }
.sidebar .sb-nav{ list-style:none; margin:0; padding:0 12px; }
.sidebar .sb-nav a{ display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:11px;
  color:#e7ccd1; font-weight:500; margin-bottom:2px; position:relative; }
.sidebar .sb-nav a i{ font-size:1.05rem; opacity:.9; width:20px; text-align:center; }
.sidebar .sb-nav a:hover{ background:rgba(255,255,255,.08); color:#fff; }
.sidebar .sb-nav a.active{ background:rgba(255,255,255,.13); color:#fff; }
.sidebar .sb-nav a.active::before{ content:""; position:absolute; left:-12px; top:8px; bottom:8px; width:4px; border-radius:4px; background:var(--gold); }
.sidebar .sb-nav a .badge{ margin-left:auto; }
.sidebar .sb-foot{ margin:16px 16px; padding:12px 14px; background:rgba(0,0,0,.15); border-radius:12px; }
.sidebar .sb-foot .rl{ font-size:.66rem; letter-spacing:1px; text-transform:uppercase; color:#c79aa3; }
.sidebar .sb-foot .nm{ font-weight:700; color:#fff; font-size:.9rem; }

.main{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.topbar{ height:60px; background:rgba(255,255,255,.85); backdrop-filter:blur(6px); border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:12px; padding:0 22px; position:sticky; top:0; z-index:20; }
.topbar .t-title{ font-family:Georgia,serif; font-weight:700; font-size:1.05rem; }
.topbar .t-sub{ font-size:.74rem; color:var(--muted); }
.content{ padding:24px 26px 40px; flex:1; }

/* user dropdown */
.userbtn{ display:flex; align-items:center; gap:9px; background:none; border:1px solid var(--line); border-radius:11px; padding:6px 10px; }
.userbtn:hover{ background:var(--wineSoft2); }
.userbtn .av{ width:30px;height:30px;border-radius:8px;background:var(--wine);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem;}

/* ===== COMPONENTS ===== */
.card{ border:1px solid var(--line); border-radius:16px; background:#fff; }
.card.soft{ box-shadow:var(--shadow); }
.hoverable{ transition:transform .12s, box-shadow .12s; }
.hoverable:hover{ transform:translateY(-3px); box-shadow:0 12px 28px rgba(90,40,40,.12); }

.eyebrow{ font-size:.68rem; letter-spacing:2px; text-transform:uppercase; font-weight:700; color:var(--gold); }
.small-cap{ font-size:.64rem; text-transform:uppercase; letter-spacing:.7px; color:var(--muted); font-weight:700; }
.page-head{ margin-bottom:20px; }
.page-head h1{ font-family:Georgia,serif; font-weight:700; font-size:1.6rem; margin:2px 0 0; }
.page-head .ph-sub{ color:var(--inkSoft); font-size:.9rem; }

.stat-num{ font-family:Georgia,serif; font-weight:700; font-size:2rem; color:var(--wine); line-height:1; }

/* KPI tile */
.tile{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:16px 18px; box-shadow:var(--shadow); height:100%; }
.tile .ic{ width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.15rem; }
.ic-wine{ background:var(--wineSoft); color:var(--wine);} .ic-gold{ background:#f6ecd8; color:var(--goldD);} 
.ic-info{ background:var(--infoBg); color:var(--info);} .ic-bad{ background:var(--badBg); color:var(--bad);}
.tile .kv{ font-family:Georgia,serif; font-weight:700; font-size:1.9rem; line-height:1; margin-top:12px; }
.tile .kl{ font-size:.82rem; color:var(--inkSoft); margin-top:3px; }

/* progress */
.progress{ height:8px; background:#efe5e3; border-radius:20px; }
.progress-bar{ background:linear-gradient(90deg,var(--wine),var(--gold)); }
.ring{ position:relative; width:118px; height:118px; }
.ring .rc{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.ring .rc b{ font-family:Georgia,serif; font-size:1.6rem; color:var(--wine); line-height:1; }
.ring .rc span{ font-size:.6rem; text-transform:uppercase; letter-spacing:.5px; color:var(--inkSoft); }

/* chips */
.modtag{ display:inline-flex;align-items:center;gap:5px; font-size:.72rem; font-weight:700; padding:4px 10px; border-radius:20px; background:var(--wineSoft); color:var(--wine); }
.st{ font-size:.72rem; font-weight:700; padding:4px 10px; border-radius:20px; display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.st .dot{ width:7px;height:7px;border-radius:50%; }
.st-pend{ background:var(--warnBg); color:var(--warn); } .st-rev{ background:var(--infoBg); color:var(--info); }
.st-apr{ background:var(--okBg); color:var(--ok); } .st-obs{ background:var(--badBg); color:var(--bad); }
.st-pend .dot{background:var(--warn);}.st-rev .dot{background:var(--info);}.st-apr .dot{background:var(--ok);}.st-obs .dot{background:var(--bad);}
.vig{ font-size:.7rem; font-weight:700; padding:3px 9px; border-radius:20px; display:inline-flex; align-items:center; gap:5px; }
.vig-ok{ background:var(--okBg); color:var(--ok);} .vig-soon{ background:var(--warnBg); color:var(--warn);} .vig-exp{ background:var(--badBg); color:var(--bad);}

/* requisito rows */
.req-group{ border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-bottom:12px; }
.phase-h{ background:var(--wineSoft2); color:var(--wine); font-weight:700; font-size:.8rem; padding:9px 16px; border-bottom:1px solid var(--line); letter-spacing:.3px; }
.req-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; border-top:1px solid var(--line2); }
.req-row:first-of-type{ border-top:none; }
.req-row .doc-ic{ width:34px;height:34px;border-radius:9px;background:var(--wineSoft2);color:var(--wine);display:flex;align-items:center;justify-content:center; flex:none; }

.empdot{ width:40px;height:40px;border-radius:11px;background:var(--wineSoft);color:var(--wine);display:flex;align-items:center;justify-content:center;font-weight:700; flex:none; }

.table>thead th{ font-size:.64rem; text-transform:uppercase; letter-spacing:.7px; color:var(--muted); font-weight:700; border-bottom:1px solid var(--line); }
.table>tbody td{ border-bottom:1px solid var(--line2); vertical-align:middle; }
.table-hover>tbody>tr:hover>*{ background:var(--wineSoft2); }

.nav-pills .nav-link{ color:var(--inkSoft); border-radius:10px; font-weight:600; font-size:.88rem; }
.nav-pills .nav-link.active{ background:var(--wine); }

.alert-item{ display:flex; align-items:center; gap:12px; padding:11px 0; border-bottom:1px solid var(--line2); }
.alert-item:last-child{ border-bottom:none; }
.alert-item .ai{ width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center; flex:none; }

.form-control,.form-select{ border-radius:10px; }
.form-control:focus,.form-select:focus{ border-color:var(--wine); box-shadow:0 0 0 .2rem rgba(122,34,51,.13); }
.form-label{ font-weight:600; font-size:.82rem; color:var(--ink); }

.empty{ text-align:center; color:var(--muted); padding:48px 20px; }
.empty i{ font-size:2.4rem; display:block; margin-bottom:10px; opacity:.5; }

/* ===== LOGIN & LANDING (se mantienen, con retoques) ===== */
.auth-wrap{ min-height:100vh; display:flex; }
.auth-left{ flex:1.05; background:linear-gradient(155deg,var(--wineX),var(--wine) 65%,#8a2a3d); color:#fff; padding:56px 60px; display:flex; flex-direction:column; justify-content:center; position:relative; overflow:hidden; }
.auth-left .disc{ position:absolute; border-radius:50%; }
.auth-left .d1{ width:380px;height:380px; top:-130px; right:-90px; background:rgba(255,255,255,.05);}
.auth-left .d2{ width:230px;height:230px; bottom:-90px; left:-50px; background:rgba(193,154,84,.16);}
.auth-right{ flex:1; display:flex; align-items:center; justify-content:center; padding:40px; background:var(--paper); }
.auth-card{ width:100%; max-width:400px; }
.auth-logo{ width:58px;height:58px;border-radius:15px;background:var(--wine);color:#fff;font-weight:800;font-size:1.4rem;display:flex;align-items:center;justify-content:center; box-shadow:inset 0 0 0 3px rgba(193,154,84,.3);}
.demo-cred{ background:#fff;border:1px dashed var(--line);border-radius:12px;font-size:.8rem; }
.demo-cred b{ color:var(--wine); }
.brand-mk{ width:36px;height:36px;border-radius:9px;background:#fff;color:var(--wineD);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:.9rem; }
.hero-lp{ background:linear-gradient(160deg,#fff,#f7ecee); }
.svc-ic{ width:48px;height:48px;border-radius:13px;background:var(--wineSoft);color:var(--wine);display:flex;align-items:center;justify-content:center;font-size:1.35rem; }

@media(max-width:991px){ .auth-left{ display:none; } }
@media print{ .no-print{ display:none!important; } .sidebar,.topbar{ display:none!important; } body{ background:#fff; } .content{ padding:0; } }

/* sidebar fija en escritorio (sin romper el offcanvas en móvil) */
@media(min-width:992px){
  .sidebar{ display:flex; flex-direction:column; position:sticky; top:0; height:100vh; overflow-y:auto; }
  .sidebar .sb-foot{ margin-top:auto; }
}

/* filtros de la bandeja */
.fbar{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.fbar .lbl{ font-size:.64rem; text-transform:uppercase; letter-spacing:.7px; color:var(--muted); font-weight:700; margin-right:2px; }
.fchip{ border:1px solid var(--line); background:#fff; color:var(--inkSoft); border-radius:20px; padding:5px 13px; font-size:.8rem; font-weight:600; }
.fchip:hover{ background:var(--wineSoft2); }
.fchip.on{ background:var(--wine); border-color:var(--wine); color:#fff; }
.fchip .badge{ background:rgba(0,0,0,.12); }
.emp-group{ margin-bottom:22px; }
.emp-group .eg-head{ display:flex; align-items:center; gap:10px; margin:6px 2px 10px; }
.emp-group .eg-head .cnt{ margin-left:auto; }
