/* ================================================================
   PANCULTURA — TPV
   Forma y tono del Design System (docs/pancultura-design-system) sobre theme.css.
   Colores: solo variables --brand-* (config 'brand' de projects-pct*.php).
   - Bordes antes que sombras; radios md 8px (botones, campos) y lg 14px (tarjetas).
   - Títulos en Space Grotesk y en minúscula salvo la primera letra;
     etiquetas (label) en mayúsculas con 0,06em.
   - El trigo (accent) es gráfico: para texto, accent-dark (accent-ink).
   ================================================================ */

:root {
    --radius-card: 14px;   /* radius-lg */
    --radius-btn:  8px;    /* radius-md */
    --shadow-card:  0 1px 2px rgba(var(--brand-primary-rgb), 0.08);   /* shadow-card */
    --shadow-panel: 0 1px 2px rgba(var(--brand-primary-rgb), 0.08);
    --shadow-drawer: 0 8px 24px rgba(var(--brand-primary-rgb), 0.16); /* shadow-pop */
    --clr-green-dark: var(--brand-primary);   /* cabecera y marco: el marrón de marca, no uno más oscuro */
}

/* ---- Cabecera: marrón corteza con el logotipo crema ---- */
.pos-header { background: var(--brand-primary); box-shadow: none; }
.hdr-logo__mark { display: none; }   /* el logotipo ya lleva el símbolo */
.hdr-logo__name { flex-shrink: 0; margin-left: 0.9rem; line-height: 0; }
.hdr-logo__name img { height: 40px; width: auto; max-width: none !important; }
@media (max-width: 479px) {
    .hdr-logo__mark { display: flex; background: transparent; }
}

/* ---- Títulos: Space Grotesk, sin mayúsculas forzadas ---- */
.hdr-title, .drawer-head__title, .view-title, .cart-head__title, .ck-title {
    font-family: var(--brand-font-display);
    text-transform: none;
    letter-spacing: -0.01em;
    font-weight: 600;
}
.view-title { color: var(--brand-text); }

/* Etiquetas: label del DS (12px, 600, mayúsculas 0,06em) */
.pmodal__field .lbl, .co-label, .session-card__lbl, .session-divider,
.home-scan fieldset.search legend, .ticket-tbl th {
    font-family: var(--brand-font-body);
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--brand-text-muted);
}

/* ---- Importes y cifras: Space Grotesk tabular; trigo solo como acento gráfico ---- */
.session-card__main, .pmodal__price-tag .price, .pcard__price, .product-card__price, .totals-disc, .ts-disc .ts-val,
#session-close .orange {
    font-family: var(--brand-font-display);
    font-variant-numeric: tabular-nums;
}
.session-card__main, .pmodal__price-tag .price, .product-card__price, .totals-disc, .ts-disc .ts-val, #session-close .orange,
.drawer-nav__link:hover, .drawer-nav__link.active,
.drawer-nav__link:hover i, .drawer-nav__link.active i { color: var(--brand-accent-dark); }
.drawer-nav__link.active { border-left-color: var(--brand-accent); }

/* ---- Tarjetas y paneles: superficie elevada con borde fino ---- */
.pcard, .session-card, .quick-menu, .note-card, .home-scan, .pmodal__panel {
    border: 1px solid var(--brand-border);
    box-shadow: var(--shadow-card);
}

/* ---- Campos: borde line-strong, foco sólido de 2px ---- */
.form-control, .form-select, .search-input, .home-scan input#search_term {
    border-color: var(--brand-border-strong);
    border-radius: var(--radius-btn);
}
.form-control:focus, .form-select:focus, .search-input:focus, .home-scan input#search_term:focus,
.btn:focus-visible {
    border-color: var(--brand-primary);
    box-shadow: none;
    outline: 2px solid var(--brand-primary);
    outline-offset: 2px;
}

/* ---- Botones: radio md ---- */
.btn { border-radius: var(--radius-btn); }
.btn-outline-secondary, .btn-default, .btn-light {
    --bs-btn-color: var(--brand-text);
    --bs-btn-border-color: var(--brand-border-strong);
    --bs-btn-hover-bg: var(--brand-background-deep);
    --bs-btn-hover-color: var(--brand-text);
    --bs-btn-hover-border-color: var(--brand-border-strong);
}

/* ---- Tablas (DataTable del DS): cabecera en banda surface-200 con estilo label ---- */
.table-pos thead { background: var(--brand-background-deep); }
.table-pos thead th, table.items thead tr th {
    background: transparent;
    color: var(--brand-text-muted);
    font-family: var(--brand-font-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--brand-border);
}
.table { --bs-table-striped-bg: rgba(var(--brand-primary-rgb), 0.03); --bs-table-hover-bg: var(--brand-background-deep); }
.table-scroll { border: 1px solid var(--brand-border); }

/* ---- Acción de cobrar: trigo con texto tinta (blanco sobre trigo no llega a 4,5:1) ----
   !important: las vistas (sale/ticket.blade.php) declaran estos estilos en <style> después de esta hoja. */
.btn-checkout, .btn-finish--primary, .btn-finish--primary:hover, .btn-checkout:hover {
    color: var(--brand-text) !important;
}
.btn-checkout i, .btn-finish--primary i { color: inherit; }

/* Títulos de ventanas: frase con mayúscula inicial */
.modal-title, .co-head__title {
    font-family: var(--brand-font-display) !important;
    text-transform: none !important;
    letter-spacing: -0.01em !important;
}
.hdr-icon-btn--menu, .hdr-icon-btn--menu i { color: var(--brand-text) !important; }
