/* =========================================================
   ASOY GROUP
   LIGHT MODE
========================================================= */


/* =========================================================
   GLOBAL
========================================================= */

body.light-mode {
    background: #f4f4f2;
    color: #161616;
}

body.light-mode main {
    background: #f4f4f2;
    color: #161616;
}

body.light-mode h1,
body.light-mode h2,
body.light-mode h3,
body.light-mode h4,
body.light-mode h5,
body.light-mode h6 {
    color: #161616;
}

body.light-mode p {
    color: #5f5f5f;
}


/* =========================================================
   HEADER
========================================================= */

body.light-mode .site-header {
    background: rgba(255, 255, 255, 0.88);

    border-bottom:
        1px solid rgba(0, 0, 0, 0.08);
}

body.light-mode .site-header.scrolled {
    background: rgba(255, 255, 255, 0.97);

    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.08);
}


/* =========================================================
   HEADER LOGO
========================================================= */

/* Normal Light Mode = kırmızı logo */

body.light-mode .header-logo-dark {
    display: none !important;
}

body.light-mode .header-logo-light {
    display: block !important;
}


/* =========================================================
   HEADER TITLE
========================================================= */

body.light-mode .header-title {
    color: #161616;
}


/* =========================================================
   HEADER MENU
========================================================= */

body.light-mode .header-menu-link,
body.light-mode .dropdown-toggle {
    color: #333;
}

body.light-mode .header-menu-link:hover,
body.light-mode .dropdown-toggle:hover {
    color: #a5852f;
}

body.light-mode .header-menu-link::after,
body.light-mode .dropdown-toggle::after {
    background: #a5852f;
}


/* =========================================================
   THEME BUTTON
========================================================= */

body.light-mode .theme-toggle {
    color: #333;

    border-color:
        rgba(0, 0, 0, 0.14);

    background:
        rgba(0, 0, 0, 0.025);
}

body.light-mode .theme-toggle:hover {
    color: #a5852f;

    border-color:
        rgba(165, 133, 47, 0.60);

    background:
        rgba(165, 133, 47, 0.08);
}


/* =========================================================
   LANGUAGE SWITCH
========================================================= */

body.light-mode .language-switch {
    background:
        rgba(0, 0, 0, 0.025);

    border-color:
        rgba(0, 0, 0, 0.10);
}

body.light-mode .lang-btn {
    color: #777;
}

body.light-mode .lang-btn:hover {
    color: #333;
}

body.light-mode .lang-btn.active {
    color: #a5852f;
}

body.light-mode .language-switch > span {
    color: #aaa;
}


/* =========================================================
   HEADER DROPDOWN
========================================================= */

body.light-mode .header-dropdown {
    background:
        rgba(255, 255, 255, 0.98);

    border-color:
        rgba(0, 0, 0, 0.08);

    box-shadow:
        0 20px 40px
        rgba(0, 0, 0, 0.12);
}

body.light-mode .header-dropdown a {
    color: #555;
}

body.light-mode .header-dropdown a:hover {
    color: #a5852f;

    background:
        rgba(165, 133, 47, 0.09);
}


/* =========================================================
   MOBILE HEADER
========================================================= */

body.light-mode .mobile-menu-toggle span {
    background: #222;
}

@media (max-width: 950px) {

    body.light-mode .header-center,
    body.light-mode .header-menu {
        background:
            rgba(255, 255, 255, 0.98);

        border-top-color:
            rgba(0, 0, 0, 0.07);

        box-shadow:
            0 20px 40px
            rgba(0, 0, 0, 0.10);
    }

    body.light-mode .header-menu-link,
    body.light-mode .dropdown-toggle {
        border-bottom-color:
            rgba(0, 0, 0, 0.07);
    }

    body.light-mode .header-dropdown a {
        border-bottom-color:
            rgba(0, 0, 0, 0.06);
    }

}


/* =========================================================
   HOME HERO HEADER
   LIGHT MODE'DA HERO ÜZERİNDE DARK GÖRÜNÜM
========================================================= */

/*
   Anasayfa hero üzerindeyken:
   - Header transparan
   - Beyaz logo
   - Beyaz menüler
*/

body.light-mode
.site-header.home-header:not(.scrolled) {
    background: transparent !important;
    background-color: transparent !important;

    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    border-bottom-color: transparent !important;

    box-shadow: none !important;
}


/* HERO'DA BEYAZ LOGO */

body.light-mode
.site-header.home-header:not(.scrolled)
.header-logo-dark {
    display: block !important;
}

body.light-mode
.site-header.home-header:not(.scrolled)
.header-logo-light {
    display: none !important;
}


/* HERO'DA BEYAZ MENÜ */

body.light-mode
.site-header.home-header:not(.scrolled)
.header-menu-link,

body.light-mode
.site-header.home-header:not(.scrolled)
.dropdown-toggle {
    color: #fff !important;
}


