/* Theme Override - Dashboard Light Mode & Home Dark Mode */

/* Dashboard Light Mode - Override hardcoded colors */
.dashboard-light .leaderboard-card,
.dashboard-light .category-card,
.dashboard-light .class-card,
.dashboard-light .empty-state,
.dashboard-light .card,
.dashboard-light .modal-content,
.dashboard-light .form-control,
.dashboard-light .table,
.dashboard-light .alert {
    background-color: var(--whiteColor) !important;
    color: var(--bodyColor) !important;
}

.dashboard-light h1,
.dashboard-light h2,
.dashboard-light h3,
.dashboard-light h4,
.dashboard-light h5,
.dashboard-light h6,
.dashboard-light .heading,
.dashboard-light .category-title,
.dashboard-light .filter-title {
    color: var(--headingColor) !important;
}

.dashboard-light p,
.dashboard-light .text-muted,
.dashboard-light .category-meta,
.dashboard-light span:not(.badge) {
    color: var(--contentColor) !important;
}

.dashboard-light .btn-primary,
.dashboard-light .badge-primary {
    background: linear-gradient(135deg, var(--primaryColor) 0%, var(--primaryColor2) 100%) !important;
    border-color: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
}

.dashboard-light .btn-secondary,
.dashboard-light .badge-secondary {
    background-color: var(--secondaryColor) !important;
    border-color: var(--secondaryColor) !important;
    color: var(--primaryColor) !important;
}

.dashboard-light .border,
.dashboard-light .card,
.dashboard-light .table {
    border-color: var(--borderColor) !important;
}

