/* bengkel-app theme stabilization layer */

body.th-malam,
body.th-dark {
  color-scheme: dark;
  --bm-dark-bg: #0b0f18;
  --bm-dark-surface: #141a28;
  --bm-dark-surface-raised: #1b2333;
  --bm-dark-surface-soft: #222c40;
  --bm-dark-text: #edf2ff;
  --bm-dark-muted: #aab5cb;
  --bm-dark-border: rgba(177, 194, 224, .18);
  --bm-dark-divider: rgba(177, 194, 224, .12);
  --bm-dark-shadow: 0 12px 32px rgba(0, 0, 0, .32);
  --bg: var(--bm-dark-bg) !important;
  --card: var(--bm-dark-surface) !important;
  --th-bg: var(--bm-dark-bg) !important;
  --th-nav: #0d1320 !important;
  --th-nav-text: var(--bm-dark-muted) !important;
  --th-nav-border: var(--bm-dark-divider) !important;
  --th-card: var(--bm-dark-surface) !important;
  --th-card-base-bg: var(--bm-dark-surface) !important;
  --th-text: var(--bm-dark-text) !important;
  --th-sub: var(--bm-dark-muted) !important;
  --th-muted: var(--bm-dark-muted) !important;
  --th-item-bg: var(--bm-dark-surface-raised) !important;
  --th-item-border: var(--bm-dark-border) !important;
  --th-inline-bg: #101624 !important;
  --th-popup-bg: var(--bm-dark-surface) !important;
  --th-popup-header-bg: var(--bm-dark-surface-raised) !important;
  --th-sheet-bg: var(--bm-dark-surface) !important;
  --th-confirm-bg: var(--bm-dark-surface) !important;
  --th-save-bg: var(--bm-dark-surface-raised) !important;
  --th-close-bg: var(--bm-dark-surface-soft) !important;
  background: var(--bm-dark-bg) !important;
  color: var(--bm-dark-text) !important;
}

body.th-malam main,
body.th-dark main,
body.th-malam #app,
body.th-dark #app,
body.th-malam .app-shell,
body.th-dark .app-shell,
body.th-malam .page-shell,
body.th-dark .page-shell {
  background: transparent !important;
  color: var(--bm-dark-text) !important;
}

body.th-malam .card,
body.th-dark .card,
body.th-malam .panel,
body.th-dark .panel,
body.th-malam .card-panel,
body.th-dark .card-panel,
body.th-malam .chart-card,
body.th-dark .chart-card,
body.th-malam .stats-card,
body.th-dark .stats-card,
body.th-malam .summary-card,
body.th-dark .summary-card,
body.th-malam .filter-card,
body.th-dark .filter-card,
body.th-malam .hero-card,
body.th-dark .hero-card,
body.th-malam .price-card,
body.th-dark .price-card,
body.th-malam .prod-card,
body.th-dark .prod-card,
body.th-malam .list-item,
body.th-dark .list-item,
body.th-malam .item-row,
body.th-dark .item-row,
body.th-malam .table-wrap,
body.th-dark .table-wrap,
body.th-malam .table-card,
body.th-dark .table-card,
body.th-malam .entry-form,
body.th-dark .entry-form,
body.th-malam .form-card,
body.th-dark .form-card {
  background: var(--bm-dark-surface) !important;
  color: var(--bm-dark-text) !important;
  border-color: var(--bm-dark-border) !important;
  box-shadow: var(--bm-dark-shadow) !important;
}

body.th-malam .card-header,
body.th-dark .card-header,
body.th-malam .modal-header,
body.th-dark .modal-header,
body.th-malam .popup-header,
body.th-dark .popup-header,
body.th-malam .sheet-header,
body.th-dark .sheet-header,
body.th-malam .table-header,
body.th-dark .table-header,
body.th-malam thead,
body.th-dark thead {
  background: var(--bm-dark-surface-raised) !important;
  color: var(--bm-dark-text) !important;
  border-color: var(--bm-dark-divider) !important;
}

body.th-malam .menu-item,
body.th-dark .menu-item,
body.th-malam .tp-item,
body.th-dark .tp-item,
body.th-malam .nav-item,
body.th-dark .nav-item,
body.th-malam .fab-item,
body.th-dark .fab-item,
body.th-malam .opt-item,
body.th-dark .opt-item,
body.th-malam .popup-item,
body.th-dark .popup-item,
body.th-malam .sheet-item-row,
body.th-dark .sheet-item-row,
body.th-malam .list-row,
body.th-dark .list-row {
  background: var(--bm-dark-surface-raised) !important;
  color: var(--bm-dark-text) !important;
  border-color: var(--bm-dark-border) !important;
}

body.th-malam .menu-item:active,
body.th-dark .menu-item:active,
body.th-malam .tp-item:active,
body.th-dark .tp-item:active,
body.th-malam .nav-item:active,
body.th-dark .nav-item:active,
body.th-malam .list-item:active,
body.th-dark .list-item:active {
  background: var(--bm-dark-surface-soft) !important;
}

