/* Shared UI palette. Theme is resolved in theme.js before Bootstrap is painted. */
:root, :root[data-theme="light"] {
    --cp-body-bg: #f4f7fb; --cp-body-bg-alt: #f4f7fb;
    --cp-surface: #ffffff; --cp-surface-raised: #ffffff; --cp-surface-overlay: #ffffff;
    --cp-text: #18263a; --cp-text-secondary: #526176; --cp-text-tertiary: #5e6c80;
    --cp-primary: #176b78; --cp-blue: #176b78; --cp-blue-hover: #12525f; --cp-blue-dark: #12525f;
    --cp-link: #176b78; --cp-success: #167045; --cp-danger: #b52c3b;
    --cp-warning: #845500; --cp-info: #116a85;
    --cp-border: #8896a8; --cp-border-light: #d5deea;
    --cp-gray-1: #64748b; --cp-gray-2: #8896a8; --cp-gray-3: #b5c0cf;
    --cp-gray-4: #d5deea; --cp-gray-5: #e6ecf3; --cp-gray-6: #f0f4f9;
    --ui-focus: #176b78; --ui-primary-fill: #176b78; --ui-primary-hover: #12525f;
    --ui-success-fill: #167045; --ui-danger-fill: #b52c3b;
    --ui-info-fill: #116a85; --ui-warning-fill: #f3c65f; --ui-warning-ink: #352400;
    --ui-primary-soft: #e7f4f4; --ui-success-soft: #e8f5ee;
    --ui-danger-soft: #fcecef; --ui-warning-soft: #fff4d5; --ui-info-soft: #e6f3f8;
    --ui-nav-bg: #13243c; --ui-nav-text: #cbd8e9; --ui-nav-active: #24486f;
    --cp-radius: 10px; --cp-radius-lg: 16px;
    --bs-body-bg: var(--cp-body-bg); --bs-body-color: var(--cp-text);
    --bs-secondary-color: var(--cp-text-secondary); --bs-tertiary-color: var(--cp-text-tertiary);
    --bs-border-color: var(--cp-border-light); --bs-secondary-bg: var(--cp-gray-6);
    --bs-tertiary-bg: var(--cp-gray-6); --bs-emphasis-color: var(--cp-text);
    --bs-link-color: var(--cp-link); --bs-link-hover-color: var(--cp-link);
}
:root[data-theme="dark"] {
    --cp-body-bg: #101824; --cp-body-bg-alt: #101824;
    --cp-surface: #192536; --cp-surface-raised: #233247; --cp-surface-overlay: #192536;
    --cp-text: #edf3fc; --cp-text-secondary: #b5c3d6; --cp-text-tertiary: #a8b8ce;
    --cp-primary: #8ee4df; --cp-blue: #8ee4df; --cp-blue-hover: #b0efeb; --cp-blue-dark: #8ee4df;
    --cp-link: #8ee4df; --cp-success: #8ce1b1; --cp-danger: #ffa3ac;
    --cp-warning: #f5d17d; --cp-info: #8dd9f0;
    --cp-border: #75879f; --cp-border-light: #394b63;
    --cp-gray-1: #a8b8ce; --cp-gray-2: #75879f; --cp-gray-3: #536981;
    --cp-gray-4: #394b63; --cp-gray-5: #2c3d53; --cp-gray-6: #233247;
    --ui-focus: #b0efeb; --ui-primary-fill: #8ee4df; --ui-primary-hover: #b0efeb;
    --ui-success-fill: #8ce1b1; --ui-danger-fill: #ffa3ac;
    --ui-info-fill: #8dd9f0; --ui-warning-fill: #f5d17d; --ui-warning-ink: #352400;
    --ui-primary-soft: #21464b; --ui-success-soft: #173e31;
    --ui-danger-soft: #482a36; --ui-warning-soft: #403821; --ui-info-soft: #1d3c4c;
    --ui-nav-bg: #111d2e; --ui-nav-text: #cbd8e9; --ui-nav-active: #24486f;
}
body { background: var(--cp-body-bg); }
h1 { font-size: clamp(1.5rem, 2.2vw, 2rem); line-height: 1.25; }
h2, h3, h4 { line-height: 1.35; }
a:not(.btn):not(.sidebar-nav-item):not(.dropdown-item):not(.topbar-user-link) { text-underline-offset: .2em; }
:focus-visible { outline: 3px solid var(--ui-focus) !important; outline-offset: 3px; }
.skip-link { position: fixed; left: 1rem; top: -6rem; z-index: 2000; background: var(--cp-surface); color: var(--cp-text); padding: .75rem 1rem; border: 2px solid var(--ui-focus); border-radius: 8px; }
.skip-link:focus { top: 1rem; }
#app:focus { outline: none; }
.btn { min-height: 40px; font-weight: 600; }
.btn-sm { min-height: 34px; }
.btn:active { transform: none; }
.btn-primary, .bg-primary, .text-bg-primary { background-color: var(--ui-primary-fill) !important; color: #fff !important; }
.btn-primary:hover { background-color: var(--ui-primary-hover) !important; }
.btn-success, .bg-success, .text-bg-success { background-color: var(--ui-success-fill) !important; color: #fff !important; }
.btn-danger, .bg-danger, .text-bg-danger { background-color: var(--ui-danger-fill) !important; color: #fff !important; }
.btn-info, .bg-info, .text-bg-info { background-color: var(--ui-info-fill) !important; color: #fff !important; }
.btn-warning, .bg-warning, .text-bg-warning { background-color: var(--ui-warning-fill) !important; color: var(--ui-warning-ink) !important; }
[data-theme="dark"] :is(.btn-primary,.bg-primary,.text-bg-primary,.btn-success,.bg-success,.text-bg-success,.btn-danger,.bg-danger,.text-bg-danger,.btn-info,.bg-info,.text-bg-info) { color: #101824 !important; }
.btn-secondary, .btn-light, .bg-light, .text-bg-light { background: var(--cp-gray-6) !important; color: var(--cp-text) !important; border: 1px solid var(--cp-border-light); }
.btn-dark, .bg-dark, .text-bg-dark { background: #17263d !important; color: #edf3fc !important; }
.btn-outline-primary { color: var(--cp-primary); border-color: var(--cp-primary); }
.btn-outline-success { color: var(--cp-success); border-color: var(--cp-success); }
.btn-outline-danger { color: var(--cp-danger); border-color: var(--cp-danger); }
.btn-outline-warning { color: var(--cp-warning); border-color: var(--cp-warning); }
.btn-outline-info { color: var(--cp-info); border-color: var(--cp-info); }
.btn-outline-secondary { color: var(--cp-text-secondary); border-color: var(--cp-border); }
.btn-outline-primary:hover, .btn-outline-primary:active { background: var(--ui-primary-fill); color: #fff; }
.btn-outline-success:hover, .btn-outline-success:active { background: var(--ui-success-fill); color: #fff; }
.btn-outline-danger:hover, .btn-outline-danger:active { background: var(--ui-danger-fill); color: #fff; }
.btn-outline-warning:hover, .btn-outline-warning:active { background: var(--ui-warning-fill); color: var(--ui-warning-ink); }
.btn-outline-info:hover, .btn-outline-info:active { background: var(--ui-info-fill); color: #fff; }
[data-theme="dark"] .btn-outline-info:is(:hover,:active) { color: #101824; }
[data-theme="dark"] :is(.btn-outline-primary,.btn-outline-success,.btn-outline-danger):is(:hover,:active) { color: #101824; }
.btn-outline-secondary:hover, .btn-light:hover, .btn-secondary:hover { background: var(--cp-gray-5) !important; color: var(--cp-text); }
.text-secondary, .text-body-secondary { color: var(--cp-text-secondary) !important; }
.text-body, .text-body-emphasis { color: var(--cp-text) !important; }
.text-primary { color: var(--cp-primary) !important; }
.text-success { color: var(--cp-success) !important; }
.text-danger { color: var(--cp-danger) !important; }
.text-warning { color: var(--cp-warning) !important; }
.text-info { color: var(--cp-info) !important; }
.bg-primary-subtle { background: var(--ui-primary-soft) !important; }
.bg-success-subtle { background: var(--ui-success-soft) !important; }
.bg-danger-subtle { background: var(--ui-danger-soft) !important; }
.bg-warning-subtle { background: var(--ui-warning-soft) !important; }
.bg-info-subtle { background: var(--ui-info-soft) !important; }
.bg-secondary-subtle, .bg-body-tertiary { background: var(--cp-gray-6) !important; }
.alert-primary { color: var(--cp-primary); background: var(--ui-primary-soft); border-color: var(--cp-primary); }
.alert-success { color: var(--cp-success); background: var(--ui-success-soft); border-color: var(--cp-success); }
.alert-danger { color: var(--cp-danger); background: var(--ui-danger-soft); border-color: var(--cp-danger); }
.alert-warning { color: var(--cp-warning); background: var(--ui-warning-soft); border-color: var(--cp-warning); }
.alert-info { color: var(--cp-info); background: var(--ui-info-soft); border-color: var(--cp-info); }
.alert p, .alert strong, .alert a { color: inherit; }
.form-control, .form-select, .input-group-text { border-color: var(--cp-border); min-height: 42px; }
.form-control:disabled, .form-select:disabled, .form-control[readonly] { background: var(--cp-gray-6); color: var(--cp-text-secondary); opacity: 1; }
.form-control::placeholder { opacity: 1; color: var(--cp-text-tertiary); }
.form-check-input { border-color: var(--cp-border); width: 1.15em; height: 1.15em; }
.form-check-input:checked { background-color: #176b78; border-color: var(--cp-primary); }
.form-select { background-image: var(--bs-form-select-bg-img); }
.form-text, .invalid-feedback { line-height: 1.5; }
.invalid-feedback { color: var(--cp-danger); }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--cp-danger); }
.card, .modal-content, .dropdown-menu { box-shadow: 0 3px 14px rgba(0,0,0,.04); }
.modal-content { max-height: calc(100dvh - 2rem); }
.modal-body { overflow-y: auto; min-height: 0; overscroll-behavior: contain; }
.modal-header, .modal-footer { flex-shrink: 0; }
.modal-dialog-scrollable .modal-content { overflow: hidden; }
.dropdown-menu { --bs-dropdown-color: var(--cp-text); --bs-dropdown-link-color: var(--cp-text); --bs-dropdown-link-hover-color: var(--cp-text); --bs-dropdown-link-hover-bg: var(--cp-gray-6); --bs-dropdown-header-color: var(--cp-text-secondary); }
.dropdown-item { min-height: 40px; color: var(--cp-text); }
.dropdown-item:hover, .dropdown-item:focus { background: var(--cp-gray-6); color: var(--cp-text); }
.dropdown-item[aria-pressed="true"] { background: var(--ui-primary-soft); color: var(--cp-primary); font-weight: 700; }
.btn-close { width: 32px; height: 32px; opacity: 1; filter: none !important; background-image: none !important; color: var(--cp-text-secondary); }
.list-group { --bs-list-group-bg: var(--cp-surface); --bs-list-group-color: var(--cp-text); --bs-list-group-border-color: var(--cp-border-light); }
.table { --bs-table-striped-bg: var(--cp-gray-6); --bs-table-striped-color: var(--cp-text); }
.table th { color: var(--cp-text-secondary); background: var(--cp-gray-6); font-size: .82rem; line-height: 1.4; }
.table td { vertical-align: middle; line-height: 1.5; }
.table td .btn + .btn { margin-left: .25rem; }
.table-responsive { border-radius: 10px; scrollbar-color: var(--cp-border) var(--cp-surface); }
.badge { line-height: 1.4; font-weight: 600; }
.report-status-pill--success, .report-method-badge--success { background: var(--ui-success-soft); color: var(--cp-success); }
.report-method-badge--primary { background: var(--ui-primary-soft); color: var(--cp-primary); }
.report-method-badge--warning { background: var(--ui-warning-soft); color: var(--cp-warning); }
.report-method-badge--danger { background: var(--ui-danger-soft); color: var(--cp-danger); }
.report-method-badge--info { background: var(--ui-info-soft); color: var(--cp-info); }
.notification-badge { background: #b52c3b; color: #fff; }
summary { min-height: 40px; padding-block: .35rem; }
summary:hover { color: var(--cp-primary); }
#sidebar-container { background: var(--ui-nav-bg) !important; color: var(--ui-nav-text); }
.sidebar-nav-item { min-height: 44px; color: var(--ui-nav-text); font-weight: 500; }
.sidebar-nav-item.active, .sidebar-nav-item:hover { background: var(--ui-nav-active); color: #fff; }
.sidebar-nav-item.active { border-left-color: #8ee4df; }
.sidebar-nav-item.active i { color: #b0efeb; }
.sidebar-brand { color: #fff; }
.sidebar-brand .text-muted { color: var(--ui-nav-text) !important; }
.report-tab-switch { flex-wrap: wrap; gap: .35rem; }
.report-tab-switch .btn { border-radius: 8px !important; }
.report-tab-switch { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: min(100%, 440px); flex-shrink: 0; }
.report-tab-switch .btn { min-width: 0; padding-inline: .65rem; font-size: .85rem; }
#ventasPage .sales-item-list { grid-auto-rows: max-content; align-content: start; }
#ventasPage .sales-item { min-height: 112px; }
#ventasPage .sales-item.is-disabled { opacity: 1; }
#ventasPage .sales-item.is-disabled .sales-item__body { color: var(--cp-text-secondary); }
#ventasPage #saleTotal { line-height: 1.15; }
.topbar-user-link small { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.topbar-user-link > div { min-width: 0; }
.topbar-user-link i { flex-shrink: 0; }
.topbar-user-link strong { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.theme-options { display: flex; justify-content: center; flex-wrap: wrap; gap: .3rem; margin-top: 1rem; }
.theme-options button { background: var(--cp-surface); border: 1px solid var(--cp-border); border-radius: 8px; color: var(--cp-text-secondary); padding: .4rem .75rem; min-height: 36px; font-size: .8rem; }
.theme-options button[aria-pressed="true"] { color: var(--cp-primary); border-color: var(--cp-primary); background: var(--ui-primary-soft); font-weight: 700; }
/* Specificity keeps route-loaded login.css within the shared theme. */
html .login-root { background: var(--cp-body-bg); padding: 24px 16px; overflow: auto; --login-card-bg: var(--cp-surface); --login-text-main: var(--cp-text); --login-text-muted: var(--cp-text-secondary); --login-input-bg: var(--cp-surface); --login-input-border: var(--cp-border); --login-accent: var(--cp-primary); }
html .login-bg-photo { background: linear-gradient(135deg, var(--cp-body-bg), var(--ui-primary-soft)); }
html .login-bg-glow { opacity: .25; }
html .login-card { border-color: var(--cp-border-light); box-shadow: 0 16px 48px rgba(0,0,0,.12); padding: 32px; }
html .login-brand-logo { display: inline-flex; width: min(230px, 100%); margin-bottom: 8px; }
html .login-brand-logo::after { display: none; }
html .login-brand-logo img { width: 100%; max-width: 100%; height: auto; }
.brand-logo { display: block; object-fit: contain; }
.brand-link { display: inline-flex; min-width: 0; flex-shrink: 1; }
.brand-logo--sidebar { width: 190px; height: auto; max-width: 100%; filter: brightness(0) invert(1); }
.brand-logo--topbar { width: 136px; height: 30px; }
:root[data-theme="dark"] .brand-logo--topbar,
:root[data-theme="dark"] .brand-logo--login { filter: brightness(0) invert(1); }
@media (max-width: 420px) { .brand-logo--topbar { width: 104px; height: 26px; } }
html .login-brand-company { font-size: .85rem; letter-spacing: .14em; }
html .login-brand-title { font-size: 1.75rem; letter-spacing: -.02em; margin-block: .5rem; }
html .login-brand-sub { font-size: .95rem; }
html .login-form-label { font-size: .9rem; text-transform: none; letter-spacing: 0; color: var(--cp-text); }
html .login-input { min-height: 48px; padding-right: 52px; font-size: 1rem; }
html .login-input:focus { background: var(--cp-surface); border-color: var(--ui-focus); }
html .login-toggle-pw { right: 8px; min-width: 36px; min-height: 36px; }
html .login-btn { background: var(--ui-primary-fill); color: #fff; min-height: 48px; font-size: 1rem; text-transform: none; letter-spacing: 0; box-shadow: none; }
[data-theme="dark"] .login-btn { color: #101824; }
html .login-link-btn { min-height: 40px; font-size: .9rem; text-transform: none; letter-spacing: 0; }
html .login-footer { font-size: .8rem; }
html .login-help-btn { background: var(--cp-surface); color: var(--cp-text); border-color: var(--cp-border); }
@media (max-width: 767.98px) {
    .btn { min-height: 44px; }
    .btn-sm { min-height: 38px; }
    .topbar-user-link small { max-width: 130px; }
    .topbar-user-link { max-width: 140px; min-width: 0; }
    .topbar-user-link small { max-width: 100%; }
    #topbar-container .navbar-brand { margin-right: .4rem; }
    .notification-menu { max-width: calc(100vw - 24px); }
    html .login-wrap { padding: 0; }
    html .login-card { padding: 28px 22px; }
    .report-tab-switch { width: 100%; }
    .report-tab-switch { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@media (max-width: 359.98px) {
    .topbar-user-link > div { display: none !important; }
}

/* Keep six-decimal prices and fiscal options readable in the counter workspace. */
#ventasPage .sales-item__body { min-width: 0; }
#ventasPage .sales-item__action strong { white-space: nowrap; font-variant-numeric: tabular-nums; }
#ventasPage .sales-cart-line select { max-width: 100%; }
@media (min-width: 1100px) {
    #ventasPage.is-counter-focused .counter-scanner { padding: .6rem; }
    #ventasPage.is-counter-focused .sales-payment-box { gap: .4rem; }
    #ventasPage.is-counter-focused #saleTotal { font-size: 1.8rem; }
    #ventasPage.is-counter-focused .sales-total-line--grand { padding: .6rem; }
}

@media (min-width: 1100px) {
    #ventasPage.is-counter-focused .sales-payment-box > details > summary { min-height: 28px; }
    #ventasPage.is-counter-focused .sales-payment-grid label > span { font-size: .85rem; line-height: 1.2; }
    #ventasPage.is-counter-focused .sales-total-line--grand { font-size: .9rem; line-height: 1.2; }
    #ventasPage.is-counter-focused .counter-scanner label { font-size: .8rem; line-height: 1.2; }
    #ventasPage.is-counter-focused #saleBarcode { height: 48px; min-height: 48px; line-height: 1.2; }
    #ventasPage.is-counter-focused .counter-shortcuts { font-size: .7rem; gap: .35rem; }
}

/* Hospital delivery cohorts: readable quantities and finance without wide legacy headers. */
.hospital-operation-table { table-layout: fixed; min-width: 760px; font-size: .875rem; }
.hospital-operation-table th, .hospital-operation-table td { white-space: normal; overflow-wrap: anywhere; padding: .75rem; }
.hospital-operation-table th:nth-child(1) { width: 15%; }
.hospital-operation-table th:nth-child(2) { width: 20%; }
.hospital-operation-table th:nth-child(3) { width: 15%; }
.hospital-operation-table th:nth-child(4) { width: 14%; }
.hospital-operation-table th:nth-child(5) { width: 24%; }
.hospital-operation-table th:nth-child(6) { width: 12%; }
