/* theme-switcher.css */

/* ====== SIMPLE VERTICAL THEME SWITCHER ====== */
.ohio-theme-switch-vertical {
    position: fixed;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 30px;
    padding: 0px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

body.dark-scheme .ohio-theme-switch-vertical {
    background: rgba(42, 42, 42, 0.95);
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
    max-width: 41px;
    padding: 4px;
}

.theme-switch-vertical-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.theme-switch-label-vertical {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 600;
    font-size: 14px;
    padding: 8px 12px;
    border-radius: 20px;
    width: 100%;
    transition: all 0.3s ease;
    cursor: pointer;
    min-width: 40px;
    min-height: 40px;
    max-width: 40px;
    max-height: 40px;
}

.theme-switch-label-vertical.light {
    color: #333;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.theme-switch-label-vertical.dark {
    color: #fff;
    background: rgba(51, 51, 51, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0px;
}

.theme-switch-label-vertical.active {
    transform: scale(1.1);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

body.dark-scheme .theme-switch-label-vertical.light {
    background: rgba(255, 255, 255, 0.2);
    color: #ccc;
    padding:0px;
    min-width: 28px;
}

body.dark-scheme .theme-switch-label-vertical.dark {
    background: #ff6b355c;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 0px;
    min-width: 28px;
}

.theme-switch-label-vertical.light.active {
    background: #ff6b3561;
    color: #333;
    border-color: #ffb347;
    max-width: 29px;
}

.theme-switch-label-vertical.dark.active {
    background: linear-gradient(145deg, #8ec5fc, #6a8df5);
    color: #fff;
    border-color: #6a8df5;
}

.theme-switch-icon-vertical {
    font-size: 20px;
    transition: all 0.3s ease;
}

.light .theme-switch-icon-vertical {
    color: #ff8c00;
}

.dark .theme-switch-icon-vertical {
    color: #8ec5fc;
}

/* Animation for active state */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.theme-switch-label-vertical.active {
    animation: pulse 0.3s ease;
}

/* ====== DARK MODE STYLES ====== */
body.dark-scheme {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
}

/* Dark mode for general content */
body.dark-scheme .site-content {
    background-color: #1a1a1a !important;
}

body.dark-scheme header,
body.dark-scheme footer,
body.dark-scheme .page-container,
body.dark-scheme .elementor-section:not([class*="clb__light"]) {
    background-color: #1a1a1a !important;
}

body.dark-scheme .card,
body.dark-scheme .accordion,
body.dark-scheme .header.-mobile .nav .holder {
    background-color: #2a2a2a !important;
}

/* Dark mode text colors */
body.dark-scheme .heading .title,
body.dark-scheme h1,
body.dark-scheme h2,
body.dark-scheme h3,
body.dark-scheme h4,
body.dark-scheme h5,
body.dark-scheme h6 {
    color: #ffffff !important;
}

body.dark-scheme p,
body.dark-scheme span:not(.dynamic),
body.dark-scheme div:not([class*="icon"]),
body.dark-scheme li {
    color: #dddddd !important;
}

body.dark-scheme .button:not(.-text) {
    background-color: #333 !important;
    color: #fff !important;
    border-color: #444 !important;
}

body.dark-scheme a:not(.button):not(.menu-link) {
    color: #ff6b35 !important;
}

/* EXCEPTIONS - Sections that should NOT change in dark mode */
/* Keep the gradient section (elementor-element-656a71e) in its original state */
body.dark-scheme section.elementor-section.elementor-top-section.elementor-element.elementor-element-656a71e {
    background: #4A6572 !important;
    background: radial-gradient(circle, rgba(74, 101, 114, 1) 0%, rgba(117, 138, 150, 1) 87%) !important;
}

/* Keep all text inside this section in light mode colors */
body.dark-scheme .elementor-element-656a71e .heading .title,
body.dark-scheme .elementor-element-656a71e h1,
body.dark-scheme .elementor-element-656a71e h2,
body.dark-scheme .elementor-element-656a71e h3,
body.dark-scheme .elementor-element-656a71e h4,
body.dark-scheme .elementor-element-656a71e h5,
body.dark-scheme .elementor-element-656a71e h6,
body.dark-scheme .elementor-element-656a71e p,
body.dark-scheme .elementor-element-656a71e span:not(.dynamic),
body.dark-scheme .elementor-element-656a71e div,
body.dark-scheme .elementor-element-656a71e li {
    color: inherit !important;
}

/* Keep buttons in this section in light mode */
body.dark-scheme .elementor-element-656a71e .button:not(.-text) {
    background-color: var(--clb-color-button, #4a6572) !important;
    color: #ffffff !important;
    border-color: inherit !important;
}

/* ====== LIGHT MODE STYLES ====== */
body.light-scheme {
    /* Reset to Ohio default light colors */
    background-color: #ffffff !important;
    color: #232323 !important;
}

body.light-scheme .site-content {
    background-color: #ffffff !important;
}

body.light-scheme header,
body.light-scheme footer,
body.light-scheme .page-container,
body.light-scheme .elementor-section:not([class*="clb__dark"]) {
    background-color: #ffffff00 !important;
    color: #232323 !important;
}

/* LIGHT MODE - Reset text colors */
body.light-scheme .heading .title,
body.light-scheme h1,
body.light-scheme h2,
body.light-scheme h3,
body.light-scheme h4,
body.light-scheme h5,
body.light-scheme h6 {
    color: inherit !important;
}

body.light-scheme p,
body.light-scheme span,
body.light-scheme div,
body.light-scheme li {
    color: inherit !important;
}

body.light-scheme .button:not(.-text) {
    background-color: var(--clb-color-button, #4a6572) !important;
    color: #ffffff !important;
}

body.light-scheme a:not(.button):not(.menu-link) {
    color: #8d8d8d !important;
}

/* Special elements reset */
body.light-scheme .elementor-21466 .elementor-element.elementor-element-3f72335 .dynamic {
    color: #014941 !important;
}

body.light-scheme .icon-button:hover,
body.light-scheme .icon-button.hamburger,
body.light-scheme .icon-button.cart {
    background-color: #2E3437 !important;
}

/* Keep the gradient section in light mode (already has its own style) */
body.light-scheme section.elementor-section.elementor-top-section.elementor-element.elementor-element-656a71e {
    background: #4A6572 !important;
    background: radial-gradient(circle, rgba(74, 101, 114, 1) 0%, rgba(117, 138, 150, 1) 87%) !important;
}

body.dark-scheme header, body.dark-scheme footer, body.dark-scheme .page-container, body.dark-scheme .elementor-section:not([class*="clb__light"]) {
    background-color: #1a1a1a00 !important;
}

body.dark-scheme a:not(.button):not(.menu-link) {
    color: #b9b9b9 !important;
}

.dark-scheme .button.-outlined:not(.-primary):not(.-dm-ignore), 
.dark-scheme .button.-flat:not(.-primary):not(.-dm-ignore), 
.dark-scheme .button.-text:not(.-primary):not(.-dm-ignore) {
    background: #00000047 !important;
}

body.dark-scheme .card, 
body.dark-scheme .accordion, 
body.dark-scheme .header.-mobile .nav .holder {
    background-color: #2a2a2a00 !important;
}

.icon {
    color: white!important;
}

.accordion:not(.-outlined):not(.-text) .accordion-item .accordion-button {
    color: #d9d9d9 !important;
}

.elementor-21466 .elementor-element.elementor-element-07b222a .accordion-header {
    color: #e8e8e8!important;
}

.elementor-21466 .elementor-element.elementor-element-eadde9e > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute) {
    margin-bottom: 9px;
}

body.light-scheme footer#colophon {
    background: #efefef!important;
}

body.dark-scheme .header.-sticky:not(.-fixed):not(.header-8) .header-wrap{
    background: black !important;
}

body.light-scheme .header.-sticky:not(.-fixed):not(.header-8) .header-wrap{
    background: white !important;
}



body.light-scheme .icon {
    color: #afafaf !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .ohio-theme-switch-vertical {
        left: 10px;
        padding: 12px 8px;
        transform: translateY(-50%) scale(0.9);
    }
    
    .theme-switch-label-vertical {
        font-size: 12px;
        min-width: 36px;
        min-height: 36px;
        max-width: 36px;
        max-height: 36px;
        padding: 6px;
    }
    
    .theme-switch-icon-vertical {
        font-size: 18px;
    }
}

@media (max-width: 480px) {
    .ohio-theme-switch-vertical {
        transform: translateY(-50%) scale(0.8);
        left: 5px;
        padding: 10px 6px;
    }
    
    .theme-switch-label-vertical {
        min-width: 32px;
        min-height: 32px;
        max-width: 32px;
        max-height: 32px;
    }
    
    .theme-switch-icon-vertical {
        font-size: 16px;
    }
}