/* Hover */

body.light-mode
.site-header.home-header:not(.scrolled)
.header-menu-link:hover,

body.light-mode
.site-header.home-header:not(.scrolled)
.dropdown-toggle:hover {
    color: #c9a84c !important;
}


/* Dropdown oku */

body.light-mode
.site-header.home-header:not(.scrolled)
.dropdown-arrow {
    color: #fff !important;
}


/* Theme / Language alanları */

body.light-mode
.site-header.home-header:not(.scrolled)
.theme-toggle {
    color: #fff !important;

    border-color:
        rgba(255, 255, 255, 0.22);

    background:
        rgba(255, 255, 255, 0.04);
}

body.light-mode
.site-header.home-header:not(.scrolled)
.theme-toggle:hover {
    color: #c9a84c !important;

    border-color:
        rgba(201, 168, 76, 0.65);
}

body.light-mode
.site-header.home-header:not(.scrolled)
.language-switch {
    background:
        rgba(255, 255, 255, 0.04);

    border-color:
        rgba(255, 255, 255, 0.18);
}

body.light-mode
.site-header.home-header:not(.scrolled)
.lang-btn {
    color:
        rgba(255, 255, 255, 0.70);
}

body.light-mode
.site-header.home-header:not(.scrolled)
.lang-btn:hover {
    color: #fff;
}

body.light-mode
.site-header.home-header:not(.scrolled)
.lang-btn.active {
    color: #c9a84c;
}

body.light-mode
.site-header.home-header:not(.scrolled)
.language-switch > span {
    color:
        rgba(255, 255, 255, 0.35);
}


/* Hamburger beyaz */

body.light-mode
.site-header.home-header:not(.scrolled)
.mobile-menu-toggle span {
    background: #fff !important;
}


/* =========================================================
   HOME HEADER - SCROLL SONRASI
========================================================= */

/*
   Hero'dan çıkınca normal Light Mode:
   - Beyaz header
   - Kırmızı logo
   - Koyu menüler
*/

body.light-mode
.site-header.home-header.scrolled {
    background:
        rgba(255, 255, 255, 0.96) !important;

    backdrop-filter:
        blur(14px) !important;

    -webkit-backdrop-filter:
        blur(14px) !important;

    border-bottom:
        1px solid
        rgba(0, 0, 0, 0.08) !important;

    box-shadow:
        0 10px 30px
        rgba(0, 0, 0, 0.08) !important;
}


/* =========================================================
   SALES PROPERTIES PAGE
========================================================= */

body.light-mode .sales-properties-page,
body.light-mode .sales-properties-section {
    background: #f4f4f2;
}


/* HEADING */

body.light-mode .sales-properties-heading h1 {
    color: #161616;
}

body.light-mode .sales-properties-heading p {
    color: #6f6f6f;
}

body.light-mode .sales-properties-heading > span {
    color: #a5852f;
}


/* =========================================================
   SALES FILTER
========================================================= */

body.light-mode .sales-filter-btn {
    background: #fff;

    border-color:
        rgba(0, 0, 0, 0.10);

    color: #666;
}

body.light-mode .sales-filter-btn:hover {
    border-color: #a5852f;
    color: #a5852f;
}

body.light-mode .sales-filter-btn.active {
    background: #a5852f;
    border-color: #a5852f;
    color: #fff;
}


/* =========================================================
   SALES PROPERTY CARD
========================================================= */

body.light-mode .sales-property-card {
    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f7f7f5
        );

    border-color:
        rgba(0, 0, 0, 0.08);

    box-shadow:
        0 12px 30px
        rgba(0, 0, 0, 0.08);
}

body.light-mode .sales-property-card:hover {
    border-color:
        rgba(165, 133, 47, 0.45);

    box-shadow:
        0 20px 42px
        rgba(0, 0, 0, 0.12);
}


/* CARD TOP */

body.light-mode .sales-property-top {
    border-bottom-color:
        rgba(0, 0, 0, 0.07);
}

body.light-mode .sales-property-top h2 {
    color: #1a1a1a;
}

body.light-mode
.sales-property-top > div:first-child > span {
    color: #888;
}


/* ADDRESS */

body.light-mode .sales-property-address {
    color: #606060;
}


/* =========================================================
   PROPERTY INFORMATION
========================================================= */

body.light-mode .sales-property-info > div {
    background:
        rgba(0, 0, 0, 0.025);

    border-color:
        rgba(0, 0, 0, 0.06);
}

body.light-mode .sales-property-info span {
    color: #8a8a8a;
}

body.light-mode .sales-property-info strong {
    color: #292929;
}


/* =========================================================
   PROPERTY PRICE
========================================================= */

body.light-mode .sales-property-price {
    border-top-color:
        rgba(0, 0, 0, 0.07);
}

body.light-mode .sales-property-price span {
    color: #888;
}

