/**
 * Dark / Deep Blue content surfaces.
 * Loaded last so it beats page <style> blocks and #fff !important.
 * Light mode is untouched. Deep Blue remaps --pt-* via panel-theme.css.
 */

html.dark-mode #page_layout .card:not(.telegram-card):not(.push-card),
html.dark-mode #page_layout .card:not(.telegram-card):not(.push-card) > .card-header,
html.dark-mode #page_layout .card:not(.telegram-card):not(.push-card) > .card-body,
html.dark-mode #page_layout .card:not(.telegram-card):not(.push-card) > .card-footer,
html.dark-mode #panel-ajax-content .card:not(.telegram-card):not(.push-card),
html.dark-mode #panel-ajax-content .card:not(.telegram-card):not(.push-card) > .card-header,
html.dark-mode #panel-ajax-content .card:not(.telegram-card):not(.push-card) > .card-body,
html.dark-mode #panel-ajax-content .card:not(.telegram-card):not(.push-card) > .card-footer {
  background: var(--pt-surface, #1e293b) !important;
  background-image: none !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode #page_layout .card-title,
html.dark-mode #page_layout h1,
html.dark-mode #page_layout h2,
html.dark-mode #page_layout h3,
html.dark-mode #page_layout h4,
html.dark-mode #page_layout h5,
html.dark-mode #page_layout h6,
html.dark-mode #panel-ajax-content .card-title,
html.dark-mode #panel-ajax-content h1,
html.dark-mode #panel-ajax-content h2,
html.dark-mode #panel-ajax-content h3,
html.dark-mode #panel-ajax-content h4,
html.dark-mode #panel-ajax-content h5,
html.dark-mode #panel-ajax-content h6 {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #page_layout .text-muted,
html.dark-mode #page_layout .text-secondary,
html.dark-mode #page_layout .text-body-secondary,
html.dark-mode #panel-ajax-content .text-muted,
html.dark-mode #panel-ajax-content .text-secondary,
html.dark-mode #panel-ajax-content .text-body-secondary {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode #page_layout .form-control,
html.dark-mode #page_layout .form-select,
html.dark-mode #page_layout input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]),
html.dark-mode #page_layout textarea,
html.dark-mode #page_layout select,
html.dark-mode #panel-ajax-content .form-control,
html.dark-mode #panel-ajax-content .form-select,
html.dark-mode #panel-ajax-content input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]),
html.dark-mode #panel-ajax-content textarea,
html.dark-mode #panel-ajax-content select {
  background: var(--pt-input, #0f172a) !important;
  background-image: none !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode #page_layout .form-control::placeholder,
html.dark-mode #page_layout input::placeholder,
html.dark-mode #page_layout textarea::placeholder,
html.dark-mode #panel-ajax-content .form-control::placeholder,
html.dark-mode #panel-ajax-content input::placeholder,
html.dark-mode #panel-ajax-content textarea::placeholder {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode #page_layout .table,
html.dark-mode #page_layout .table > :not(caption) > * > *,
html.dark-mode #panel-ajax-content .table,
html.dark-mode #panel-ajax-content .table > :not(caption) > * > * {
  --bs-table-bg: var(--pt-surface, #1e293b);
  --bs-table-striped-bg: var(--pt-surface-2, #273449);
  --bs-table-hover-bg: var(--pt-surface-2, #273449);
  --bs-table-color: var(--pt-text, #e2e8f0);
  --bs-table-striped-color: var(--pt-text, #e2e8f0);
  --bs-table-hover-color: var(--pt-text, #e2e8f0);
  --bs-table-border-color: var(--pt-border, rgba(148, 163, 184, 0.32));
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  background-color: transparent !important;
}

html.dark-mode #page_layout .table thead,
html.dark-mode #page_layout .table thead th,
html.dark-mode #page_layout .table-light,
html.dark-mode #page_layout .table-light > :not(caption) > * > *,
html.dark-mode #panel-ajax-content .table thead,
html.dark-mode #panel-ajax-content .table thead th,
html.dark-mode #panel-ajax-content .table-light,
html.dark-mode #panel-ajax-content .table-light > :not(caption) > * > * {
  --bs-table-bg: var(--pt-surface-2, #273449) !important;
  --bs-table-color: var(--pt-text, #e2e8f0) !important;
  background-color: var(--pt-surface-2, #273449) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #page_layout .table tbody tr,
html.dark-mode #page_layout .table tbody td,
html.dark-mode #panel-ajax-content .table tbody tr,
html.dark-mode #panel-ajax-content .table tbody td {
  background-color: var(--pt-surface, #1e293b) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #page_layout .table tbody tr:nth-child(even),
html.dark-mode #panel-ajax-content .table tbody tr:nth-child(even) {
  background-color: var(--pt-surface-2, #273449) !important;
}

html.dark-mode #page_layout .nav-tabs .nav-link,
html.dark-mode #page_layout .nav-pills .nav-link,
html.dark-mode #panel-ajax-content .nav-tabs .nav-link,
html.dark-mode #panel-ajax-content .nav-pills .nav-link {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #page_layout .list-group-item,
html.dark-mode #panel-ajax-content .list-group-item {
  background: var(--pt-surface, #1e293b) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

/* ---------- New Order ---------- */
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .neworder-top,
html.dark-mode body.orders-create-page #page_layout .neworder-top {
  background: var(--pt-surface, #1e293b) !important;
  background-color: var(--pt-surface, #1e293b) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .neworder-top .input-wrapper,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .neworder-top #input_service3,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .neworder-top #input_service3:focus,
html.dark-mode body.orders-create-page #page_layout .neworder-top .input-wrapper,
html.dark-mode body.orders-create-page #page_layout .neworder-top #input_service3,
html.dark-mode body.orders-create-page #page_layout .neworder-top #input_service3:focus {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  box-shadow: none !important;
}

html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .neworder-top #input_service3::placeholder,
html.dark-mode body.orders-create-page #page_layout .neworder-top #input_service3::placeholder {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode #minmax,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #minmax,
html.dark-mode body.orders-create-page #minmax {
  background: transparent !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #minmax span,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #minmax span,
html.dark-mode body.orders-create-page #minmax span {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode #minmax span span,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #minmax span span,
html.dark-mode body.orders-create-page #minmax span span {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #minmax .fa-arrow-down,
html.dark-mode body.orders-create-page #minmax .fa-arrow-down {
  color: #f87171 !important;
}

html.dark-mode #minmax .fa-arrow-up,
html.dark-mode body.orders-create-page #minmax .fa-arrow-up {
  color: #4ade80 !important;
}

html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .des-neworder > .card.card-des,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .des-neworder .des-info-card,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .orders-create-left-col > .des-neworder > .card.card-des,
html.dark-mode body.orders-create-page #page_layout .des-neworder .des-info-card,
html.dark-mode body.orders-create-page #page_layout .des-neworder > .card.card-des {
  background: var(--pt-surface, #1e293b) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  color: var(--pt-text, #e2e8f0) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .des-neworder .des-info-card label,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .des-neworder .des-info-card .text,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout #service-title-box,
html.dark-mode body.orders-create-page #page_layout .des-neworder .des-info-card label,
html.dark-mode body.orders-create-page #page_layout .des-neworder .des-info-card .text,
html.dark-mode body.orders-create-page #page_layout #service-title-box {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .select2-dropdown,
html.dark-mode .select2-container--default .select2-results__option,
html.dark-mode .select2-container--bootstrap4 .select2-results__option,
html.dark-mode .select2-container--bootstrap4 .select2-dropdown {
  background: var(--pt-surface, #1e293b) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .select2-container--bootstrap4 .select2-selection--single,
html.dark-mode .select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered,
html.dark-mode .select2-container--bootstrap4.select2-container--open .select2-selection--single,
html.dark-mode .select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered span {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode #search-results-dropdown {
  background: var(--pt-surface, #1e293b) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode #search-results-dropdown .search-result-item {
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

/* ---------- AI Recommended ---------- */
html.dark-mode .ai-recommended-page .services-column {
  background: var(--pt-surface, #1e293b) !important;
  color: var(--pt-text, #e2e8f0) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode .ai-recommended-page .column-header {
  border-bottom-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .ai-recommended-page .column-header h3 {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .ai-recommended-page .services-table thead,
html.dark-mode .ai-recommended-page .services-table thead th {
  background: var(--pt-surface-2, #273449) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-bottom-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .ai-recommended-page .services-table tbody tr,
html.dark-mode .ai-recommended-page .services-table tbody tr:nth-child(odd),
html.dark-mode .ai-recommended-page .services-table tbody tr:nth-child(even) {
  background: var(--pt-surface, #1e293b) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .ai-recommended-page .services-table tbody tr:nth-child(even) {
  background: var(--pt-surface-2, #273449) !important;
}

html.dark-mode .ai-recommended-page .services-table tbody tr:hover {
  background: rgba(58, 87, 232, 0.18) !important;
}

html.dark-mode .ai-recommended-page .services-table tbody td,
html.dark-mode .ai-recommended-page .service-title,
html.dark-mode .ai-recommended-page .service-content {
  color: var(--pt-text, #e2e8f0) !important;
}

@media (max-width: 768px) {
  html.dark-mode .ai-recommended-page .services-table tbody tr,
  html.dark-mode .ai-recommended-page .services-table tbody tr:nth-child(even),
  html.dark-mode .ai-recommended-page .services-table tbody tr:nth-child(odd) {
    background: var(--pt-surface, #1e293b) !important;
  }
}

/* ---------- Orders list ---------- */
html.dark-mode #panel-ajax-content[data-panel-page="orders.index"] .oc-item,
html.dark-mode body.orders-index-page .oc-item,
html.dark-mode .orders-wrapper .oc-item {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #panel-ajax-content[data-panel-page="orders.index"] .oc-item .text,
html.dark-mode #panel-ajax-content[data-panel-page="orders.index"] .oc-item span,
html.dark-mode body.orders-index-page .oc-item .text,
html.dark-mode body.orders-index-page .oc-item span {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .date-header > div,
html.dark-mode #panel-ajax-content[data-panel-page="orders.index"] .date-header > div {
  background-color: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .date-header span[style*="font-weight:600"],
html.dark-mode #panel-ajax-content[data-panel-page="orders.index"] .date-header span {
  color: var(--pt-text, #e2e8f0) !important;
}

/* ---------- Tickets ---------- */
html.dark-mode .support-card {
  background: var(--pt-surface, #1e293b) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .support-card-content h5,
html.dark-mode .support-card-content p {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #contact3 {
  background: var(--pt-surface, #1e293b) !important;
}

html.dark-mode #contact3 .card-header6 {
  background-color: var(--pt-surface-2, #273449) !important;
}

html.dark-mode #contact3 .card-header6 .card-head-icon {
  background-color: var(--pt-input, #0f172a) !important;
}

html.dark-mode #contact3 label,
html.dark-mode body.tickets-index-page label {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode #contact3 input[type="text"],
html.dark-mode #contact3 input[type="email"],
html.dark-mode #contact3 input[type="number"],
html.dark-mode #contact3 input[type="file"],
html.dark-mode #contact3 textarea,
html.dark-mode #contact3 select,
html.dark-mode #contact3 input[type="text"]:focus,
html.dark-mode #contact3 input[type="email"]:focus,
html.dark-mode #contact3 input[type="number"]:focus,
html.dark-mode #contact3 textarea:focus,
html.dark-mode #contact3 select:focus {
  background: var(--pt-input, #0f172a) !important;
  background-image: none !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode #page_layout .col-md-5 .card-body .ticket-item,
html.dark-mode body.tickets-index-page .ticket-item {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #page_layout .col-md-5 .card-body .ticket-item h6,
html.dark-mode #page_layout .col-md-5 .card-body .ticket-item .user-name,
html.dark-mode #page_layout .col-md-5 .card-body .ticket-item .d-block,
html.dark-mode body.tickets-index-page .ticket-item h6 {
  color: var(--pt-text, #e2e8f0) !important;
}

/* ---------- Affiliates ---------- */
html.dark-mode .affiliates-program-page .affiliate-overview-card .card-body {
  background: var(--pt-surface, #1e293b) !important;
  background-image: none !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .affiliates-program-page .affiliate-overview-card .card-body h5,
html.dark-mode .affiliates-program-page .affiliate-overview-card .card-body li,
html.dark-mode .affiliates-program-page .affiliate-overview-card .card-body strong,
html.dark-mode .affiliates-program-page .affiliate-overview-card .card-body ol,
html.dark-mode .affiliates-program-page .affiliate-overview-card .card-body ul {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .affiliates-program-page .affiliate-link-chip {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .affiliates-program-page .aft-box-row > .col-lg .aft-item {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .affiliates-program-page .affiliate-stats-card .card-header-ap {
  background: var(--pt-surface-2, #273449) !important;
}

/* ---------- Child Panel ---------- */
html.dark-mode .child-panel-page .cp-surface {
  background: transparent !important;
}

html.dark-mode .child-panel-page .cp-promo .card-body {
  background: var(--pt-surface, #1e293b) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode .child-panel-page .cp-promo-title {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: var(--pt-text, #e2e8f0) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .child-panel-page .cp-promo-kicker {
  color: #93c5fd !important;
  background: var(--pt-input, #0f172a) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .child-panel-page .cp-table-wrap {
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .child-panel-page .cp-table-wrap thead th,
html.dark-mode .child-panel-page .cp-table-wrap .table-light,
html.dark-mode .child-panel-page .cp-table-wrap .table-light th {
  background: var(--pt-surface-2, #273449) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .child-panel-page .cp-ns-display {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  box-shadow: inset 4px 0 0 0 #3a57e8 !important;
}

html.dark-mode .child-panel-page .cp-form label {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode .child-panel-page .cp-ns-copy.btn-light {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  color: #93c5fd !important;
}

/* ---------- Updates ---------- */
html.dark-mode body.updates-index-page .updates-platforms-search,
html.dark-mode #panel-ajax-content[data-panel-page="services.updateServices"] .updates-platforms-search {
  background: var(--pt-input, #0f172a) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode body.updates-index-page .updates-platforms-search .search-input,
html.dark-mode #panel-ajax-content[data-panel-page="services.updateServices"] .updates-platforms-search .search-input {
  background: transparent !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode body.updates-index-page .updates-platform-pill,
html.dark-mode #panel-ajax-content[data-panel-page="services.updateServices"] .updates-platform-pill {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode body.updates-index-page .updates-platform-pill.is-active,
html.dark-mode #panel-ajax-content[data-panel-page="services.updateServices"] .updates-platform-pill.is-active {
  background: #3b6cff !important;
  border-color: #3b6cff !important;
  color: #fff !important;
}

html.dark-mode body.updates-index-page .updates-category-field .select2-container--bootstrap4 .select2-selection--single,
html.dark-mode #panel-ajax-content[data-panel-page="services.updateServices"] .updates-category-field .select2-container--bootstrap4 .select2-selection--single,
html.dark-mode body.updates-index-page .updates-status-field .select2-container--bootstrap4 .select2-selection--single,
html.dark-mode #panel-ajax-content[data-panel-page="services.updateServices"] .updates-status-field .select2-container--bootstrap4 .select2-selection--single {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .update-card {
  background: var(--pt-surface, #1e293b) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  color: var(--pt-text, #e2e8f0) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode .container-fluid .input-group .form-control[style*="background-color"] {
  background-color: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .select-search.fab,
html.dark-mode select.select-search {
  background: var(--pt-surface-2, #273449) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

/* ---------- Notifications / Account tabs ---------- */
html.dark-mode .nav-link-settings {
  background: var(--pt-surface-2, #273449) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .nav-link-settings:hover {
  background: var(--pt-input, #0f172a) !important;
  color: #93c5fd !important;
}

html.dark-mode .nav-link-settings.active {
  background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%) !important;
  color: #fff !important;
}

html.dark-mode .notification-section {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .notification-item {
  background: var(--pt-surface, #1e293b) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .notification-info h6,
html.dark-mode .toggle-label {
  color: var(--pt-text, #e2e8f0) !important;
}

/* ---------- New Order: inner Cancel/Refill + description tiles ---------- */
html.dark-mode .desc-list,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .des-neworder .desc-list,
html.dark-mode body.orders-create-page #page_layout .des-neworder .desc-list {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .desc-list .text,
html.dark-mode .desc-list .text span {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #des2,
html.dark-mode .des-info-card--desc,
html.dark-mode .des-info-card--desc .form-group,
html.dark-mode .des-info-card--desc #service_description,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .des-neworder #des2,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] #page_layout .des-neworder .card.card-des > .card-body #des2,
html.dark-mode #panel-ajax-content[data-panel-page="orders.create"] .des-neworder #des2,
html.dark-mode body.orders-create-page #page_layout .des-neworder #des2 {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

/* ---------- Tickets: flush header that beats panel-responsive 2-ID rules ---------- */
html.dark-mode body.tickets-index-page #contact3,
html.dark-mode #panel-ajax-content[data-panel-page="tickets.index"] #contact3 {
  background: var(--pt-surface, #1e293b) !important;
}

html.dark-mode body.tickets-index-page #contact3 .card-header6,
html.dark-mode #panel-ajax-content[data-panel-page="tickets.index"] #contact3 .card-header6 {
  background-color: var(--pt-surface-2, #273449) !important;
}

html.dark-mode body.tickets-index-page #contact3 .card-header6 .card-head-icon,
html.dark-mode #panel-ajax-content[data-panel-page="tickets.index"] #contact3 .card-header6 .card-head-icon {
  background-color: var(--pt-input, #0f172a) !important;
}

html.dark-mode body.tickets-index-page #contact3 .card-header6 h3,
html.dark-mode #panel-ajax-content[data-panel-page="tickets.index"] #contact3 .card-header6 h3 {
  color: #93c5fd !important;
  -webkit-text-fill-color: #93c5fd !important;
}

/* ---------- Updates filter bar + date contrast ---------- */
html.dark-mode body.updates-index-page .updates-platforms,
html.dark-mode #panel-ajax-content[data-panel-page="services.updateServices"] .updates-platforms {
  background: var(--pt-surface, #1e293b) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode .update-card .op-date,
html.dark-mode .update-card .updates-date-badge {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .update-card .op-date i {
  color: #93c5fd !important;
}

/* ---------- Add Funds ---------- */
html.dark-mode #contact.balance-pay-form-shell,
html.dark-mode body.balances-create-page #contact.balance-pay-form-shell,
html.dark-mode #panel-ajax-content[data-panel-page="balances.create"] #contact.balance-pay-form-shell {
  background: var(--pt-surface, #1e293b) !important;
  background-color: var(--pt-surface, #1e293b) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

html.dark-mode body.balances-create-page .card-header2,
html.dark-mode #panel-ajax-content[data-panel-page="balances.create"] .card-header2 {
  background-color: var(--pt-surface-2, #273449) !important;
}

html.dark-mode body.balances-create-page .card-header2 h3,
html.dark-mode #panel-ajax-content[data-panel-page="balances.create"] .card-header2 h3 {
  color: #93c5fd !important;
  -webkit-text-fill-color: #93c5fd !important;
}

html.dark-mode .balance-payment-picker {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  box-shadow: none !important;
}

html.dark-mode .balance-payment-picker-title,
html.dark-mode .balance-payment-picker-sub,
html.dark-mode .balance-payment-picker-eyebrow {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .balance-payment-picker-sub {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode .payment-list .payment-box,
html.dark-mode .payment-list .payment-box.active,
html.dark-mode .payment-list .payment-box:hover {
  background: var(--pt-input, #0f172a) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .payment-list .payment-box.active {
  border-color: #3b82f6 !important;
}

html.dark-mode .payment-list .payment-icon > img:first-of-type,
html.dark-mode .payment-list .payment-brand {
  background: #f8fafc !important;
  border-radius: 10px !important;
  padding: 6px 10px !important;
}

html.dark-mode .payment-list .payment-brand-name {
  color: #0f172a !important;
}

html.dark-mode #contact #balance-pay-flow .addBalanceBtn {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode #contact #balance-pay-flow .addBalanceBtn.is-active {
  background: #155eef !important;
  color: #fff !important;
}

html.dark-mode .amount-growth-box,
html.dark-mode .balance-instruction-shell,
html.dark-mode #contact .balance-instruction-shell,
html.dark-mode #balance-pay-flow .balance-instruction-shell {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .balance-instruction-shell::before,
html.dark-mode #contact .balance-instruction-shell::before,
html.dark-mode #balance-pay-flow .balance-instruction-shell::before {
  background: var(--pt-surface, #1e293b) !important;
}

html.dark-mode .balance-instruction-title,
html.dark-mode .balance-instruction-eyebrow,
html.dark-mode .balance-instruction-lead,
html.dark-mode .balance-instruction-panel,
html.dark-mode .balance-instruction-panel p,
html.dark-mode .instruction-support,
html.dark-mode .instruction-support b,
html.dark-mode .instruction-note,
html.dark-mode #contact .balance-instruction-title,
html.dark-mode #contact .balance-instruction-panel,
html.dark-mode #contact .panel-body.balance-instruction-panel,
html.dark-mode #balance-pay-flow .balance-instruction-title,
html.dark-mode #balance-pay-flow .balance-instruction-panel,
html.dark-mode #balance-pay-flow .panel-body.balance-instruction-panel,
html.dark-mode #balance-pay-flow.is-open .balance-instruction-panel,
html.dark-mode #balance-pay-flow.is-open .balance-instruction-panel.panel-body,
html.dark-mode #balance-pay-flow.is-open .balance-instruction-panel p,
html.dark-mode #Cryptomus,
html.dark-mode #Heleket,
html.dark-mode #UltraPay {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .balance-instruction-lead,
html.dark-mode .instruction-note,
html.dark-mode #balance-pay-flow .instruction-note {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode .panel-body.balance-instruction-panel,
html.dark-mode .balance-instruction-panel.panel-body,
html.dark-mode #contact .panel-body.balance-instruction-panel,
html.dark-mode #balance-pay-flow .panel-body.balance-instruction-panel,
html.dark-mode #balance-pay-flow.is-open .balance-instruction-panel,
html.dark-mode #balance-pay-flow.is-open .balance-instruction-panel.panel-body,
html.dark-mode #Cryptomus.panel-body,
html.dark-mode #Heleket.panel-body,
html.dark-mode #UltraPay.panel-body {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .instruction-bonus-hero,
html.dark-mode #contact .instruction-bonus-hero,
html.dark-mode #Cryptomus .instruction-bonus-hero,
html.dark-mode #Heleket .instruction-bonus-hero,
html.dark-mode #UltraPay .instruction-bonus-hero {
  background: #78350f !important;
  color: #fde68a !important;
  border-color: rgba(251, 191, 36, 0.45) !important;
}

html.dark-mode .instruction-tier,
html.dark-mode #contact .instruction-tier,
html.dark-mode .instruction-bonus-grid .instruction-tier,
html.dark-mode #Cryptomus .instruction-tier,
html.dark-mode #Heleket .instruction-tier,
html.dark-mode #UltraPay .instruction-tier {
  background: #14532d !important;
  color: #dcfce7 !important;
  border-color: rgba(74, 222, 128, 0.35) !important;
}

html.dark-mode .instruction-tier-pct,
html.dark-mode .instruction-bonus-grid .instruction-tier-pct {
  color: #86efac !important;
}

html.dark-mode #messagesBox,
html.dark-mode #activityBox,
html.dark-mode .navbar .nav-item .toggle-body,
html.dark-mode .custom-message-card {
  background: var(--pt-surface, #1e293b) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4) !important;
}

html.dark-mode #messagesBox .tn-item,
html.dark-mode #activityBox .tn-item {
  border-bottom-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode #messagesBox .tn-date,
html.dark-mode #messagesBox .msg-date,
html.dark-mode #messagesBox .text-muted,
html.dark-mode #activityBox .tn-date,
html.dark-mode #activityBox .text-muted,
html.dark-mode #activityBox .activity-head {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode #messagesBox .tn-title,
html.dark-mode #messagesBox .tn-text,
html.dark-mode #messagesBox .msg-title,
html.dark-mode #messagesBox .msg-body,
html.dark-mode #activityBox .tn-title,
html.dark-mode #activityBox .tn-text {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #activityBox .activity-ico {
  background: rgba(148, 163, 184, 0.14) !important;
  color: #93c5fd !important;
}

html.dark-mode #activityBox .tn-item.is-unread {
  background: rgba(148, 163, 184, 0.08) !important;
}

html.dark-mode .p_card .control-label,
html.dark-mode .p_card label,
html.dark-mode .p_card .form-text,
html.dark-mode .p_card .text-muted {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode .p_card .form-text,
html.dark-mode .p_card .text-muted {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode .p_card #message.form-control,
html.dark-mode .p_card textarea.form-control,
html.dark-mode .p_card input.form-control,
html.dark-mode .p_card input[type="file"] {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode .p_card textarea.form-control::placeholder {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode #payments-history-card.payments-history-card,
html.dark-mode #payments-history-card .card-header,
html.dark-mode #payments-history-card .payments-history-card-body {
  background: var(--pt-surface, #1e293b) !important;
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #payments-history-card .pay-history-row.sc-sup-item {
  background: var(--pt-surface-2, #273449) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode #payments-history-card .pay-history-row .title {
  color: var(--pt-muted, #94a3b8) !important;
}

html.dark-mode #payments-history-card .pay-history-row .text {
  color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode #balance-pay-flow.is-open #amount.lradd,
html.dark-mode #balance-pay-flow.is-open input#amount {
  background: var(--pt-input, #0f172a) !important;
  color: var(--pt-text, #e2e8f0) !important;
  border-color: var(--pt-border, rgba(148, 163, 184, 0.32)) !important;
}

html.dark-mode body.orders-index-page a.oc-service,
html.dark-mode body.orders-index-page .oc-service,
html.dark-mode body.orders-index-page .oc-name,
html.dark-mode #panel-ajax-content[data-panel-page="orders.index"] a.oc-service,
html.dark-mode #panel-ajax-content[data-panel-page="orders.index"] .oc-service,
html.dark-mode #panel-ajax-content[data-panel-page="orders.index"] .oc-name {
  color: var(--pt-text, #e2e8f0) !important;
  -webkit-text-fill-color: var(--pt-text, #e2e8f0) !important;
}

html.dark-mode body.orders-index-page .oc-refill-icon,
html.dark-mode #panel-ajax-content[data-panel-page="orders.index"] .oc-refill-icon {
  color: #22c55e !important;
  -webkit-text-fill-color: #22c55e !important;
}