/* ==========================================
   SYSTEM-BASED DARK THEME IMPLEMENTATION
   Using @media (prefers-color-scheme: dark)
   ========================================== */

/* ==========================================
   LIGHT THEME (Default)
   ========================================== */

/* Hide dark theme logos in light mode */
.dark-theme-logo {
    display: none !important;
}

/* Show light theme logos in light mode */
.light-theme-logo {
    display: block !important;
}

/* Hide dark theme chevrons in light mode */
.dark_theme_image {
    display: none !important;
}

/* Show light theme chevrons in light mode */
.light_theme_image {
    display: inline !important;
}

.site-header .site-logo a:focus-visible {
    outline: 0px;
}

.footer-logo.dark_theme_image {
    height: 29px;
}

/* ==========================================
   DARK THEME GLOBAL STYLES
   ========================================== */

@media (prefers-color-scheme: dark) {

    /* Hide light theme logos in dark mode */
    .light-theme-logo {
        display: none !important;
    }

    /* Show dark theme logos in dark mode */
    .dark-theme-logo {
        display: block !important;
    }

    /* Hide light theme chevrons in dark mode */
    .light_theme_image {
        display: none !important;
    }

    /* Show dark theme chevrons in dark mode */
    .dark_theme_image {
        display: inline !important;
    }

    body {
        background-color: #1a1a1a;
        color: #e0e0e0;
    }


    #main_content,
    .testimonial-two-section {
        background-color: transparent;
        color: #e0e0e0;
    }

    .testimonial--two {
        background-color: transparent;
        border: 1px solid #444;
    }

    .testimonial--two:hover {
        box-shadow: none;
    }

    .testimonial__name,
    .testimonial__designation,
    .testimonial--two .testimonial__content p {
        color: #fff;
    }

    .testimonial--two .testimonial__content .review-link {
        color: #ed3947;
    }

    .funfact-section, .funfact-section .container {
        background-color: transparent;
        position: relative;
        z-index: 5;
    }

    .funfact-section .title {
        color: #fff;
    }

    /* Header styles for dark theme */
    #masthead.site-header {
        background-color: #1a1a1a;
        border-bottom: 1px solid #444;
    }

    .site-header .site-logo a img {
        filter: brightness(0.9);
    }

    .site-header .tt-hamburger .bar {
        background-color: #e0e0e0;
    }

    .site-header .main-nav-container {
        background-color: #1a1a1a;
        /* border: 1px solid #333; */
    }

    .site-header .menu>li>a {
        color: #fff !important;
    }

    .site-header .menu>li>a:hover {
        /* color: #ffc107; */
    }

    .site-header .nav-right .nav-link {
        color: #e0e0e0;
    }

    .site-header .nav-right .nav-link:hover {
        /* color: #ffc107; */
    }

    .site-header .nav-right .tt__btn {
        background-color: #ed3947;
        color: #1a1a1a;
        border: 1px solid #ed3947;
    }

    .site-header .nav-right .tt__btn:hover {
        background-color: #fff !important;
        border-color: #ED3947;
        color: #ed3947 !important;
    }

    .site-header button[type="button"] {
        background-color: transparent !important;
        border: 1px solid #444 !important;
        color: #fff !important;
    }

    .site-header button[type="button"]:hover {
        background-color: #444;
        /* border-color: #ffc107; */
    }

    .close-menu {
        color: #e0e0e0;
    }

    .close-menu:hover {
        /* color: #ffc107; */
    }

    /* Banner section dark theme */
    .banner--six {
        background-color: transparent;
    }

    .banner__title {
        color: #fff !important;
    }

    .banner__description {
        color: #b0b0b0;
    }

    /* Button styles for dark theme */
    .tt__btn {
        background-color: #fff;
        color: #fff !important;
        border: 2px solid #ED3947;
    }

    .tt__btn:hover {
        background-color: #fff;
        border-color: #ED3947;
        color: #ED3947 !important;
    }

    .tt__btn.btn-outline {
        background-color: transparent;
        /* color: #ffc107 !important; */
        /* border: 2px solid #ffc107; */
    }

    .tt__btn.btn-outline:hover {
        /* background-color: #ffc107; */
        color: #1a1a1a !important;
    }

    /* Section headings dark theme */
    .section-heading .section-title {
        color: #fff !important;
    }

    .section-heading .description {
        color: #b0b0b0;
    }

    /* Cards/boxes dark theme */
    .tt-event {
        background-color: #222;
        border: 1px solid #333;
    }

    .share-wedding.tt-event {
        background-color: transparent;
        box-shadow: none;
    }

    .tt-event__contents {
        background-color: transparent;
        color: #e0e0e0;
    }

    .tt-event__contents h3 {
        color: #fff;
    }

    .tt-event__contents p {
        color: #b0b0b0;
    }

    /* Icon box dark theme */
    .tt-icon-box {
        background-color: transparent !important;
        border: 1px solid #333 !important;
        box-shadow: none !important;
    }

    .tt-icon-box h3 {
        color: #fff;
    }

    .tt-icon-box p {
        color: #b0b0b0 !important;
    }

    /* Logo carousel dark theme */
    .logo-slider-wrapper {
        /* background-color: #222;
        border: 1px solid #333; */
        border-radius: 8px;
        padding: 20px;
    }

    .section--heading .section-title-sm {
        color: #fff;
    }

    /* Service section dark theme */
    .service-six,
    .service-seven {
        background-color: transparent;
        position: relative;
        z-index: 5;
    }

    /* Form inputs dark theme */
    input,
    textarea,
    select {
        background-color: transparent !important;
        color: #e0e0e0 !important;
        border: 1px solid #444 !important;
    }

    input::placeholder,
    textarea::placeholder {
        color: #888;
    }

    input:focus,
    textarea:focus,
    select:focus {
        background-color: #3a3a3a;
        /* border-color: #ffc107; */
        color: #e0e0e0;
    }

    .tt-select {
        background-color: #333;
        color: #e0e0e0;
        border: 1px solid #444;
    }

    .tt-select option {
        background-color: #333;
        color: #e0e0e0;
    }

    /* Dark theme for modal */
    .modal-content {
        background-color: #222 !important;
        border: 1px solid #444;
    }

    .modal-header {
        /* background-color: #1a1a1a; */
        border-bottom: 1px solid #444;
    }

    .modal-header .modal-title {
        color: #fff;
    }

    .modal-header .close {
        color: #fff;
        opacity: 0.8;
    }

    .modal-header .close:hover {
        /* color: #ffc107; */
    }

    .modal-body {
        color: #e0e0e0;
    }

    .modal-body p {
        color: #b0b0b0;
    }

    .modal-body a {
        /* color: #ffc107; */
    }

    .modal-body a:hover {
        color: #ffb300;
    }

    .tooltip-inner {
        background-color: #444 !important;
        color: #fff !important;
        border: 1px solid #1a1a1a;
    }

    .tooltip .tooltip-arrow::before {
        border-bottom-color: #444 !important;
    }

    .tooltip.bs-tooltip-top .tooltip-arrow::before {
        border-top-color: #444 !important;
    }

    /* Form styling in modal for dark theme */
    .appointment-form input,
    .appointment-form textarea,
    .appointment-form select {
        background-color: #333;
        color: #e0e0e0;
        border: 1px solid #444;
    }

    .appointment-form input::placeholder,
    .appointment-form textarea::placeholder {
        color: #888;
    }

    .appointment-form input:focus,
    .appointment-form textarea:focus,
    .appointment-form select:focus {
        background-color: #3a3a3a;
        /* border-color: #ffc107; */
        color: #e0e0e0;
    }

    .appointment-form .input-field:has(input.required),
    .appointment-form .input-field:has(textarea.required),
    .appointment-form .input-field:has(select.required) {
        border-color: #ff6b6b;
    }

    /* Country selector dropdown dark theme */
    .custom-select {
        background-color: #333;
        border: 1px solid #444;
    }

    .selected-option {
        background-color: #333;
        color: #e0e0e0;
    }

    .options-container {
        background-color: #333;
        border: 1px solid #444;
    }

    .option {
        background-color: #333;
        color: #e0e0e0;
    }

    .option:hover {
        background-color: #3a3a3a;
        /* color: #ffc107; */
    }

    .search-box {
        background-color: #2a2a2a;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg>');
        color: #e0e0e0;
        border: 1px solid #444;
    }

    .search-box::placeholder {
        color: #888;
    }

    .search-wrapper {
        background-color: #2a2a2a;
        border-bottom: 1px solid #444;
    }

    .country-list {
        background-color: #333;
    }

    /* ==========================================
       DARK THEME FOOTER STYLES
       ========================================== */

    #footer.footer-education {
        background-color: transparent !important;
        border-top: 1px solid #444;
        color: #e0e0e0 !important;
        z-index: 5;
        position: relative;
    }

    .footer-education .widget {
        color: #e0e0e0;
    }

    .footer-education .widget-title {
        color: #fff !important;
        font-weight: 600;
    }

    .footer-education .footer-logo {
        filter: brightness(0.9);
    }

    .footer-education .footer-description {
        color: #b0b0b0;
    }

    .footer-education .footer-contact-info {
        color: #b0b0b0;
    }

    .footer-education .footer-contact-info li {
        color: #b0b0b0 !important;
    }

    .footer-education .footer-contact-info li i {
        color: #ed3947 !important;
    }

    .footer-education .footer-menu a {
        color: #b0b0b0 !important;
        transition: all 0.3s ease;
    }

    .footer-education .footer-menu a:hover {
        /* color: #ffc107; */
        text-decoration: none;
    }

    .footer-education .tt-app-btn {
        background-color: #333;
        color: #e0e0e0;
        border: 1px solid #444;
    }

    .footer-education .tt-app-btn:hover {
        background-color: #3a3a3a;
        /* border-color: #ffc107; */
        /* color: #ffc107; */
    }

    .site-info {
        background-color: transparent;
        border-top: 1px solid #444 !important;
        color: #b0b0b0;
    }

    .site-info .copy-right {
        color: #b0b0b0 !important;
    }

    .footer-social-link a {
        color: #ed3947 !important;
        transition: all 0.3s ease;
        border: 1px solid #ed3947 !important;
    }

    .footer-social-link li {
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .footer-social-link a:hover {
        color: #fff !important;
    }

    .footer-social-link li:hover {
        background-color: rgba(255, 193, 7, 0.2);
    }

    .footer-social-link li a {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Link colors dark theme */
    .tt-counter .suffix,
    .tt-counter .counter,
    .span-heading,
    .banner--ten .banner__feature li,
    .security-image-content-wrapper .section-heading .lead,
    .tt-counter-box__item.style-two .tt-counter-box__count-title,
    .tt-counter-box__item.style-two .tt-counter-box__count,
    .section-heading.style-four .description,
    .tt-icon-box .box-title a,
    .site-header:not(.mobile-header) .menu li.has-submenu .sub-menu li a,
    .feature-tab-nav__title,
    .tt-icon-box.style-five .box-content a,
    .banner__feature-title,
    .testimonial-control>div:hover,
    .faq-section .tt-accordian__nav li a,
    .faq-section .tt-accordian__nav li a:hover,
    .faq-section .tt-accordian h5.collapsed i,
    .hosting_title.text-center h1,
    .pricing-table .pricing-header .price-title,
    .pricing-table .pricing-header .price,
    .pricing-table .pricing-header .price-subtitle,
    .pricing-table .price-feture li,
    .fadeInUp,
    .page-header.pricing-page-header .page-header_title,
    .page-header.pricing-page-header .description,
    .tt-event__title a,
    .text-center .contact-us,
    .contact-content .contact-title,
    .input-wrap label,
    .custom_term-heading,
    .refund_policy_title,
    .custom_font_text,
    .edge-intro p,
    .edge-feat-card__title,
    .edge-feat-card__desc,
    .edge-promise__label,
    .edge-promise__headline,
    .promise-list__text strong,
    .promise-list__text span,
    .edge-how-title,
    .edge-how-sub,
    .how-list-title,
    .how-list-desc,
    .how-list-desc ul li,
    .license-card__duration,
    .license-card__name,
    .license-card__desc,
    .license-card__perks li,
    .blog-hero__title,
    .blog-hero__description p,
    .blog-single-content h3.title,
    .blog-single-content p,
    .sidebar .widget-title,
    .ultraland-widget-recent-posts .post-title a,
    .ultraland-widget-recent-posts .date a,
    .blog-category li a,
    .blog-single-content ul li,
    .tag-list li a,
    .blog-card__title,
    .mobile-header .main-nav-container li.has-submenu li a,
    .toggle-container .toggle-btn, .pricing-cards .card h2,
    .pricing-cards .card .price span, .pricing-cards .card .description,
    .pricing-cards .card .features, .card-footer .btn.secondary:hover,
    .container .hero p, .addons-grid .addon-card .price span,
    .addons-grid .addon-card p, .pricing-cards .card .card-footer p,
    .category-row td, .comparison-table td:first-child
    {
        color: #fff !important;
    }

    .banner.banner--ten, .addons-grid .addon-card, .category-row td {
        background: transparent !important;
    }

    .pricing-two .comparison-table {
        background-color: transparent !important;
        outline: 1px solid #444 !important;
    }

    .comparison-table th, .comparison-table td {
        border: 1px solid #444 !important;
    }

    /* a,  */
    a:hover,
    #footer .footer-menu li a:hover,
    .site-header:not(.mobile-header).header-7 .menu li a:hover,
    .site-header:not(.mobile-header) .menu li.has-submenu .sub-menu li a:hover {
        color: #ED3947 !important;
    }

    .site-header:not(.mobile-header) .menu li.has-submenu .sub-menu {
        background: #1a1a1a;
        border: 1px solid #444;
    }

    .toggle-container {
        background-color: transparent !important;
        border: 1px solid #444 !important;
    }
    .pricing-cards .card {
        background: transparent !important;
        border: 1px solid #444 !important;
    }

    .testimonial-control>div {
        color: #fff !important;
        border: 1px solid #fff !important;
        background: transparent !important;
    }

    .faq-section .tt-accordian__nav {
        background-color: transparent;
        border: 1px solid #444;
        box-shadow: none;
    }

    .faq-section .tt-accordian__nav li a.active {
        background: #fa5441;
    }

    .tt-accordian h5.collapsed {
        /* background-color: #1a1a1a; */
        background-color: transparent !important;
        box-shadow: none;
        color: #fff;
        border: 1px solid #444;
    }
    .faq_transparent_bg .card.faq{
        background-color: transparent !important;
    }

    .tt-accordian .card-header {
        background-color: transparent !important;
    }

    .tt-accordian h5 {
        background-color: transparent;
        border: 1px solid #444;
        box-shadow: none;
        color: #fff;
    }

    .tt-accordian .card-body {
        background: transparent !important;
    }

    .feature-tab-nav__item:hover {
        background-color: #444;
    }

    .feature-tab {
        background-color: transparent;
    }

    .tt-icon-box.style-five {
        box-shadow: none;
    }

    .tt-parallax__image.tt-parallax__image--ten,
    .page-header.pricing-page-header {
        background-color: transparent !important;
    }

    .tt-icon-box.style-five .box-content a:hover {
        color: #ED3947 !important;
    }

    .banner__feature-item,
    .pricing-table {
        background-color: transparent;
        border: 1px solid #444;
    }

    .pricing-table {
        box-shadow: none;
    }

    .appointment-form .input-field input,
    .appointment-form .input-field select,
    .appointment-form .input-field textarea {
        background-color: transparent;
        ;
    }

    .mobile-header.header-5 .tt-hamburger .bar,
    .mobile-header.header-7 .tt-hamburger .bar {
        background: #fff !important;
    }

    .edge-feat-card,
    .promise-list__item {
        background: none !important;
        border: 1px solid #444 !important;
    }

    .how-list-body {
        background: transparent !important;
    }

    /* .custom_bg_edge {
        background: #1a1a1a !important;
        border: 1px solid #444 !important;
    } */
    .license-card,
    .sidebar .widget,
    .custom_bg_edge,
    .tag-list li a {
        background: transparent !important;
        border: 1px solid #333 !important;
    }

    .tag-list li a:hover {
        background: #ed3947 !important;
        color: #fff !important;
    }

    .blog-card__body {
        background: transparent !important;
        border: 1px solid #333 !important;
    }

    .blog-card {
        box-shadow: none !important;
        border-radius: 0px !important;
    }


}

/* ==========================================
   LIGHT THEME (Default - No media query needed)
   ========================================== */

/* ==========================================
   LOGO VISIBILITY RULES (Both Themes)
   Logo switching: main-logo vs logo-sticky
   ========================================== */
.main-logo.dark-theme-logo,
.logo-sticky.dark-theme-logo {
    height: 29px;
}

/* Hide all sticky logos by default */
.site-header .site-logo .logo-sticky {
    display: none !important;
}

/* Hide main logo when sticky */
.site-header.showed .site-logo .main-logo {
    display: none !important;
}

/* LIGHT MODE sticky: show light sticky, hide dark sticky */
/* @media (prefers-color-scheme: light) {
    .site-header.showed .site-logo .logo-sticky.light-theme-logo {
        display: block !important;
    }

    .site-header.showed .site-logo .logo-sticky.dark-theme-logo {
        display: none !important;
    }
    .glassy_overlay .container .row.hero-box .common_banner_img,
    .glassy_overlay .container .row.hero-box .common_banner_img
    {
        display: none !important;
    }
} */

@media (prefers-color-scheme: light) {
    .site-header.showed .site-logo .logo-sticky.light-theme-logo {
        display: block !important;
    }

    .site-header.showed .site-logo .logo-sticky.dark-theme-logo {
        display: none !important;
    }
    .glassy_overlay .container .row.hero-box .common_banner_img,
    .glassy_overlay .container .row.hero-box .common_banner_img
    {
        display: none !important;
    }
}

/* Hide dark theme background images in light mode */
.glassy_overlay .banner-image,
.glassy_overlay .banner-image-mobile {
    display: none !important;
}

@media (prefers-color-scheme: dark) {
    .glassy_overlay .banner-image {
        display: block !important;
    }
    .glassy_overlay .banner-image-mobile {
        display: block !important;
    }
}


/* DARK MODE sticky: show dark sticky, hide light sticky */
@media (prefers-color-scheme: dark) {
    .site-header.showed .site-logo .logo-sticky.dark-theme-logo {
        display: block !important;
    }

    .site-header.showed .site-logo .logo-sticky.light-theme-logo {
        display: none !important;
    }

    /* Glassy Effect Style */
    .hero-box {
        margin-bottom: 80px;
        margin-left: 0 !important;
        width: 100%;
    }

    .hero-box {
        margin-bottom: 40px;
    }

    .banner-image {
        display: flex;
        justify-content: center;
        left: 0;
        position: fixed;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
    }

    .hero-box>div {
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
    }

    .hero-box img {
        position: relative;
        height: auto;
        max-width: 100%;
        /* display: block;
            vertical-align: middle;
            border-style: solid; */
    }

    .banner-image-mobile {
        display: flex;
        justify-content: center;
        left: 0;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: -1;
    }

    @media(max-width: 575.98px) {
        .banner-image {
            display: none;
        }
        .banner-image-mobile {
            display: block;
        }
        .banner-image-mobile img{
            object-fit: cover;
            height: 100vh;
            width: 100vw;
        }
    }

    @media(min-width: 576px) {
        .banner-image-mobile {
            display: none;
        }
        .banner-image {
            display: block;
        }
        .banner-image img {
            height: 100%;
            width: 100%;
            object-fit: cover;
        }
    }

    /* ============================= */
    /* GLASS EFFECT HEADER */
    /* ============================= */

    #masthead {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 999;
        transition: all 0.35s ease;

        /* Default transparent */
        background: transparent !important;
    }

    /* When scrolling */
    #masthead.header-scrolled {
        background: rgba(18, 18, 18, 0.45) !important;

        backdrop-filter: blur(6px) saturate(180%);
        -webkit-backdrop-filter: blur(6px) saturate(180%);

        border-bottom: 1px solid rgba(255, 255, 255, 0.08);

        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
    }

    @media(max-width:992px) {
        .forWebcustomBgHeader #mega-menu-wrap.main-nav-container {
            background: #121212 !important;
        }
    }

    .memzo-header .tt-hamburger .bar {
        background: #fff !important;
    }

    .memzo-header .main-nav-container, .feature-tab-nav__item.active-tab,
    .tt-accordian_faq .card {
        background: transparent !important;
    }
    .pricing-two {
        z-index: 5;
    }
    .tt-accordian {
        z-index: 5;
    }
    .tt-accordian h5 i{
        color: #fff !important;
    }
    .service-seven .container, .section--heading.text-center .section-title-sm.wow.fadeInUp,
    .blog-single-section, .blog-hero-section, .service-four-area .container .row,
    .service-four-area .container .description.wow.fadeInUp p, .right_container,
    .process-section .container .section-heading.style-three.text-center,
    .process-section .container .process-box-wrapper .row, 
    .container .security-image-content .row .col-lg-6 .row.mobile_icons,
    .service .container .tt-feature-tab.wow.fadeInUp, .faq-section, .container .tt-testimonials-wrapper .row.align-items-center .col-md-4
    {
        z-index: 5;
        position: relative;
    }
}

.custom-select {
    height: 50px;
}

@media (prefers-color-scheme: dark) and (max-width: 575.98px) {
    .glassy_overlay .banner-image {
        display: none !important;
    }
}