/* AirData v12: «Safar» and «Shahar» as in the approved mock-ups (19.09.2026). Glass only on the controls; content cards are
   tinted; motion is opacity and position only. */

/* ------------------------------------------------------------ the segmented control: a glass drop glides to the chosen part */
#view .seg.lq-segon::before { background:radial-gradient(120% 90% at 30% 0%, rgba(255,255,255,.5), rgba(255,255,255,.12) 60%), rgba(255,255,255,.14) !important;
  border:1px solid rgba(255,255,255,.55); box-shadow:inset 0 1.5px 1px rgba(255,255,255,.9), inset 0 -1px 1px rgba(255,255,255,.2), 0 6px 16px rgba(0,0,0,.35) !important; }
#view .seg.lq-segon > button { color:rgba(255,255,255,.72) !important; }
#view .seg.lq-segon > button.on { color:#fff !important; font-weight:750; }
#view .seg { height:46px; }

/* ------------------------------------------------------------ search lines: a glass pill with a gold button */
#view form.as-box, #view form.tv-find { border-radius:26px !important; min-height:52px; padding:0 6px 0 14px !important;
  background:linear-gradient(160deg, rgba(255,255,255,.18), rgba(255,255,255,.05)), rgba(18,20,30,.35) !important; border:1px solid rgba(255,255,255,.2) !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.5) !important; -webkit-backdrop-filter:blur(18px) saturate(170%); backdrop-filter:blur(18px) saturate(170%); }
#view form.as-box button[type=submit], #view form.tv-find .tv-find-btn { background:#F7C948 !important; color:#15130a !important; border-radius:20px !important; font-weight:750; min-height:40px; padding:0 16px !important; }
#view form.as-box .as-ic svg { color:#F7C948; }

/* ------------------------------------------------------------ «Manzillar»: mood tiles, destination cards */
#view .v12-moods { display:flex !important; gap:8px; overflow:visible !important; margin:4px 0 16px !important; }
#view .v12-moods button.chip { flex:1; display:flex !important; flex-direction:column; align-items:center; gap:6px; background:none !important; border:0 !important; box-shadow:none !important; padding:0 !important; min-height:0; height:auto; }
#view .v12-moods .mi { width:56px; height:56px; border-radius:20px; display:grid; place-items:center; color:#F7C948;
  background:linear-gradient(160deg, rgba(255,255,255,.16), rgba(255,255,255,.04)), rgba(22,24,34,.62); border:1px solid rgba(255,255,255,.14); transition:transform .4s cubic-bezier(.34,1.56,.64,1), background .3s; }
#view .v12-moods .mi svg.i { width:24px; height:24px; }
#view .v12-moods small { font-size:11.5px; color:rgba(255,255,255,.78); white-space:nowrap; }
#view .v12-moods button.on .mi { background:#fff; color:#111; border-color:#fff; box-shadow:0 8px 20px rgba(0,0,0,.3); }
#view .v12-moods button.on small { color:#fff; font-weight:700; }
#view .v12-moods button:active .mi { transform:scale(.9); }
#view .tv-grid .tv-card { border-radius:24px !important; }
#view .tv-card .tv-deal { background:rgba(61,214,140,.94) !important; color:#062414 !important; font-weight:800; border-radius:12px !important; }
#view .tv-card .pr b { font-size:23px; font-weight:850; letter-spacing:-.02em; }
#view .tv-top { border-radius:22px !important; }

/* ------------------------------------------------------------ «Turlar»: countries as round photos, the choice large, the rest as rows */
#view .v12-circles { display:flex !important; gap:14px !important; overflow-x:auto; scrollbar-width:none; padding:2px 2px 6px !important; }
#view .v12-circles::-webkit-scrollbar { display:none; }
#view .v12-circles .dst { flex:0 0 auto !important; width:72px !important; min-width:0 !important; height:auto !important; padding:0 !important; background:none !important; border:0 !important; box-shadow:none !important;
  display:flex !important; flex-direction:column; align-items:center; gap:6px; text-align:center; overflow:visible !important; }
#view .v12-circles .dst::before { content:""; display:block; width:64px; height:64px; border-radius:50%; background:var(--img, linear-gradient(150deg,#3a2f5c,#15151d)) center/cover;
  border:2px solid rgba(255,255,255,.3); box-shadow:0 6px 14px rgba(0,0,0,.35); transition:transform .4s cubic-bezier(.34,1.56,.64,1); }
