/* ==========================================================================\n   ECÓNOMO DESIGN SYSTEM · V1.4\n   Identidad oficial: #2F4A3D · #C98A3C · #F3EDE3\n   Este archivo se carga DESPUÉS de styles.css y normaliza toda la UI.\n   ========================================================================== */
:root{
  --brand-forest:#2F4A3D;
  --brand-forest-900:#21352B;
  --brand-forest-800:#294035;
  --brand-forest-700:#365548;
  --brand-forest-100:#E4EBE6;
  --brand-forest-050:#EEF3EF;
  --brand-amber:#C98A3C;
  --brand-amber-700:#9E6728;
  --brand-amber-100:#F0DCC1;
  --brand-amber-050:#F8EEDF;
  --brand-cream:#F3EDE3;
  --brand-cream-2:#F8F4EC;
  --brand-surface:#FFFCF7;
  --brand-white:#FFFFFF;
  --brand-ink:#24332C;
  --brand-muted:#6E746F;
  --brand-line:#DED5C8;
  --brand-line-soft:#EAE2D7;

  --success:#3E6B54;
  --success-bg:#E8F0EA;
  --warning:#A86F2F;
  --warning-bg:#F8EAD8;
  --danger:#9B4B3E;
  --danger-bg:#F6E5E1;
  --info:#46675B;
  --info-bg:#E7EFEC;

  --bg:var(--brand-cream-2);
  --panel:var(--brand-surface);
  --panel2:#F6F1E8;
  --ink:var(--brand-ink);
  --muted:var(--brand-muted);
  --border:var(--brand-line-soft);
  --primary:var(--brand-forest);
  --primaryText:#FFFDF9;
  --accent:var(--brand-amber);
  --good:var(--success);
  --goodBg:var(--success-bg);
  --warn:var(--warning);
  --warnBg:var(--warning-bg);
  --bad:var(--danger);
  --badBg:var(--danger-bg);

  --font-ui:"Avenir Next",Avenir,"Segoe UI",Helvetica,Arial,sans-serif;
  --font-display:"Avenir Next",Avenir,"Segoe UI",Helvetica,Arial,sans-serif;
  --radius-xs:8px;
  --radius-sm:12px;
  --radius-md:16px;
  --radius-lg:22px;
  --radius-xl:30px;
  --shadow-sm:0 2px 10px rgba(47,74,61,.06);
  --shadow-md:0 12px 34px rgba(47,74,61,.10);
  --shadow-lg:0 26px 70px rgba(47,74,61,.14);
  --shadow:var(--shadow-md);
  --shadow-float:var(--shadow-lg);
}
[data-theme="dark"]{
  --bg:#15221C;
  --panel:#1D2D25;
  --panel2:#23362C;
  --ink:#F5F0E7;
  --muted:#B4B6AF;
  --border:#344A3E;
  --primary:#E8D9C4;
  --primaryText:#20342A;
  --accent:#DDA65E;
  --good:#8EB59B;
  --goodBg:#233B2E;
  --warn:#E0AE6D;
  --warnBg:#3A3023;
  --bad:#D98D80;
  --badBg:#402823;
  --brand-surface:#1D2D25;
  --brand-cream-2:#15221C;
  --brand-line-soft:#344A3E;
}

html{font-family:var(--font-ui);font-feature-settings:"kern" 1,"liga" 1;text-rendering:optimizeLegibility}
body{background:var(--bg);color:var(--ink)}
::selection{background:var(--brand-amber-100);color:var(--brand-forest-900)}

/* Brand assets */
.brand-wordmark{display:block;width:148px;max-width:100%;height:auto;object-fit:contain}
.brand-wordmark.admin{width:136px}
.brand-isotype{display:block;width:42px;height:42px;object-fit:contain}
.logo-row{padding:2px 8px;gap:10px;min-height:46px}
.logo-row.brand-only{display:grid;gap:5px;align-content:start}
.logo-row.brand-only small{font-size:10px;letter-spacing:.03em;color:var(--muted);margin-left:1px}
.brand-mark{background:transparent!important;color:transparent!important;border-radius:0!important;padding:0!important;overflow:visible!important}
.brand-mark:before{content:"";display:block;width:100%;height:100%;background:url('./assets/economo-isotipo.png') center/contain no-repeat}

