/* BI FARMA MARKET */
:root {
  --marca: #0f5f5a;
  --marca-2: #13807a;
  --fondo: #f4f6f5;
  --superficie: #ffffff;
  --borde: #e2e6e4;
  --texto: #1b1f1e;
  --texto-2: #5b6461;
  --sube: #0b7a3b;
  --baja: #b42318;
  --menu-ancho: 232px;
}
body { background: var(--fondo); color: var(--texto); font-size: .92rem; }
.barra-sup { position: sticky; top: 0; z-index: 1030; height: 56px; background: var(--marca); color: #fff; }
.marca { font-weight: 700; letter-spacing: .02em; }
.estado-datos { font-size: .8rem; opacity: .9; }
.contenedor { display: flex; min-height: calc(100vh - 56px); }
.menu { width: var(--menu-ancho); flex: 0 0 var(--menu-ancho); background: var(--superficie); border-right: 1px solid var(--borde);
        padding: .75rem .5rem; position: sticky; top: 56px; height: calc(100vh - 56px); overflow-y: auto; transition: margin-left .2s; }
.menu .nav-link { color: var(--texto); border-radius: .5rem; padding: .5rem .75rem; display: flex; align-items: center; gap: .6rem; }
.menu .nav-link:hover { background: #eef3f2; }
.menu .nav-link.activo { background: #e1efed; color: var(--marca); font-weight: 600; }
.menu .nav-link.deshabilitado { color: #9aa3a0; cursor: default; }
.menu .nav-link small { white-space: nowrap; margin-left: auto; font-size: .68rem; background: #eef0ef; border-radius: 1rem; padding: 0 .45rem; }
.menu-grupo { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-2); padding: 1rem .75rem .25rem; }
body.menu-oculto .menu { margin-left: calc(-1 * var(--menu-ancho)); }
.contenido { flex: 1; min-width: 0; padding: 1.25rem 1.5rem 2rem; }
.titulo { font-size: 1.35rem; font-weight: 700; margin-bottom: 1rem; }
.pie { color: var(--texto-2); font-size: .78rem; margin-top: 2rem; }
@media (max-width: 991px) {
  .menu { position: fixed; left: 0; z-index: 1020; box-shadow: 0 0 24px rgba(0,0,0,.15); margin-left: calc(-1 * var(--menu-ancho)); }
  body.menu-visible .menu { margin-left: 0; }
  .contenido { padding: 1rem; }
}

/* Tarjetas */
.tarjeta { background: var(--superficie); border: 1px solid var(--borde); border-radius: .75rem; padding: 1rem 1.1rem; }
.row > * > .tarjeta { height: 100%; }
.tarjeta h2 { font-size: .95rem; font-weight: 600; margin: 0 0 .75rem; }
.tarjeta h2 small { font-weight: 400; color: var(--texto-2); }
.kpi-etiqueta { font-size: .78rem; color: var(--texto-2); }
.kpi-valor { font-size: 1.55rem; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
.kpi-nota { font-size: .78rem; color: var(--texto-2); }
.var-sube { color: var(--sube); font-weight: 600; white-space: nowrap; }
.var-baja { color: var(--baja); font-weight: 600; white-space: nowrap; }

/* Filtros */
.filtros { background: var(--superficie); border: 1px solid var(--borde); border-radius: .75rem; padding: .75rem 1rem; margin-bottom: 1rem; }
.filtros .form-label { font-size: .75rem; color: var(--texto-2); margin-bottom: .15rem; }

/* Tablas */
.tabla-bi { font-size: .85rem; margin: 0; }
.tabla-bi th { font-size: .75rem; color: var(--texto-2); font-weight: 600; white-space: nowrap; background: #f7f9f8; }
.tabla-bi td.num, .tabla-bi th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tabla-bi tr.subtotal td { background: #f1f6f5; font-weight: 600; }
.tabla-bi tr.total td { background: #e1efed; font-weight: 700; }
.tabla-scroll { overflow-x: auto; }

/* Gráficos */
.grafico { position: relative; height: 280px; }
.grafico.alto { height: 360px; }

/* Etiquetas de estado (siempre con texto) */
.etq { display: inline-flex; align-items: center; gap: .25rem; font-size: .72rem; font-weight: 600; border-radius: 1rem; padding: .1rem .5rem; border: 1px solid; }
.etq-a { color: #0b5f37; border-color: #9fd3b6; background: #eaf7ef; }
.etq-b { color: #7a4d00; border-color: #f0cf8d; background: #fdf5e4; }
.etq-c { color: #5b6461; border-color: #d5dbd9; background: #f4f6f5; }

/* Búsqueda de productos */
.buscador { position: relative; max-width: 640px; }
.sugerencias { position: absolute; z-index: 20; left: 0; right: 0; top: 100%; background: #fff; border: 1px solid var(--borde);
               border-radius: .5rem; box-shadow: 0 8px 24px rgba(0,0,0,.08); max-height: 360px; overflow-y: auto; }
.sugerencias a { display: block; padding: .5rem .75rem; color: var(--texto); text-decoration: none; border-bottom: 1px solid #f0f2f1; }
.sugerencias a:hover, .sugerencias a.sel { background: #eef3f2; }
.sugerencias small { color: var(--texto-2); }

/* Login */
.contenido-login { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem;
                   background: linear-gradient(160deg, #0f5f5a 0%, #13807a 100%); }
.caja-login { width: 100%; max-width: 380px; background: #fff; border-radius: 1rem; padding: 2rem; box-shadow: 0 20px 48px rgba(0,0,0,.2); }