#view .v12-circles .dst.um::before { display:none; }
#view .v12-circles .dst .dst-ic { width:64px; height:64px; border-radius:50%; display:grid; place-items:center; font-size:28px; background:rgba(255,255,255,.08); border:2px solid rgba(255,255,255,.3); }
#view .v12-circles .dst > *:not(.dst-ic) { position:static !important; }
#view .v12-circles .dst .dst-l { font-size:12px; line-height:1.2; color:rgba(255,255,255,.85); }
#view .v12-circles .dst .dst-l small { display:block; font-size:10px; color:rgba(255,255,255,.55); white-space:nowrap; }
#view .v12-circles .dst:active::before { transform:scale(.92); }
#view .v12-circles .dst.on::before { border-color:#F7C948; box-shadow:0 0 0 3px rgba(247,201,72,.35), 0 6px 14px rgba(0,0,0,.35); }
#view .v12-circles .dst:not([style*="--img"]):not(.um)::before { display:none; }
#view .v12-circles .dst:not([style*="--img"]) .dst-ic img { width:34px; height:auto; border-radius:4px; }
#view .v12-circles .dst > .ph, #view .v12-circles .dst > .sh { display:none !important; }
#view .tp-rail .tp-card { border-radius:28px !important; overflow:hidden; }
#view .tp-rail .tp-img { height:170px !important; }
/* the tours as rows: the picture left, the score on it, the name, the price and one line of why (the tall photo card of
   liquid.css gives way; the photo's parallax offset does not apply to a thumbnail) */
#view .tr-list .tcard { display:grid !important; grid-template-columns:84px 1fr; column-gap:12px; align-items:center; height:auto !important; min-height:0 !important;
  padding:10px !important; border-radius:24px !important; overflow:hidden; margin-bottom:10px;
  background:linear-gradient(160deg, rgba(255,255,255,.14), rgba(255,255,255,.035) 55%, rgba(255,255,255,.07)), rgba(22,24,34,.62) !important; border:1px solid rgba(255,255,255,.12) !important; box-shadow:none !important; }
#view .tr-list .tcard .tc-img { position:relative !important; inset:auto !important; grid-column:1; grid-row:1; width:84px !important; height:84px !important; border-radius:18px !important; transform:none !important; background-size:cover; background-position:center; }
#view .tr-list .tcard .tc-sc { position:absolute !important; left:14px !important; top:14px !important; right:auto !important; bottom:auto !important; width:auto !important; min-width:0 !important; height:auto !important;
  padding:2px 7px !important; border-radius:10px !important; font-size:12px !important; line-height:1.2; display:flex !important; align-items:baseline; gap:2px; z-index:2; }
#view .tr-list .tcard .tc-sc small { font-size:9px !important; }
#view .tr-list .tcard .tc-b { position:static !important; grid-column:2; grid-row:1; left:auto; right:auto; bottom:auto; padding:0 !important; min-width:0; border-radius:0 !important;
  background:none !important; border:0 !important; box-shadow:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
#view .tr-list .tcard .tc-t { display:block; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#view .tr-list .tcard .tc-t .flag { width:18px; vertical-align:-2px; }
#view .tr-list .tcard .tc-s { display:block; font-size:12px; color:rgba(255,255,255,.62); margin-top:1px; }
#view .tr-list .tcard .tc-row { display:flex; align-items:baseline; justify-content:space-between; margin-top:4px; }
#view .tr-list .tcard .price { font-size:20px !important; font-weight:850; color:#F7C948; }
#view .tr-list .tcard .price small { font-size:11px; color:rgba(255,255,255,.6); font-weight:500; }
#view .tr-list .tcard .pn { font-size:11.5px; color:rgba(255,255,255,.6); }
#view .tr-list .tcard .tc-why { display:block; font-size:11.5px; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#view .tr-list .tcard .tc-ags { display:none !important; }

