/*
  LeisureOS staging — dark-mode contrast repair v4.
  The v3 theme paints admin text pale but leaves some original dashboard
  statistic cards, menu actions, tab headers, and detail panels white.
  These overrides pair dark surfaces with pale text instead of whitening
  all children indiscriminately. Only active admin dark mode is affected.
*/

html[data-leisure-contrast="dark"] #appShell .view,
html[data-leisure-contrast="dark"] #appShell .view :is(
  .sales-stats article,.inventory-stats article,.expense-stats article,
  .pool-stats article,.booking-stats article,.report-metrics article,
  .metric-card,.panel,.table-card,.staff-card,.activity-feed,
  .admin-menu-item,.menu-category-row,.menu-category-panel,.menu-items-panel,
  .sales-table-wrap,.inventory-table-wrap,.expense-table-wrap,.pool-table-wrap,
  .booking-table-wrap,.report-card,.settings-panel,.settings-tabs,
  .subscription-summary-card,.brand-settings-card,.review-score,
  .staff-detail-metrics>div,.inventory-detail-metrics>div,
  .expense-detail-grid>div,.pool-detail-grid>div,.booking-detail-grid>div,
  .qr-settings-summary>div,.report-kpi-stack>div,
  .sale-summary-box,.booking-payment-summary>div,
  .detail-box,.report-data-notice,.notification-menu,.account-popover,
  .staff-sale-row,.staff-table-chip,.stock-recipe-row,
  .unassigned-card,.ops-card,.pool-box
) {
  background-color:#212c30!important;
  border-color:#45585c!important;
  color:#f1f7f5!important;
}

html[data-leisure-contrast="dark"] #appShell .view :is(
  .sales-stats article,.inventory-stats article,.expense-stats article,
  .pool-stats article,.booking-stats article,.report-metrics article,
  .metric-card,.panel,.report-card,.settings-panel,.brand-settings-card
) :is(h2,h3,h4,small,p,span,b,strong,div) {
  color:#f1f7f5!important;
}

/* Neutral sections, edit panels and captions with previously pale backgrounds. */
html[data-leisure-contrast="dark"] #appShell .view :is(
  .period-switch,.custom-period,.status-tab,.management-access,
  .capacity-control,.permission-manager-picker,.plan-inline-notice,
  .expense-detail-note,.expense-category-badge,.rank-no,
  .settings-row-actions button,.settings-tab:hover,.stock-recipe-row,
  .booking-payment-summary>div,.report-data-notice,.form-actions,
  .qr-settings-summary>div,.review-score,.staff-sale-row:hover
) {
  background:#2c3a3f!important;
  color:#f3f9f7!important;
  border-color:#596d71!important;
}
html[data-leisure-contrast="dark"] #appShell .view :is(
  .sales-filters input,.sales-filters select,
  .inventory-filters input,.inventory-filters select,
  .expense-filters input,.expense-filters select,
  .pool-filters input,.pool-filters select,
  .booking-filters input,.booking-filters select,
  .settings-form input,.settings-form select,
  .menu-items-toolbar input,.menu-items-toolbar select,
  .form-grid input,.form-grid select,.booking-payment-entry input,
  .booking-payment-entry select,.pool-payment-note input,
  .pool-payment-note select,.capacity-control input,
  .permission-manager-picker select
) {
  background:#2a383d!important;
  color:#f7fbfa!important;
  border-color:#607579!important;
  color-scheme:dark;
}
html[data-leisure-contrast="dark"] #appShell .view :is(
  .menu-category-row button,.admin-menu-item button,
  .stock-link-button,.settings-row-actions button,
  .view-sale-btn,.inventory-view-btn,.expense-view-btn,.pool-view-btn,.booking-view-btn,
  .close-btn,.text-btn,.ghost-btn
) {
  background:#324146!important;
  color:#f7fbfa!important;
  border-color:#6b7f83!important;
}
html[data-leisure-contrast="dark"] #appShell .view :is(
  .menu-category-row button,.admin-menu-item button,
  .stock-link-button,.settings-row-actions button
) * {
  color:#f7fbfa!important;
}

/* Table headers, hover rows and totals must remain distinguishable. */
html[data-leisure-contrast="dark"] #appShell .view :is(
  .sales-table thead th,.inventory-table thead th,
  .expense-table thead th,.pool-table thead th,
  .booking-table thead th,table thead th
) {
  background:#2b3b40!important;
  color:#f7fbfa!important;
  border-color:#53666a!important;
}
html[data-leisure-contrast="dark"] #appShell .view :is(
  .sales-table tbody tr:hover,.inventory-table tbody tr:hover,
  .expense-table tbody tr:hover,.pool-table tbody tr:hover,
  .booking-table tbody tr:hover,table tbody tr:hover
) {
  background:#29373c!important;
}
html[data-leisure-contrast="dark"] #appShell .view :is(
  .sale-summary-box,.report-kpi-stack>div,.staff-detail-metrics>div,
  .expense-detail-grid>div,.inventory-detail-metrics>div,
  .booking-detail-grid>div,.pool-detail-grid>div
) :is(span,strong,b,small,h3) {
  color:#f3f9f7!important;
}