body.th-malam input,
body.th-dark input,
body.th-malam select,
body.th-dark select,
body.th-malam textarea,
body.th-dark textarea,
body.th-malam .search-input,
body.th-dark .search-input,
body.th-malam .stock-input,
body.th-dark .stock-input,
body.th-malam .edit-input,
body.th-dark .edit-input,
body.th-malam .popup-input,
body.th-dark .popup-input {
  background: #101624 !important;
  color: var(--bm-dark-text) !important;
  border-color: var(--bm-dark-border) !important;
  caret-color: #8ab4ff;
}

body.th-malam input::placeholder,
body.th-dark input::placeholder,
body.th-malam textarea::placeholder,
body.th-dark textarea::placeholder,
body.th-malam .search-input::placeholder,
body.th-dark .search-input::placeholder {
  color: #8692aa !important;
  opacity: 1;
}

body.th-malam table,
body.th-dark table,
body.th-malam tbody,
body.th-dark tbody,
body.th-malam tr,
body.th-dark tr,
body.th-malam td,
body.th-dark td,
body.th-malam th,
body.th-dark th {
  color: var(--bm-dark-text) !important;
  border-color: var(--bm-dark-divider) !important;
}

body.th-malam tbody tr:nth-child(even),
body.th-dark tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, .025) !important;
}

body.th-malam .muted,
body.th-dark .muted,
body.th-malam .text-muted,
body.th-dark .text-muted,
body.th-malam .sub,
body.th-dark .sub,
body.th-malam .subtitle,
body.th-dark .subtitle,
body.th-malam .meta,
body.th-dark .meta,
body.th-malam .card-meta,
body.th-dark .card-meta,
body.th-malam .card-note,
body.th-dark .card-note,
body.th-malam .empty,
body.th-dark .empty,
body.th-malam .empty-state,
body.th-dark .empty-state,
body.th-malam .summary-empty,
body.th-dark .summary-empty,
body.th-malam small,
body.th-dark small {
  color: var(--bm-dark-muted) !important;
}

body.th-malam label,
body.th-dark label,
body.th-malam .card-title,
body.th-dark .card-title,
body.th-malam .section-title,
body.th-dark .section-title,
body.th-malam .title,
body.th-dark .title,
body.th-malam .item-name,
body.th-dark .item-name,
body.th-malam .sheet-item-name,
body.th-dark .sheet-item-name {
  color: var(--bm-dark-text) !important;
}

body.th-malam .btn-secondary,
body.th-dark .btn-secondary,
body.th-malam .btn-ghost,
body.th-dark .btn-ghost,
body.th-malam .ghost,
body.th-dark .ghost,
body.th-malam .cancel,
body.th-dark .cancel,
body.th-malam .btnCancel,
body.th-dark .btnCancel,
body.th-malam .filter-btn,
body.th-dark .filter-btn,
body.th-malam .month-btn,
body.th-dark .month-btn,
body.th-malam .tab-btn,
body.th-dark .tab-btn,
body.th-malam .sheet-btn.cancel,
body.th-dark .sheet-btn.cancel,
body.th-malam .confirm-btn.cancel,
body.th-dark .confirm-btn.cancel {
  background: var(--bm-dark-surface-soft) !important;
  color: var(--bm-dark-text) !important;
  border-color: var(--bm-dark-border) !important;
}

body.th-malam .navbar,
body.th-dark .navbar,
body.th-malam .bottom-nav,
body.th-dark .bottom-nav,
body.th-malam .bottom-bar,
body.th-dark .bottom-bar {
  background: rgba(9, 13, 22, .96) !important;
  color: var(--bm-dark-text) !important;
  border-color: var(--bm-dark-divider) !important;
  box-shadow: 0 -10px 28px rgba(0, 0, 0, .24) !important;
}

body.th-malam .navbar .nav-item,
body.th-dark .navbar .nav-item,
body.th-malam .bottom-nav .nav-item,
body.th-dark .bottom-nav .nav-item {
  background: transparent !important;
  color: var(--bm-dark-muted) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

body.th-malam .navbar .nav-item.active,
body.th-dark .navbar .nav-item.active,
body.th-malam .bottom-nav .nav-item.active,
body.th-dark .bottom-nav .nav-item.active {
  color: #8ab4ff !important;
}

body.th-malam .header::before,
body.th-dark .header::before {
  opacity: .10 !important;
}

body.th-malam .popup-card,
body.th-dark .popup-card,
body.th-malam .modal-card,
body.th-dark .modal-card,
body.th-malam .dialog,
body.th-dark .dialog,
body.th-malam .bottom-sheet,
body.th-dark .bottom-sheet,
body.th-malam .theme-panel-card,
body.th-dark .theme-panel-card {
  background: var(--bm-dark-surface) !important;
  color: var(--bm-dark-text) !important;
  border-color: var(--bm-dark-border) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .48) !important;
}

body.th-malam .overlay,
body.th-dark .overlay,
body.th-malam .modal-backdrop,
body.th-dark .modal-backdrop,
body.th-malam .popup-backdrop,
body.th-dark .popup-backdrop,
body.th-malam .theme-panel-overlay,
body.th-dark .theme-panel-overlay {
  background: rgba(1, 4, 10, .72) !important;
}

body.th-malam hr,
body.th-dark hr,
body.th-malam .divider,
body.th-dark .divider {
  border-color: var(--bm-dark-divider) !important;
  background-color: var(--bm-dark-divider) !important;
}

@media (prefers-reduced-motion: reduce) {
  body.th-malam *,
  body.th-dark * {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}