/* ------------------------------------------------------------ «Reyslar»: the codes large, the calendar by price, flights as rows */
#view .v12-route { position:relative; display:grid !important; grid-template-columns:1fr auto 1fr; grid-template-rows:auto auto; align-items:end; padding:14px 16px !important; border-radius:28px !important; }
#view .v12-route .v12-codes { grid-column:1 / 4; display:flex; align-items:center; justify-content:space-between; margin-bottom:2px; }
#view .v12-route .v12-codes b { font-size:36px; font-weight:850; letter-spacing:-.02em; line-height:1; }
#view .v12-route .v12-codes .arc { position:relative; flex:1; height:40px; margin:0 12px; }
#view .v12-route .v12-codes .arc svg:first-child { position:absolute; inset:0; width:100%; height:40px; }
#view .v12-route .v12-codes .arc path { stroke:rgba(255,255,255,.4); stroke-width:1.4; stroke-dasharray:3 5; }
#view .v12-route .v12-codes .arc svg.i { position:absolute; left:50%; top:0; width:22px; height:22px; margin-left:-11px; color:#F7C948; animation:v12Fly 3.2s cubic-bezier(.45,0,.55,1) 1 both; }
@keyframes v12Fly { from { left:6%; top:26px; transform:rotate(-30deg); opacity:0; } 20% { opacity:1; } to { left:50%; top:0; transform:none; } }
#view .v12-route .cin input { font-size:13px !important; color:rgba(255,255,255,.75) !important; background:none !important; border:0 !important; padding:0 !important; min-height:0 !important; }
#view .v12-route .cin label { font-size:10.5px !important; letter-spacing:.08em; text-transform:uppercase; opacity:.55; }
#view .v12-route .cin:last-child { text-align:right; } #view .v12-route .cin:last-child input { text-align:right; }
#view .v12-route .swap { width:34px !important; height:34px !important; }
#view .v2-verdictcard { border-radius:24px !important; }
#view .calgrid .cday { border-radius:12px !important; }
#view .card.v2-flt { border-radius:22px !important; padding:12px !important; }
#view .card.v2-flt .al-logo { width:44px !important; height:44px !important; border-radius:14px !important; }
#view .card.v2-flt .pr { font-size:18px; font-weight:850; }

/* ------------------------------------------------------------ «Safarlar»: boarding passes */
#view .card.trip.v12-pass { position:relative; padding:16px !important; border-radius:30px !important; overflow:hidden;
  background:linear-gradient(160deg, rgba(255,255,255,.18), rgba(255,255,255,.04) 55%, rgba(255,255,255,.08)), rgba(22,24,34,.66) !important; box-shadow:inset 0 1px 1px rgba(255,255,255,.3), 0 18px 40px rgba(0,0,0,.35) !important; }
