/* =========================================================
   QONAQLAMA.AZ — ULTRA PREMIUM GLASS (MOBILE) — CLEAN v2
   - No duplicates
   - Layout-safe (does not touch spacers / fixed heights)
   - Scoped ONLY to body.theme-ultra
   - Keep it LAST loaded
   ========================================================= */

:root{
  --ink:#0f172a;
  --muted: rgba(15,23,42,.62);

  /* 4K-ish aurora intensity (balanced) */
  --aurA: rgba(0,185,255,.24);
  --aurB: rgba(255,110,210,.14);
  --aurC: rgba(80,140,255,.18);

  /* Glass palette (ONE source of truth) */
  --glassTop: rgba(235,250,255,.78);
  --glassBot: rgba(185,230,255,.42);
  --glassBorder: rgba(255,255,255,.68);

  /* Depth */
  --shadowSoft: 0 14px 34px rgba(8,22,35,.10);
  --shadowDeep: 0 30px 86px rgba(8,22,35,.12);
  --glow:       0 22px 70px rgba(40,130,255,.14);
  --inset: inset 0 1px 0 rgba(255,255,255,.70);

  --rXL: 26px;
  --rLG: 20px;
  --rMD: 16px;

  /* bottom bar height comes from your base CSS, keep variable only */
  --bbar-h: 62px;
}

/* =========================
   BACKGROUND (only theme)
   ========================= */
body.theme-ultra{
  color: var(--ink);
  background:
    radial-gradient(980px 640px at 16% 10%, var(--aurA), transparent 60%),
    radial-gradient(900px 600px at 86% 18%, var(--aurB), transparent 62%),
    radial-gradient(1100px 720px at 50% 112%, var(--aurC), transparent 66%),
    linear-gradient(180deg, #e9f7ff 0%, #f7fbff 58%, #eef7ff 100%);
  /* only safe padding for bottom bar */
  padding-bottom: calc(var(--bbar-h, 66px) + env(safe-area-inset-bottom, 0px) + 22px);
}

/* =========================
   GLASS helper (supported devices)
   ========================= */
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  body.theme-ultra .m-navbar,
  body.theme-ultra .m-filterbar,
  body.theme-ultra .m-cats .cats-row,
  body.theme-ultra .elan-card,
  body.theme-ultra .m-bbar,
  body.theme-ultra #mobileLangMenu{
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    backdrop-filter: blur(18px) saturate(140%);
  }
}

/* =========================
   NAVBAR (same language)
   ========================= */
body.theme-ultra .m-navbar{
  background: linear-gradient(180deg, var(--glassTop), var(--glassBot));
  border-bottom: 1px solid var(--glassBorder);
  box-shadow: var(--shadowSoft), var(--glow), var(--inset);
}
body.theme-ultra .m-navbar .nav-logo{
  filter: drop-shadow(0 12px 22px rgba(8,22,35,.14));
}

/* =========================
   FILTER BAR (no extra panel look)
   - bar itself is glass
   - buttons are slightly brighter glass
   ========================= */
body.theme-ultra .m-filterbar{
  background: linear-gradient(180deg, rgba(235,250,255,.62), rgba(185,230,255,.30));
  border-bottom: 1px solid rgba(255,255,255,.52);
  box-shadow: 0 10px 26px rgba(8,22,35,.08);
}
body.theme-ultra .m-filterbar .btn{
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(210,242,255,.46));
  border: 1px solid rgba(255,255,255,.70);
  border-radius: 999px;
  box-shadow: 0 12px 26px rgba(8,22,35,.10), var(--inset);
  color: var(--ink);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
body.theme-ultra .m-filterbar .btn:active{
  transform: translateY(1px) scale(.99);
  box-shadow: 0 10px 22px rgba(8,22,35,.10), var(--inset);
}

/* =========================
   CATEGORIES (one piece with filters)
   ========================= */
