/*
 * Ajustes del CRM sobre Tabler 1.6.1 (migración de la interfaz, 03/10/2026; guía: docs del sistema de producción,
 * gestion_produccion_app/docs/diseno_interfaz.md). Igual que producción pero con la paleta NARANJA del CRM (decisión
 * del dueño): letra Barlow servida desde acá (licencia OFL), barra de color con el logo en blanco y números alineados.
 * Nada más: el resto es Tabler. Las pantallas que todavía no se migraron siguen con layout.php (Tailwind).
 */
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 400; font-display: swap; src: url("fuentes/barlow-400.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 500; font-display: swap; src: url("fuentes/barlow-500.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 600; font-display: swap; src: url("fuentes/barlow-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 700; font-display: swap; src: url("fuentes/barlow-700.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("fuentes/barlow-condensed-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("fuentes/barlow-condensed-700.woff2") format("woff2"); }

/* Paleta naranja del CRM: Tabler calcula los demás tonos a partir del primario */
:root, [data-bs-theme] {
  --tblr-primary: #ea580c;
  --tblr-primary-rgb: 234, 88, 12;
  --tblr-font-sans-serif: "Barlow", system-ui, sans-serif;
}
body { font-size: 15px; }
.page-title, .card-title, .empty-title, .alert-heading, .navbar-brand, .modal-title {
  font-family: "Barlow Condensed", "Barlow", sans-serif; font-weight: 700; letter-spacing: .01em;
}
.page-title { font-size: 1.75rem; }
.card-title { font-size: 1.15rem; }
/* Etiquetas de estado dentro del título de la página: tamaño de etiqueta, no del título */
.page-title .badge { font-family: var(--tblr-font-sans-serif); font-size: .8rem; font-weight: 600; letter-spacing: 0; text-transform: none; vertical-align: .3em; }

/* Barra superior y menú en naranja oscuro (contraste con el texto blanco), con el logo en blanco */
.barra-color { background: #c2410c !important; --tblr-navbar-active-border-color: #fed7aa; --tblr-navbar-border-color: rgba(255, 255, 255, .18); }
[data-bs-theme=dark] .barra-color { background: #7c2d12 !important; }
.barra-color .nav-link { color: rgba(255, 255, 255, .86); }
.barra-color .nav-item.active .nav-link, .barra-color .nav-link:hover { color: #fff; }
.menu-secundario { border-top: 1px solid rgba(255, 255, 255, .18); }
/* Menú con ícono en cada grupo, como producción: 12 grupos entran en una línea desde ~1400 px; más angosto, bajan a otra línea */
.menu-secundario .navbar-nav .nav-link { padding-left: .42rem; padding-right: .42rem; }
.menu-secundario .nav-link-icon { margin-right: .25rem; }
.usuario-rol { color: rgba(255, 255, 255, .72); }
.barra-color .btn-barra { --tblr-btn-color: #fff; --tblr-btn-border-color: rgba(255, 255, 255, .35); --tblr-btn-hover-bg: rgba(255, 255, 255, .12);
  --tblr-btn-hover-color: #fff; --tblr-btn-hover-border-color: rgba(255, 255, 255, .6); background: transparent; }
.campana { position: relative; color: #fff; display: inline-flex; }
.campana .badge { position: absolute; top: -.45rem; right: -.6rem; }

/* Números: cifras tabulares, a la derecha, sin cortar */
.num { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.dato-grande { font-family: "Barlow Condensed", "Barlow", sans-serif; font-weight: 700; font-size: 1.9rem; line-height: 1.1; font-variant-numeric: tabular-nums; }

/* Botón (i) de ayuda (render.php: info()) y su variante 🤝 de acuerdo comercial: abren #modal-info */
.info-i { display: inline-flex; align-items: center; justify-content: center; height: 1.05rem; width: 1.05rem; border-radius: 9999px;
  background: var(--tblr-gray-200, #e2e8f0); color: var(--tblr-secondary, #64748b); font-size: 11px; font-style: italic; font-weight: 700;
  font-family: Georgia, serif; line-height: 1; vertical-align: middle; cursor: pointer; flex: none; border: 0; padding: 0; transition: all .15s; }
.info-i:hover { background: var(--tblr-primary); color: #fff; }
.info-i.acuerdo-i { width: auto; height: auto; background: transparent; font-style: normal; font-family: inherit; font-weight: 400;
  padding: 0 .15rem; border-radius: .375rem; line-height: 1.2; }
.info-i.acuerdo-i:hover { background: #ffedd5; color: inherit; }
#modal-info-cuerpo h4 { font-weight: 600; margin: .75rem 0 .25rem; }
#modal-info-cuerpo p { margin: .35rem 0; }
#modal-info-cuerpo ul { margin: .35rem 0 .35rem 1.1rem; padding: 0; }
#modal-info-cuerpo .pill { display: inline-block; padding: 0 .4rem; border-radius: 9999px; font-size: 11px; font-weight: 700; }

/* Filtro aplicado: distinto de la vista inicial (ayuda visual rápida; crm.js) */
.filtro-on { border-color: var(--tblr-primary) !important; background-color: #fff7ed !important; color: #9a3412 !important;
  box-shadow: 0 0 0 1px var(--tblr-primary); font-weight: 600; }
label.filtro-on { border-radius: .5rem; }

/* Inicio: accesos a cada pantalla */
.acceso { display: flex; align-items: center; gap: .6rem; padding: .4rem .5rem; border-radius: var(--tblr-border-radius); color: var(--tblr-body-color); text-decoration: none; }
.acceso:hover { background: #fff7ed; color: #c2410c; text-decoration: none; }
.acceso .acceso-ico { font-size: 1.15rem; line-height: 1; flex: none; width: 1.4rem; text-align: center; }

/* Ingreso: el mismo esquema que el de producción (produccion.asaditos.ar/ingresar: franja de color con el logo en blanco,
   el nombre del sistema en grande y la tarjeta encima), en naranja y con «Plataforma CRM» */
.ingreso-fondo { min-height: 100vh; background: linear-gradient(180deg, #c2410c 0, #ea580c 340px, var(--tblr-bg-surface-secondary, #f6f8fb) 340px); }
[data-bs-theme=dark] .ingreso-fondo { background: linear-gradient(180deg, #7c2d12 0, #c2410c 340px, var(--tblr-bg-surface-secondary, #151f2c) 340px); }
.ingreso-sistema { font-family: "Barlow Condensed", "Barlow", sans-serif; font-weight: 700; font-size: clamp(2.75rem, 11vw, 3.75rem); line-height: 1;
  letter-spacing: .04em; text-transform: uppercase; color: #fff; margin: .6rem 0 .25rem; }
.ingreso-marca { color: rgba(255, 255, 255, .82); font-weight: 500; }