.v12-pass .bp-codes { display:flex; align-items:center; justify-content:space-between; margin:4px 0 2px; }
.v12-pass .bp-codes b { display:block; font-size:40px; font-weight:850; letter-spacing:-.03em; line-height:1; }
.v12-pass .bp-codes small { font-size:12px; opacity:.72; }
.v12-pass .bp-codes .r { text-align:right; }
.v12-pass .bp-line { position:relative; flex:1; height:30px; margin:0 12px; }
.v12-pass .bp-line i { position:absolute; left:0; right:0; top:15px; border-top:1.5px dashed rgba(255,255,255,.35); }
.v12-pass .bp-line svg.i { position:absolute; left:50%; top:4px; margin-left:-11px; width:22px; height:22px; color:#F7C948; background:#1a1c26; border-radius:50%; padding:2px; }
.v12-pass .bp-perf { position:relative; margin:14px -16px 12px; border-top:2px dashed rgba(255,255,255,.18); }
.v12-pass .bp-perf::before, .v12-pass .bp-perf::after { content:""; position:absolute; top:-12px; width:22px; height:22px; border-radius:50%; background:#07080d; }
.v12-pass .bp-perf::before { left:-11px; } .v12-pass .bp-perf::after { right:-11px; }
.v12-pass { animation:v12Pass .7s cubic-bezier(.2,.9,.25,1) both; transform-origin:50% 0; }
@keyframes v12Pass { from { opacity:0; transform:perspective(900px) rotateX(-14deg) translateY(12px); } }
.v12-noTrip { display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; padding:28px 20px; border-radius:30px; margin-top:4px;
  background:linear-gradient(160deg, rgba(255,255,255,.14), rgba(255,255,255,.035) 55%, rgba(255,255,255,.07)), rgba(22,24,34,.62); border:1.5px dashed rgba(255,255,255,.22); }
.v12-noTrip .nt-ic { width:64px; height:64px; border-radius:22px; display:grid; place-items:center; color:#F7C948; background:rgba(247,201,72,.12); margin-bottom:4px; }
.v12-noTrip .nt-ic svg.i { width:32px; height:32px; }
.v12-noTrip b { font-size:19px; } .v12-noTrip small { font-size:13.5px; color:rgba(255,255,255,.7); max-width:280px; }
.v12-noTrip .btn { margin-top:8px; background:#F7C948 !important; color:#15130a !important; border-radius:22px !important; font-weight:750; display:inline-flex; gap:6px; align-items:center; padding:0 18px !important; min-height:44px; }

/* ------------------------------------------------------------ «Shahar»: the city is the title, not a row of chips */
body[data-tab="city"] #view > .chips:first-child { display:none !important; }
/* icon categories */
#view .v12-cats { display:flex !important; gap:8px; margin:2px 0 16px !important; overflow-x:auto; scrollbar-width:none; }
#view .v12-cats::-webkit-scrollbar { display:none; }
#view .v12-cats > button { flex:1 0 58px; display:flex !important; flex-direction:column; align-items:center; gap:5px; background:none !important; border:0 !important; box-shadow:none !important; padding:0 !important; min-height:0; height:auto; color:rgba(255,255,255,.75); }
#view .v12-cats .mi { width:52px; height:52px; border-radius:18px; display:grid; place-items:center; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); transition:transform .4s cubic-bezier(.34,1.56,.64,1), background .3s; }
#view .v12-cats .mi svg.i { width:22px; height:22px; }
#view .v12-cats small { font-size:11px; text-align:center; line-height:1.2; max-width:72px; }
#view .v12-cats small em { display:block; font-style:normal; font-size:10px; opacity:.55; }
#view .v12-cats > button.on .mi { background:#fff; color:#111; border-color:#fff; }
#view .v12-cats > button.on { color:#fff; font-weight:700; }
#view .v12-cats > button:active .mi { transform:scale(.9); }
#view .v12-cats.wide > button { flex:0 0 74px; }
/* posters */
#view .v12-posters { display:flex; gap:10px; overflow-x:auto; scrollbar-width:none; margin:0 -16px 14px; padding:0 16px 4px; }
#view .v12-posters::-webkit-scrollbar { display:none; }
#view .v12-posters .pst { position:relative; flex:0 0 200px; height:266px; border-radius:26px; overflow:hidden; text-align:left; transition:transform .4s cubic-bezier(.34,1.56,.64,1); }
#view .v12-posters .pst:active { transform:scale(.97); }
#view .v12-posters .pimg { position:absolute; inset:0; background-size:cover; background-position:center; }
#view .v12-posters .psh { position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 38%, rgba(0,0,0,.82)); }
#view .v12-posters .tm { position:absolute; left:10px; top:10px; padding:6px 10px; border-radius:14px; font-weight:800; font-size:13px; background:rgba(10,12,18,.62); border:1px solid rgba(255,255,255,.2); }
#view .v12-posters .ptx { position:absolute; left:12px; right:12px; bottom:12px; }
#view .v12-posters .ptx b { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; font-size:15px; line-height:1.2; }
#view .v12-posters .ptx small { display:block; font-size:11.5px; opacity:.75; margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#view .tl-head.v12-sub { margin-top:4px; }
/* «Hordiq»: the first place with its picture wide, the rest as rows */
#view .v12-go { display:flex !important; flex-direction:column; gap:8px; }
#view .v12-go .go-card { display:flex !important; align-items:center; border-radius:22px !important; padding:10px !important; min-height:0 !important; }
#view .v12-go .go-card .go-main { display:flex !important; align-items:center; gap:12px; flex:1; min-width:0; text-align:left; }
#view .v12-go .go-card .go-img { position:relative !important; inset:auto !important; width:58px !important; height:58px !important; flex:0 0 58px; border-radius:16px !important; background-size:cover; background-position:center; }
#view .v12-go .go-card .go-tx { position:static !important; }
#view .v12-go .go-card .go-tx b { font-size:15px; }
#view .v12-go .go-card:first-child { position:relative; height:170px; padding:0 !important; overflow:hidden; border-radius:26px !important; }
#view .v12-go .go-card:first-child .go-main { position:absolute; inset:0; }
#view .v12-go .go-card:first-child .go-img { position:absolute !important; inset:0 !important; width:auto !important; height:auto !important; border-radius:0 !important; }
#view .v12-go .go-card:first-child .go-img::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.15) 75%); }
#view .v12-go .go-card:first-child .go-tx { position:absolute !important; left:16px; right:60px; bottom:14px; }
#view .v12-go .go-card:first-child .go-tx b { font-size:19px; }
#view .v12-go .go-card:first-child .open-btn { position:absolute; right:12px; top:12px; }
/* «Joylar»: the place of the day, then a mosaic */
#view .st-card.v12-hero { position:relative; display:block; width:100%; height:230px; border-radius:28px !important; overflow:hidden; margin:0 0 14px; }
#view .st-card.v12-hero .st-img { position:absolute !important; inset:0 !important; width:auto !important; height:auto !important; border-radius:0 !important; animation:v12Settle 2.2s cubic-bezier(.22,1,.36,1) both; }
@keyframes v12Settle { from { transform:scale(1.1); } }
#view .st-card.v12-hero::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.8)); pointer-events:none; }
#view .st-card.v12-hero .st-tx { position:absolute !important; left:16px; right:16px; bottom:14px; z-index:2; }
#view .st-card.v12-hero .st-tx b { font-size:24px; letter-spacing:-.02em; }
#view .v12-badge { position:absolute; left:12px; top:12px; z-index:2; padding:6px 11px; border-radius:14px; font-size:12px; font-weight:750; background:rgba(61,214,140,.94); color:#062414; }
#view .v12-mosaic { display:grid !important; grid-template-columns:1fr 1fr; grid-auto-rows:124px; gap:10px !important; }
#view .v12-mosaic .st-card { position:relative; height:auto !important; border-radius:22px !important; overflow:hidden; }
#view .v12-mosaic .st-card:nth-child(3n+1) { grid-row:span 2; }
/* «Kundalik»: widgets */
#view .card.wx.v12-wx { border-radius:28px !important; background:linear-gradient(160deg, rgba(90,160,255,.34), rgba(90,160,255,.06)), rgba(22,24,34,.62) !important; }
#view .card.wx.v12-wx .wxtop b { font-size:54px; font-weight:300; letter-spacing:-.04em; }
#view .card.pray.v12-pray { border-radius:28px !important; }
#view .v12-near .near-cats { display:grid !important; grid-template-columns:repeat(3, 1fr); gap:10px !important; overflow:visible !important; }
#view .v12-near .near-cat { display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:8px; height:auto !important; min-height:84px; width:auto !important; padding:14px 6px !important; border-radius:22px !important; text-align:center; }
#view .v12-near .near-cat svg.i { width:26px; height:26px; color:#F7C948; }
#view .v12-near .near-cat span { font-size:12px; line-height:1.2; }

@media (prefers-reduced-motion: reduce) { .v12-pass, #view .st-card.v12-hero .st-img, #view .v12-route .v12-codes .arc svg.i { animation:none !important; } }

/* ------------------------------------------------------------ fixes after the first look (19.09.2026) */
/* the tiles of a category row keep their two-line names */
#view .v12-cats { height:auto !important; max-height:none !important; align-items:flex-start !important; flex-wrap:nowrap !important; padding-bottom:4px !important; }
#view .v12-cats > button { height:auto !important; min-height:0 !important; }
#view .v12-cats small { white-space:normal !important; display:block; }
/* «Hordiq» rows: the tall card of liquid.css gives way */
#view .v12-go .go-card { height:auto !important; }
#view .v12-go .go-card .go-main { position:relative !important; inset:auto !important; }
#view .v12-go .go-card .go-tx { position:static !important; background:none !important; border:0 !important; box-shadow:none !important; padding:0 !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
#view .v12-go .go-card .open-btn { position:static !important; flex:0 0 34px; }
#view .v12-go .go-card:first-child { height:170px !important; }
#view .v12-go .go-card:first-child .go-main { position:absolute !important; inset:0 !important; }
#view .v12-go .go-card:first-child .go-tx { position:absolute !important; }
#view .v12-go .go-card:first-child .open-btn { position:absolute !important; }
/* «Turlar» circles: the tile of calm.css gives way */
#view .v12-circles .dst::after { display:none !important; }
#view .v12-circles .dst .dst-ic { position:static !important; }
#view .v12-circles .dst.on { outline:none !important; }
#view .v12-circles .dst .dst-l { text-shadow:none; }
#view .v12-cats > button small, #view .v12-moods button small { color:rgba(255,255,255,.78) !important; }
#view .v12-cats > button.on small, #view .v12-moods button.on small { color:#fff !important; font-weight:700; }
/* the trip card button of a boarding pass sits at the foot, not over the codes */
#view .v12-pass .tc-open { position:absolute !important; top:auto !important; bottom:16px !important; right:16px !important; left:auto !important; }

/* ------------------------------------------------------------ rails that drift: the track slides, the rail stays a rail the finger can take */
#view .lq-auto { display:block !important; }
#view .lq-auto > .lq-track { display:flex; gap:inherit; width:max-content; will-change:transform; }
#view .lq-auto.short > .lq-track > .lq-dup { display:none !important; }
#view .dst-rail.lq-auto > .lq-track { gap:14px; } #view .v12-posters.lq-auto > .lq-track { gap:10px; }