body.theme-ultra .m-cats{
  background: transparent;
  border-bottom: 0;
}
body.theme-ultra .m-cats .cats-row{
  background: linear-gradient(180deg, rgba(235,250,255,.62), rgba(185,230,255,.30));
  border: 1px solid rgba(255,255,255,.58);
  border-radius: 22px;
  box-shadow: 0 14px 34px rgba(8,22,35,.10), var(--inset);
  padding: 10px 6px;
}
body.theme-ultra .m-cats .cat-avatar{
  border: 1px solid rgba(255,255,255,.66);
  background: rgba(255,255,255,.30);
  box-shadow: 0 14px 28px rgba(40,130,255,.10);
}
body.theme-ultra .m-cats .cat-text{
  color: var(--ink);
}

/* =========================
   CARDS (premium but safe)
   ========================= */
body.theme-ultra .elan-card{
  position: relative;
  border-radius: var(--rXL);
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(200,238,255,.34));
  border: 1px solid rgba(255,255,255,.66);
  box-shadow: var(--shadowSoft), var(--shadowDeep), var(--inset);
  transform: translateZ(0);
  transition: transform .20s ease, box-shadow .20s ease, filter .20s ease;
}
body.theme-ultra .elan-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  background:
    radial-gradient(180px 120px at 20% 10%, rgba(255,255,255,.78), transparent 60%),
    radial-gradient(240px 180px at 85% 0%, rgba(0,185,255,.14), transparent 62%),
    radial-gradient(260px 190px at 10% 95%, rgba(80,140,255,.12), transparent 65%);
  opacity:.55;
  pointer-events:none;
}
body.theme-ultra .elan-card:active{
  transform: translateY(-3px);
  box-shadow: 0 22px 55px rgba(8,22,35,.16), 0 40px 110px rgba(8,22,35,.10), var(--inset);
}

/* ✅ Only main listing photo (icons unaffected) */
body.theme-ultra .elan-card .card-img-top,
body.theme-ultra .elan-card .photo-wrap img,
body.theme-ultra .elan-card .main-photo{
  width: 100%;
  height: 160px;
  object-fit: cover;
  display:block;
  border-radius: var(--rLG);
}

/* Chips (if present) */
body.theme-ultra .elan-card .chip,
body.theme-ultra .elan-card .price-chip,
body.theme-ultra .elan-card .badge{
  background: linear-gradient(180deg, rgba(255,255,255,.74), rgba(210,242,255,.40));
  border: 1px solid rgba(255,255,255,.66);
  border-radius: 999px;
  box-shadow: 0 10px 22px rgba(8,22,35,.10), var(--inset);
}

/* =========================
   BOTTOM BAR (floating)
   ========================= */
body.theme-ultra .m-bbar{
  left: 10px;
  right: 10px;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 10px);
  border-radius: 999px;
  background: linear-gradient(180deg, var(--glassTop), var(--glassBot));
  border: 1px solid var(--glassBorder);
  box-shadow: var(--shadowDeep), var(--glow), var(--inset);
}
body.theme-ultra .m-bbar .bbar-inner{
  padding: 6px 10px 6px !important;
  align-items: center !important;
}
body.theme-ultra .m-bbar .bbtn img{
  width: clamp(30px, 8vw, 36px) !important;
  height: clamp(30px, 8vw, 36px) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.34);
  border: 1px solid rgba(255,255,255,.55);
  box-shadow: 0 10px 22px rgba(8,22,35,.12);
}
body.theme-ultra .m-bbar .bbtn span{
  font-size: 11px !important;
  line-height: 1.05 !important;
  margin-top: 2px !important;
  color: var(--ink) !important;
}

/* =========================
   LANGUAGE MENU
   ========================= */
body.theme-ultra #mobileLangMenu{
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(210,242,255,.42));
  border: 1px solid rgba(255,255,255,.66);
  border-radius: 22px;
  box-shadow: var(--shadowDeep), var(--glow);
}

/* =========================
   MOTION SAFETY
   ========================= */
@media (prefers-reduced-motion: reduce){
  body.theme-ultra *{ transition:none !important; animation:none !important; }
}
