:root {
  color-scheme: dark;
  --app-bg: #111916;
  --app-surface: #1a2420;
  --app-surface-raised: #222e28;
  --app-surface-soft: #29372f;
  --app-text: #edf4ef;
  --app-muted: #a8b8ad;
  --app-border: #3a4b40;
  --app-accent: #70d6a9;
  --app-accent-strong: #39a77c;
  --app-danger: #ff9b91;
  --app-warning: #f0c27b;
}

html,
body {
  background: var(--app-bg) !important;
  color: var(--app-text) !important;
  color-scheme: dark;
}

body * {
  border-color: var(--app-border);
}

body :is(h1, h2, h3, h4, h5, h6, p, label, legend, th, td, li, dt, dd, span, strong, b, small, summary, .form-text, .breadcrumb-item, .page-link) {
  color: var(--app-text) !important;
}

body :is(.text-muted, .text-secondary, .text-body-secondary, .form-text, small, .small, .description, .help-text) {
  color: var(--app-muted) !important;
}

body a,
body .link-primary {
  color: var(--app-accent) !important;
}

body a:hover,
body .link-primary:hover {
  color: #a1edc8 !important;
}

body :is(.card, .modal-content, .dropdown-menu, .popover, .offcanvas, .list-group-item, .accordion-item, .accordion-body, .accordion-button, .toast, .app-notification, .alert-light, .bg-white, .bg-light, .table-responsive, .dataTables_wrapper, .dataTables_length, .dataTables_filter, .dataTables_info, .dataTables_paginate, .pagination) {
  background-color: var(--app-surface) !important;
  color: var(--app-text) !important;
  border-color: var(--app-border) !important;
}

body :is(.card-header, .card-footer, .modal-header, .modal-footer, .list-group-item, .accordion-button:not(.collapsed), .page-item .page-link) {
  background-color: var(--app-surface-raised) !important;
}

body :is(input, textarea, select, .form-control, .form-select, .custom-select, .custom-file-label, .input-group-text, .form-control:focus, .form-select:focus) {
  background-color: var(--app-surface-raised) !important;
  color: var(--app-text) !important;
  border-color: var(--app-border) !important;
}

body :is(input, textarea, select, .form-control, .form-select)::placeholder {
  color: #91a398 !important;
  opacity: 1;
}

body option {
  background: var(--app-surface-raised);
  color: var(--app-text);
}

body.mobile-dashboard-page .mobile-recharge-amount-field input {
  background-color: transparent !important;
  color: #f1f8f3 !important;
  text-align: left;
}

body.mobile-dashboard-page .mobile-recharge-amount-field input:focus-visible {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.mobile-dashboard-page .mobile-recharge-amount-field:focus-within {
  border-color: #3a5143;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2), inset 0 1px rgba(255, 255, 255, 0.025);
}

body.mobile-dashboard-page .mobile-withdraw-input-wrap input {
  background-color: transparent !important;
  color: #f1f8f3 !important;
}

body.mobile-dashboard-page .mobile-withdraw-input-wrap input:focus-visible {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

body :is(.table, table, .table > :not(caption) > *, .table-striped > tbody > tr:nth-of-type(odd) > *, .table-hover > tbody > tr:hover > *) {
  --bs-table-bg: var(--app-surface);
  --bs-table-color: var(--app-text);
  --bs-table-striped-bg: var(--app-surface-raised);
  --bs-table-striped-color: var(--app-text);
  --bs-table-hover-bg: var(--app-surface-soft);
  --bs-table-hover-color: var(--app-text);
  border-color: var(--app-border) !important;
  color: var(--app-text) !important;
}

body :is(.btn-primary, .public-login-submit) {
  background: var(--app-accent-strong) !important;
  border-color: var(--app-accent-strong) !important;
  color: #071b12 !important;
}

body :is(.btn-primary, .public-login-submit):hover {
  background: var(--app-accent) !important;
  border-color: var(--app-accent) !important;
}

body .btn-success {
  background: #25825e !important;
  border-color: #25825e !important;
  color: #fff !important;
}

body .btn-danger {
  background: #a8433d !important;
  border-color: #a8433d !important;
  color: #fff !important;
}

body .btn-warning {
  background: #d49a42 !important;
  border-color: #d49a42 !important;
  color: #211607 !important;
}

body :is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger, .btn-outline-dark) {
  background: transparent !important;
  border-color: var(--app-accent) !important;
  color: var(--app-accent) !important;
}

body :is(.alert-success, .alert-info) {
  background: #19392c !important;
  border-color: #286148 !important;
  color: #b9f0d1 !important;
}

body :is(.alert-danger, .alert-warning) {
  background: #3a2522 !important;
  border-color: #71413b !important;
  color: #ffd0c9 !important;
}

body dialog.app-dialog {
  background: transparent !important;
  border: 1px solid var(--app-border) !important;
  border-radius: 16px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.48);
  color: var(--app-text) !important;
  max-width: min(440px, calc(100vw - 32px));
  padding: 0;
  width: calc(100% - 32px);
}