body.light-mode .sales-property-price strong {
    color: #9d7c22;
}


/* =========================================================
   PROPERTY EMPTY MESSAGE
========================================================= */

body.light-mode .sales-empty {
    color: #666;
}


/* =========================================================
   FOOTER
========================================================= */

body.light-mode .site-footer {
    background:
        linear-gradient(
            180deg,
            #eeeeeb 0%,
            #e5e5e1 100%
        );

    color: #333;

    border-top-color:
        rgba(0, 0, 0, 0.08);
}


/* FOOTER LOGO */

body.light-mode .footer-logo .footer-logo-dark {
    display: none !important;
}

body.light-mode .footer-logo .footer-logo-light {
    display: block !important;
}


/* DESCRIPTION */

body.light-mode .footer-description {
    color: #666;
}


/* =========================================================
   FOOTER SOCIAL
========================================================= */

body.light-mode .footer-social a {
    color: #555;

    background:
        rgba(255, 255, 255, 0.45);

    border-color:
        rgba(0, 0, 0, 0.10);
}

body.light-mode .footer-social a:hover {
    color: #9d7c22;

    border-color: #9d7c22;

    background:
        rgba(165, 133, 47, 0.08);
}


/* =========================================================
   FOOTER CONTACT
========================================================= */

body.light-mode .footer-contact-item {
    color: #555;
}

body.light-mode .footer-contact-item a,
body.light-mode .footer-contact-item p {
    color: #555;
}

body.light-mode .footer-contact-item a:hover {
    color: #9d7c22;
}

body.light-mode .footer-contact-icon {
    color: #9d7c22;

    background:
        rgba(255, 255, 255, 0.45);

    border-color:
        rgba(0, 0, 0, 0.10);
}


/* =========================================================
   FOOTER CENTER MENU
========================================================= */

body.light-mode .footer-menu-title {
    color: #222;
}

body.light-mode .footer-menu-links a {
    color: #666;
}

body.light-mode .footer-menu-links a:hover {
    color: #9d7c22;
}


/* =========================================================
   FOOTER RIGHT CARD
========================================================= */

body.light-mode .footer-card {
    background:
        linear-gradient(
            145deg,
            rgba(165, 133, 47, 0.08),
            rgba(255, 255, 255, 0.55)
        );

    border-color:
        rgba(165, 133, 47, 0.22);

    box-shadow:
        0 12px 30px
        rgba(0, 0, 0, 0.05);
}

body.light-mode .footer-card h3 {
    color: #222;
}

body.light-mode .footer-card > p {
    color: #666;
}


/* =========================================================
   FOOTER EMAIL BOX
========================================================= */

body.light-mode .footer-email-box {
    background:
        rgba(255, 255, 255, 0.70);

    border-color:
        rgba(0, 0, 0, 0.10);
}

body.light-mode .footer-email-box:focus-within {
    border-color:
        rgba(165, 133, 47, 0.65);

    background: #fff;
}

body.light-mode .footer-email-box input {
    color: #222;
    background: transparent;
}

body.light-mode .footer-email-box input::placeholder {
    color: #888;
}

body.light-mode .footer-email-box button {
    background: #a5852f;
    color: #fff;
}

body.light-mode .footer-email-box button:hover {
    background: #927424;
}


/* =========================================================
   FOOTER PROJECT STAT
========================================================= */

body.light-mode .footer-project-stat {
    background:
        rgba(255, 255, 255, 0.55);

    border-color:
        rgba(0, 0, 0, 0.08);
}

body.light-mode .footer-project-stat strong {
    color: #9d7c22;
}

body.light-mode .footer-project-stat span {
    color: #666;
}


/* =========================================================
   FOOTER BOTTOM
========================================================= */

body.light-mode .footer-bottom {
    border-top-color:
        rgba(0, 0, 0, 0.08);
}

body.light-mode .footer-copyright,
body.light-mode .footer-designed {
    color: #777;
}

body.light-mode .footer-designed a,
body.light-mode .footer-designed span {
    color: #555;
}

body.light-mode .footer-designed a:hover {
    color: #9d7c22;
}


/* =========================================================
   GENERAL FORM ELEMENTS
========================================================= */

body.light-mode input,
body.light-mode textarea,
body.light-mode select {
    color: #222;
}

body.light-mode input::placeholder,
body.light-mode textarea::placeholder {
    color: #999;
}


/* =========================================================
   THEME TRANSITIONS
========================================================= */

body,
main,
.site-header,
.site-footer,
.header-dropdown,
.theme-toggle,
.language-switch,
.sales-property-card,
.sales-filter-btn,
.sales-property-info > div,
.footer-social a,
.footer-contact-icon,
.footer-card,
.footer-email-box,
.footer-project-stat {
    transition:
        background-color 0.30s ease,
        background 0.30s ease,
        color 0.30s ease,
        border-color 0.30s ease,
        box-shadow 0.30s ease;
}