/* ============================================================
   R260: MOBILE RESPONSIVE — TAM OPTİMALLAŞDIRMA
   Şəkil ölçüsü, şrift ölçüsü, dizayn yığcamlığı
   ============================================================ */

/* === BASE === */
* { box-sizing: border-box; }
html { 
    -webkit-text-size-adjust: 100%;
    font-size: 16px;
}
body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    line-height: 1.5;
}
img, picture, video, canvas, svg {
    max-width: 100%;
    height: auto;
    display: block;
}
iframe, embed, object { max-width: 100%; }

/* === FLUID TYPOGRAPHY (Ekran ölçüsünə görə şrift) === */
h1 { font-size: clamp(1.5rem, 4vw, 2.5rem); line-height: 1.2; margin: 0.5em 0; }
h2 { font-size: clamp(1.25rem, 3.5vw, 2rem); line-height: 1.25; margin: 0.5em 0; }
h3 { font-size: clamp(1.1rem, 3vw, 1.5rem); line-height: 1.3; margin: 0.5em 0; }
h4 { font-size: clamp(1rem, 2.5vw, 1.25rem); line-height: 1.35; }
p  { font-size: clamp(0.95rem, 2vw, 1.1rem); line-height: 1.6; margin: 0.75em 0; }
li { font-size: clamp(0.9rem, 1.9vw, 1rem); line-height: 1.5; }

/* === CONTAINER === */
.container, .wrap, .wrapper, .content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 16px;
    padding-right: 16px;
}

/* === TABLET (768px-dən kiçik) === */
@media (max-width: 768px) {
    html { font-size: 15px; }
    
    /* Bütün grid-ləri tək sütuna çevir */
    .grid, .cards-grid, .features-grid, .vehicles-grid, .routes-grid,
    .blog-grid, .hotels-grid, .attractions-grid {
        display: block !important;
        grid-template-columns: 1fr !important;
    }
    .grid > *, .cards-grid > *, .features-grid > *,
    .vehicles-grid > *, .routes-grid > *,
    .blog-grid > *, .hotels-grid > *, .attractions-grid > * {
        width: 100% !important;
        margin-bottom: 16px !important;
    }
    
    /* Flex-ləri sütuna çevir */
    .row, .flex-row { flex-direction: column !important; }
    .row > *, .flex-row > * { width: 100% !important; }
    
    /* Header */
    .site-header, header, .topbar {
        padding: 12px 16px !important;
    }
    .site-header .logo img { max-height: 36px !important; }
    .header-nav, .main-nav { display: none !important; }
    
    /* Hero */
    .hero, .hero-section, .banner {
        padding: 32px 16px !important;
        min-height: auto !important;
        text-align: center;
    }
    .hero h1, .hero-title { font-size: 1.75rem !important; }
    .hero p, .hero-subtitle { font-size: 1rem !important; }
    
    /* Booking form */
    .booking-form, .form-row, .form-grid {
        display: block !important;
        width: 100% !important;
    }
    .booking-form input,
    .booking-form select,
    .booking-form textarea,
    .booking-form button,
    .form-control {
        width: 100% !important;
        margin-bottom: 12px !important;
        padding: 14px 16px !important;
        font-size: 16px !important; /* iOS zoom qarşısı */
        border-radius: 8px !important;
        min-height: 48px;
    }
    .booking-form button, .btn-primary {
        min-height: 52px;
        font-size: 16px !important;
    }
    
    /* Kartlar */
    .card, .vehicle-card, .route-card, .blog-card, 
    .hotel-card, .attraction-card {
        padding: 16px !important;
        margin-bottom: 16px !important;
        border-radius: 10px !important;
    }
    
    /* Şəkillər */
    .card img, .vehicle-card img, .blog-card img {
        width: 100% !important;
        height: auto !important;
        max-height: 200px !important;
        object-fit: cover !important;
        border-radius: 8px !important;
    }
    img.hero-image, .hero img {
        max-height: 250px !important;
        object-fit: cover;
    }
    
    /* Cədvəllər */
    table {
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        font-size: 13px !important;
        white-space: nowrap;
    }
    table th, table td {
        padding: 10px 12px !important;
        font-size: 13px !important;
    }
    
    /* Breadcrumb */
    .breadcrumb {
        font-size: 12px !important;
        padding: 8px 0 !important;
        overflow-x: auto;
        white-space: nowrap;
    }
    
    /* Footer */
    .site-footer, footer {
        padding: 24px 16px !important;
        font-size: 14px !important;
    }
    .footer-columns, .footer-grid {
        display: block !important;
    }
    .footer-columns > *, .footer-grid > * {
        width: 100% !important;
        margin-bottom: 20px !important;
    }
    
    /* Naviqasiya */
    .breadcrumb { overflow-x: auto; }
    
    /* Padding azalt */
    section, .section { padding: 24px 16px !important; }
    .card-body, .panel { padding: 16px !important; }
}

