/* ============================================================
   MOBIL ILOVA (ANDROID, GOOGLE PLAY) — saytdagi reklama elementlari
   ------------------------------------------------------------
   1) header tugmasi (faqat <html class="is-android"> + ≤768px)
   2) pastki "o'rnating" sheet'i (non-modal; public/js/app-promo.js klonlaydi)
   3) footer: Google Play badge + "Mobil ilova" havolasi
   Markup: layouts/app.blade.php, partials/app-promo-sheet.blade.php.

   `html.is-android` klassini <head>dagi erta inline skript qo'yadi (bot'lardan
   tashqari). Desktop/iPhone/bot'da bu fayl header va sheet'ga TA'SIR QILMAYDI;
   desktopda faqat footer o'zgaradi.

   SPETSIFIKLIK: header tugmasi `.btn` klassini OLMAYDI — guest.css'dagi
   ".header__right > .btn" (0,2,0) 18px padding tuzog'iga tushmaslik uchun.
   Barcha Android qoidalari `html.is-android ...` bilan boshlanadi (>= 0,3,1) —
   guest.css'dagi ".header__right{gap}" va ".lang-switcher__btn-sep"ni manba
   tartibidan qat'i nazar yengadi.
   ============================================================ */

:root {
    --app-g1: #0F6B62;       /* CTA gradienti boshi — oq matn bilan 6.4:1 */
    --app-g2: #157A6E;       /* gradient oxiri — oq matn bilan 5.2:1 */
    --app-bright: #04A5B5;   /* faqat bezak (oq bilan 2.98:1 — matn uchun EMAS) */
    --app-ink: #1A2E3B;
    --app-muted: #5A6872;
    --app-tint: #E8F6F8;
    --app-z-sheet: 1000;     /* tabbar 250 < sheet 1000 < ListingSheet 1190 < lead modal 9999 */
}

