/* BUMI · versión clara (fase 2). Se carga DESPUÉS del <style> de cada página y solo cambia colores, tipografía y encabezados:
   ninguna lógica ni texto. Mismo lenguaje que la landing (index.html): casi blanco con toque verde, verde bosque, acento madera. */

/* Todo en claro: esta paleta también gana sobre los bloques de modo oscuro que traen algunas páginas. */
html:root,html:root:not([data-theme="light"]),html:root[data-theme="dark"]{
  color-scheme:light;
  --bg:#FDFEFA; --surface:#FFFFFF; --surface2:#F4F7E4; --border:#DDE6C4;
  --text:#112F15; --text-secondary:#555E49; --accent:#8D6420;
  --accent-faint:color-mix(in srgb, var(--accent) 9%, var(--surface));
  --accent-mid:color-mix(in srgb, var(--accent) 32%, var(--border));
  --shadow:0 2px 14px rgba(17,47,21,.07);
  --sidebar:#F4F7E4; --sidebar-line:rgba(17,47,21,.14);
  --ok:#2B7530; --ok-lt:#E4F3E0; --warn:#8D6420; --warn-lt:#FCF0D9; --danger:#B83527; --danger-lt:#FBE4E0;
  /* BUMIcom usa estos dos como pareja fondo/texto (botones, burbuja de quien escribe): ahora madera con blanco */
  --brand-dark:#8D6420; --brand-cream:#FFFFFF;
}
html:root[data-theme="dark"] .btn{color:#fff}
body{font-family:'Montserrat',sans-serif;background:var(--bg);color:var(--text)}

/* ── Encabezado: claro, con el logo de BUMI Corporate */
header,header.top{background:var(--surface);color:var(--text);border-bottom:1px solid var(--border)}
.back-nav{background:var(--surface2);border-bottom:1px solid var(--border)}
.hd-logo{display:flex;align-items:center;flex-shrink:0;text-decoration:none}
.hd-logo img{height:36px;width:auto;display:block}
.hd-eyebrow,.page-eyebrow,header.top .eyebrow{color:var(--text-secondary)}
.hd-title,.page-title,header.top h1{color:var(--text)}
header.top p{color:var(--text-secondary)}
.hd-tag,.header-tag{color:var(--text-secondary);border-color:var(--border)}
.btn-print{border-color:var(--border);color:var(--text-secondary)}

/* ── Barras laterales de las herramientas (ROI, Reporte de Impacto, MOB): claras */
.roi-sidebar,.rep-sidebar,.mob-sidebar{background:var(--sidebar);color:var(--text);border-right:1px solid var(--border)}
.sb-title,.sb-org-field label,.sb-desc,.sb-hint,.sb-note,.sb-note2,.sb-value small{color:var(--text-secondary)}
.sb-label,.sb-value{color:var(--text)}
.sb-field input[type=range]{background:rgba(17,47,21,.18)}
.sb-field input[type=range]::-webkit-slider-thumb{background:var(--accent);box-shadow:0 0 0 3px rgba(141,100,32,.2)}
.sb-field input[type=range]::-moz-range-thumb{background:var(--accent);box-shadow:0 0 0 3px rgba(141,100,32,.2)}
.sb-num,.sb-org-field input,.sb-org-field select{background:var(--surface);border-color:var(--border);color:var(--text)}
.risk-btn,.sb-pill{background:var(--surface);border-color:var(--border);color:var(--text-secondary)}
.risk-btn.active,.sb-pill.sel{border-color:var(--accent);color:var(--accent);background:var(--accent-faint)}
.sb-hint{border-top-color:var(--sidebar-line)}

/* ── Piezas oscuras que pasan a claras */
.impact-badge{background:var(--accent-faint);color:var(--accent);border:1px solid var(--accent-mid)}
.profit-hero,.price-panel{background:var(--surface2);color:var(--text);border:1px solid var(--border)}
.price-panel-sub,.price-tier-name{color:var(--text-secondary)}

/* ── Reporte de Impacto: bloque principal claro */
.profit-hero{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow)}
.ph-eyebrow,.ph-label,.ph-sub{color:var(--text-secondary)}
.ph-headline strong,.ph-tile.main .ph-val{color:var(--accent)}
.ph-tile{background:var(--surface2);border-color:var(--border)}
.ph-tile.main{background:var(--accent-faint);border-color:var(--accent-mid)}
.ph-warn{background:var(--accent-faint);border-color:var(--accent-mid)}
.seg-gain{background:var(--accent);color:#fff}

/* ── Cotizador: barra y paneles "profundos" pasan a claros */
:root{--deep:#F4F7E4;--deep-fg:#112F15;--deep-soft:#555E49}
.bar{background:var(--surface);border-bottom:1px solid var(--border)}
.brand-eyebrow{color:var(--text-secondary)}
.brand-title{color:var(--text)}
.chips a{border-color:var(--border)}
.chips a:hover{background:var(--surface2)}
.chips b,.ptable tr.on td,.price .v{color:var(--accent)}
.deep,.price{border:1px solid var(--border)}
.ptable th{border-bottom-color:var(--border)}
.ptable td,.lines div{border-bottom-color:var(--border)}
.levels button{border-color:var(--border)}
.levels button[aria-pressed=true]{background:var(--accent);color:#fff;border-color:var(--accent)}
.presets button[aria-pressed=true],.tabs button[aria-selected=true]{background:var(--accent);color:#fff;border-color:var(--accent)}
.tabs button[aria-selected=true] .p{color:rgba(255,255,255,.85)}

/* ── Portal Evidencial: menú lateral claro */
.sidebar{background:var(--surface2);color:var(--text-secondary);border-right:1px solid var(--border);scrollbar-color:rgba(17,47,21,.25) transparent}
.sb-back{color:var(--accent);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border)}
.sb-back:hover{background:var(--accent-faint);color:var(--accent)}
.sb-logo{background:var(--surface);box-shadow:inset 0 0 0 1px var(--border)}
.sb-logo:hover{background:var(--accent-faint)}
.sb-logo-badge{box-shadow:0 2px 8px rgba(17,47,21,.12);border:1px solid var(--border)}
.sb-wordmark{color:var(--text)}
.sb-tag,.sb-client-label,.sb-section{color:var(--text-secondary)}
.sb-client{background:var(--surface);box-shadow:inset 0 0 0 1px var(--border)}
.sb-client-name{color:var(--text)}
.nav-item{color:var(--text-secondary)}
.nav-item:hover{background:var(--surface);color:var(--text)}
.nav-item.active{background:var(--accent-faint);box-shadow:inset 0 0 0 1px var(--accent-mid);color:var(--text)}
.nav-icon{background:var(--surface);box-shadow:inset 0 0 0 1px var(--border)}
.nav-item:hover .nav-icon{background:var(--accent-faint)}
.nav-item.active .nav-icon{background:var(--accent);color:#fff;box-shadow:0 3px 10px rgba(141,100,32,.25)}
.nav-badge{background:var(--accent);color:#fff}
.sb-footer{background:var(--surface);color:var(--text-secondary);box-shadow:inset 0 0 0 1px var(--border)}
.sb-footer a{color:var(--accent)}
.sb-footer a:hover{color:var(--text)}

/* ── BUMIcom: encabezado y panel de empresa claros (el protocolo de crisis y sus textos no se tocan) */
.header-title{color:var(--text)}
.header-sub{color:var(--text-secondary)}
#settingsBtn,#myProgressBtn,#companyPanelBtn{color:var(--text-secondary)!important}
#settingsBtn:hover,#companyPanelBtn:hover,#myProgressBtn:hover{background:var(--surface2)}
.logo-badge{box-shadow:0 1px 6px rgba(17,47,21,.18);border:1px solid var(--border)}
.company-hero{background:var(--surface2);color:var(--text)}
.company-hero svg{color:var(--accent)}
.company-hero h1{color:var(--text)}
.company-hero p{color:var(--text-secondary)}

/* ── Botón flotante y formulario de contacto (mismos que la landing) */
.bumicom-fab{background:var(--surface);border-color:var(--border);box-shadow:0 6px 18px rgba(17,47,21,.18)}
.bumicom-fab::after{border-color:var(--surface)}
.qr-overlay{background:rgba(17,47,21,.45)}
.qr-modal{background:var(--bg)}
.qr-modal input,.qr-modal textarea{background:var(--surface);border-color:var(--border)}

/* Contraste (WCAG 2.1): el borde de un campo de formulario tiene que distinguirse del fondo (3:1); el verde y el rojo de estado, 4.5:1 sobre su fondo claro. */
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]):not([type=color]),select,textarea{border-color:#86926F}