/*
 * Crypto Resources dashboard dark theme
 *
 * Loaded after Metronic bundles and scoped to the existing .dark-mode class.
 * Light mode and vendor bundles remain untouched.
 */

/* Shared branded CTA: intentionally identical in light and dark modes. */
.btn.algo-activation-btn {
    background-color: #E8A33D !important;
    border-color: #E8A33D !important;
    color: #17110A !important;
    box-shadow: 0 7px 18px rgba(232, 163, 61, 0.2);
}

.btn.algo-activation-btn i {
    color: #17110A !important;
}

.btn.algo-activation-btn:hover,
.btn.algo-activation-btn:focus,
.btn.algo-activation-btn:active {
    background-color: #F3B455 !important;
    border-color: #F3B455 !important;
    color: #17110A !important;
}

.btn.algo-activation-btn:focus-visible {
    box-shadow:
        0 0 0 0.2rem rgba(232, 163, 61, 0.28),
        0 7px 18px rgba(232, 163, 61, 0.2);
}

/* Sidebar brand zone stays dark in both application themes. */
#kt_aside .aside-logo {
    position: relative;
    background:
        radial-gradient(circle at 24% 50%, rgba(14, 139, 236, 0.09), transparent 44%),
        linear-gradient(100deg, #0D1118 0%, #0B0E14 72%, rgba(232, 163, 61, 0.045) 100%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.065);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}

#kt_aside .aside-logo::after {
    content: "";
    position: absolute;
    right: 18px;
    bottom: -1px;
    left: 18px;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(14, 139, 236, 0.38),
        rgba(232, 163, 61, 0.3),
        transparent
    );
    pointer-events: none;
}

#kt_aside .aside-logo .sidebar-brand-icon {
    filter:
        drop-shadow(0 0 12px rgba(14, 139, 236, 0.1))
        drop-shadow(0 0 10px rgba(232, 163, 61, 0.045));
}

html.dark-mode,
body.dark-mode {
    --cr-black: #07090D;
    --cr-shell: #090C11;
    --cr-sidebar: #080A0F;
    --cr-surface: #10141B;
    --cr-surface-raised: #151A23;
    --cr-surface-hover: #1A202B;
    --cr-border: #232936;
    --cr-border-soft: #1B2029;
    --cr-text: #ECEEF2;
    --cr-text-secondary: #B4BBC8;
    --cr-text-muted: #8A93A6;
    --cr-blue: #0E8BEC;
    --cr-blue-hover: #25A2FF;
    --cr-orange: #E8A33D;
    --cr-orange-hover: #F3B455;

    --bs-body-bg: var(--cr-black);
    --bs-body-bg-rgb: 7, 9, 13;
    --bs-body-color: var(--cr-text);
    --bs-body-color-rgb: 236, 238, 242;
    --bs-card-bg: var(--cr-surface);
    --bs-card-cap-bg: var(--cr-surface);
    --bs-border-color: var(--cr-border);
    --bs-border-color-translucent: rgba(255, 255, 255, 0.08);

    --bs-primary: var(--cr-blue);
    --bs-primary-rgb: 14, 139, 236;
    --bs-warning: var(--cr-orange);
    --bs-warning-rgb: 232, 163, 61;
    --bs-secondary: var(--cr-surface-raised);
    --bs-secondary-rgb: 21, 26, 35;
    --bs-light: var(--cr-surface-raised);
    --bs-light-rgb: 21, 26, 35;
    --bs-dark: var(--cr-text);
    --bs-dark-rgb: 236, 238, 242;

    --bs-gray-100: #0D1016;
    --bs-gray-200: #13171F;
    --bs-gray-300: var(--cr-border);
    --bs-gray-400: #4F5768;
    --bs-gray-500: #6D7587;
    --bs-gray-600: var(--cr-text-muted);
    --bs-gray-700: var(--cr-text-secondary);
    --bs-gray-800: #D6DAE2;
    --bs-gray-900: var(--cr-text);
    --bs-text-muted: var(--cr-text-muted);

    --bs-link-color: var(--cr-blue);
    --bs-link-hover-color: var(--cr-blue-hover);
    --bs-component-active-bg: var(--cr-blue);
    --bs-component-active-color: #FFFFFF;
    --bs-focus-ring-color: rgba(14, 139, 236, 0.28);
}

