/* Theme Switcher Toggle */
.theme-switcher {
    display: inline-flex;
    align-items: center;
    margin-right: 12px;
}

#theme-switcher-btn {
    display: flex;
    align-items: center;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    -webkit-tap-highlight-color: transparent;
}

.theme-switcher-track {
    position: relative;
    width: 52px;
    height: 28px;
    border-radius: 14px;
    background: #e0e0e0;
    transition: background 0.25s ease;
}

[data-theme="dark"] .theme-switcher-track {
    background: #3d3d3d;
}

.theme-switcher-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #3498db;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.25s ease, left 0.25s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

[data-theme="dark"] .theme-switcher-thumb {
    left: calc(100% - 26px);
}

.theme-switcher-thumb svg {
    width: 14px;
    height: 14px;
    fill: white;
}

/* Sun icon (light mode) - visible in dark mode thumb */
.theme-switcher-thumb .icon-sun {
    display: block;
}

.theme-switcher-thumb .icon-moon {
    display: none;
}

[data-theme="dark"] .theme-switcher-thumb .icon-sun {
    display: none;
}

[data-theme="dark"] .theme-switcher-thumb .icon-moon {
    display: block;
}

/* Inactive icons on track - subtle outline */
.theme-switcher-track::before,
.theme-switcher-track::after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    opacity: 0.35;
}

.theme-switcher-track::before {
    left: 6px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666'%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Cpath d='M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42' stroke='%23666' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") center/contain no-repeat;
}

.theme-switcher-track::after {
    right: 6px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666'%3E%3Cpath d='M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z' stroke='%23666' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") center/contain no-repeat;
}

[data-theme="dark"] .theme-switcher-track::before,
[data-theme="dark"] .theme-switcher-track::after {
    opacity: 0.4;
}

/* ===== Dark Mode Styles (data-theme="dark") ===== */
[data-theme="dark"] body {
    background: #1a1a1a;
    color: #e8e8e8;
}

[data-theme="dark"] #kt_header,
[data-theme="dark"] .kt-header,
[data-theme="dark"] .kt-header-menu-wrapper,
[data-theme="dark"] .kt-header-mobile {
    background-color: #151515 !important;
}

[data-theme="dark"] @media (max-width: 1024px) {
    .kt-header-menu-wrapper,
    .kt-header-menu-mobile {
        background: #151515 !important;
    }
}

[data-theme="dark"] .kt-footer .kt-footer__wrapper .kt-footer__copyright,
[data-theme="dark"] .kt-footer .kt-footer__wrapper .kt-footer__copyright > a,
[data-theme="dark"] .kt-footer .kt-footer__wrapper .kt-footer__menu a {
    color: #e8e8e8;
}

[data-theme="dark"] .kt-header-menu-wrapper .kt-header-menu .kt-menu__nav > .kt-menu__item > .kt-menu__link .kt-menu__link-text {
    color: #e8e8e8;
}

[data-theme="dark"] .kt-aside-toggler span,
[data-theme="dark"] .kt-aside-toggler span::before,
[data-theme="dark"] .kt-aside-toggler span::after {
    background: #e8e8e8;
}

[data-theme="dark"] tbody {
    background-color: #1f1f1f;
    color: #e8e8e8;
}

[data-theme="dark"] .table-bordered td {
    border-color: #353535;
}

[data-theme="dark"] tbody tr:hover {
    background-color: #2a2a2a !important;
}

[data-theme="dark"] .kt-portlet {
    background-color: #1f1f1f;
}

[data-theme="dark"] .kt-portlet .kt-portlet__head .kt-portlet__head-label .kt-portlet__head-title {
    color: #e8e8e8;
}

[data-theme="dark"] .dataTables_wrapper .dataTable th,
[data-theme="dark"] .dataTables_wrapper .dataTable td {
    color: #e8e8e8;
}

[data-theme="dark"] .modal-content {
    background-color: #1f1f1f;
}

[data-theme="dark"] .modal .modal-content .modal-header .modal-title {
    color: #e8e8e8;
}

[data-theme="dark"] .modal-body {
    background: #252525;
}

[data-theme="dark"] .btn-secondary {
    color: #e8e8e8;
    border-color: #555;
}

[data-theme="dark"] .form-control {
    background: #252525;
    color: #e8e8e8;
    border-color: #444;
}

[data-theme="dark"] .kt-header-mobile,
[data-theme="dark"] .kt-header__topbar,
[data-theme="dark"] .kt-container--fluid {
    background-color: #151515 !important;
}

[data-theme="dark"] .kt-user-card {
    background-color: #252525;
    border-color: #444;
}

[data-theme="dark"] .kt-user-card.kt-user-card--skin-light .kt-user-card__name {
    color: #e8e8e8;
}

[data-theme="dark"] .table {
    color: #e8e8e8;
}

[data-theme="dark"] a {
    color: #7eb8ff;
}

[data-theme="dark"] a:hover {
    color: #a8d0ff;
}

[data-theme="dark"] .kt-widget.kt-widget--user-profile-3 .kt-widget__top .kt-widget__content .kt-widget__head .kt-widget__title,
[data-theme="dark"] .kt-widget.kt-widget--user-profile-3 .kt-widget__top .kt-widget__content .kt-widget__subhead a {
    color: #e8e8e8;
}

[data-theme="dark"] .kt-notification .kt-notification__item .kt-notification__item-details .kt-notification__item-title,
[data-theme="dark"] .kt-notification .kt-notification__item .kt-notification__item-details .kt-notification__item-time {
    color: #e8e8e8;
}

[data-theme="dark"] .kt-invoice-1 .kt-invoice__body table tbody tr td,
[data-theme="dark"] .kt-invoice-1 .kt-invoice__body table thead tr th,
[data-theme="dark"] .kt-invoice-1 .kt-invoice__footer .kt-invoice__total .kt-invoice__price,
[data-theme="dark"] .kt-invoice-1 .kt-invoice__footer .kt-invoice__total .kt-invoice__title {
    color: #e8e8e8;
}

[data-theme="dark"] .shortBlueBackgroundContainer {
    opacity: 0.9;
}

[data-theme="dark"] .kt-login.kt-login--v1 .kt-login__wrapper {
    background: #1a1a1a !important;
}

[data-theme="dark"] .kt-login.kt-login--v1 .kt-login__wrapper .kt-login__body .kt-login__form .kt-form .form-group .form-control {
    background-color: #252525 !important;
    color: #e8e8e8;
    border-color: #444;
}

[data-theme="dark"] .dropdown-menu {
    background-color: #1f1f1f;
    border-color: #444;
}

[data-theme="dark"] .dropdown-item {
    color: #e8e8e8;
}

[data-theme="dark"] .dropdown-item:hover {
    background-color: #333;
}