/* ---------- Ilova ikonkasi (CSS bilan; haqiqiy ikonka gradienti: #0F6B62 -> #04A5B5) ---------- */
.app-promo-icon {
    --s: 56px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--s);
    height: var(--s);
    border-radius: 22.4%;
    background: linear-gradient(135deg, #0F6B62 0%, #04A5B5 100%);
}
.app-promo-icon .brand-logo { color: #fff; }          /* (0,2,0) > .brand-logo (0,1,0) */
.app-promo-icon--lg { --s: 88px; }

/* ============================================================
   1) HEADER TUGMASI
   ============================================================ */

/* Sukut bo'yicha YASHIRIN (desktop, iPhone, bot) */
.app-promo-btn { display: none; }

@media (max-width: 768px) {
    html.is-android .header__right > .app-promo-btn {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        gap: 6px;
        height: 38px;
        padding: 0 12px 0 10px;
        border-radius: 10px;
        background: linear-gradient(135deg, var(--app-g1), var(--app-g2));
        color: #fff;
        font: 700 13px/1 var(--font-sans, 'Inter', system-ui, sans-serif);
        letter-spacing: .1px;
        white-space: nowrap;
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
        transition: transform .12s ease, filter .15s ease;
    }
    html.is-android .app-promo-btn__ic { flex: 0 0 auto; width: 18px; height: 18px; }
    html.is-android .header__right > .app-promo-btn:active { transform: scale(.94); }
    html.is-android .header__right > .app-promo-btn:focus-visible { outline: 2px solid var(--app-g1); outline-offset: 2px; }
}
@media (max-width: 768px) and (hover: hover) {
    html.is-android .header__right > .app-promo-btn:hover { filter: brightness(.9); }
}

/* <=480px: joy ochish — gap 6 -> 4px va 1px bezak ajratgich yashiriladi
   (til/valyuta tugmasida); funksional elementlar joyida qoladi. */
@media (max-width: 480px) {
    html.is-android .header__right { gap: 4px; }
    html.is-android .lang-switcher__btn-sep { display: none; }
}

/* Faqat ikonka (36x36, tap-zona 40x40): viloyat chip'i bor sahifada (bosh sahifa)
   <=480px'da; boshqa sahifalarda <=374px'da. Yorliq aria-label orqali o'qiladi. */
@media (max-width: 480px) {
    html.is-android body.has-header-chip .header__right > .app-promo-btn {
        width: 36px; height: 36px; padding: 0; gap: 0;
    }
    html.is-android body.has-header-chip .header__right > .app-promo-btn::after {
        content: ''; position: absolute; inset: -2px;
    }
    html.is-android body.has-header-chip .app-promo-btn__ic { width: 20px; height: 20px; }
    html.is-android body.has-header-chip .app-promo-btn__label { display: none; }
}
@media (max-width: 374px) {
    html.is-android .header__right > .app-promo-btn {
        width: 36px; height: 36px; padding: 0; gap: 0;
    }
    html.is-android .header__right > .app-promo-btn::after {
        content: ''; position: absolute; inset: -2px;
    }
    html.is-android .app-promo-btn__ic { width: 20px; height: 20px; }
    html.is-android .app-promo-btn__label { display: none; }
}

/* Bosh sahifa viloyat chip'idagi pin-ikonka (<420px) — bezak, joy ochish uchun yashiriladi */
@media (max-width: 419px) {
    html.is-android .header-mobile-region__icon { display: none; }
}

/* ============================================================
   2) PASTKI SHEET (non-modal bottom sheet)
   ============================================================ */
.app-promo-sheet {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--app-z-sheet);
    box-sizing: border-box;
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    /* Balandlik <= min(30vh, 220px): ekranning kichik qismi, kontentni to'smaydi */
    max-height: 30vh;
    max-height: min(30vh, 220px);
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    padding: 0 16px calc(16px + env(safe-area-inset-bottom, 0px));
    background: #fff;
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -12px 36px rgba(2, 34, 42, .22), 0 -1px 0 rgba(2, 34, 42, .06);
    font-family: var(--font-sans, 'Inter', system-ui, sans-serif);
    color: var(--app-ink);
    transform: translateY(105%);
    transition: transform .32s cubic-bezier(.22, .61, .36, 1);
}
.app-promo-sheet.is-open { transform: translateY(0); }
.app-promo-sheet.is-closing {
    transform: translateY(105%);
    transition-duration: .22s;
    transition-timing-function: cubic-bezier(.4, 0, 1, 1);
}
.app-promo-sheet.is-dragging { transition: none; }