body dialog.app-dialog::backdrop {
  background: rgba(3, 10, 6, 0.74);
  backdrop-filter: blur(4px);
}

body .app-dialog__panel {
  background: var(--app-surface-raised) !important;
  border-radius: inherit;
  padding: 22px;
}

body .app-dialog__title {
  color: var(--app-text) !important;
  font-size: 1.08rem;
}

body .app-dialog__message {
  color: var(--app-muted) !important;
  margin: 10px 0 22px;
}

body .app-dialog__button--secondary {
  background: var(--app-surface-soft) !important;
  border-color: var(--app-border) !important;
  color: var(--app-text) !important;
}

body .app-dialog__button--secondary:hover {
  background: #34453a !important;
  border-color: #597361 !important;
}

body .app-dialog__button--danger {
  background: #a8433d !important;
  border-color: #a8433d !important;
  color: #fff !important;
}

body .app-dialog__button--danger:hover {
  background: #c04f47 !important;
  border-color: #c04f47 !important;
}

body :is(.navbar, .header, .main-header, .main-sidebar, .sidebar, .student-dashboard-sidebar, .student-dashboard-topbar, .admin-sidebar, .content-wrapper, .main-footer, .footer) {
  background-color: var(--app-surface) !important;
  color: var(--app-text) !important;
  border-color: var(--app-border) !important;
}

body :is(.public-login-shell, .public-login-form-panel) {
  background: var(--app-surface) !important;
}

body.public-login-page.student-app-page .public-account-main {
  background: var(--app-bg) !important;
  color: var(--app-text) !important;
}

body.public-login-page.student-app-page .public-login-shell {
  background: var(--app-surface) !important;
  border-color: var(--app-border) !important;
  box-shadow: 0 22px 58px rgba(0, 0, 0, 0.38);
}

body.public-login-page.student-app-page .public-login-form-panel {
  background: var(--app-surface) !important;
}

