/**
 * Bilvo portal themes
 * - Product Desk  → bilvo-product (blue catalog)
 * - Billing Desk  → bilvo-billing (forest green POS)
 * Applied via body[data-pos-theme] (AppShell syncs with portal).
 */

:root,
body[data-pos-theme='bilvo-blue'],
body[data-pos-theme='bilvo-product'] {
  --pos-maroon: #1e40af;
  --pos-maroon-dark: #172554;
  --pos-maroon-light: #2563eb;
  --pos-pink: #1e40af;
  --pos-pink-soft: #e8f0fc;
  --pos-pink-mid: #a8c8f5;
  --pos-bg: #e8f2fc;
  --pos-card: #ffffff;
  --pos-border: #a8c4f0;
  --pos-text: #0a1628;
  --pos-muted: #4a6285;
  --pos-green: #059669;
  --pos-green-dark: #047857;
  --pos-accent-2: #3b82f6;
  --pos-shadow: 0 8px 28px rgba(30, 64, 175, 0.12);
  --pos-topbar-bg: linear-gradient(90deg, #1e40af 0%, #2563eb 100%);
  --pos-sidebar-bg: linear-gradient(180deg, #1e3a8a 0%, #172554 100%);
  --pos-logo-bg: linear-gradient(145deg, #7eb4f7, #1e40af);
  --pos-radius: 12px;
  --pos-overlay: rgba(15, 40, 90, 0.45);
  --pos-focus-ring: rgba(37, 99, 235, 0.18);
  --pos-chip-grad: linear-gradient(145deg, #1e40af 0%, #172554 100%);
  --pos-soft-grad: linear-gradient(145deg, #e8f0fc 0%, #d4e4f8 100%);
  --pos-panel-head-bg: linear-gradient(180deg, #fff 0%, #e8f0fc 100%);
  --pos-thumb-grad-1: linear-gradient(145deg, #dbeafe, #93c5fd);
  --pos-thumb-grad-2: linear-gradient(145deg, #bfdbfe, #60a5fa);
  --pos-thumb-grad-3: linear-gradient(145deg, #e0f2fe, #7dd3fc);
  --pos-icon-grad: linear-gradient(145deg, #bfdbfe, #60a5fa);

  --gc-maroon: #1e40af;
  --gc-maroon-dark: #172554;
  --gc-maroon-light: #2563eb;
  --gc-pink: #1e40af;
  --gc-pink-soft: #e8f0fc;
  --gc-bg: #e8f2fc;
}

/* Billing Desk — forest green (MarketHub-style POS energy) */
body[data-pos-theme='bilvo-billing'] {
  --pos-maroon: #166534;
  --pos-maroon-dark: #0f3d2e;
  --pos-maroon-light: #15803d;
  --pos-pink: #16a34a;
  --pos-pink-soft: #ecfdf5;
  --pos-pink-mid: #86efac;
  --pos-bg: #f0fdf6;
  --pos-card: #ffffff;
  --pos-border: #bbf7d0;
  --pos-text: #052e16;
  --pos-muted: #3f6b52;
  --pos-green: #059669;
  --pos-green-dark: #047857;
  --pos-accent-2: #22c55e;
  --pos-shadow: 0 8px 28px rgba(22, 101, 52, 0.12);
  --pos-topbar-bg: linear-gradient(90deg, #14532d 0%, #166534 55%, #15803d 100%);
  --pos-sidebar-bg: linear-gradient(180deg, #0f3d2e 0%, #14532d 55%, #166534 100%);
  --pos-logo-bg: linear-gradient(145deg, #4ade80, #166534);
  --pos-radius: 12px;
  --pos-overlay: rgba(8, 40, 24, 0.45);
  --pos-focus-ring: rgba(22, 163, 74, 0.2);
  --pos-chip-grad: linear-gradient(145deg, #166534 0%, #0f3d2e 100%);
  --pos-soft-grad: linear-gradient(145deg, #ecfdf5 0%, #dcfce7 100%);
  --pos-panel-head-bg: linear-gradient(180deg, #fff 0%, #ecfdf5 100%);
  --pos-thumb-grad-1: linear-gradient(145deg, #dcfce7, #86efac);
  --pos-thumb-grad-2: linear-gradient(145deg, #bbf7d0, #4ade80);
  --pos-thumb-grad-3: linear-gradient(145deg, #ecfdf5, #6ee7b7);
  --pos-icon-grad: linear-gradient(145deg, #bbf7d0, #4ade80);

  --gc-maroon: #166534;
  --gc-maroon-dark: #0f3d2e;
  --gc-maroon-light: #15803d;
  --gc-pink: #16a34a;
  --gc-pink-soft: #ecfdf5;
  --gc-bg: #f0fdf6;
}

html {
  font-family: 'DM Sans', 'Segoe UI', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body,
.pos-body,
.gc-login {
  font-family: inherit;
  background: var(--pos-bg);
  color: var(--pos-text);
}

/* Sidebar & topbar use theme gradients */
.pos-sidebar {
  background: var(--pos-sidebar-bg) !important;
}

.pos-topbar,
.bq-topbar,
.bq-page-header.bq-topbar {
  background: var(--pos-topbar-bg) !important;
}

.pos-sidebar-brand--logo img,
.pos-topbar-logo {
  border-radius: 10px;
}

.pos-sidebar-brand--billing::before,
.pos-sidebar-brand--product::before {
  background: var(--pos-logo-bg) !important;
}

.bq-portal-product .pos-sidebar-brand--product .pos-sidebar-logo,
.pos-sidebar-brand--product .pos-sidebar-logo {
  background: var(--pos-logo-bg);
}

.bq-portal-billing .pos-sidebar-brand--billing .pos-sidebar-logo,
.pos-sidebar-brand--billing .pos-sidebar-logo {
  background: var(--pos-logo-bg);
}

.bq-portal-product .pos-sidebar,
.bq-portal-billing .pos-sidebar {
  background: var(--pos-sidebar-bg) !important;
}

/* Overlays */
.pos-overlay {
  background: var(--pos-overlay) !important;
}

.pos-scan-now-btn,
.pos-scan-now-btn:hover {
  background: var(--pos-chip-grad) !important;
  border-color: color-mix(in srgb, var(--pos-maroon) 25%, transparent) !important;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--pos-maroon) 22%, transparent) !important;
}

.pos-grand-total,
.si-app .si-grand {
  background: var(--pos-chip-grad) !important;
}

.pos-category-chip.is-active,
.si-app .si-category-chip.is-active {
  background: var(--pos-chip-grad) !important;
  border-color: transparent !important;
}

.pos-chip-accent,
.pos-btn-save-print,
.pos-btn-pay {
  background: var(--pos-chip-grad) !important;
  border-color: var(--pos-maroon) !important;
}

.pos-modules-strip__link.is-active {
  background: var(--pos-soft-grad) !important;
  border-color: var(--pos-pink-mid) !important;
  color: var(--pos-maroon) !important;
}

.pos-pay-tab.is-active,
.si-app .si-pay-tab.is-active {
  background: var(--pos-maroon) !important;
  border-color: var(--pos-maroon) !important;
}

.bq-badge-paid {
  background: #ecfdf5 !important;
  color: #047857 !important;
}

.bq-badge-warning {
  background: #fff7ed !important;
  color: #c2410c !important;
}

.bq-badge-info {
  background: var(--pos-pink-soft) !important;
  color: var(--pos-maroon) !important;
}

/* Login */
.gc-login .gc-card-head,
.gc-login .gc-btn-primary {
  background: var(--pos-chip-grad) !important;
}

.gc-login .gc-link,
.gc-login a {
  color: var(--pos-maroon) !important;
}

/* Section headers */
.si-section-head,
.bq-panel-head {
  background: var(--pos-panel-head-bg) !important;
}

/* Focus rings */
.pos-input:focus,
.bq-form-control:focus,
.pos-search-field__input:focus,
.pos-search-bar:focus-within,
.pos-mini-input:focus,
.gc-input:focus {
  border-color: var(--pos-maroon-light) !important;
  box-shadow: 0 0 0 3px var(--pos-focus-ring) !important;
}

input:not([type='checkbox']):not([type='radio']):not([type='button']):not([type='submit']):not([type='reset']):not([disabled]):not([readonly]),
textarea:not([disabled]):not([readonly]),
select:not([disabled]) {
  pointer-events: auto !important;
  -webkit-user-select: auto;
  user-select: auto;
  cursor: auto;
}

select:not([disabled]):not(.pos-mini-select) {
  cursor: pointer;
  -webkit-appearance: auto;
  appearance: auto;
}

.pos-search-bar {
  box-shadow: 0 1px 3px color-mix(in srgb, var(--pos-maroon) 8%, transparent) !important;
}

.pos-search-bar:focus-within {
  box-shadow: 0 0 0 4px var(--pos-focus-ring) !important;
}

.pos-search-field__input {
  padding-left: 4px;
}

.pos-category-thumb,
.pos-product-card-thumb {
  color: var(--pos-maroon);
  font-weight: 700;
}

.pos-product-card em {
  color: var(--pos-maroon);
}

/* Workspace switcher — portal-aware active chip */
.bq-workspace-btn.is-active {
  background: var(--pos-maroon) !important;
  border-color: var(--pos-maroon) !important;
  color: #fff !important;
}

.bq-workspace-current {
  color: var(--pos-maroon);
}

body[data-pos-theme='bilvo-billing'] .bq-workspace-bar {
  border-bottom-color: var(--pos-border);
}

body[data-pos-theme='bilvo-billing'] .pos-nav-link.is-active,
body[data-pos-theme='bilvo-product'] .pos-nav-link.is-active {
  background: rgba(255, 255, 255, 0.16);
}

/* Accent KPI cards — solid theme + white text (fixes unreadable dark-on-dark) */
.bq-stat-card.is-accent,
.bp-desk-stat--accent,
.bq-reports-app .bq-stat-card.is-accent,
.bq-product-reports-app .bq-stat-card.is-accent,
body[data-pos-theme] .bq-product-reports-app .bq-stat-card.is-accent {
  background: var(--pos-chip-grad) !important;
  border-color: transparent !important;
  color: #fff !important;
}

.bq-stat-card.is-accent .bq-stat-label,
.bq-stat-card.is-accent .bq-stat-value,
.bq-stat-card.is-accent .bq-stat-note,
.bq-reports-app .bq-stat-card.is-accent .bq-stat-label,
.bq-reports-app .bq-stat-card.is-accent .bq-stat-value,
.bq-reports-app .bq-stat-card.is-accent .bq-stat-note,
.bq-product-reports-app .bq-stat-card.is-accent .bq-stat-label,
.bq-product-reports-app .bq-stat-card.is-accent .bq-stat-value,
.bq-product-reports-app .bq-stat-card.is-accent .bq-stat-note,
body[data-pos-theme] .bq-product-reports-app .bq-stat-card.is-accent .bq-stat-label,
body[data-pos-theme] .bq-product-reports-app .bq-stat-card.is-accent .bq-stat-value,
body[data-pos-theme] .bq-product-reports-app .bq-stat-card.is-accent .bq-stat-note {
  color: #fff !important;
}

.bq-stat-card.is-accent .bq-stat-label,
.bq-reports-app .bq-stat-card.is-accent .bq-stat-label,
.bq-product-reports-app .bq-stat-card.is-accent .bq-stat-label {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* Module / product icon tiles follow portal */
.bq-module-icon,
.bq-product-thumb,
.bq-thumb-placeholder,
.pos-sidebar-card {
  background: var(--pos-icon-grad) !important;
  color: var(--pos-maroon-dark) !important;
}

.bq-module-card:hover {
  box-shadow: 0 12px 32px color-mix(in srgb, var(--pos-maroon) 14%, transparent) !important;
}

/* POS category active glow */
.pos-category-card.is-active {
  border-color: var(--pos-maroon) !important;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--pos-maroon) 22%, transparent) !important;
}

/* Sidebar submenu active — theme color, not boutique pink */
.pos-nav-sublink.is-active {
  background: #fff !important;
  color: var(--pos-maroon-dark) !important;
}

.pos-nav-sublink.is-active .pos-nav-sublink-icon {
  background: var(--pos-soft-grad) !important;
  color: var(--pos-maroon) !important;
}

/* Reports section chrome — drop pink leftovers */
.bq-reports-section-head {
  border-color: color-mix(in srgb, var(--pos-maroon) 12%, transparent) !important;
  border-left-color: var(--pos-maroon) !important;
  background: var(--pos-card) !important;
}

.bq-reports-section-head h2 {
  color: var(--pos-maroon) !important;
}

.bq-reports-section-head h2 i {
  background: var(--pos-soft-grad) !important;
  color: var(--pos-maroon) !important;
}

.bq-reports-app .bq-stat-icon,
.bq-reports-kpi.is-highlight {
  background: var(--pos-soft-grad) !important;
  border-color: color-mix(in srgb, var(--pos-maroon) 18%, transparent) !important;
}

.bq-reports-kpi.is-highlight strong,
.bq-reports-footnote a,
.bq-reports-pill i {
  color: var(--pos-maroon) !important;
}

.bq-report-table-toolbar {
  background: var(--pos-panel-head-bg) !important;
}

.bq-flash-info {
  background: var(--pos-pink-soft) !important;
  color: var(--pos-maroon) !important;
}

.bq-reports-app .bq-panel-head {
    padding: 10px 14px !important;
}

.bq-reports-app .bq-panel-head h2,
.bq-reports-app .bq-panel-head h3 {
    color: var(--pos-text) !important;
    margin: 0;
}

.bq-reports-app .bq-table th {
    padding: 8px 10px;
    color: var(--pos-muted);
}

.bq-reports-app .bq-table td {
    padding: 8px 10px;
    color: var(--pos-text);
}

.bq-reports-app .bq-stat-card:not(.is-accent) .bq-stat-value {
    color: var(--pos-maroon);
}

.gc-login .gc-btn-primary,
.gc-login button[type='submit'] {
  background: var(--pos-chip-grad) !important;
  border-color: transparent !important;
}

body[data-pos-theme='bilvo-billing'] .gc-login__subtitle,
body[data-pos-theme='bilvo-product'] .gc-login__subtitle {
  color: var(--pos-muted);
}

/* Primary Add/Save and Delete — always readable on both desks */
.pos-chip-btn.pos-chip-accent,
a.pos-chip-btn.pos-chip-accent,
.pos-chip-accent,
.pos-input-btn:not(.pos-input-btn-outline):not(.pos-input-btn--camera),
.pos-btn-save,
.pos-btn-pay,
.pos-btn-save-print {
  background: var(--pos-maroon-dark) !important;
  background-image: linear-gradient(145deg, var(--pos-maroon) 0%, var(--pos-maroon-dark) 100%) !important;
  border-color: var(--pos-maroon-dark) !important;
  color: #fff !important;
}

.pos-chip-btn.pos-chip-accent:hover,
a.pos-chip-btn.pos-chip-accent:hover,
.pos-input-btn:not(.pos-input-btn-outline):not(.pos-input-btn--camera):hover {
  filter: brightness(1.08);
  color: #fff !important;
}

.pos-chip-btn.bq-btn-danger,
.pc-btn-danger,
.pos-chip-btn.pc-btn-danger {
  background: #b42318 !important;
  border-color: #912018 !important;
  color: #fff !important;
}

.pos-chip-btn.bq-btn-danger:hover,
.pc-btn-danger:hover,
.pos-chip-btn.pc-btn-danger:hover {
  background: #912018 !important;
  color: #fff !important;
}