html.dark-mode body,
body.dark-mode {
    background: var(--cr-black) !important;
    color: var(--cr-text);
    color-scheme: dark;
}

body.dark-mode .page,
body.dark-mode .wrapper,
body.dark-mode #kt_content,
body.dark-mode #kt_post {
    background-color: var(--cr-black);
}

body.dark-mode #kt_header,
body.dark-mode .header {
    background-color: var(--cr-shell) !important;
    border-bottom: 1px solid var(--cr-border-soft);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
}

body.dark-mode #kt_toolbar,
body.dark-mode .toolbar,
body.dark-mode #kt_footer,
body.dark-mode .footer {
    background-color: var(--cr-black) !important;
    border-color: var(--cr-border-soft) !important;
}

#kt_aside {
    --cr-sidebar: #080A0F;
    --cr-surface: #10141B;
    --cr-surface-raised: #151A23;
    --cr-text: #ECEEF2;
    --cr-text-muted: #8A93A6;
    --cr-blue: #0E8BEC;
    --cr-border-soft: #1B2029;
}

#kt_aside,
#kt_aside .aside-menu,
#kt_aside .aside-footer,
#kt_aside .menu {
    background-color: var(--cr-sidebar) !important;
}

#kt_aside {
    border-right: 1px solid var(--cr-border-soft);
}

#kt_aside .menu-item .menu-link {
    border-radius: 8px;
}

#kt_aside .menu-item .menu-link:hover,
#kt_aside .menu-item.hover > .menu-link {
    background-color: var(--cr-surface-raised);
}

#kt_aside .menu-item.here > .menu-link,
#kt_aside .menu-item.show > .menu-link,
#kt_aside .menu-item .menu-link.active {
    background:
        linear-gradient(90deg, rgba(14, 139, 236, 0.18), rgba(14, 139, 236, 0.04)),
        var(--cr-surface);
    box-shadow: inset 2px 0 0 var(--cr-blue);
}

#kt_aside .menu-title,
#kt_aside .menu-icon,
#kt_aside .menu-arrow {
    color: var(--cr-text-muted) !important;
}

#kt_aside .menu-link:hover .menu-title,
#kt_aside .menu-link.active .menu-title,
#kt_aside .menu-item.here > .menu-link .menu-title {
    color: var(--cr-text) !important;
}

body.dark-mode .card:not(.card-cta-contrast):not([class*="bg-"]):not([style*="background"]),
body.dark-mode .modal-content,
body.dark-mode .dropdown-menu,
body.dark-mode .popover,
body.dark-mode .offcanvas,
body.dark-mode .drawer {
    background-color: var(--cr-surface) !important;
    border-color: var(--cr-border) !important;
}

body.dark-mode .card:not([class*="shadow-none"]),
body.dark-mode .modal-content,
body.dark-mode .dropdown-menu {
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.24);
}

body.dark-mode .card-header,
body.dark-mode .card-footer,
body.dark-mode .modal-header,
body.dark-mode .modal-footer,
body.dark-mode .dropdown-divider {
    border-color: var(--cr-border-soft) !important;
}

body.dark-mode .dropdown-item,
body.dark-mode .menu-link {
    color: var(--cr-text-secondary);
}

body.dark-mode .dropdown-item:hover,
body.dark-mode .dropdown-item:focus,
body.dark-mode .dropdown-item.active,
body.dark-mode .menu-state-bg .menu-item .menu-link:hover {
    background-color: var(--cr-surface-hover);
    color: var(--cr-text);
}