body.public-login-page.student-app-page .public-login-brand {
  background: linear-gradient(145deg, #15251c, #1a4934 72%, #173528) !important;
}

body .public-login-brand :is(h1, p, small, strong, span, i) {
  color: #edf8f0 !important;
}

body .public-login-brand small,
body .public-login-brand p,
body .public-login-brand-footer {
  color: #b8d8c3 !important;
}

body .public-login-form :is(h2, label) {
  color: var(--app-text) !important;
}

body .public-login-subtitle {
  color: var(--app-muted) !important;
}

body .public-login-input {
  background: var(--app-surface-raised) !important;
  border-color: var(--app-border) !important;
  border-radius: 12px;
  min-height: 54px;
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

body .public-login-input:focus-within {
  border-color: var(--app-accent-strong) !important;
  box-shadow: 0 0 0 3px rgba(112, 214, 169, 0.15) !important;
}

body .public-login-input > i {
  color: var(--app-muted) !important;
  margin-left: 15px;
}

body .public-login-input input {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--app-text) !important;
  min-width: 0;
  padding: 15px 14px;
}

body .public-login-input input::placeholder {
  color: #91a398 !important;
  opacity: 1;
}

body .public-login-input input:focus-visible {
  outline: none !important;
}

body .signup-required {
  color: #ff7167 !important;
  font-size: 1rem;
  font-weight: 800;
  margin-left: 0.2rem;
}

body .signup-field-error {
  color: var(--app-danger) !important;
  display: block;
  min-height: 0;
  margin-top: 0.3rem;
}

body .signup-field-error:empty {
  display: none;
}

body [aria-invalid="true"] {
  border-color: var(--app-danger) !important;
}

body :focus-visible {
  outline: 2px solid var(--app-accent) !important;
  outline-offset: 2px;
}

body ::selection {
  background: #2c7656;
  color: #fff;
}

body.mobile-dashboard-page .withdraw-status-pending,
body.mobile-dashboard-page .mobile-recharge-status.is-pending,
body.mobile-dashboard-page .mobile-order-total-status .is-pending,
body.mobile-dashboard-page .mobile-order-total-status .is-processing {
  color: var(--app-warning) !important;
}

body.mobile-dashboard-page .withdraw-status-approved,
body.mobile-dashboard-page .mobile-team-member-status.is-active,
body.mobile-dashboard-page .mobile-recharge-status.is-successful,
body.mobile-dashboard-page .mobile-order-total-status .is-paid,
body.mobile-dashboard-page .mobile-order-total-status .is-completed,
body.mobile-dashboard-page .mobile-task-state.is-complete,
body.mobile-dashboard-page .mobile-task-stats strong.is-complete,
body.mobile-dashboard-page .mobile-product-dialog-metrics > div strong.is-positive,
body.mobile-dashboard-page .mobile-settings-message.is-success,
body.mobile-dashboard-page .mobile-account-image-message:not(.is-error) {
  color: var(--app-accent) !important;
}

body.mobile-dashboard-page .withdraw-status-rejected,
body.mobile-dashboard-page .mobile-recharge-status.is-failed,
body.mobile-dashboard-page .mobile-recharge-status.is-cancelled,
body.mobile-dashboard-page .mobile-order-total-status .is-cancelled,
body.mobile-dashboard-page .mobile-order-total-status .is-failed,
body.mobile-dashboard-page .mobile-settings-message.is-error,
body.mobile-dashboard-page .mobile-account-image-message.is-error {
  color: var(--app-danger) !important;
}

body.mobile-dashboard-page .mobile-recharge-unavailable,
body.mobile-dashboard-page .mobile-recharge-unavailable i {
  color: var(--app-warning) !important;
}

body.mobile-dashboard-page .withdraw-status-pending,
body.mobile-dashboard-page .mobile-recharge-status.is-pending,
body.mobile-dashboard-page .mobile-order-total-status .is-pending,
body.mobile-dashboard-page .mobile-order-total-status .is-processing,
body.mobile-dashboard-page .mobile-task-state {
  color: var(--app-warning) !important;
}

body.mobile-dashboard-page .withdraw-status-approved,
body.mobile-dashboard-page .mobile-team-member-status.is-active,
body.mobile-dashboard-page .mobile-recharge-status.is-successful,
body.mobile-dashboard-page .mobile-order-total-status .is-paid,
body.mobile-dashboard-page .mobile-order-total-status .is-completed,
body.mobile-dashboard-page .mobile-task-state.is-complete,
body.mobile-dashboard-page .mobile-task-stats strong.is-complete,
body.mobile-dashboard-page .mobile-product-dialog-metrics > div strong.is-positive,
body.mobile-dashboard-page .mobile-settings-message.is-success,
body.mobile-dashboard-page .mobile-account-image-message:not(.is-error) {
  color: var(--app-accent) !important;
}

body.mobile-dashboard-page .withdraw-status-rejected,
body.mobile-dashboard-page .mobile-recharge-status.is-failed,
body.mobile-dashboard-page .mobile-recharge-status.is-cancelled,
body.mobile-dashboard-page .mobile-order-total-status .is-cancelled,
body.mobile-dashboard-page .mobile-order-total-status .is-failed,
body.mobile-dashboard-page .mobile-settings-message.is-error,
body.mobile-dashboard-page .mobile-account-image-message.is-error {
  color: var(--app-danger) !important;
}

@media (max-width: 760px) {
  body .public-login-shell {
    background: var(--app-surface) !important;
    margin: 1rem auto;
    width: calc(100% - 24px);
  }

  body .public-login-brand {
    padding: 28px 24px;
  }

  body .public-login-form-panel {
    padding: 28px 24px;
  }
}

body .app-notification {
  align-items: center;
  background-color: var(--app-surface-raised) !important;
  border-color: var(--app-border) !important;
  border-left-color: var(--app-accent-strong) !important;
  color: var(--app-text) !important;
}

body .app-notification__message {
  color: var(--app-text) !important;
  min-width: 0;
  text-align: left;
}

body .app-notification__icon {
  color: var(--app-accent) !important;
}

body .app-notification--error {
  border-left-color: var(--app-danger) !important;
}

body .app-notification--error .app-notification__icon {
  color: var(--app-danger) !important;
}

body .app-notification--info {
  border-left-color: #79adff !important;
}

body .app-notification--info .app-notification__icon {
  color: #79adff !important;
}

body .app-notification__close {
  align-self: center;
  color: var(--app-muted) !important;
}

body .app-notification__close:hover {
  background-color: var(--app-surface-soft) !important;
  color: var(--app-text) !important;
}

body.mobile-dashboard-page .mobile-settings-input-wrap input {
  background-color: transparent !important;
  color: #f1f8f3 !important;
}

body.mobile-dashboard-page .mobile-settings-input-wrap input[readonly] {
  color: #a8b8ad !important;
}

body.mobile-dashboard-page .mobile-settings-input-wrap input:focus-visible {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}