/* ============================================
   Responsive CSS — Lüks Tasarım v2.0
   ============================================ */

/* ---- Scrollbar gizle ---- */
.main-content::-webkit-scrollbar,
.modal::-webkit-scrollbar,
.filter-bar::-webkit-scrollbar { display: none; }

/* ---- Safe area — çentikli telefonlar ---- */
@supports (padding: max(0px)) {
    .bottom-nav {
        padding-bottom: max(env(safe-area-inset-bottom), 8px);
        height: calc(var(--nav-height) + max(env(safe-area-inset-bottom), 0px));
    }
}


/* ---- Küçük ekranlar (< 380px) ---- */
@media (max-width: 379px) {
    :root {
        --header-height: 75px;
        --nav-height: 64px;
    }

    .header {
        padding: 0 14px;
    }

    .header__logo-img {
        height: calc(var(--header-height) - 12px);
        max-height: calc(var(--header-height) - 12px);
        max-width: 180px;
    }

    .hero-slider__title {
        font-size: 1.75rem;
    }

    .hero-slider__btn {
        padding: 13px 26px;
        font-size: 0.7rem;
    }

    .category-card__img,
    .category-card__img-placeholder {
        width: 58px;
        height: 58px;
    }

    .product-card__img,
    .product-card__img-placeholder {
        width: 72px;
        height: 72px;
    }

    .modal__name {
        font-size: 1.5rem;
    }

    .lang-switcher__btn {
        padding: 5px 9px;
        font-size: 0.68rem;
    }

    .category-list,
    .product-list,
    .info-section {
        padding-left: 12px;
        padding-right: 12px;
    }

    .bottom-nav__item.active .bottom-nav__icon-wrap {
        width: 46px;
        height: 46px;
        margin-top: -18px;
    }
}

/* ---- Normal telefon (380px – 599px) ---- */
@media (min-width: 380px) and (max-width: 599px) {
    .hero-slider__title {
        font-size: clamp(1.9rem, 7vw, 2.5rem);
    }
}

/* ---- Tablet / geniş mobil (≥ 600px) ---- */
@media (min-width: 600px) {
    body {
        align-items: flex-start;
        justify-content: center;
        padding: 24px 16px;
        background: linear-gradient(135deg, #E6E4DD 0%, #D8D6CF 50%, #E0DDD6 100%);
        min-height: 100dvh;
    }

    .header--home {
        border-radius: 24px 24px 0 0;
    }

    .hero-slider__title {
        font-size: 2.8rem;
    }

    .category-list {
        padding: 24px 20px 28px;
    }

    .product-list {
        padding: 8px 20px 28px;
    }

    .info-section {
        padding: 24px 20px 32px;
    }

    .modal__body {
        padding: 26px 28px 14px;
    }
}

/* ---- Tablet (≥ 768px) ---- */
@media (min-width: 768px) {
    body {
        padding: 24px;
    }

    .app-container {
        max-width: 520px;
        margin: 0 auto;
        border-radius: 24px;
    }

    .hero-slider {
        min-height: 440px;
    }

    .hero-slider__title {
        font-size: 2.8rem;
    }

    .hero-slider__subtitle {
        font-size: 1rem;
        max-width: 340px;
    }

    .hero-slider__btn {
        padding: 16px 40px;
        font-size: 0.78rem;
    }

    .category-card__img,
    .category-card__img-placeholder {
        width: 76px;
        height: 76px;
    }

    .category-card__name {
        font-size: 1.3rem;
    }

    .product-card__img,
    .product-card__img-placeholder {
        width: 88px;
        height: 88px;
    }

    .product-card__name {
        font-size: 1.15rem;
    }

    .filter-btn {
        padding: 9px 20px;
        font-size: 0.82rem;
    }
}

/* ---- Büyük ekran (≥ 1024px) ---- */
@media (min-width: 1024px) {
    body {
        padding: 32px;
        align-items: center;
        min-height: 100dvh;
    }

    .app-container {
        max-width: 520px;
        margin: 0 auto;
        height: calc(100dvh - 64px);
        max-height: calc(100dvh - 64px);
        border-radius: 28px;
    }
}

/* ---- Yüksek yoğunluklu ekranlar ---- */
@media (min-resolution: 2dppx) {
    .hero-slider__bg img {
        image-rendering: -webkit-optimize-contrast;
    }
}

/* ---- Koyu mod (sistem ayarı) ---- */
@media (prefers-color-scheme: dark) {
    /* Varsayılan olarak açık tema korunur,
       ancak body arka planı biraz daha koyulaşır */
    body {
        background: #1C1C1A;
    }
}

/* ---- Hareket azaltma ---- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .hero-slider__track {
        transition: none;
    }
}

/* ---- Yatay mod (landscape) ---- */
@media (orientation: landscape) and (max-height: 500px) {
    :root {
        --header-height: 54px;
        --nav-height: 60px;
    }

    .app-container {
        height: 100dvh;
    }

    .hero-slider {
        min-height: 320px;
        height: calc(100dvh - var(--header-height) - var(--nav-height));
    }


    .hero-slider__title {
        font-size: 1.75rem;
        margin-bottom: 8px;
    }

    .hero-slider__subtitle {
        margin-bottom: 16px;
    }

    .bottom-nav__item.active .bottom-nav__icon-wrap {
        width: 44px;
        height: 44px;
        margin-top: -16px;
    }
}

/* ---- Print ---- */
@media print {
    .bottom-nav,
    .modal-overlay,
    .header__btn { display: none; }

    .app-container {
        box-shadow: none;
        border-radius: 0;
        max-width: 100%;
    }
}