/* === MOBILE (480px-dən kiçik) === */
@media (max-width: 480px) {
    html { font-size: 14px; }
    
    h1 { font-size: 1.5rem !important; }
    h2 { font-size: 1.25rem !important; }
    h3 { font-size: 1.1rem !important; }
    p  { font-size: 0.95rem !important; }
    
    .container, .wrap { padding-left: 12px !important; padding-right: 12px !important; }
    
    /* Hero kiçik */
    .hero, .hero-section { padding: 24px 12px !important; }
    .hero h1, .hero-title { font-size: 1.5rem !important; }
    
    /* Düymələr tam genişlik */
    .btn, button, .button, .btn-primary, .btn-secondary {
        width: 100% !important;
        padding: 14px 20px !important;
        font-size: 15px !important;
        min-height: 48px !important;
    }
    
    /* Şəkillər */
    img { max-height: 200px !important; }
    .card img { max-height: 160px !important; }
    
    /* Cədvəl daha kiçik */
    table { font-size: 12px !important; }
    table th, table td { padding: 8px 10px !important; }
    
    /* Gizlət lazımsız elementləri */
    .desktop-only { display: none !important; }
    .sidebar-desktop { display: none !important; }
}

/* === ÇOX KİÇİK (360px-dən kiçik) === */
@media (max-width: 360px) {
    html { font-size: 13px; }
    h1 { font-size: 1.35rem !important; }
    .container, .wrap { padding-left: 10px !important; padding-right: 10px !important; }
}

/* === TOUCH OPTIMIZATION === */
@media (hover: none) and (pointer: coarse) {
    /* Touch-friendly düymələr */
    a, button, .btn, input, select, textarea {
        min-height: 44px;
        min-width: 44px;
    }
    
    /* Hover effektlərini söndür */
    *:hover { transition: none !important; }
    
    /* Link-lər daha böyük */
    a { padding: 4px; }
}

/* === LANDSCAPE MOBILE === */
@media (max-height: 500px) and (orientation: landscape) {
    .hero { padding: 16px 12px !important; min-height: auto !important; }
    .hero h1 { font-size: 1.35rem !important; }
}

/* === PRINT === */
@media print {
    .site-header, .site-footer, .mobile-menu-toggle, 
    .booking-form, .sidebar, .no-print {
        display: none !important;
    }
    body { font-size: 11pt; }
    a { text-decoration: underline; }
}

/* === NAVİQASİYA MENYUSU (mobile) === */
@media (max-width: 768px) {
    .mobile-menu-toggle {
        display: block !important;
        font-size: 24px;
        padding: 8px 12px;
        background: none;
        border: none;
        cursor: pointer;
    }
    .mobile-menu-open {
        position: fixed;
        top: 0; left: 0; right: 0; bottom: 0;
        background: white;
        z-index: 9999;
        padding: 20px;
        overflow-y: auto;
    }
}

/* === ŞƏKİL OPTİMALLAŞDIRMA === */
img {
    image-rendering: -webkit-optimize-contrast;
}
img.lazy {
    opacity: 0;
    transition: opacity 0.3s;
}
img.lazy.loaded {
    opacity: 1;
}

/* === SCROLL DAVRANIŞI === */
html {
    scroll-behavior: smooth;
}
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #555;
}