body.dark-mode .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--cr-text-secondary);
    --bs-table-border-color: var(--cr-border-soft);
    --bs-table-striped-bg: rgba(255, 255, 255, 0.018);
    --bs-table-hover-bg: rgba(14, 139, 236, 0.055);
    color: var(--cr-text-secondary);
}

body.dark-mode .table > :not(caption) > * > *,
body.dark-mode .table td,
body.dark-mode .table th {
    border-color: var(--cr-border-soft) !important;
}

body.dark-mode .table thead th {
    color: var(--cr-text-muted);
}

body.dark-mode .form-control,
body.dark-mode .form-select,
body.dark-mode .input-group-text,
body.dark-mode .select2-container--bootstrap5 .select2-selection,
body.dark-mode .select2-dropdown,
body.dark-mode .flatpickr-calendar {
    background-color: var(--cr-shell) !important;
    border-color: var(--cr-border) !important;
    color: var(--cr-text) !important;
}

body.dark-mode .form-control::placeholder {
    color: #646D7E;
}

body.dark-mode .form-control:focus,
body.dark-mode .form-select:focus,
body.dark-mode .select2-container--bootstrap5.select2-container--focus .select2-selection {
    border-color: var(--cr-blue) !important;
    box-shadow: 0 0 0 0.2rem rgba(14, 139, 236, 0.12);
}

body.dark-mode .btn-light,
body.dark-mode .btn-active-light-primary:hover,
body.dark-mode .btn-active-light-primary.active,
body.dark-mode .btn.btn-active-light-primary:active {
    background-color: var(--cr-surface-raised) !important;
    border-color: var(--cr-border) !important;
    color: var(--cr-text-secondary) !important;
}

body.dark-mode .btn-light:hover,
body.dark-mode .btn-active-light-primary:hover {
    background-color: var(--cr-surface-hover) !important;
    color: var(--cr-blue-hover) !important;
}

body.dark-mode .btn-primary,
body.dark-mode .bg-primary {
    background-color: var(--cr-blue) !important;
    border-color: var(--cr-blue) !important;
}

body.dark-mode .btn-primary:hover,
body.dark-mode .btn-primary:focus {
    background-color: var(--cr-blue-hover) !important;
    border-color: var(--cr-blue-hover) !important;
}

body.dark-mode .btn-warning,
body.dark-mode .bg-warning {
    background-color: var(--cr-orange) !important;
    border-color: var(--cr-orange) !important;
    color: #17110A !important;
}

body.dark-mode .nav-tabs,
body.dark-mode .nav-line-tabs,
body.dark-mode .separator,
body.dark-mode .border,
body.dark-mode [class*="border-gray-"] {
    border-color: var(--cr-border) !important;
}

body.dark-mode .nav-link {
    color: var(--cr-text-muted);
}

body.dark-mode .nav-link:hover,
body.dark-mode .nav-link.active {
    color: var(--cr-blue-hover);
}

body.dark-mode .pagination .page-link {
    background-color: var(--cr-surface);
    border-color: var(--cr-border);
    color: var(--cr-text-secondary);
}

body.dark-mode .pagination .page-item.active .page-link {
    background-color: var(--cr-blue);
    border-color: var(--cr-blue);
    color: #FFFFFF;
}

body.dark-mode .text-dark,
body.dark-mode .text-gray-800,
body.dark-mode .text-gray-900,
body.dark-mode .card-title {
    color: var(--cr-text) !important;
}

body.dark-mode .text-muted,
body.dark-mode .text-gray-500,
body.dark-mode .text-gray-600 {
    color: var(--cr-text-muted) !important;
}

body.dark-mode .text-gray-700 {
    color: var(--cr-text-secondary) !important;
}

body.dark-mode .bg-body,
body.dark-mode .bg-white {
    background-color: var(--cr-surface) !important;
}

body.dark-mode .bg-light,
body.dark-mode .bg-light-primary {
    background-color: var(--cr-surface-raised) !important;
}