/* App frame */
.app-shell{grid-template-columns:244px minmax(0,1fr);background:var(--bg)}
.sidebar{background:rgba(255,252,247,.94);border-right:1px solid var(--brand-line-soft);padding:20px 14px 16px;gap:20px;box-shadow:4px 0 22px rgba(47,74,61,.025)}
[data-theme="dark"] .sidebar{background:rgba(29,45,37,.97)}
.sidebar nav{gap:5px}
.sidebar nav button{min-height:46px;border-radius:13px;color:#6A726D;font-size:14px;font-weight:700;padding:0 12px;gap:11px}
.sidebar nav button:hover{background:var(--brand-cream);color:var(--brand-forest)}
.sidebar nav button.active{background:var(--brand-forest);color:#fff;box-shadow:0 7px 18px rgba(47,74,61,.16)}
.sidebar nav button.active .ui-icon{color:#F6EADB}
.sidebar nav button .nav-icon{display:grid;place-items:center;width:22px;height:22px}
.sidebar nav button .ui-icon{width:19px;height:19px;stroke-width:1.85}
.pro-tag{border-color:rgba(201,138,60,.35);background:var(--brand-amber-050);color:var(--brand-amber-700);font-size:9px}
.sidebar-business{border-top:1px solid var(--brand-line-soft);padding:14px 8px 2px}
.avatar,.avatar-button{background:var(--brand-forest);color:#fff;box-shadow:0 5px 14px rgba(47,74,61,.15)}

.topbar{height:76px;background:rgba(248,244,236,.88);border-bottom:1px solid var(--brand-line-soft);padding:12px 28px;backdrop-filter:blur(14px) saturate(1.1)}
[data-theme="dark"] .topbar{background:rgba(21,34,28,.90)}
.topbar h2{font-family:var(--font-display);font-weight:760;letter-spacing:-.02em;color:var(--brand-forest)}
[data-theme="dark"] .topbar h2{color:var(--ink)}
.content{padding:30px 30px 42px;max-width:1640px}

/* Typography */
h1,h2,h3,h4{font-family:var(--font-display);color:var(--ink)}
.hero-row h1{font-size:clamp(30px,3.2vw,46px);font-weight:760;letter-spacing:-.045em;line-height:1.02}
.panel-head h3,.card h3{font-weight:750;letter-spacing:-.02em}
.eyebrow{color:var(--brand-amber-700);font-size:10px;letter-spacing:.15em;font-weight:850}
.muted{color:var(--muted)}

/* Buttons */
.btn{min-height:45px;border-radius:13px;border:1px solid var(--brand-line);padding:10px 15px;font-weight:760;box-shadow:none;letter-spacing:-.01em}
.btn.primary{background:var(--brand-forest);color:#FFFDF9;border-color:var(--brand-forest);box-shadow:0 7px 18px rgba(47,74,61,.14)}
.btn.primary:hover{background:var(--brand-forest-900);border-color:var(--brand-forest-900);transform:translateY(-1px)}
.btn.secondary{background:var(--brand-cream);border-color:var(--brand-line);color:var(--brand-forest)}
.btn.secondary:hover{background:#ECE4D7;border-color:#D5C8B7}
.btn.ghost{border-color:transparent;background:transparent;color:var(--brand-forest)}
.btn.danger{color:var(--danger);border-color:rgba(155,75,62,.24);background:var(--danger-bg)}
.text-btn{color:var(--brand-forest)}
.icon-btn,.bell-button{border-color:var(--brand-line);background:var(--brand-surface);border-radius:13px;color:var(--brand-forest)}
.icon-btn:hover,.bell-button:hover{background:var(--brand-cream)}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid rgba(201,138,60,.28);outline-offset:2px}

/* Inputs */
input,select,textarea{min-height:47px;border:1px solid var(--brand-line);border-radius:13px;background:var(--brand-surface);padding:11px 13px;box-shadow:inset 0 1px 0 rgba(255,255,255,.55)}
input:hover,select:hover,textarea:hover{border-color:#CFC2B0}
input:focus,select:focus,textarea:focus{border-color:var(--brand-amber);box-shadow:0 0 0 3px rgba(201,138,60,.10)}
label{font-size:12px;font-weight:760;color:var(--brand-forest)}
[data-theme="dark"] label{color:var(--ink)}
input[type="checkbox"]{accent-color:var(--brand-forest)}

/* Switch */
.switch-track{background:#D7D0C5;box-shadow:inset 0 0 0 1px rgba(47,74,61,.08)}
.switch-control input:checked+.switch-track{background:var(--brand-forest)}
.switch-control input:focus-visible+.switch-track{outline:3px solid rgba(201,138,60,.25)}
.switch-thumb{box-shadow:0 2px 7px rgba(47,74,61,.24)}

/* Cards / panels */
.panel,.card,.stat{background:var(--brand-surface);border-color:var(--brand-line-soft);box-shadow:var(--shadow-sm)}
.panel{border-radius:18px;padding:20px}
.card{border-radius:16px}
.stat{border-radius:17px;padding:19px}
.stat strong{font-weight:760;color:var(--brand-forest)}
[data-theme="dark"] .stat strong{color:var(--ink)}
.stat.good{border-color:rgba(62,107,84,.22);background:linear-gradient(180deg,var(--panel),var(--success-bg))}
.stat.warn{border-color:rgba(168,111,47,.22);background:linear-gradient(180deg,var(--panel),var(--warning-bg))}
.capacity-box,.notice{background:var(--brand-cream);border:1px solid var(--brand-line-soft)}
.notice{border-radius:13px}
.notice.warn{background:var(--warning-bg);color:#815423;border-color:rgba(168,111,47,.20)}

/* Status pills */
.pill{border-radius:999px;padding:6px 10px;font-weight:800;letter-spacing:.01em}
.pill.ok{color:var(--success);background:var(--success-bg);border-color:rgba(62,107,84,.20)}
.pill.warn{color:var(--warning);background:var(--warning-bg);border-color:rgba(168,111,47,.18)}
.pill.danger{color:var(--danger);background:var(--danger-bg);border-color:rgba(155,75,62,.18)}
.pill.mid{background:var(--brand-cream);color:var(--brand-forest);border-color:var(--brand-line)}
.bell-badge{background:var(--brand-amber);color:#fff}

/* Tables */
.data-table,.inventory-table-wrap,.table-wrap{border-color:var(--brand-line-soft);border-radius:16px;background:var(--brand-surface)}
.table-head{background:var(--brand-cream);color:var(--brand-forest);font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:850}
.table-row{border-color:var(--brand-line-soft)}
.table-row:not(.table-head):hover{background:#FAF6EF}
[data-theme="dark"] .table-row:not(.table-head):hover{background:#26392F}

/* Notifications / menus */
.notifications-panel{border-color:var(--brand-line);border-radius:18px;box-shadow:var(--shadow-lg)}
.notification-row.unread{background:var(--brand-cream-2)}
.alert-icon{background:var(--brand-cream);color:var(--brand-forest)}
.alert-icon.warn{background:var(--warning-bg);color:var(--warning)}
.alert-icon.good{background:var(--success-bg);color:var(--success)}

/* Modal / onboarding */
.modal-card,.modal,.onboarding-card{border-color:var(--brand-line);background:var(--brand-surface);box-shadow:var(--shadow-lg);border-radius:22px}
.onboarding-wrap{background:radial-gradient(circle at 20% 10%,#FFF9F0 0,transparent 36%),linear-gradient(135deg,var(--brand-cream-2),#EFE5D7)}
.onboarding-card{max-width:500px;padding:34px}
.onboarding-brand{display:flex;justify-content:center;margin-bottom:26px}
.onboarding-brand img{width:min(280px,76%);height:auto}
.modal-x{color:var(--brand-forest)}

/* Brand-specific empty states */
.empty{color:var(--muted)}
.empty-state-brand{display:grid;place-items:center;text-align:center;gap:10px;padding:36px 18px;color:var(--muted)}
.empty-state-brand img{width:54px;height:54px;object-fit:contain;opacity:.36;filter:grayscale(.18)}

/* FAB */
.fab-button,.fab-main{background:var(--brand-forest)!important;color:#fff!important;border-color:var(--brand-forest)!important;box-shadow:0 16px 30px rgba(47,74,61,.24)!important}
.fab-menu{border-color:var(--brand-line);background:var(--brand-surface);box-shadow:var(--shadow-lg)}
.fab-menu button:hover{background:var(--brand-cream)}

/* Charts */
.chart svg .chart-line,.chart-line{stroke:var(--brand-forest)!important}
.chart svg .chart-accent,.chart-accent{stroke:var(--brand-amber)!important}

/* Admin */
.portal-client-link{color:var(--brand-forest);border-color:var(--brand-line);background:var(--brand-surface)}
.portal-client-link:hover{background:var(--brand-cream)}
.admin-sidebar .logo-row{padding-top:0}

/* Maintenance · fully on-brand */
.maintenance-screen{background:linear-gradient(135deg,#EDE4D7 0%,var(--brand-cream) 54%,#E7DDCF 100%);padding:24px}
.maintenance-shell{background:var(--brand-surface);border:1px solid rgba(47,74,61,.08);border-radius:32px;box-shadow:var(--shadow-lg);grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr)}
.maintenance-copy{padding:clamp(34px,5vw,76px)}
.maintenance-brand{margin-bottom:clamp(42px,7vh,84px)}
.maintenance-brand img{width:min(310px,72%);height:auto}
.maintenance-status{background:var(--brand-amber-050);color:var(--brand-amber-700);border-color:rgba(201,138,60,.28)}
.maintenance-copy h1{color:var(--brand-forest);font-size:clamp(42px,5.4vw,74px);letter-spacing:-.055em}
.maintenance-lead{color:#68726C}
.maintenance-window-card{background:var(--brand-cream-2);border-color:var(--brand-line)}
.maintenance-window-card strong{color:var(--brand-forest)}
.maintenance-window-dot{background:var(--brand-amber);box-shadow:0 0 0 6px rgba(201,138,60,.14)}
.maintenance-safe-icon{background:var(--success-bg);color:var(--success)}
.maintenance-safe strong{color:var(--brand-forest)}
.maintenance-visual{background:var(--brand-forest);min-height:620px}
.maintenance-glow{background:rgba(243,237,227,.07)}
.maintenance-visual-caption{color:#F7F0E5}
.maintenance-admin-link{margin-top:24px;display:inline-flex;align-items:center;gap:8px;color:var(--brand-forest);font-size:12px;font-weight:760;text-decoration:none;width:max-content;padding:8px 0}
.maintenance-admin-link:hover{text-decoration:underline;text-decoration-color:var(--brand-amber);text-underline-offset:4px}
.maintenance-admin-link[hidden]{display:none!important}
.maintenance-banner{border-color:rgba(201,138,60,.27);background:var(--brand-amber-050);color:#805623}
.maintenance-banner:before{background:var(--brand-amber);box-shadow:0 0 0 5px rgba(201,138,60,.12)}
.maintenance-banner strong{color:#68451C}.maintenance-banner span{color:#8A653A}
.maintenance-preview{background:linear-gradient(145deg,var(--brand-forest),#243A30);color:#F8F1E7}
.maintenance-preview:after{background:rgba(243,237,227,.07)}
.maintenance-preview-dot{background:var(--brand-amber)}
.preview-barrier{background:var(--brand-cream);box-shadow:0 18px 30px rgba(26,43,35,.26)}
.preview-barrier span{background:linear-gradient(125deg,transparent 0 28%,var(--brand-amber) 28% 62%,transparent 62% 100%)}
.preview-barrier:before,.preview-barrier:after{background:var(--brand-cream)}
.preview-cone{border-bottom-color:var(--brand-cream);filter:drop-shadow(0 15px 14px rgba(26,43,35,.28))}
.preview-cone:before{background:var(--brand-amber-700)}
.preview-cone:after{background:var(--brand-amber)}

/* Maintenance SVG semantic classes */
.economo-maint-art .cream{fill:#F3EDE3}
.economo-maint-art .amber{fill:#C98A3C}
.economo-maint-art .forest-dark{fill:#21352B}
.economo-maint-art .stroke-cream{stroke:#F3EDE3}
.economo-maint-art .stroke-amber{stroke:#C98A3C}

/* Touch targets */
@media(pointer:coarse){
  .btn,.sidebar nav button,.icon-btn,.bell-button,.text-btn{min-height:48px}
  input,select,textarea{min-height:50px;font-size:16px}
  .table-row{min-height:52px}
}

@media(max-width:760px){
  .content{padding:22px 16px 34px}
  .hero-row h1{font-size:34px}
  .maintenance-screen{padding:0}
  .maintenance-copy{padding:30px 22px 36px}
  .maintenance-brand img{width:min(260px,78%)}
  .maintenance-copy h1{font-size:42px}
}
[data-theme="dark"] .logo-row.brand-only{background:#F3EDE3;border:1px solid rgba(201,138,60,.20);border-radius:14px;padding:10px}
[data-theme="dark"] .onboarding-brand{background:#F3EDE3;border-radius:18px;padding:14px}

/* Ecónomo V1.5 — MFA seguro y layouts de selección */
.flow-choice-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.mfa-enroll-visual{text-align:center;margin-bottom:16px}
.mfa-qr-mount{display:grid;place-items:center;min-height:230px;margin:8px auto 10px}
.mfa-qr-image{display:block;width:210px;max-width:100%;height:auto;background:#fff;padding:10px;border-radius:16px;border:1px solid var(--brand-line);box-shadow:0 8px 24px rgba(47,74,61,.10)}
.mfa-manual{max-width:420px;margin:10px auto;text-align:left}
.mfa-manual summary{cursor:pointer;font-weight:800;color:var(--brand-forest)}
.mfa-manual code{display:block;word-break:break-all;margin:10px 0;padding:10px;border-radius:10px;background:var(--brand-cream);font-size:12px}
@media(max-width:760px){.flow-choice-grid.two{grid-template-columns:1fr}.mfa-qr-image{width:190px}}