/* ================================================================
   THEME — POS
   Capa de marca: colores y fuentes de la empresa como variables --brand-*,
   generadas por App\Services\Brand desde config('projects.brand')
   (resources/views/common/brand_head.blade.php). No poner colores fijos aquí.
   ================================================================ */

:root {
    /* Tokens del POS (pos_simple.css) → marca */
    --clr-green:        var(--brand-primary);
    --clr-green-light:  var(--brand-primary-light);
    --clr-green-dark:   var(--brand-primary-dark);
    --clr-grey:         var(--brand-text-muted);
    --clr-grey-light:   var(--brand-background);
    --clr-grey-mid:     var(--brand-border);
    --clr-grey-dark:    var(--brand-text-soft);
    --clr-orange:       var(--brand-accent);   /* acción principal (cobrar) */
    --clr-orange-light: var(--brand-accent-light);
    --clr-orange-ink:   var(--brand-accent-dark);   /* texto en tono acento (importes): contraste legible */
    --clr-beige:        var(--brand-background);
    --clr-beige-dark:   var(--brand-background-deep);
    --clr-white:        #FFFFFF;
    --clr-text:         var(--brand-text);
    --clr-aparcar:      var(--brand-info);

    --ff-headline: var(--brand-font-display);
    --ff-body:     var(--brand-font-body);
    --ff-base:     var(--ff-body);

    --radius-card: 14px;
    --radius-btn:  10px;
    --shadow-card:  0 2px 6px rgba(var(--brand-text-rgb), 0.06);
    --shadow-panel: -2px 0 16px rgba(var(--brand-text-rgb), 0.08);
    --shadow-drawer: -4px 0 24px rgba(var(--brand-text-rgb), 0.14);
    --shadow-footer: 0 -2px 12px rgba(var(--brand-text-rgb), 0.16);
    --shadow-checkout-btn: 0 2px 10px rgba(var(--brand-accent-rgb), 0.45);

    /* Bootstrap 5 */
    --bs-body-font-family: var(--ff-body);
    --bs-body-color: var(--brand-text);
    --bs-link-color: var(--brand-primary);
    --bs-link-color-rgb: var(--brand-primary-rgb);
    --bs-link-hover-color: var(--brand-accent-dark);
    --bs-link-hover-color-rgb: var(--brand-accent-rgb);
    --bs-primary: var(--brand-primary);
    --bs-primary-rgb: var(--brand-primary-rgb);
    --bs-success: var(--brand-primary);
    --bs-success-rgb: var(--brand-primary-rgb);
    --bs-warning: var(--brand-accent-light);
    --bs-warning-rgb: var(--brand-accent-rgb);
    --bs-danger: var(--brand-danger);
    --bs-danger-rgb: var(--brand-danger-rgb);
    --bs-border-color: var(--brand-border);
}

body { font-family: var(--ff-body); color: var(--brand-text); }

/* ---- Bootstrap: botones y formularios ---- */
.btn-success, .btn-primary {
    --bs-btn-bg: var(--brand-primary);
    --bs-btn-border-color: var(--brand-primary);
    --bs-btn-hover-bg: var(--brand-primary-dark);
    --bs-btn-hover-border-color: var(--brand-primary-dark);
    --bs-btn-active-bg: var(--brand-primary-darker);
    --bs-btn-active-border-color: var(--brand-primary-darker);
    --bs-btn-disabled-bg: var(--brand-primary-light);
    --bs-btn-disabled-border-color: var(--brand-primary-light);
    --bs-btn-focus-shadow-rgb: var(--brand-primary-rgb);
}
.btn-outline-success, .btn-outline-primary {
    --bs-btn-color: var(--brand-primary);
    --bs-btn-border-color: var(--brand-primary);
    --bs-btn-hover-bg: var(--brand-primary);
    --bs-btn-hover-border-color: var(--brand-primary);
    --bs-btn-active-bg: var(--brand-primary-dark);
    --bs-btn-active-border-color: var(--brand-primary-dark);
}
.btn-warning {
    --bs-btn-color: var(--brand-text);
    --bs-btn-bg: var(--brand-accent-light);
    --bs-btn-border-color: var(--brand-accent-light);
    --bs-btn-hover-bg: var(--brand-accent);
    --bs-btn-hover-border-color: var(--brand-accent);
    --bs-btn-hover-color: #fff;
}
.btn-danger {
    --bs-btn-bg: var(--brand-danger);
    --bs-btn-border-color: var(--brand-danger);
    --bs-btn-hover-bg: var(--brand-danger-dark);
    --bs-btn-hover-border-color: var(--brand-danger-dark);
}
.text-success { color: var(--brand-primary) !important; }
.text-danger  { color: var(--brand-danger) !important; }
.bg-success   { background-color: var(--brand-primary) !important; }