/* Home Page Dark Mode - For public pages (not dashboard) */
body:not(.dashboard-light) .category-filter-wrapper,
body:not(.dashboard-light) .class-card,
body:not(.dashboard-light) .tryout-card,
body:not(.dashboard-light) .bundle-card,
body:not(.dashboard-light) .card:not(.modal-content) {
    background: rgba(71, 17, 18, 0.7) !important;
    border: 1px solid var(--secondaryColor) !important;
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .card-body,
body:not(.dashboard-light) .card-title,
body:not(.dashboard-light) .card-text {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) h1,
body:not(.dashboard-light) h2,
body:not(.dashboard-light) h3,
body:not(.dashboard-light) h4,
body:not(.dashboard-light) h5,
body:not(.dashboard-light) h6 {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) p,
body:not(.dashboard-light) .text-muted,
body:not(.dashboard-light) span:not(.badge) {
    color: var(--contentColor) !important;
}

body:not(.dashboard-light) .btn-primary,
body:not(.dashboard-light) .default__button {
    background: var(--secondaryColor) !important;
    border-color: var(--secondaryColor) !important;
    color: var(--primaryColor) !important;
}

body:not(.dashboard-light) .btn-primary:hover,
body:not(.dashboard-light) .default__button:hover {
    background: var(--secondaryColor2) !important;
    border-color: var(--secondaryColor2) !important;
}

body:not(.dashboard-light) .btn-secondary,
body:not(.dashboard-light) .btn-outline-primary {
    background: rgba(71, 17, 18, 0.8) !important;
    border: 2px solid var(--secondaryColor) !important;
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .btn-secondary:hover,
body:not(.dashboard-light) .btn-outline-primary:hover {
    background: var(--primaryColor) !important;
    border-color: var(--secondaryColor) !important;
    color: var(--secondaryColor) !important;
}

/* Auth Pages specific */
body:not(.dashboard-light) .alert {
    background: rgba(90, 31, 33, 0.8) !important;
    border: 1px solid var(--secondaryColor) !important;
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) label,
body:not(.dashboard-light) .form__label {
    color: var(--secondaryColor) !important;
}

/* ========================================
   GLOBAL COLOR OVERRIDE - AUTO REPLACE
   ======================================== */

/* Override ALL purple-blue gradients to primary gradient */
[style*="linear-gradient"][style*="#667eea"],
[style*="linear-gradient"][style*="#764ba2"],
[style*="background: linear-gradient(135deg, #667eea"],
[style*="background:linear-gradient(135deg, #667eea"] {
    background: linear-gradient(135deg, var(--primaryColor) 0%, var(--primaryColor2) 100%) !important;
}

/* Dashboard specific - keep light mode gradients */
.dashboard-light [style*="linear-gradient"][style*="#667eea"],
.dashboard-light [style*="linear-gradient"][style*="#764ba2"] {
    background: linear-gradient(135deg, var(--primaryColor) 0%, var(--primaryColor2) 100%) !important;
}

/* Public pages - override to primary gradient with secondary text */
body:not(.dashboard-light) [style*="linear-gradient"][style*="#667eea"],
body:not(.dashboard-light) [style*="linear-gradient"][style*="#764ba2"] {
    background: linear-gradient(135deg, var(--primaryColor) 0%, var(--primaryColor2) 100%) !important;
    color: var(--secondaryColor) !important;
}

/* Icon colors - replace purple to secondary */
body:not(.dashboard-light) [style*="color: #667eea"],
body:not(.dashboard-light) [style*="color:#667eea"],
body:not(.dashboard-light) i[style*="#667eea"] {
    color: var(--secondaryColor) !important;
}

/* Dashboard icons - replace purple to primary */
.dashboard-light [style*="color: #667eea"],
.dashboard-light [style*="color:#667eea"],
.dashboard-light i[style*="#667eea"] {
    color: var(--primaryColor) !important;
}

/* Text colors override - Public Pages */
body:not(.dashboard-light) [style*="color: #2d3748"],
body:not(.dashboard-light) [style*="color: #4a5568"],
body:not(.dashboard-light) [style*="color: #718096"],
body:not(.dashboard-light) [style*="color: #64748b"],
body:not(.dashboard-light) [style*="color:#2d3748"],
body:not(.dashboard-light) [style*="color:#4a5568"],
body:not(.dashboard-light) [style*="color:#718096"],
body:not(.dashboard-light) [style*="color:#64748b"] {
    color: var(--secondaryColor) !important;
}

/* Text colors override - Dashboard */
.dashboard-light [style*="color: #2d3748"],
.dashboard-light [style*="color: #4a5568"],
.dashboard-light [style*="color:#2d3748"],
.dashboard-light [style*="color:#4a5568"] {
    color: var(--headingColor) !important;
}

/* Border colors override - Public Pages */
body:not(.dashboard-light) [style*="border-top: 1px solid #e2e8f0"],
body:not(.dashboard-light) [style*="border: 1px solid #e2e8f0"],
body:not(.dashboard-light) [style*="border-color: #e2e8f0"],
body:not(.dashboard-light) [style*="border-top:1px solid #e2e8f0"],
body:not(.dashboard-light) [style*="border:1px solid #e2e8f0"],
body:not(.dashboard-light) [style*="border-color:#e2e8f0"] {
    border-color: var(--secondaryColor) !important;
}

/* Background colors override - Public Pages */
body:not(.dashboard-light) [style*="background: #f1f5f9"],
body:not(.dashboard-light) [style*="background:#f1f5f9"],
body:not(.dashboard-light) [style*="background: white"],
body:not(.dashboard-light) [style*="background:white"],
body:not(.dashboard-light) [style*="background: #ffffff"],
body:not(.dashboard-light) [style*="background:#ffffff"],
body:not(.dashboard-light) [style*="background: #fff"],
body:not(.dashboard-light) [style*="background:#fff"] {
    background: rgba(71, 17, 18, 0.7) !important;
}

/* Price colors */
body:not(.dashboard-light) [style*="color: #ef4444"] {
    color: var(--secondaryColor) !important;
}

/* ========================================
   BUTTON CLASSES OVERRIDE
   ======================================== */

/* Default Button - Public Pages */
body:not(.dashboard-light) .default__button {
    background-color: var(--secondaryColor) !important;
    color: var(--primaryColor) !important;
    border: 2px solid var(--secondaryColor) !important;
    font-weight: 600 !important;
}

body:not(.dashboard-light) .default__button:hover {
    background-color: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
    border-color: var(--secondaryColor) !important;
}

/* Default Button Variants - Public Pages */
body:not(.dashboard-light) .default__button--2 {
    background-color: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
    border: 2px solid var(--primaryColor) !important;
}

body:not(.dashboard-light) .default__button--2:hover {
    background-color: var(--secondaryColor) !important;
    color: var(--primaryColor) !important;
}

body:not(.dashboard-light) .default__button--3,
body:not(.dashboard-light) .default__button--4 {
    background-color: transparent !important;
    color: var(--secondaryColor) !important;
    border: 2px solid var(--secondaryColor) !important;
}

body:not(.dashboard-light) .default__button--3:hover,
body:not(.dashboard-light) .default__button--4:hover {
    background-color: var(--secondaryColor) !important;
    color: var(--primaryColor) !important;
}

/* Gridarea Button - Public Pages */
body:not(.dashboard-light) .gridarea__button a,
body:not(.dashboard-light) .gridarea__button .default__button {
    background: var(--secondaryColor) !important;
    color: var(--primaryColor) !important;
    border: 2px solid var(--secondaryColor) !important;
}

body:not(.dashboard-light) .gridarea__button a:hover,
body:not(.dashboard-light) .gridarea__button .default__button:hover {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
}

/* Small Buttons */
body:not(.dashboard-light) .default__small__button {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
    border: 2px solid var(--primaryColor2) !important;
}

/* Badge/Grid Badge */
body:not(.dashboard-light) .grid__badge,
body:not(.dashboard-light) .badge {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .grid__badge.orange__color {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
}

/* Enroll/Buy/Login Buttons */
body:not(.dashboard-light) .enroll-button,
body:not(.dashboard-light) .buy-button,
body:not(.dashboard-light) .login-button {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
    border: 2px solid var(--primaryColor) !important;
}

body:not(.dashboard-light) .enroll-button:hover,
body:not(.dashboard-light) .buy-button:hover,
body:not(.dashboard-light) .login-button:hover {
    background: var(--secondaryColor) !important;
    color: var(--primaryColor) !important;
    border-color: var(--primaryColor) !important;
}

/* End Message */
body:not(.dashboard-light) .end-message {
    background: rgba(71, 17, 18, 0.9) !important;
    color: var(--secondaryColor) !important;
    border: 2px solid var(--secondaryColor) !important;
}

/* Dashboard Buttons - Light Mode */
.dashboard-light .default__button {
    background-color: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
    border: 1px solid var(--primaryColor) !important;
}

.dashboard-light .default__button:hover {
    background-color: var(--whiteColor) !important;
    color: var(--primaryColor) !important;
    border-color: var(--primaryColor) !important;
}

.dashboard-light .badge,
.dashboard-light .grid__badge {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
}

/* ========================================
   TRYOUT PAGE & COURSE GRID COLORS
   ======================================== */

/* Public Pages - Override all badge color variants */
body:not(.dashboard-light) .grid__badge.blue__color,
body:not(.dashboard-light) .grid__badge.pink__color,
body:not(.dashboard-light) .grid__badge.green__color,
body:not(.dashboard-light) .grid__badge.orange__color,
body:not(.dashboard-light) .grid__badge.yellow__color {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
}

/* Gridarea wrapper - Dark mode for tryout/course cards */
body:not(.dashboard-light) .gridarea__wraper,
body:not(.dashboard-light) .gridarea__wraper__2 {
    background: rgba(71, 17, 18, 0.7) !important;
    border: 1px solid var(--secondaryColor) !important;
}

body:not(.dashboard-light) .gridarea__content {
    background: transparent !important;
}

body:not(.dashboard-light) .gridarea__heading h3,
body:not(.dashboard-light) .gridarea__heading h3 a {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .gridarea__heading h3 a:hover {
    color: var(--primaryColor2) !important;
}

body:not(.dashboard-light) .gridarea__price,
body:not(.dashboard-light) .gridarea__price.green__color {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .gridarea__price del,
body:not(.dashboard-light) .gridarea__price span {
    color: var(--contentColor) !important;
}

body:not(.dashboard-light) .gridarea__list li,
body:not(.dashboard-light) .gridarea__list li i {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .gridarea__small__content h6 {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .gridarea__star i {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .gridarea__star span {
    color: var(--contentColor) !important;
}

body:not(.dashboard-light) .gridarea__details a {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .gridarea__details a:hover {
    color: var(--primaryColor2) !important;
}

body:not(.dashboard-light) .gridarea__details a i {
    color: var(--secondaryColor) !important;
}

/* Breadcrumb area - dark mode */
body:not(.dashboard-light) .breadcrumbarea {
    background: rgba(71, 17, 18, 0.9) !important;
}

body:not(.dashboard-light) .breadcrumb__content__wraper .breadcrumb__title h2,
body:not(.dashboard-light) .breadcrumb__content__wraper .breadcrumb__title .heading {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .breadcrumb__inner ul li,
body:not(.dashboard-light) .breadcrumb__inner ul li a {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .breadcrumb__inner ul li a:hover {
    color: var(--primaryColor2) !important;
}

/* Course filter/sorting area */
body:not(.dashboard-light) .course__text p {
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .single__tab__link {
    color: var(--secondaryColor) !important;
    border-color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .single__tab__link.active,
body:not(.dashboard-light) .single__tab__link:hover {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .form-select {
    background-color: rgba(71, 17, 18, 0.7) !important;
    color: var(--secondaryColor) !important;
    border-color: var(--secondaryColor) !important;
}

/* Pagination */
body:not(.dashboard-light) .main__page__pagination li a {
    background: rgba(71, 17, 18, 0.7) !important;
    color: var(--secondaryColor) !important;
    border-color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .main__page__pagination li a.active,
body:not(.dashboard-light) .main__page__pagination li a:hover:not(.disable) {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
}

body:not(.dashboard-light) .main__page__pagination li a.disable {
    opacity: 0.5;
}

/* Dashboard - Keep light mode for badges with color variants */
.dashboard-light .grid__badge.blue__color,
.dashboard-light .grid__badge.pink__color,
.dashboard-light .grid__badge.green__color,
.dashboard-light .grid__badge.orange__color,
.dashboard-light .grid__badge.yellow__color {
    background: var(--primaryColor) !important;
    color: var(--secondaryColor) !important;
}