/* ============================================
   ELMAS CUSTOM CSS
   Consolidated fixes for Menu, Cart, Slider, and Mobile Layouts
   Replaces: menu-fix.css, cart-dropdown-fix.css, slider-mobile-only.css, 
             ticker-fix.css, slider-height-fix.css, rtl-support.css,
             payment-methods-footer-fix.css, story-fix.css
   ============================================ */

/* -----------------------------------------------------------
   1. MENU & NAVIGATION FIXES
   ----------------------------------------------------------- */
.header-wrap,
.header-nav,
.main-menu,
.main-menu>nav,
.main-menu>nav>ul {
    position: relative;
    overflow: visible !important;
    z-index: 100;
}

.main-menu>nav>ul>li {
    position: relative !important;
    z-index: 10;
}

.main-menu>nav>ul>li>a {
    pointer-events: auto !important;
    cursor: pointer !important;
    position: relative;
    z-index: 11 !important;
}

/* Sub-menus */
.main-menu>nav>ul>li ul.sub-menu {
    position: absolute !important;
    left: 0 !important;
    top: 100% !important;
    z-index: 1000 !important;
    pointer-events: auto !important;
    opacity: 0 !important;
    visibility: hidden !important;
    margin-top: 10px !important;
    display: block !important;
    min-width: 250px;
    background-color: #fff;
    padding: 25px 15px;
    border-radius: 10px;
    box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.05);
    transition: all 0.25s ease;
}

.main-menu>nav>ul>li:hover ul.sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    margin-top: 0 !important;
}

/* -----------------------------------------------------------
   2. CART DROPDOWN FIXES (Desktop Only)
   ----------------------------------------------------------- */
@media (min-width: 992px) {

    .header-middle,
    .header-middle .header-wrap {
        position: relative;
        z-index: 900;
    }

    .header-middle .cart-dropdown-wrap {
        z-index: 901;
        position: absolute;
    }

    .sticky-bar.stick.header-bottom {
        z-index: 899;
    }
}

/* -----------------------------------------------------------
   3. MOBILE SLIDER FIXES
   ----------------------------------------------------------- */
@media (max-width: 991.98px) {

    .home-slider,
    section.home-slider {
        margin: 0 !important;
        padding: 0 !important;
    }

    .home-slider .container,
    section.home-slider .container {
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .home-slider .slider-mobile-image {
        width: 100% !important;
        height: 0 !important;
        padding-bottom: 60% !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
        display: block !important;
        border-radius: 0 !important;
    }
}

/* -----------------------------------------------------------
   4. TICKER FIX (Layout Shift & Overflow)
   ----------------------------------------------------------- */
#news-flash,
#news-flash1 {
    position: relative !important;
    overflow: hidden !important;
    height: 35px !important;
    line-height: 37px !important;
    display: inline-block !important;
}

#news-flash ul,
#news-flash1 ul {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#news-flash li,
#news-flash1 li {
    position: relative !important;
    height: 35px !important;
    width: 100% !important;
    white-space: nowrap !important;
    display: block !important;
    line-height: 35px !important;
}

/* -----------------------------------------------------------
   5. PAYMENT LOGOS FOOTER FIX
   ----------------------------------------------------------- */
.mobile-social-icon {
    display: block !important;
    width: 100% !important;
}

.mobile-social-icon a {
    display: inline-block !important;
    margin-right: 5px;
}

.payment-methods-logos {
    margin-left: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto;
}

.payment-methods-logos img {
    max-height: 40px;
    width: auto;
}

@media (max-width: 991px) {
    .mobile-social-icon {
        display: block !important;
    }

    .payment-methods-logos {
        margin-left: 0;
        margin-top: 15px;
        width: 100%;
    }
}

/* -----------------------------------------------------------
   6. STORY FIX
   ----------------------------------------------------------- */
#story_watch {
    position: fixed !important;
    z-index: 1100 !important;
    top: 90px !important;
    left: calc(50% - 200px) !important;
    max-width: 600px !important;
    display: none;
    background: linear-gradient(45deg, #f33057, #3858f9);
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

#opactiy_bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 1099 !important;
    display: none;
}