.form-control:focus, .form-select:focus,
.search-input:focus, .home-scan input#search_term:focus {
    border-color: var(--brand-primary-light);
    box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), 0.15);
}
.form-check-input:checked { background-color: var(--brand-primary); border-color: var(--brand-primary); }
.select2-container--default.select2-container--open .select2-selection { box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), 0.15); }

/* ---- pos_simple.css: colores fijos ---- */
.btn-checkout:hover { box-shadow: 0 4px 16px rgba(var(--brand-accent-rgb), 0.55); }
.btn-confirm { box-shadow: 0 2px 10px rgba(var(--brand-primary-rgb), 0.35); }
.pay-btn:hover { background: rgba(var(--brand-primary-rgb), 0.05); }
.pmodal__thumb, .pmodal__panel, .quick-menu__btn { background-color: var(--brand-surface); }
.pmodal__thumb, .pmodal__panel, .pmodal__sep { border-color: var(--brand-border); }
.parked-pill, .btn-aparcar { border-color: var(--brand-border-strong); }
.drawer-nav__link--danger, .drawer-nav__link--danger i,
.session-logout, #session-close .red { color: var(--brand-danger); }
.drawer-nav__link--danger:hover, .session-logout:hover { color: var(--brand-danger); background: var(--brand-danger-soft); }

/* ---- pos_style.css (pantallas antiguas): verdes y naranjas fijos ---- */
a, .btn-pos, .paginator a.btn, #modal_product_categories, #modal_product_id { color: var(--brand-primary); }
a:hover, .paginator a.btn:hover,
fieldset.search form .results .result_row:hover { color: var(--brand-accent-dark); }
.btn-pos:hover, .btn-pos.selected,
fieldset.search form .results b,
#modal-client .initsale span, #modal-product .initsale span,
#modal_product_categories span,
.modal#modal-more table tr td.second a,
.notes_wrapper .note :hover { color: var(--brand-accent); }
.green, .title, a.sidebar-btn:hover, .modal#modal-more .modal-body h4 { color: var(--brand-primary-light); }
fieldset.search form .results .result_row, #modal_product_title,
#modal-client #modal_client_alias, #modal-client #modal_client_initsaletitle,
#modal-product #modal_product_initsaletitle { color: var(--brand-primary-dark); }
fieldset legend, #modal-product .brand, #modal-product .price #modal_product_tax,
#modal-product .provider_ean, #modal_product_dates,
#modal_product_stock, #modal_product_min, #modal_product_min_recommend,
.notes_wrapper .note .from, .notes_wrapper .note .last_reply,
#modal-notes-reply .reply small { color: var(--brand-text-muted); }
#modal-product .price #modal_product_total, .modal#modal-more table tr td.third { color: var(--brand-primary-light); }
hr, fieldset, #modal-client .meta { border-color: var(--brand-border); }

/* pos_style.css fija Raleway en table/input/div/span... y fondo #efe en los campos */
table, input, textarea, select, button, div, span, body { font-family: var(--ff-body); letter-spacing: 0; }
input, textarea { background: #FFFFFF; border-color: var(--brand-border-strong); }
a.sidebar-btn:hover, fieldset.search form .results .result_row:hover { background: var(--brand-primary-softer); }

/* Login: el símbolo va sobre crema, no sobre el acento */
.login-container .login-logo__mark { background: var(--brand-primary-softer); box-shadow: inset 0 0 0 1px var(--brand-primary-soft); }
.login-container .login-logo__mark img { width: 80%; }

/* Sin logo configurado: nombre en texto sobre la cabecera oscura */
.brand-fallback-name { color: var(--brand-on-dark); font-family: var(--brand-font-display); font-size: 1.35rem; font-weight: 600; white-space: nowrap; }
a:has(> .brand-fallback-name) { text-decoration: none; }