/* Status indicators: distinguish categories without washed-out white chips. */
html[data-leisure-contrast="dark"] #appShell .view :is(
  .table-state,.role-badge,.status-badge,.stock-status,.stock-level,
  .pool-status-badge,.pool-payment-badge,.booking-status,
  .report-stock-status,.expense-category-badge,.pill
) {
  background:#35464a!important;
  color:#f6faf8!important;
  border:1px solid #64797d!important;
}
html[data-leisure-contrast="dark"] #appShell .view :is(
  .stock-status.low,.stock-status.out,.booking-status.pending,
  .booking-status.cancelled,.report-stock-status.low,.report-stock-status.out,
  .status-badge.part-payment,.attention-item.warning
) {
  background:#483526!important;
  color:#ffe2b2!important;
  border-color:#916a3d!important;
}

/* Disabled/secondary states and selected date period remain legible. */
html[data-leisure-contrast="dark"] #appShell .view :is(
  button[disabled],.settings-tab,.status-tab,.period-btn,.filter-chip
) {
  color:#dce8e6!important;
}
html[data-leisure-contrast="dark"] #appShell .view :is(
  .period-btn.active,.settings-tab.active,.status-tab.active
) {
  background:#0f181b!important;
  border-color:#839b9e!important;
  color:#fff!important;
}
html[data-leisure-contrast="dark"] #appShell .view :is(
  .period-btn.active,.settings-tab.active,.status-tab.active
) * {color:#fff!important}

/* Admin modals are outside .view in some dashboard versions. */
html[data-leisure-contrast="dark"] .modal-backdrop:not(#loginModal):not(#registerModal) :is(
  .modal-card,.detail-box,.sale-summary-box,.staff-detail-metrics>div,
  .inventory-detail-metrics>div,.expense-detail-grid>div,
  .booking-detail-grid>div,.pool-detail-grid>div,.expense-detail-note,
  .stock-recipe-row,.brand-settings-card,.form-actions
) {
  background:#222f33!important;
  border-color:#4e6367!important;
  color:#f2f8f6!important;
}
html[data-leisure-contrast="dark"] .modal-backdrop:not(#loginModal):not(#registerModal) :is(
  button:not(.primary-btn),input,select,textarea,.close-btn
) {
  background:#304045!important;
  color:#f5faf8!important;
  border-color:#687d81!important;
}
html[data-leisure-contrast="dark"] .modal-backdrop:not(#loginModal):not(#registerModal) :is(
  .primary-btn,.primary-btn *
) {
  background:#e6b94f!important;
  color:#151d1c!important;
}

/* Safeguard for any staging-only card classes that inherit a white background:
   an optional small script marks only offending surfaces or text.
   The names are deliberately scoped to the main operational dashboard. */
html[data-leisure-contrast="dark"] #appShell .view .lo-v4-surface.lo-v4-surface,
html[data-leisure-contrast="dark"] .modal-backdrop:not(#loginModal):not(#registerModal) .lo-v4-surface.lo-v4-surface {
  background-color:#263439!important;
  color:#f4f9f8!important;
}
html[data-leisure-contrast="dark"] #appShell .view .lo-v4-dark-ink.lo-v4-dark-ink.lo-v4-dark-ink,
html[data-leisure-contrast="dark"] .modal-backdrop:not(#loginModal):not(#registerModal) .lo-v4-dark-ink.lo-v4-dark-ink.lo-v4-dark-ink {
  color:#142023!important;
}
html[data-leisure-contrast="dark"] #appShell .view .lo-v4-light-ink.lo-v4-light-ink.lo-v4-light-ink,
html[data-leisure-contrast="dark"] .modal-backdrop:not(#loginModal):not(#registerModal) .lo-v4-light-ink.lo-v4-light-ink.lo-v4-light-ink {
  color:#f5faf9!important;
}

/* Preserve QR readability, colors of logos/photos/charts, and print output. */
html[data-leisure-contrast="dark"] #appShell .view .qr-code-box,
html[data-leisure-contrast="dark"] #appShell .view .qr-code-box * {
  background-color:#fff!important;
  color:#131818!important;
}
@media print {
  html[data-leisure-contrast="dark"] #appShell .view,
  html[data-leisure-contrast="dark"] #appShell .view *{
    color:#121818!important;
  }
  html[data-leisure-contrast="dark"] #appShell .view :is(article,.panel,.metric-card,td,th,.report-card) {
    background:#fff!important;
    color:#121818!important;
    border-color:#ddd!important;
  }
}