/* ============================================================================
   TOTAL MOBILE RESPONSIVENESS & FLUID PIPELINE OVERRIDES
   ============================================================================ */

/* --- 1. Fluid Layout Grids & Spacing (repeat auto-fit) --- */
/* .work-types__grid kuralı kaldırıldı: !important auto-fit, work-types.css'teki
   mobil yatay kaydırma düzenini eziyordu — düzen artık tamamen work-types.css'te */

/* .hero-stats auto-fit kuralı kaldırıldı: minmax(220px) dar ekranda hero.css /
   responsive.css düzenleriyle çatışıp kart kaymasına yol açıyordu —
   düzen artık tamamen hero.css + responsive.css'te */

/* .job-specs kuralı kaldırıldı: bileşen artık flex metadata satırı —
   grid-template-columns ölü kuraldı */

/* .action-grid !important auto-fit kuralı kaldırıldı: 2'li/3'lü/tekli sütunlar
   job-card.css'te açıkça tanımlı — global ezme çift layout hesabı yaratıyordu */

/* --- 2. Zero Horizontal Overflow Guards --- */
/* Bileşen listesi sadeleştirildi: .feed-card/.hero-card vb. kendi overflow
   kurallarına sahip — !important zinciri çift stil hesabına yol açıyordu */
html, body {
    max-width: 100vw;
    overflow-x: hidden;
}

img, svg, video, iframe, input, select, textarea {
    max-width: 100%;
}

/* --- 3. WCAG Touch Target Compliance (Pointer Coarse / Touch Screen) --- */
@media (pointer: coarse) {
    .feed-filter-chip {
        min-height: 48px !important;
        /* 16px → 12px: kompakt mobil yoğunlukla hizalı, 48px hedef korunur */
        padding: 0 12px !important;
    }

    /* Ghost-target nötralizasyonu: 48px gerçek yükseklik varken görünmez
       -7px inset genişlemesi komşu çipin alanına taşıyordu */
    .feed-filter-chip::before {
        inset: 0 !important;
    }
    .feed-search,
    .feed-toolbar__sort {
        min-height: 48px !important;
    }
    .icon-btn,
    .icon-btn--search,
    .theme-toggle,
    .modal-close,
    .topbar__pin {
        min-width: 48px !important;
        min-height: 48px !important;
        width: 48px !important;
        height: 48px !important;
    }
    .pagination__link {
        min-width: 48px !important;
        height: 48px !important;
    }
    .bottom-nav__item {
        min-height: 52px !important;
    }
}

/* --- 4. (Kaldırıldı) ---
   .bottom-nav width + padding-bottom ve .fab width @media (max-width: 720px)
   kuralları responsive.css:197 ve responsive.css:156'da AYNI değerlerle zaten
   tanımlı; bu blok son cascade'de aynı değerleri ikinci kez basıyordu. */

/* --- 5. Desktop Hero Separation & Watermark Contrast Clean-up --- */
@media (min-width: 1181px) {
    .feed-shell .hero {
        padding-top: var(--space-8);
        padding-bottom: var(--space-8);
    }
    .feed-shell .hero .hero-card .hero-card__top {
        display: flex;
        align-items: stretch;
        gap: var(--space-8);
    }
    .feed-shell .hero .hero-card .hero-card__top .hero-card__copy {
        flex: 1 1 60%;
        min-width: 60%;
    }
    .feed-shell .hero .hero-card .hero-card__top .hero-card__title {
        line-height: 1.4;
    }
    .feed-shell .hero .hero-card .hero-card__top .hero-card__subtitle {
        line-height: 1.6;
    }
    .feed-shell .hero .hero-card .hero-card__top .hero-map {
        flex: 0 1 40%;
        max-width: 40%;
        width: 100%;
    }
}

.hero-card::after,
html[data-theme="dark"] .hero-card::after {
    opacity: 0.03 !important;
}