#story_watch.show~#opactiy_bg,
body.story-open #opactiy_bg {
    display: block;
}

/* -----------------------------------------------------------
   7. SLIDER HEIGHT FIX
   ----------------------------------------------------------- */
.home-slider .hero-slider-1,
.home-slider .hero-slider-1 .single-hero-slider {
    height: 100% !important;
    min-height: 400px;
    max-height: 500px;
}

.home-slide-cover {
    height: 100%;
}

.col-lg-3 .banner-img.style-4 {
    height: 100%;
    min-height: 400px;
    max-height: 500px;
}

.col-lg-3 .banner-img.style-4 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

@media (max-width: 991px) {

    .home-slider .hero-slider-1,
    .home-slider .hero-slider-1 .single-hero-slider {
        min-height: auto !important;
        max-height: none !important;
        height: auto !important;
    }

    .col-lg-3 .banner-img.style-4 {
        min-height: 200px;
        max-height: 300px;
    }
}

/* Floating Contact Buttons */
.floating-contact-buttons {
    position: fixed;
    bottom: 30px;
    left: 30px;
    right: auto;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.floating-btn {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 30px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
    text-decoration: none !important;
}

.floating-btn:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
    color: #fff;
}

.floating-btn.phone-btn {
    background: #007bff;
}

.floating-btn.whatsapp-btn {
    background: #25D366;
}

.floating-btn i {
    line-height: 1;
}

/* Mobile Adjustments */
@media (max-width: 768px) {
    .floating-contact-buttons {
        bottom: 20px;
        left: 20px;
        right: auto;
        gap: 10px;
    }

    .floating-btn {
        width: 50px;
        height: 50px;
        font-size: 24px;
    }
}

/* POPUP Z-INDEX FIX - REMOVED (Fixed via Header Z-Index Refactor) */

/* Popup Close Button Styling */
#popupreklam .btn-close {
    position: absolute !important;
    right: 15px !important;
    top: 15px !important;
    z-index: 99999 !important;
    background-color: #fff !important;
    opacity: 1 !important;
    border-radius: 50% !important;
    padding: 0 !important;
    width: 40px !important;
    height: 40px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid #eee !important;
    font-size: 20px !important;
    outline: none !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") !important;
    background-size: 16px !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* -----------------------------------------------------------
   7. GOOGLE TRANSLATE CUSTOM
   ----------------------------------------------------------- */
/* Hide Default Google Bar - Robust Fix */
.goog-te-banner-frame.skiptranslate,
.goog-te-banner-frame,
.goog-te-balloon-frame,
#goog-gt-tt,
.goog-te-balloon-frame,
iframe[name="goog-te-banner-frame"],
iframe.goog-te-banner-frame {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
}

body {
    top: 0px !important;
    position: static !important;
    /* Prevents Google from pushing body down */
}

#google_translate_element {
    display: none !important;
}

.goog-tooltip {
    display: none !important;
}

.goog-te-gadget-simple {
    display: none !important;
}

/* Hide Mobile Top Bar */
.VIpgJd-ZVi9od-ORHb-OEVmcd {
    display: none !important;
}

.skiptranslate {
    display: none !important;
}

/* Ensure our widget is visible though skiptranslate might hide it if not careful.
   Actually, our widget uses custom classes.
   But if Google wraps everything in skiptranslate, we might lose our widget.
   Standard Google behavior is adding skiptranslate to ITS OWN elements.
   Safe to hide .skiptranslate. */

/* Custom Dropdown Container */
.custom-lang-dropdown {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin-right: 15px;
    font-family: 'Inter', sans-serif;
}

/* Current Language (Trigger) */
.current-lang {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    padding: 5px;
    border-radius: 4px;
    transition: background-color 0.2s;
}

.current-lang:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.current-lang i {
    font-size: 12px;
    color: #666;
}

/* Dropdown List */
.lang-list {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border: 1px solid #eee;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    padding: 5px 0;
    min-width: 140px;
    z-index: 1000;
    margin-top: 5px;
}

.lang-list.show {
    display: block;
    animation: fadeIn 0.2s ease;
}

/* Dropdown Item */
.lang-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 15px;
    cursor: pointer;
    font-size: 14px;
    color: #333;
    transition: all 0.2s;
}

