/* =====================================================================
   VELLORI · SKIN "MAISON" — identidad de la vitrina Valdezzi sobre la app.
   Superpone marfil topo-grey + tinta, tipografía Jost y colores de señal
   (verde/ámbar/rojo/pizarra) sobre la ESTRUCTURA de componentes de "Pro".
   Se activa con html.theme-maison (que SIEMPRE va junto con html.theme-pro)
   y se carga DESPUÉS de theme-pro.css para ganar por orden de cascada.
   INTOCABLES (igual que Pro): Emporio (#public-screen/.mk-*), Belmont (.pub-*),
   login (#login-screen), impresiones (.pr-*), selector de skins (.skin-*).
   Solo cambia lo visual; ninguna función/ruta/handler se toca.
   ===================================================================== */

/* ============ 1 · TOKENS MAISON (sobrescriben los de Pro) ============ */
html.theme-maison #app-shell .main-col{
  /* superficies — topo paper cálido */
  --bg-0:#E8E6E1; --bg-1:#EEECE7; --bg-2:#FFFFFF; --panel:#FFFFFF; --panel-2:#F4F3EF; --panel-3:#EEECE7; --elev:#FFFFFF;
  /* líneas — hairline de tinta (~14% / 22% / 32%) */
  --line:rgba(25,24,22,.14); --line-2:rgba(25,24,22,.22); --line-3:rgba(25,24,22,.32);
  /* texto — tinta maison */
  --text:#191919; --text-2:#44433F; --muted:#5E5D57; --faint:#8A857C;
  /* acento = tinta (monocromo; la maison no tiene color de marca) */
  --acc:#191919; --acc-hi:#000000; --acc-dim:#2A2A28; --acc-ink:#F3F1EC;
  --acc-soft:rgba(25,25,25,.06); --acc-line:rgba(25,25,25,.22); --acc-glow:0 0 0 3px rgba(25,25,25,.12);
  /* estados — colores de señal Valdezzi (SOLO UI, como en los mockups) */
  --ok:#2E7D5B;  --ok-soft:rgba(46,125,91,.12);
  --warn:#8A6600; --warn-soft:rgba(185,137,0,.16);
  --bad:#B4453A; --bad-soft:rgba(180,69,58,.12);
  --info:#2F4A6B; --info-soft:rgba(47,74,107,.12);
  --vio:#5E5D57; --vio-soft:rgba(94,93,87,.10);
  /* radios — mockup Valdezzi: cards 7px, chips/tracks pill */
  --r-xs:4px; --r-sm:5px; --r-md:7px; --r-lg:9px; --r-xl:12px; --r-pill:999px;
  /* sombras planas (maison): descanso muy sutil, sin dirección */
  --sh-1:0 1px 2px rgba(25,24,22,.05);
  --sh-2:0 12px 32px -16px rgba(25,24,22,.20);
  --sh-pop:0 36px 80px -40px rgba(25,24,22,.42);
  --ring:0 0 0 3px rgba(25,25,25,.14);
  /* tipografía — Jost en todo (geométrica, liviana, estilo Futura) */
  --disp:'Jost','Century Gothic',system-ui,sans-serif;
  --sans:'Jost','Century Gothic',system-ui,sans-serif;
  --mono:'Jost','Century Gothic',ui-monospace,monospace;
  /* remapeos clave (el resto hereda por var()) */
  --gold:var(--acc); --gold-soft:var(--acc-soft);
  --green:var(--ok); --green-soft:var(--ok-soft);
  --amber:var(--warn); --amber-soft:var(--warn-soft);
  --red:var(--bad); --red-soft:var(--bad-soft);
  --blue:var(--info); --blue-soft:var(--info-soft);
  --violet:var(--vio); --violet-soft:var(--vio-soft);
  --glass:rgba(255,255,255,.88);

  background:var(--bg-1); color:var(--text); letter-spacing:.1px;
}

/* ============ 2 · TIPOGRAFÍA: regla "weightless" (nunca más de 500) ============ */
html.theme-maison #app-shell .main-col h1,
html.theme-maison #app-shell .main-col h2,
html.theme-maison #app-shell .main-col h3,
html.theme-maison #app-shell .main-col h4{ font-weight:400; letter-spacing:-.01em; }
html.theme-maison #app-shell .main-col .page-title{ font-weight:300; letter-spacing:-.015em; }
/* etiquetas estructurales: mayúscula tracked, peso normal (no bold) */
html.theme-maison #app-shell .main-col .section-title,
html.theme-maison #app-shell .main-col .kpi-label,
html.theme-maison #app-shell .main-col .qa-group-t{ font-weight:500; letter-spacing:.14em; }
/* números de KPI: livianos y aireados, como las capturas */
html.theme-maison #app-shell .main-col .kpi-value{ font-weight:400; letter-spacing:-.01em; }

/* ============ 3 · BOTONES: el gesto LV (mayúscula widely-tracked) ============ */
html.theme-maison #app-shell .main-col .btn-primary{
  background:var(--acc); color:var(--acc-ink); border:1px solid var(--acc);
  text-transform:uppercase; letter-spacing:.12em; font-weight:500; box-shadow:none;
}
html.theme-maison #app-shell .main-col .btn-primary:hover{ background:var(--acc-hi); border-color:var(--acc-hi); color:var(--acc-ink); }
html.theme-maison #app-shell .main-col .btn-outline{
  text-transform:uppercase; letter-spacing:.12em; font-weight:500; box-shadow:none; border-color:var(--line-2);
}
html.theme-maison #app-shell .main-col .btn-outline:hover{ background:var(--acc); border-color:var(--acc); color:var(--acc-ink); }

/* ============ 4 · DETALLE ============ */
/* scrollbar cálida */
html.theme-maison #app-shell .main-col{ scrollbar-color:#CFCBC2 transparent; }
html.theme-maison #app-shell .main-col ::-webkit-scrollbar-thumb{ background:#D8D4CB; }
html.theme-maison #app-shell .main-col ::-webkit-scrollbar-thumb:hover{ background:#C4BFB4; }
/* enlaces en tinta */
html.theme-maison #app-shell .main-col a{ color:var(--acc); }
html.theme-maison #app-shell .main-col a:hover{ color:var(--acc-hi); }