/*
 * ASENWARE — Responsive Override CSS
 * Sadece genişlik/grid kurallarını düzeltir, CDN stillerini bozmaz
 * Tüm genişlikler % / vw / rem kullanır
 */

/* ── Temel kurallar ── */
*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; height: auto; }

/* ── Ana kapsayıcı: sabit px yerine % ── */
.w {
    width: 92% !important;
    max-width: 1320px !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ── Inquiry / Feedback toast ── */
.inquiry-toast {
    position: fixed;
    bottom: 24px; right: 24px;
    background: #27ae60;
    color: #fff;
    padding: 14px 22px;
    border-radius: 6px;
    font-size: .93rem;
    z-index: 9999;
    box-shadow: 0 4px 20px rgba(0,0,0,.2);
    transform: translateY(20px);
    opacity: 0;
    transition: opacity .3s, transform .3s;
    max-width: 340px;
}
.inquiry-toast.show  { opacity: 1; transform: translateY(0); }
.inquiry-toast.error { background: #e74c3c; }

/* ════════════════════════════════════════
   Tablet: ≤ 1024px
════════════════════════════════════════ */
@media screen and (max-width: 1024px) {
    .w {
        width: 95% !important;
    }

    /* Nav ürün listesi: 3'lü kolon */
    .ueeshop_product_list li,
    .products_list li {
        width: 33.33% !important;
    }

    /* Footer wrapper */
    .footer_260_1 #footer .index_wrapper_1200 {
        width: 95% !important;
        padding: 0 2% !important;
    }
}

/* ════════════════════════════════════════
   Küçük tablet: ≤ 768px
════════════════════════════════════════ */
@media screen and (max-width: 768px) {
    .w {
        width: 96% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Header / Nav mobile zaten CDN responsive.css'de var,
       sadece içerik alanlarını düzeltiyoruz */

    /* Ürün listesi: 2'li kolon */
    .ueeshop_product_list li,
    .products_list li {
        width: 50% !important;
        float: left !important;
    }

    /* Case listesi: 2'li */
    .ueeshop_responsive_case_list li {
        width: 50% !important;
    }

    /* Info/haber listesi: 2'li */
    .ueeshop_responsive_info_list li,
    .info_list li {
        width: 50% !important;
    }

    /* Sol sidebar kategoriler: tam genişlik */
    .ueeshop_responsive_position.left_position,
    .leftside {
        width: 100% !important;
        float: none !important;
    }
    .rightside {
        width: 100% !important;
        float: none !important;
    }

    /* Banner görseli */
    .banner_module img,
    .banner img {
        width: 100% !important;
        height: auto !important;
    }

    /* Form alanları */
    .ueeshop_responsive_feedback .rows span input,
    .ueeshop_responsive_feedback .rows span select,
    .ueeshop_responsive_feedback .rows span textarea {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Tablo — yatay kaydırma */
    table {
        min-width: 100%;
    }

    /* Footer'daki sabit 1200px */
    .footer_260_1 #footer .index_wrapper_1200 {
        width: 100% !important;
        padding: 0 4% !important;
    }

    /* İndirmeler grid */
    .ueeshop_downloads_list li {
        width: 50% !important;
    }

    h1 { font-size: 1.5rem !important; }
    h2 { font-size: 1.2rem !important; }
}

/* ════════════════════════════════════════
   Mobil: ≤ 480px
════════════════════════════════════════ */
@media screen and (max-width: 480px) {
    .w {
        width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    /* Tek kolon */
    .ueeshop_product_list li,
    .products_list li,
    .ueeshop_responsive_case_list li,
    .ueeshop_responsive_info_list li,
    .info_list li,
    .ueeshop_downloads_list li {
        width: 100% !important;
        float: none !important;
    }

    /* Dokunulabilir butonlar */
    .form_button,
    .btn_submit,
    [type="submit"] {
        min-height: 44px !important;
        width: 100% !important;
        font-size: 1rem !important;
    }

    /* Sayfalama */
    .ueeshop_page_nav a,
    .ueeshop_page_nav span {
        min-width: 36px !important;
        height: 36px !important;
    }

    /* Footer item genişlik */
    .footer_260_1 #footer .footer_top .footer_top_items .footer_top_item {
        width: 100% !important;
    }

    h1 { font-size: 1.25rem !important; }
    h2 { font-size: 1.05rem !important; }

    .inquiry-toast { right: 12px; left: 12px; max-width: 100%; }
}

/* ════════════════════════════════════════
   Çok küçük: ≤ 360px
════════════════════════════════════════ */
@media screen and (max-width: 360px) {
    .w {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

/* ════════════════════════════════════════
   Header Nav Dropdown Fix
════════════════════════════════════════ */

/* #header position:absolute olduğu için overflow:visible şart —
   aksi halde dropdown clip olur.
   position:relative EKLEME — JS top değerini #header'a göre hesaplıyor. */
.header_260_1 #header,
.header_260_1 #header .header_in,
.header_260_1 #header .header_in.fixed {
    overflow: visible !important;
}
.header_260_1 #header .header_in.fixed {
    z-index: 9998 !important;
}

/* Dropdown diğer elementlerin üstünde görünsün */
.default_nav_style .nav_sec {
    z-index: 9999 !important;
}

/* ════════════════════════════════════════
   Yazdırma
════════════════════════════════════════ */
@media print {
    #header, .chat_box, #go_top { display: none !important; }
    .w { width: 100% !important; max-width: 100% !important; }
    img { max-width: 100% !important; }
}