body.dark-mode .badge-light-primary {
    background-color: rgba(14, 139, 236, 0.12) !important;
    color: #64B8F5 !important;
}

body.dark-mode .badge-light-warning {
    background-color: rgba(232, 163, 61, 0.13) !important;
    color: var(--cr-orange-hover) !important;
}

/*
 * Bridge older page-local dark styles that still contain Metronic's
 * purple-gray literals. Keep these here until those components are migrated.
 */
body.dark-mode .info-card,
body.dark-mode .step-card,
body.dark-mode .code-box {
    background-color: var(--cr-surface) !important;
    border-color: var(--cr-border) !important;
}

body.dark-mode .step-number {
    background-color: rgba(14, 139, 236, 0.16) !important;
}

body.dark-mode {
    --hint-bg: var(--cr-surface);
    --hint-text: var(--cr-text);
    --hint-muted: var(--cr-text-muted);
    --hint-border: rgba(255, 255, 255, 0.08);
    --hint-primary-outline: var(--cr-blue);
}

body.dark-mode .pd4-modal .modal-content,
body.dark-mode .pd4-modal .modal-header,
body.dark-mode .pd4-modal .modal-body {
    background: var(--cr-surface) !important;
    border-color: var(--cr-border) !important;
}

body.dark-mode .pd4-modal-hero {
    background:
        linear-gradient(135deg, rgba(14, 139, 236, 0.13), transparent 64%),
        var(--cr-surface-raised) !important;
    border-color: rgba(14, 139, 236, 0.3) !important;
}

body.dark-mode .pd4-modal-block + .pd4-modal-block,
body.dark-mode .pd4-modal .pd4-grid,
body.dark-mode .pd4-modal .pd4-smini,
body.dark-mode .pd4-modal .pd4-fl li {
    border-color: var(--cr-border) !important;
}

body.dark-mode .pd4-modal .pd4-grid,
body.dark-mode .pd4-modal .pd4-billing-toggle,
body.dark-mode .pd4-modal .pd4-status-referral-toggle,
body.dark-mode .pd4-modal .alert-light,
body.dark-mode .pd4-modal .pd4-status-footnotes,
body.dark-mode .pd4-modal .bg-light {
    background: var(--cr-surface-raised) !important;
    border-color: var(--cr-border) !important;
}

body.dark-mode .pd4-modal .pd4-card,
body.dark-mode .pd4-modal .pd4-bill-btn.active {
    background: var(--cr-shell) !important;
}

body.dark-mode .pd4-modal .pd4-card.featured,
body.dark-mode .pd4-modal .alert-light-primary {
    background: rgba(14, 139, 236, 0.11) !important;
    border-color: rgba(14, 139, 236, 0.3) !important;
}

body.dark-mode .pd4-modal .pd4-bill-btn.active {
    color: var(--cr-blue-hover) !important;
}

body.dark-mode .alert-node-status {
    background-color: var(--cr-surface) !important;
    border-color: var(--cr-border) !important;
    color: var(--cr-text) !important;
}

body.dark-mode .alert-node-status h4,
body.dark-mode .alert-node-status .btn-outline-dashed {
    color: var(--cr-text) !important;
}

body.dark-mode .alert-node-status .btn-action {
    background-color: var(--cr-blue) !important;
    color: #FFFFFF !important;
}

body.dark-mode .alert-node-status .btn-outline-dashed {
    border-color: var(--cr-border) !important;
}

body.dark-mode .alert-node-status .btn-outline-dashed:hover {
    background-color: var(--cr-surface-hover) !important;
}

body.dark-mode ::-webkit-scrollbar-track {
    background: var(--cr-shell);
}

body.dark-mode ::-webkit-scrollbar-thumb {
    background: #303744;
    border-radius: 999px;
}

body.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: #424B5B;
}

@media (prefers-reduced-motion: reduce) {
    body.dark-mode *,
    body.dark-mode *::before,
    body.dark-mode *::after {
        scroll-behavior: auto !important;
    }
}