.lang-list li:hover {
    background-color: #f8f9fa;
    color: #088178;
}

/* Flag Styles in List */
.lang-list li .flag-icon {
    width: 20px;
    height: 15px;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* Active Flag in Header */
.active-flag-icon {
    width: 24px;
    height: 18px;
    border-radius: 3px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

@keyframes fadeIn {
    from {
        opacity: 0;
        margin-top: 10px;
    }

    to {
        opacity: 1;
        margin-top: 5px;
    }
}

/* Desktop Header Specific */
.header-action-2 .custom-lang-dropdown {
    margin-right: 20px;
}

/* RTL Adjustments */
body.rtl-active,
html[dir="rtl"] body {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .header-info.f-left {
    float: right !important;
}

html[dir="rtl"] .header-info.f-right {
    float: left !important;
}

/* RTL Cart Dropdown Fix */
html[dir="rtl"] .cart-dropdown-wrap {
    left: 0 !important;
    right: auto !important;
}

html[dir="rtl"] .header-action-2 .header-action-icon-2:last-child {
    padding-right: 0;
    padding-left: 0;
}

html[dir="rtl"] .custom-lang-dropdown {
    margin-right: 0;
    margin-left: 15px;
}

/* Mobile Specific (Footer) */
.mobile-social-icon .custom-lang-dropdown {
    display: none;
    /* Hide dropdown if present */
}

.mobile-lang-flags {
    display: flex;
    gap: 15px;
    margin-top: 15px;
    flex-wrap: wrap;
    align-items: center;
}

.mobile-lang-flags .lang-flag {
    width: 28px;
    height: 21px;
    opacity: 0.8;
}

.mobile-lang-flags .lang-flag.active {
    opacity: 1;
    transform: scale(1.1);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
    border: 1px solid #fff;
}

/* Admin Specific */
.app-sidebar .custom-lang-dropdown {
    width: 100%;
    text-align: center;
    margin-right: 0;
    padding: 10px 0;
}

.app-sidebar .lang-list {
    bottom: 100%;
    top: auto;
    left: 20px;
    transform: none;
    margin-bottom: 5px;
}

.side-menu__item .custom-lang-widget {
    display: flex;
    flex-wrap: wrap;
    padding: 5px 0;
}

/* RTL Product Detail Page Fixes */
html[dir="rtl"] .product-slider-wrapper {
    float: right;
}

html[dir="rtl"] .detail-info {
    text-align: right;
}

html[dir="rtl"] .title-detail {
    text-align: right;
}

html[dir="rtl"] .product-price-cover .product-price {
    float: right;
}

html[dir="rtl"] .product-price-cover .save-price,
html[dir="rtl"] .product-price-cover .old-price {
    margin-left: 0;
    margin-right: 15px;
}

html[dir="rtl"] .product-rate-cover {
    text-align: right !important;
}

html[dir="rtl"] .product-rate {
    float: right;
}

html[dir="rtl"] .product-detail-rating .text-muted {
    margin-left: 0;
    margin-right: 5px;
}

html[dir="rtl"] .attr-detail strong {
    margin-right: 0;
    margin-left: 10px;
}

html[dir="rtl"] .list-filter {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 5px;
}

html[dir="rtl"] .detail-qty {
    float: right;
    margin-right: 0;
    margin-left: 15px;
}

html[dir="rtl"] .product-extra-link2 {
    float: right;
}

html[dir="rtl"] .product-extra-link2 a {
    margin-left: 0;
    margin-right: 10px;
}

html[dir="rtl"] .zoom-icon {
    right: auto;
    left: 20px;
}

/* Slick Slider RTL Fixes */
html[dir="rtl"] .slick-slide {
    float: right;
}

html[dir="rtl"] .product-image-slider .slick-slide img {
    margin: 0 auto;
}

/* Mobile RTL Slider Gap Fix */
@media (max-width: 768px) {
    html[dir="rtl"] .main.mt-15 {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    html[dir="rtl"] .home-slider {
        padding-top: 0 !important;
        margin-top: -10px !important;
        /* Force pull up if needed */
    }

    /* Hide story section container if empty or taking space */
    html[dir="rtl"] .popular-categories {
        padding-top: 0 !important;
        min-height: 0 !important;
    }

    /* Prevent default body padding from google banner ghost */
    html[dir="rtl"] body {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
}

/* Admin Header Language Dropdown */
.header-lang-dropdown {
    position: relative;
    padding: 0 10px;
    z-index: 1002;
    cursor: pointer;
}

.header-lang-dropdown .current-lang {
    display: flex;
    align-items: center;
    gap: 5px;
    background: transparent;
    padding: 5px 10px;
    border-radius: 5px;
    transition: background 0.3s;
}

.header-lang-dropdown .current-lang:hover {
    background: rgba(0, 0, 0, 0.05);
}

.header-lang-dropdown .lang-list {
    position: absolute;
    top: 120%;
    right: 0;
    width: 150px;
    background: #fff;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    padding: 5px 0;
    display: none;
    border: 1px solid #eee;
}

.header-lang-dropdown .lang-list.show {
    display: block;
    animation: fadeIn 0.3s ease;
}

/* Override conflicting sidebar styles if any */
.header-lang-dropdown .lang-list li {
    padding: 8px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 13px;
    color: #333;
}

.header-lang-dropdown .lang-list li:hover {
    background: #f8f9fa;
    color: #667eea;
}

/* Fix Product Image Overlap on Cart Popup */
.modal-backdrop {
    z-index: 100000 !important;
}

.custom-modal {
    z-index: 100001 !important;
}

.zoomContainer {
    z-index: 9999 !important;
    /* Ensure it stays below modal */
}

/* --- Cart Page Enhancements --- */
/* Make contract and payment checkboxes larger and clearer */
.cart-totals .form-check {
    background-color: #f8f9fa;
    /* Light background to separate items */
    padding: 10px 15px 10px 45px;
    /* Extra padding for click area */
    border-radius: 8px;
    margin-bottom: 10px;
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.cart-totals .form-check:hover {
    background-color: #e9ecef;
    border-color: #dee2e6;
}

.cart-totals .form-check-input {
    width: 1.4em;
    height: 1.4em;
    margin-left: -35px;
    /* Adjust position for larger size */
    margin-top: 0.1em;
    border: 2px solid #adb5bd;
    cursor: pointer;
}

.cart-totals .form-check-input:checked {
    background-color: #577ca5;
    /* Brand color */
    border-color: #577ca5;
}

.cart-totals .form-check-label {
    font-size: 15px;
    font-weight: 600;
    color: #253D4E;
    width: 100%;
    cursor: pointer;
}

.cart-totals .form-check-label a {
    color: #577ca5;
    text-decoration: underline;
}

/* Specific style for "Guest Checkout" to make it stand out more */
#uyeliksiz+.form-check-label {
    color: #fd7e14;
    /* Orange color for distinct action */
}

/* Error Message Styling */
#sepet_mesaj,
#sepet_mesaj1 {
    background-color: #ffe6e6;
    color: #dc3545;
    padding: 15px;
    border-radius: 8px;
    border: 1px solid #f5c6cb;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
    display: none;
}

/* Modern Dashboard Menu Styles */
.dashboard-menu {
    border-radius: 10px;
    border: 1px solid #ececec;
    padding: 15px;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

.dashboard-menu .nav-link {
    font-weight: 600;
    padding: 15px 20px;
    color: #7e7e7e;
    border-radius: 8px;
    margin-bottom: 10px;
    border: 1px solid transparent;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
}

.dashboard-menu .nav-link i {
    font-size: 18px;
    margin-right: 15px !important;
    transition: all 0.3s ease;
}

.dashboard-menu .nav-link:hover {
    background-color: #f4fcf7;
    /* Light green tint */
    color: #12bd60;
    /* Site primary green */
    transform: translateX(5px);
    border-color: #e8f5e9;
}

.dashboard-menu .nav-link.active {
    background-color: #12bd60 !important;
    color: #fff !important;
    box-shadow: 0 4px 10px rgba(18, 189, 96, 0.3);
}

.dashboard-menu .nav-link.active i {
    color: #fff !important;
}