/* EEON.TV Custom Overrides — Purple Links + Dark/Light Mode */

/* Purple menu links */
.header-menu .menu > .menu-item > .menu-link .menu-title,
.header-menu .menu .menu-link .menu-title,
.menu-sub .menu-item .menu-link .menu-title,
.aside-menu .menu .menu-link .menu-title,
.menu .menu-item .menu-link .menu-title {
    color: #7b2fff !important;
    font-weight: 600 !important;
}

.header-menu .menu > .menu-item.here > .menu-link .menu-title,
.header-menu .menu > .menu-item.show > .menu-link .menu-title,
.menu .menu-item.here > .menu-link .menu-title,
.menu .menu-item.show > .menu-link .menu-title {
    color: #9b59ff !important;
}

.header-menu .menu > .menu-item > .menu-link:hover .menu-title,
.menu .menu-item > .menu-link:hover .menu-title {
    color: #a855f7 !important;
}

/* Menu icons purple too */
.menu .menu-link .menu-icon i,
.menu .menu-link .menu-icon .svg-icon svg {
    color: #7b2fff !important;
}

/* Sidebar link text */
.aside .aside-menu .menu .menu-item .menu-link .menu-title,
.aside-menu .menu-title {
    color: #7b2fff !important;
}

/* Dark mode toggle button */
.theme-toggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 2px solid #7b2fff;
    background: rgba(123, 47, 255, 0.1);
    color: #7b2fff;
    font-size: 22px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
    backdrop-filter: blur(10px);
}
.theme-toggle:hover {
    background: #7b2fff;
    color: #fff;
    transform: scale(1.1);
}

/* ========== DARK MODE ========== */
[data-theme="dark"] body,
body.dark-mode {
    background-color: #0a0e1a !important;
    color: #e0e0f0 !important;
}

body.dark-mode .header,
body.dark-mode #kt_header {
    background: #12162a !important;
    border-bottom: 1px solid rgba(123, 47, 255, 0.2) !important;
}

body.dark-mode .card,
body.dark-mode .bg-body,
body.dark-mode .bg-white {
    background: #161b33 !important;
    color: #e0e0f0 !important;
}

body.dark-mode .wrapper,
body.dark-mode #kt_wrapper {
    background: #0a0e1a !important;
}

body.dark-mode .toolbar,
body.dark-mode #kt_toolbar {
    background: #0f1328 !important;
}

body.dark-mode .text-dark,
body.dark-mode .text-gray-900,
body.dark-mode .text-gray-800,
body.dark-mode .text-gray-700 {
    color: #e0e0f0 !important;
}

body.dark-mode .text-gray-600,
body.dark-mode .text-gray-500,
body.dark-mode .text-gray-400 {
    color: #8888aa !important;
}

body.dark-mode .text-muted {
    color: #666688 !important;
}

body.dark-mode .form-control,
body.dark-mode .form-control-solid,
body.dark-mode .form-select-solid {
    background-color: #1a1f3a !important;
    color: #e0e0f0 !important;
    border-color: rgba(123, 47, 255, 0.2) !important;
}

body.dark-mode .table,
body.dark-mode .table td,
body.dark-mode .table th {
    color: #e0e0f0 !important;
    border-color: rgba(123, 47, 255, 0.1) !important;
}

body.dark-mode .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: rgba(123, 47, 255, 0.05) !important;
}

body.dark-mode .btn-light,
body.dark-mode .btn-bg-light {
    background-color: #1a1f3a !important;
    color: #e0e0f0 !important;
}

body.dark-mode .separator,
body.dark-mode .border-bottom,
body.dark-mode .border {
    border-color: rgba(123, 47, 255, 0.15) !important;
}

body.dark-mode .dropdown-menu {
    background: #161b33 !important;
    border-color: rgba(123, 47, 255, 0.2) !important;
}

body.dark-mode .dropdown-item {
    color: #e0e0f0 !important;
}

body.dark-mode .dropdown-item:hover {
    background: rgba(123, 47, 255, 0.1) !important;
}

body.dark-mode .footer {
    background: #0a0e1a !important;
    color: #666688 !important;
}

body.dark-mode a {
    color: #9b59ff;
}

body.dark-mode .menu-link .menu-title {
    color: #a855f7 !important;
}

body.dark-mode .page-item .page-link {
    background: #1a1f3a !important;
    color: #e0e0f0 !important;
    border-color: rgba(123, 47, 255, 0.2) !important;
}

/* ========== LIGHT MODE (default) ========== */
body:not(.dark-mode) .header-menu .menu > .menu-item > .menu-link .menu-title {
    color: #7b2fff !important;
}
