/* İlçe Atlasım Theme v2.5.0 — V27 viewport and browser compatibility layer. */

:root {
    --ia-viewport-min: 320px;
    --ia-touch-target: 44px;
}

html {
    min-width: var(--ia-viewport-min);
    /* Preserve access to an accidental wide child instead of clipping it. */
    overflow-x: auto;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    min-width: var(--ia-viewport-min);
    overflow-x: visible;
}

:where(.site, .site-content, .site-main, .ia-container, .container, .entry-content,
       .district-page, .province-page, .archive-page, .search-page) {
    min-width: 0;
    max-width: 100%;
}

:where(.hero-grid, .map-grid, .why-grid, .cards-grid, .archive-grid, .latest-grid,
       .popular-grid, .numbers-grid, .stats-grid, .engage-grid, .gallery-grid,
       .district-info-grid, .district-quick-grid, .province-grid, .footer-grid) {
    min-width: 0;
    max-width: 100%;
}

:where(.hero-grid, .map-grid, .why-grid, .cards-grid, .archive-grid, .latest-grid,
       .popular-grid, .numbers-grid, .stats-grid, .engage-grid, .gallery-grid,
       .district-info-grid, .district-quick-grid, .province-grid, .footer-grid) > * {
    min-width: 0;
    max-width: 100%;
}

:where(.hero-search, .header-actions, .district-actions, .card-actions,
       .archive-filters, .compare-actions, .share-actions, .ia-button-group) {
    min-width: 0;
    max-width: 100%;
    flex-wrap: wrap;
}

:where(input, select, textarea) {
    min-width: 0;
    max-width: 100%;
}

:where(button, .button, .btn, [role="button"], input[type="button"], input[type="submit"]) {
    min-height: var(--ia-touch-target);
}

:where(.chart-wrap, .chart-container, .district-chart, .map-embed, .district-map,
       .gallery-slider, .card-rail, .table-scroll, .district-table-wrap) {
    min-width: 0;
    max-width: 100%;
}

:where(canvas, iframe, object, embed) {
    max-width: 100%;
}

:where(.chart-wrap, .chart-container, .district-chart) canvas {
    width: 100% !important;
    height: auto !important;
}

:where(.entry-content, .district-content, .province-content) :where(table) {
    width: max-content;
    min-width: 100%;
}

:where(.entry-content, .district-content, .province-content) :where(a) {
    word-break: break-word;
}

@media (max-width: 1024px) {
    :root {
        --ia-page-gutter: clamp(24px, 4vw, 40px);
    }

    :where(.district-hero-inner, .province-hero-inner, .hero-grid, .map-grid, .why-grid) {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 768px) {
    :root {
        --ia-page-gutter: clamp(20px, 5vw, 28px);
    }

    :where(.site-header, .header-inner, .site-navigation, .mobile-navigation) {
        max-width: 100vw;
    }

    :where(.hero-search, .archive-search, .district-search) > :where(input, select, button) {
        width: 100%;
    }

    :where(.cards-grid, .archive-grid, .latest-grid, .popular-grid, .numbers-grid,
           .engage-grid, .gallery-grid, .district-info-grid, .province-grid, .footer-grid) {
        grid-template-columns: minmax(0, 1fr);
    }

    :where(.stats-grid, .district-quick-grid, .regions-grid) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    :where(.site-logo, .nav-link, .login-btn, .district-label, .hero-badge) {
        white-space: normal;
    }

    :where(.modal, .search-panel, .mobile-menu-panel, .ia-dialog) {
        max-width: calc(100vw - (2 * var(--ia-page-gutter)));
        max-height: calc(100dvh - 24px);
    }
}

@media (max-width: 430px) {
    :root {
        --ia-page-gutter: 20px;
    }

    :where(.stats-grid, .district-quick-grid, .regions-grid) {
        grid-template-columns: minmax(0, 1fr);
    }

    :where(.header-actions, .district-actions, .card-actions, .share-actions) {
        gap: 8px;
    }

    :where(.header-actions, .district-actions, .card-actions, .share-actions) > * {
        max-width: 100%;
    }

    :where(.hero h1, .district-hero h1, .province-hero h1) {
        font-size: clamp(1.75rem, 9vw, 2.125rem);
        line-height: 1.12;
    }

    :where(.section-head h2, .map-content h2, .why-content h2, .footer-cta h2) {
        font-size: clamp(1.5rem, 7vw, 1.875rem);
    }
}

@media (max-width: 360px) {
    :root {
        --ia-page-gutter: 16px;
    }

    :where(.feature-card, .popular-content, .latest-content, .district-summary-card,
           .district-info-card, .district-text-card, .province-card) {
        padding-inline: 18px;
    }

    :where(.login-btn, .button, .btn) {
        padding-inline: 14px;
    }
}

@media (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
    :where(.mobile-menu-panel, .search-panel, .ia-dialog) {
        max-height: calc(100dvh - 12px);
        overflow-y: auto;
        overscroll-behavior: contain;
    }
}

@supports (padding: max(0px)) {
    body {
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
    }

    .site-header {
        padding-top: env(safe-area-inset-top);
    }

    .site-footer {
        padding-bottom: env(safe-area-inset-bottom);
    }
}

@media (forced-colors: active) {
    :where(button, .button, .btn, [role="button"], a) {
        forced-color-adjust: auto;
    }
}