.app-promo-sheet__grip {
    display: flex; align-items: center; justify-content: center;
    height: 24px; margin: 0 -16px; cursor: grab; touch-action: none;
}
.app-promo-sheet__grip span { width: 36px; height: 4px; border-radius: 2px; background: #D5DADF; }

.app-promo-sheet__close {
    position: absolute; top: 10px; right: 10px;
    width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: #F1F4F8; color: #5A6B80; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.app-promo-sheet__close::before { content: ''; position: absolute; inset: -4px; }   /* tap 44x44 */
.app-promo-sheet__close:active { background: #E4E9F0; }

.app-promo-sheet__row { display: flex; align-items: center; gap: 14px; padding-right: 40px; touch-action: none; }
.app-promo-sheet__body { min-width: 0; flex: 1 1 auto; }
.app-promo-sheet__title {
    margin: 0; font-size: 16px; line-height: 1.25; font-weight: 800; letter-spacing: -.2px; color: var(--app-ink);
}
.app-promo-sheet__chips {
    display: flex; flex-wrap: wrap; gap: 5px; margin: 7px 0 0; padding: 0; list-style: none;
}
.app-promo-sheet__chips li {
    padding: 2px 9px; border-radius: 999px; background: var(--app-tint); color: #0F6B62;   /* 5.75:1 */
    font-size: 12px; line-height: 1.5; font-weight: 600;
}

.app-promo-sheet__actions { display: flex; align-items: center; gap: 10px; margin-top: 14px; }
.app-promo-sheet__cta {
    flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    height: 48px; padding: 0 14px; border-radius: 12px;
    background: linear-gradient(135deg, var(--app-g1), var(--app-g2)); color: #fff; text-decoration: none;
    font-size: 15px; font-weight: 700; line-height: 1; white-space: nowrap;
    -webkit-tap-highlight-color: transparent; transition: transform .12s ease, filter .15s ease;
}
.app-promo-sheet__cta-ic { width: 20px; height: 20px; flex: 0 0 auto; }
.app-promo-sheet__cta:active { transform: scale(.98); filter: brightness(.92); }
.app-promo-sheet__later {
    flex: 0 0 auto; height: 48px; padding: 0 12px; border: 0; border-radius: 12px; background: transparent;
    color: var(--app-g1); font: 600 14px/1 var(--font-sans, 'Inter', system-ui, sans-serif); cursor: pointer;   /* 6.36:1 */
}
.app-promo-sheet__later:active { background: var(--app-tint); }
.app-promo-sheet__cta:focus-visible,
.app-promo-sheet__later:focus-visible,
.app-promo-sheet__close:focus-visible { outline: 2px solid var(--app-g1); outline-offset: 2px; }
@media (hover: hover) {
    .app-promo-sheet__cta:hover { filter: brightness(.92); }
}

/* Ekran o'qigich uchun polite zona (ko'rinmas) */
.app-promo-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Ingichka ekran (<=359px): 30vh ichida qolish uchun tugmalar bir qatorda, ixcham
   (ustma-ust qo'yilsa balandlik oshib ketadi) — CTA matni kerak bo'lsa 2 qatorga o'raladi */
@media (max-width: 359px) {
    .app-promo-sheet__actions { gap: 8px; }
    .app-promo-sheet__cta { height: auto; min-height: 48px; padding: 6px 10px; font-size: 13.5px; line-height: 1.15; text-align: center; white-space: normal; }
    .app-promo-sheet__cta-ic { display: none; }
    .app-promo-sheet__later { padding: 0 8px; font-size: 13px; }
}
/* Past ekran: 30vh ichida qolish uchun afzallik chiplari yashiriladi */
@media (max-height: 679px) {
    .app-promo-sheet__chips { display: none; }
}
/* Animatsiyani kamaytirish: slayd yo'q, faqat fade */
@media (prefers-reduced-motion: reduce) {
    .app-promo-sheet,
    .app-promo-sheet.is-closing { transform: none; opacity: 0; transition: opacity .15s linear; }
    .app-promo-sheet.is-open { opacity: 1; }
    .app-promo-sheet__cta:active { transform: none; }
    html.is-android .header__right > .app-promo-btn { transition: none; }
}
/* Desktop / past landshaft — sheet umuman ko'rinmaydi */
@media (min-width: 769px), (max-height: 479px) {
    .app-promo-sheet { display: none !important; }
}
/* Hamburger ochilganda yashiriladi (JS ham yopadi) */
body:has(.mobile-nav--open) .app-promo-sheet { display: none; }
@media print {
    .app-promo-sheet, .app-promo-btn { display: none !important; }
}

/* ============================================================
   3) FOOTER — Google Play badge + "Mobil ilova" havolasi
   ============================================================ */
.app-promo-foot { margin-top: 18px; }
.app-promo-foot__tagline {
    margin: 0 0 10px; font-size: 12px; font-weight: 600; letter-spacing: .2px; color: #6b7780;   /* 4.59:1 */
}
.app-badge { --bh: 44px; display: inline-block; line-height: 0; border-radius: 8px; }
.app-badge__img { display: block; height: var(--bh); width: auto; }      /* width/height atributlari CLS'ni oldini oladi */
.app-badge:focus-visible { outline: 3px solid var(--app-g1); outline-offset: 3px; }
@media (hover: hover) {
    /* opacity/rang/filter YO'Q: Google badge'ini o'zgartirish mumkin emas */
    .app-badge { transition: transform .15s; }
    .app-badge:hover { transform: translateY(-1px); }
}
.app-promo-foot__legal {
    max-width: 240px; margin: 10px 0 0; font-size: 11px; line-height: 1.45; color: #6b7780;
}
/* Yangi footer havolasi: mavjud #8a939c oq fonda 3.1:1 (AA'dan past) — shuning uchun #6b7780 (4.59:1).
   Hover rangi (accent) .footer__link:hover (0,2,0) dan keladi. */
.footer__link--app { color: #6b7780; }