/* ====== MSP.uz — uslublar (mobil-birinchi, qulay, yirik) ====== */
:root{
  --teal:#0e7a8a; --teal-dark:#0a5d69; --teal-soft:#e7f3f4;
  --amber:#f59e0b; --amber-dark:#d97f06;
  --green:#16a34a; --green-dark:#12823b;
  --red:#dc2626;
  --bg:#f4f7f8; --card:#ffffff; --ink:#15282e; --muted:#5d7077; --line:#e2eaed;
  --radius:14px; --radius-sm:10px;
  --shadow:0 1px 2px rgba(16,40,46,.06), 0 6px 18px rgba(16,40,46,.06);
  --shadow-lg:0 8px 30px rgba(16,40,46,.12);
  --maxw:1180px;
  --font:"Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; overflow-x:hidden}
body{
  margin:0; font-family:var(--font); color:var(--ink); background:var(--bg);
  font-size:16.5px; line-height:1.5; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;                 /* gorizontal skroll chiqmasin (mobil) */
  max-width:100%;
}
/* Keng elementlar sahifadan tashqariga chiqib skroll chiqarmasin */
table, pre, .table-scroll, .recent-strip, .shop-strip, .kind-strip, .group-strip{max-width:100%}
input, select, textarea{max-width:100%}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 14px; width:100%}
.muted{color:var(--muted)}
.small{font-size:.86em}
.center{text-align:center}
.lead{font-size:1.05em}
.req{color:var(--red)}

/* ---------- Tugmalar ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 18px; border:0; border-radius:var(--radius-sm); cursor:pointer;
  font-family:inherit; font-size:1rem; font-weight:700; line-height:1; transition:.15s;
  background:#eef2f3; color:var(--ink); white-space:nowrap;
}
.btn:hover{filter:brightness(.97)}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--teal); color:#fff}
.btn-primary:hover{background:var(--teal-dark)}
.btn-accent{background:var(--amber); color:#3b2600}
.btn-accent:hover{background:var(--amber-dark); color:#fff}
.btn-call{background:var(--green); color:#fff; font-size:1.08rem; padding:15px}
.btn-call:hover{background:var(--green-dark)}
.btn-ghost{background:#fff; border:1.5px solid var(--line); color:var(--ink)}
.btn-ok{background:var(--green); color:#fff}
.btn-warn{background:#f59e0b; color:#3b2600}
.btn-del{background:#fee2e2; color:var(--red)}
.btn-block{display:flex; width:100%}
.btn-lg{padding:16px; font-size:1.1rem}
.btn-sm{padding:9px 13px; font-size:.92rem; border-radius:9px}

/* ---------- Sarlavha (header) ---------- */
.site-head{position:sticky; top:0; z-index:50; background:var(--teal);
  box-shadow:0 2px 14px rgba(10,93,105,.25)}
.head-inner{display:flex; align-items:center; gap:12px; padding:11px 14px; flex-wrap:wrap}
.brand{display:flex; align-items:center; gap:9px; color:#fff; font-weight:800; font-size:1.32rem; flex-shrink:0}
.brand-mark{width:30px; height:30px; display:block; flex-shrink:0;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.18))}
.brand-name{letter-spacing:.2px}
.search{flex:1; min-width:200px; display:flex; background:#fff; border-radius:11px; overflow:hidden; box-shadow:var(--shadow)}
.search input{flex:1; border:0; padding:13px 15px; font-size:1rem; font-family:inherit; outline:none; min-width:0}
.search button{border:0; background:var(--amber); color:#3b2600; font-weight:700; padding:0 18px; cursor:pointer; font-family:inherit; font-size:1rem}
.search button:hover{background:var(--amber-dark); color:#fff}
.btn-post{flex-shrink:0; box-shadow:var(--shadow)}
.btn-post .plus{font-size:1.25rem; line-height:1}

/* ---------- Flash xabarlar ---------- */
.flash{padding:14px 16px; border-radius:var(--radius-sm); margin:14px 0; font-weight:600}
.flash-ok{background:#e9f9ef; color:#10692f; border:1.5px solid #b8ebc9}
.flash-err{background:#fdecec; color:#b42121; border:1.5px solid #f6c5c5}
.flash-err ul{margin:8px 0 0; padding-left:20px; font-weight:500}

/* ---------- Reklama banner ---------- */
.banner{position:relative; display:block; margin:14px 0; border-radius:var(--radius);
  overflow:hidden; background:linear-gradient(100deg,var(--teal),var(--teal-dark)); box-shadow:var(--shadow); min-height:64px}
.banner img{width:100%; max-height:200px; object-fit:cover}
/* Matn "Reklama" belgisi ostidan boshlanmasin — tepadan joy qoldiramiz */
.banner-text{display:block; color:#fff; font-weight:700; font-size:1.15rem; padding:34px 16px 18px; word-break:break-word}
.banner-tag{position:absolute; top:8px; right:8px; z-index:4; background:rgba(0,0,0,.55); color:#fff;
  font-size:.7rem; padding:3px 8px; border-radius:6px; letter-spacing:.5px; pointer-events:none}

/* ---------- Kategoriya chiplari ---------- */
.chips{display:flex; gap:9px; overflow-x:auto; padding:14px 0 4px; -webkit-overflow-scrolling:touch; scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex-shrink:0; background:#fff; border:1.5px solid var(--line); border-radius:999px;
  padding:9px 15px; font-weight:600; color:var(--ink); display:flex; align-items:center; gap:6px}
.chip:hover{border-color:var(--teal)}
.chip.active{background:var(--teal); border-color:var(--teal); color:#fff}
.chip-ico{font-size:1.05em}

/* ---------- Asosiy joylashuv ---------- */
.layout{display:grid; grid-template-columns:270px 1fr; gap:20px; align-items:start; padding-top:6px; padding-bottom:40px}

/* ---------- Filtr paneli ---------- */
.filters{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); position:sticky; top:78px}
.filter-toggle{display:none; width:100%; border:0; background:#fff; padding:15px; font-size:1.05rem; font-weight:700; font-family:inherit; cursor:pointer; align-items:center; justify-content:center; gap:8px; border-radius:var(--radius)}
.filter-body{padding:16px; display:flex; flex-direction:column; gap:14px}
/* Filtrdagi kalit so'z qidiruvi */
.filters .filter-search{position:relative; display:flex; align-items:center}
.filters .filter-search-ico{position:absolute; left:14px; top:50%; transform:translateY(-50%);
  font-size:.95rem; line-height:1; pointer-events:none; opacity:.6; z-index:1}
/* Yuqori spetsifiklik — mobil @media dagi .field input padding'ini bosib ketmasin */
.filters .filter-search input{width:100%; padding:13px 14px 13px 44px !important; border:1.5px solid var(--line);
  border-radius:var(--radius-sm); font-size:1rem; font-family:inherit; background:#fff; color:var(--ink); outline:none; text-indent:0}
.filters .filter-search input::placeholder{opacity:.7}
.filters .filter-search input:focus{border-color:var(--teal); box-shadow:0 0 0 3px var(--teal-soft)}
[data-theme="dark"] .filters .filter-search input{background:#0f1c21}
/* Narx filtridagi valyuta ko'rsatkichi */
.filters .price-cur-row{display:flex; align-items:center; gap:8px; margin-top:8px}
.filters .price-cur-row label{margin:0; font-weight:600; font-size:.9rem; color:var(--muted); flex:0 0 auto; width:auto}
.filters .price-cur-row select{flex:0 0 auto; width:auto !important; min-width:96px; max-width:150px; padding:9px 10px !important}
.field label{display:block; font-weight:600; margin-bottom:6px; font-size:.95rem}
.field select, .field input, .field textarea{
  width:100%; padding:13px 13px; border:1.5px solid var(--line); border-radius:var(--radius-sm);
  font-size:1rem; font-family:inherit; background:#fff; color:var(--ink); outline:none}
.field select:focus, .field input:focus, .field textarea:focus{border-color:var(--teal); box-shadow:0 0 0 3px var(--teal-soft)}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:8px}

/* ---------- Natijalar ---------- */
.results-head{display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:8px 0 14px; flex-wrap:wrap}
.results-title{font-size:1.4rem; margin:0; font-weight:800}
.grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}

.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); transition:.16s; display:flex; flex-direction:column}
.card:hover{box-shadow:var(--shadow-lg); transform:translateY(-2px)}
.card-featured{border-color:var(--amber); box-shadow:0 0 0 1.5px var(--amber), var(--shadow)}
.card-img{position:relative; aspect-ratio:4/3; background:#eef2f3; overflow:hidden}
.card-img img{width:100%; height:100%; object-fit:cover}
.noimg{display:flex; align-items:center; justify-content:center; height:100%; font-size:3rem; opacity:.5}
.badge-top{position:absolute; top:8px; left:8px; background:var(--amber); color:#3b2600; font-weight:800; font-size:.72rem; padding:4px 9px; border-radius:6px; letter-spacing:.5px}
.img-count{position:absolute; bottom:8px; right:8px; background:rgba(0,0,0,.55); color:#fff; font-size:.78rem; padding:3px 8px; border-radius:6px}
.card-body{padding:12px 13px 14px; display:flex; flex-direction:column; gap:5px; flex:1}
.card-price{font-size:1.18rem; font-weight:800; color:var(--teal-dark)}
.card-title{font-weight:600; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.card-sub{font-size:.88rem}
.card-meta{display:flex; justify-content:space-between; gap:8px; font-size:.82rem; color:var(--muted); margin-top:auto; padding-top:4px}
.card-meta .loc{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}

/* ---------- Bo'sh holat ---------- */
.empty{text-align:center; padding:50px 20px; background:#fff; border:1px dashed var(--line); border-radius:var(--radius); color:var(--muted)}
.empty-ico{font-size:3rem; margin-bottom:10px}
.empty p{font-size:1.1rem; margin:0 0 16px}

/* ---------- Sahifalash ---------- */
.pager{display:flex; gap:7px; justify-content:center; flex-wrap:wrap; margin:26px 0}
.pg{min-width:42px; height:42px; display:flex; align-items:center; justify-content:center; padding:0 12px; background:#fff; border:1.5px solid var(--line); border-radius:10px; font-weight:600}
.pg:hover{border-color:var(--teal)}
.pg.active{background:var(--teal); color:#fff; border-color:var(--teal)}

/* ---------- Form sahifalari ---------- */
.narrow{max-width:760px; padding-bottom:50px}
.page-title{font-size:1.7rem; margin:20px 0 4px; font-weight:800}
.ad-form{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:20px; margin-top:16px; display:flex; flex-direction:column; gap:16px}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.cat-fields{border-top:1px dashed var(--line); padding-top:16px}
textarea{resize:vertical}

/* Rasm yuklash */
.uploader{}
#imgInput{display:none}
.upload-box{display:block; text-align:center; padding:26px; border:2px dashed var(--teal); border-radius:var(--radius); color:var(--teal-dark); font-weight:700; cursor:pointer; background:var(--teal-soft)}
.upload-box:hover{background:#dcedef}
.previews{display:grid; grid-template-columns:repeat(auto-fill,minmax(90px,1fr)); gap:8px; margin-top:12px}
.previews .pv{position:relative; aspect-ratio:1; border-radius:9px; overflow:hidden; border:1px solid var(--line)}
.previews .pv img{width:100%; height:100%; object-fit:cover}
.previews .pv-remove{position:absolute; top:4px; right:4px; width:24px; height:24px; padding:0;
  border:0; border-radius:50%; background:rgba(0,0,0,.62); color:#fff; cursor:pointer;
  font-size:18px; line-height:1; display:flex; align-items:center; justify-content:center;
  z-index:2; transition:background .15s, transform .15s}
.previews .pv-remove:hover{background:var(--red); transform:scale(1.08)}

/* ---------- E'lon batafsil ---------- */
.detail{padding-top:14px; padding-bottom:46px}
.back{display:inline-block; margin:8px 0 14px; color:var(--teal-dark); font-weight:700}
.detail-grid{display:grid; grid-template-columns:1fr 330px; gap:22px; align-items:start}
.gallery-main{aspect-ratio:4/3; background:#eef2f3; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow)}
.gallery-main img{width:100%; height:100%; object-fit:contain; background:#222}
.noimg-lg{display:flex; align-items:center; justify-content:center; font-size:5rem; opacity:.5}
.gallery-thumbs{display:flex; gap:8px; margin-top:10px; overflow-x:auto; padding:4px 2px 6px}
.thumb{width:78px; height:62px; object-fit:cover !important; border-radius:9px; cursor:pointer; border:2px solid var(--line);
  background:transparent; flex-shrink:0; box-shadow:none}
/* Kartochka/galereya rasmlari — har doim to'ldirib (kesib), oq ramka bo'lmasin */
.card-img img, .gallery-thumbs .thumb, .prod-img img, .recent-card img{object-fit:cover !important}
.thumb.active{border-color:var(--teal); box-shadow:0 0 0 2px var(--teal-soft)}
[data-theme="dark"] .thumb{border-color:#243842; background:#0a1115}
[data-theme="dark"] .thumb.active{box-shadow:0 0 0 2px rgba(43,182,201,.3)}
.detail-title{font-size:1.6rem; margin:18px 0 6px; font-weight:800}
.detail-meta{font-size:.92rem; margin-bottom:16px}
.specs{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; margin-bottom:20px}
.spec{background:#fff; padding:11px 14px; display:flex; justify-content:space-between; gap:10px}
.spec-l{color:var(--muted)} .spec-v{font-weight:700; text-align:right}
.sec-title{font-size:1.2rem; margin:18px 0 10px; font-weight:800}
.desc{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:16px; line-height:1.65}

.detail-side{position:sticky; top:80px; display:flex; flex-direction:column; gap:14px}
.price-box{background:var(--teal); color:#fff; border-radius:var(--radius); padding:20px; box-shadow:var(--shadow)}
.price-big{font-size:1.9rem; font-weight:800}
.seller-box{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:18px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:12px}
.seller-name{font-size:1.1rem; font-weight:700}
.phone-shown{text-align:center; font-size:1.5rem; font-weight:800; color:var(--teal-dark); letter-spacing:.5px}
.safety-box{background:#fffbeb; border:1px solid #fde8b0; border-radius:var(--radius); padding:13px}

/* ---------- Login ---------- */
.login-card{max-width:440px; margin:40px auto; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:30px}

/* ---------- ADMIN ---------- */
.admin{padding-bottom:50px}
.admin-bar{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:18px 0; padding:14px 16px; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow)}
.admin-hello{font-size:1.1rem}
.admin-stats{display:flex; gap:8px; flex-wrap:wrap; margin-left:auto}
.stat{background:#eef2f3; padding:7px 12px; border-radius:8px; font-weight:700; font-size:.9rem}
.stat-warn{background:#fff3d6; color:#9a6500}
.admin-tabs{display:flex; gap:8px; overflow-x:auto; margin-bottom:18px; padding-bottom:4px}
.tab{flex-shrink:0; padding:11px 16px; background:#fff; border:1.5px solid var(--line); border-radius:10px; font-weight:700; display:flex; align-items:center; gap:7px}
.tab.active{background:var(--teal); color:#fff; border-color:var(--teal)}
.tab .dot{background:var(--amber); color:#3b2600; border-radius:999px; padding:1px 8px; font-size:.8rem}

.arow{display:flex; gap:13px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:12px; box-shadow:var(--shadow); margin-bottom:11px; flex-wrap:wrap}
.arow-img{width:84px; height:64px; border-radius:10px; overflow:hidden; flex-shrink:0; background:#eef2f3}
.arow-img img{width:100%; height:100%; object-fit:cover}
.noimg-sm{display:flex; align-items:center; justify-content:center; height:100%; font-size:1.7rem; opacity:.55}
.arow-info{flex:1; min-width:180px}
.arow-title{font-weight:700; font-size:1.05rem}
.arow-sub{font-size:.85rem; margin-top:3px; line-height:1.6}
.arow-actions{display:flex; gap:7px; flex-wrap:wrap}
.arow-actions form{margin:0}
.pill{display:inline-block; background:#eef2f3; padding:2px 8px; border-radius:6px; font-size:.74rem; font-weight:700; margin-left:4px}
.pill-red{background:#fde2e2; color:var(--red)}
.pill-gold{background:#fff0cc; color:#9a6500}
.pill-green{background:#dcf5e5; color:#12823b}
.admin-filter{display:flex; gap:8px; margin-bottom:16px; flex-wrap:wrap}
.admin-filter input{flex:1; min-width:160px; padding:11px 13px; border:1.5px solid var(--line); border-radius:10px; font-family:inherit; font-size:1rem}
.admin-filter select{padding:11px; border:1.5px solid var(--line); border-radius:10px; font-family:inherit}
.banner-form{margin-bottom:22px}

/* ---------- Futer ---------- */
.site-foot{background:#10363d; color:#cfe2e5; margin-top:30px; padding:30px 0}
.foot-inner{display:flex; gap:24px; justify-content:space-between; flex-wrap:wrap; align-items:flex-start}
.foot-brand{font-size:1.3rem; font-weight:800; color:#fff}
.foot-links{display:flex; flex-direction:column; gap:8px}
.foot-links a:hover{color:#fff; text-decoration:underline}
.site-foot .muted{color:#9fc0c4}

/* ==================== MOBIL (telefon) ==================== */
@media (max-width:920px){
  .detail-grid{grid-template-columns:1fr}
  .detail-side{position:static}
  .layout{grid-template-columns:1fr}
  .grid{grid-template-columns:repeat(2,1fr); gap:12px}
  .filters{position:static}
  .filter-toggle{display:flex}
  .filter-body{display:none}
  .filters.open .filter-body{display:flex}
  .filter-toggle .chev{transition:.2s}
  .filters.open .filter-toggle .chev{transform:rotate(180deg)}
}
@media (max-width:560px){
  body{font-size:16px}
  .head-inner{padding:10px; gap:9px}
  .brand-name{font-size:1.15rem}
  .search{order:3; flex-basis:100%; min-width:0}
  .search input{padding:12px 14px}
  .search button{padding:0 15px}
  .btn-post{padding:11px 14px; font-size:.95rem}
  .btn-post span:not(.plus){display:none}  /* mobilda faqat + belgisi */
  .btn-post .plus{font-size:1.4rem}
  .grid{grid-template-columns:repeat(2,1fr); gap:10px}
  .card-price{font-size:1.05rem}
  .card-title{font-size:.95rem}
  .grid2{grid-template-columns:1fr}
  .specs{grid-template-columns:1fr}
  .results-title{font-size:1.25rem}
  .page-title{font-size:1.4rem}
  .price-big{font-size:1.6rem}
  .admin-stats{margin-left:0; width:100%}
  .arow-actions{width:100%}
  /* Kattaroq bosish maydonlari (barmoq bilan qulay) */
  .filter-toggle{padding:16px; font-size:1.08rem}
  .chip{padding:10px 15px}
  .pg{min-width:44px; min-height:44px; display:inline-flex; align-items:center; justify-content:center}
  .btn{min-height:46px}
  .btn-sm{min-height:auto}
  .field select, .field input, .field textarea{padding:14px 13px}
}
@media (max-width:380px){
  .grid{grid-template-columns:1fr 1fr; gap:8px}
  .brand-name{font-size:1.05rem}
  .lang-switch{padding:2px}
}
/* iOS'da inputga bosilganda sahifa "zoom" bo'lib ketmasligi uchun — 16px+ shart */
@media (max-width:820px){
  input, select, textarea, .search input{font-size:16px}
}

/* Klaviatura bilan navigatsiya — fokus ko'rinishi (toza, yagona ramka) */
a:focus-visible, button:focus-visible{
  outline:2px solid var(--teal); outline-offset:2px; border-radius:8px
}
/* Inputlarda faqat bitta yumshoq teal halqa — ikkilangan ramka bo'lmasin */
input:focus-visible, select:focus-visible, textarea:focus-visible{ outline:none }
input:focus, select:focus, textarea:focus{ outline:none }
@media (prefers-reduced-motion: reduce){ *{transition:none !important} }

/* ============================================================
   ===============  YANGI: TUNGI REJIM (DARK)  ================
   ============================================================ */
[data-theme="dark"]{
  --teal:#2bb6c9; --teal-dark:#7fd6e2; --teal-soft:#16323a;
  --amber:#f5b035; --amber-dark:#ffc55c;
  --green:#2bb866; --green-dark:#46d07f;
  --red:#f06464;
  --bg:#0e171b; --card:#16242a; --ink:#e9f1f3; --muted:#93a9b0; --line:#264049;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 18px rgba(0,0,0,.35);
  --shadow-lg:0 8px 30px rgba(0,0,0,.5);
}
/* Qattiq yozilgan oq fonlarni tungi rejimga moslash */
[data-theme="dark"] .btn-ghost{background:var(--card); color:var(--ink)}
[data-theme="dark"] .chip{background:var(--card)}
[data-theme="dark"] .field select,
[data-theme="dark"] .field input,
[data-theme="dark"] .field textarea{background:#0f1c21; color:var(--ink)}
[data-theme="dark"] .empty{background:var(--card)}
[data-theme="dark"] .spec{background:var(--card)}
[data-theme="dark"] .desc{background:var(--card)}
[data-theme="dark"] .seller-box{background:var(--card)}
[data-theme="dark"] .login-card{background:var(--card)}
[data-theme="dark"] .admin-bar{background:var(--card)}
[data-theme="dark"] .stat{background:#0f1c21; color:var(--ink)}
[data-theme="dark"] .tab{background:var(--card)}
[data-theme="dark"] .arow{background:var(--card)}
[data-theme="dark"] .pill{background:#0f1c21; color:var(--ink)}
[data-theme="dark"] .pg{background:var(--card)}
[data-theme="dark"] .admin-filter input,
[data-theme="dark"] .admin-filter select{background:#0f1c21; color:var(--ink)}
[data-theme="dark"] .gallery-main,
[data-theme="dark"] .card-img,
[data-theme="dark"] .arow-img,
[data-theme="dark"] .noimg{background:#0f1c21}
[data-theme="dark"] .safety-box{background:#2a2410; border-color:#4a3f18}
[data-theme="dark"] .auth-card{background:var(--card)}
[data-theme="dark"] .cab-card{background:var(--card)}
[data-theme="dark"] .tier-card{background:var(--card)}
[data-theme="dark"] .seg{background:#0f1c21}
[data-theme="dark"] .user-drop{background:var(--card)}
[data-theme="dark"] .search input{background:#0f1c21; color:var(--ink)}
[data-theme="dark"] .upload-box{background:var(--teal-soft)}
[data-theme="dark"] img.thumb,[data-theme="dark"] .gallery-main img{background:#0a1115}

/* ============================================================
   ============  YANGI: HEADER ASBOBLARI  =====================
   ============================================================ */
.head-tools{display:flex; align-items:center; gap:8px; flex-shrink:0}
.lang-switch{display:flex; background:rgba(255,255,255,.16); border-radius:9px; overflow:hidden; font-weight:800; font-size:.86rem}
.lang-switch a{padding:8px 10px; color:#eaf6f7; line-height:1}
.lang-switch a.on{background:#fff; color:var(--teal-dark)}
.cur-switch a{min-width:20px; text-align:center}
.theme-btn{width:40px; height:40px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.16); border:0; border-radius:9px; cursor:pointer; color:#fff; padding:0}
.theme-btn:hover{background:rgba(255,255,255,.28)}
.theme-btn .ic-sun{display:none} .theme-btn .ic-moon{display:block}
[data-theme="dark"] .theme-btn .ic-sun{display:block}
[data-theme="dark"] .theme-btn .ic-moon{display:none}
.theme-btn svg{width:20px; height:20px}

/* foydalanuvchi menyusi */
.head-auth{display:flex; align-items:center; gap:8px; flex-shrink:0}
.user-menu{position:relative}
.user-btn{display:flex; align-items:center; gap:8px; background:rgba(255,255,255,.16); border:0; cursor:pointer;
  color:#fff; padding:6px 10px 6px 6px; border-radius:999px; font-family:inherit; font-weight:700; font-size:.95rem}
.user-btn:hover{background:rgba(255,255,255,.28)}
.user-btn .user-name{max-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.user-btn .caret{font-size:.7rem; opacity:.8}
.user-drop{position:absolute; top:calc(100% + 8px); right:0; min-width:210px; background:#fff;
  border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-lg); padding:7px; display:none; z-index:60}
.user-drop.open{display:block}
.user-drop a{display:flex; align-items:center; gap:9px; padding:11px 12px; border-radius:9px; color:var(--ink); font-weight:600}
.user-drop a:hover{background:var(--teal-soft)}
.user-drop .danger{color:var(--red)}
.user-drop .sep{height:1px; background:var(--line); margin:5px 4px}

/* avatarlar */
.avatar-sm{width:30px; height:30px; border-radius:50%; object-fit:cover; background:#cfe0e3; flex-shrink:0}
.avatar-lg{width:84px; height:84px; border-radius:50%; object-fit:cover; background:#cfe0e3; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:2.1rem; font-weight:800; color:var(--teal-dark)}
.avatar-edit{display:flex; align-items:center; gap:14px; flex-wrap:wrap}

/* ============================================================
   ============  YANGI: KIRISH / RO'YXAT (auth)  ==============
   ============================================================ */
.auth-card{max-width:460px; margin:34px auto; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:26px}
.auth-tabs{display:flex; gap:6px; background:var(--bg); padding:5px; border-radius:12px; margin-bottom:20px}
.auth-tabs a{flex:1; text-align:center; padding:11px; border-radius:9px; font-weight:800; color:var(--muted)}
.auth-tabs a.on{background:var(--card); color:var(--ink); box-shadow:var(--shadow)}
.seg{display:flex; gap:5px; background:var(--bg); padding:5px; border-radius:12px}
.seg-opt{flex:1; text-align:center; padding:12px 10px; border-radius:9px; font-weight:700; cursor:pointer;
  color:var(--muted); border:0; background:transparent; font-family:inherit; font-size:.98rem; line-height:1.3}
.seg-opt small{display:block; font-weight:500; font-size:.78rem; opacity:.8}
.seg-opt.on{background:var(--teal); color:#fff; box-shadow:var(--shadow)}
.seg-opt.on small{opacity:.9}
.field-label{display:block; font-weight:600; margin-bottom:6px; font-size:.95rem}
.link{color:var(--teal-dark); font-weight:700}
.biz-only{display:none}

/* ============================================================
   ============  YANGI: PROFIL / KABINET  =====================
   ============================================================ */
.profile-wrap{padding-top:18px; padding-bottom:46px}
.profile-head{display:flex; gap:18px; align-items:center; background:var(--card); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow); padding:20px; margin-bottom:6px; flex-wrap:wrap}
.profile-head-info{flex:1; min-width:200px}
.profile-name{font-size:1.5rem; font-weight:800; margin:0 0 4px; display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.cab-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:13px; margin:16px 0 8px}
.cab-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow);
  padding:18px; display:flex; flex-direction:column; gap:7px; transition:.16s}
.cab-card:hover{box-shadow:var(--shadow-lg); transform:translateY(-2px); border-color:var(--teal)}
.cab-ic{font-size:1.9rem; line-height:1}

/* ============================================================
   ============  YANGI: SOTUVCHI PROFILI (public)  ============
   ============================================================ */
.seller-head{display:flex; gap:18px; align-items:center; background:var(--card); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow); padding:22px; margin:18px 0 8px; flex-wrap:wrap}
.seller-name-wrap{flex:1; min-width:200px}
.seller-about{background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:16px; line-height:1.6; margin-bottom:10px}
.seller-link{color:var(--teal-dark); font-weight:700; display:inline-flex; align-items:center; gap:6px}

/* biznes / VIP nishonlari */
.biz-badge{display:inline-flex; align-items:center; gap:5px; background:#e3effd; color:#1366c4;
  font-weight:800; font-size:.74rem; padding:3px 9px; border-radius:999px}
[data-theme="dark"] .biz-badge{background:#16314c; color:#79bafc}
.pill-vip,.pill-violet{background:#efe3fb; color:#7a30c4}
[data-theme="dark"] .pill-vip,[data-theme="dark"] .pill-violet{background:#2c1b44; color:#c79bf2}
.pill-blue{background:#e3effd; color:#1366c4}
[data-theme="dark"] .pill-blue{background:#16314c; color:#79bafc}
.dot-grey{background:#cdd9dc!important; color:#3a4d52!important}
[data-theme="dark"] .dot-grey{background:#2e4750!important; color:#cfe0e3!important}

/* kartochkadagi VIP belgisi */
.badge-vip{position:absolute; top:8px; left:8px; background:linear-gradient(135deg,#8b5cf6,#6d28d9); color:#fff;
  font-weight:800; font-size:.72rem; padding:4px 9px; border-radius:6px; letter-spacing:.5px}
.card-vip{border-color:#a877e8; box-shadow:0 0 0 1.5px #a877e8, var(--shadow)}
.gallery-badge{position:absolute; top:10px; left:10px; z-index:2; display:flex; gap:6px}
.gallery-badge span{font-weight:800; font-size:.78rem; padding:5px 11px; border-radius:7px}
.gallery-badge .g-top{background:var(--amber); color:#3b2600}
.gallery-badge .g-vip{background:linear-gradient(135deg,#8b5cf6,#6d28d9); color:#fff}

/* ============================================================
   ============  YANGI: BOSH SAHIFA — VIP BO'LIM  =============
   ============================================================ */
.vip-section{margin:18px auto 10px}
.vip-title{display:flex; align-items:center; gap:9px; font-size:1.3rem; font-weight:800; margin:0 0 12px}
.vip-title::before{content:"💎"; font-size:1.1em}
.grid-vip{display:flex; flex-wrap:wrap; gap:14px}
.grid-vip > .card{flex:1 1 230px; min-width:230px; max-width:300px}

/* ============================================================
   ============  YANGI: REKLAMA QILISH (promote)  ============
   ============================================================ */
.promo-free{background:linear-gradient(135deg,#16a34a,#15803d); color:#fff; border-radius:var(--radius);
  padding:16px 18px; margin:16px 0; font-weight:700; display:flex; align-items:center; gap:12px; box-shadow:var(--shadow)}
.promo-free .pf-ic{font-size:1.8rem}
.tiers{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:6px 0 4px}
.tier{position:relative}
.tier input{position:absolute; opacity:0; pointer-events:none}
.tier-card{display:block; cursor:pointer; background:var(--card); border:2px solid var(--line); border-radius:var(--radius);
  padding:18px; box-shadow:var(--shadow); transition:.15s; height:100%}
.tier-card:hover{border-color:var(--teal)}
.tier input:checked + .tier-card{border-color:var(--teal); box-shadow:0 0 0 3px var(--teal-soft), var(--shadow)}
.tier-card-vip.tier-card:hover{border-color:#a877e8}
.tier input:checked + .tier-card-vip{border-color:#8b5cf6; box-shadow:0 0 0 3px rgba(139,92,246,.2), var(--shadow)}
.tier-top{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px}
.tier-name{font-size:1.15rem; font-weight:800; display:flex; align-items:center; gap:7px}
.tier-badge{font-size:.7rem; font-weight:800; padding:3px 9px; border-radius:999px; background:var(--amber); color:#3b2600}
.tier-card-vip .tier-badge{background:linear-gradient(135deg,#8b5cf6,#6d28d9); color:#fff}
.tier-price{font-size:1.5rem; font-weight:800; color:var(--teal-dark)}
.tier-price .free{color:var(--green-dark); font-size:1rem}
.tier-price s{color:var(--muted); font-weight:600; font-size:1rem; margin-right:6px}
.tier-desc{color:var(--muted); font-size:.9rem; margin-top:6px; line-height:1.5}

/* egasi paneli (e'lon sahifasida) */
.owner-bar{display:flex; gap:10px; align-items:center; flex-wrap:wrap; background:var(--teal-soft);
  border:1px solid var(--line); border-radius:var(--radius); padding:13px 16px; margin:14px 0}
.owner-bar .ob-txt{font-weight:700; flex:1; min-width:140px}

/* sozlamalardagi checkbox qatori */
.check-row{display:flex; align-items:flex-start; gap:10px; padding:12px 0; font-weight:600; cursor:pointer; line-height:1.5}
.check-row input{width:20px; height:20px; margin-top:1px; flex-shrink:0; accent-color:var(--teal)}

/* ============================================================
   ============  YANGI: MOBIL MOSLAMALAR  =====================
   ============================================================ */
@media (max-width:920px){
  .grid-vip > .card{flex-basis:200px; min-width:200px}
}
@media (max-width:560px){
  .user-btn .user-name{display:none}
  .user-btn{padding:7px; border-radius:50%}
  .lang-switch a{padding:8px}
  .tiers{grid-template-columns:1fr}
  .cab-grid{grid-template-columns:1fr 1fr}
  /* VIP kartalar aynan 2 tadan, ekrandan chiqmasin (min-width:150px kichik telefonda toshib ketardi) */
  .grid-vip{gap:10px}
  .grid-vip > .card, .grid-vip > .card-wrap{flex:1 1 calc(50% - 5px); min-width:0; max-width:none}
  .profile-name{font-size:1.25rem}
  .auth-card{margin:18px auto; padding:20px}
}

/* ============ AVTO-BAHO + KUZOV HOLATI + JIHOZLAR (post sahifasi) ============ */
.sec-head{margin-top:22px; border-top:1px solid var(--line); padding-top:16px}
.sec-h{font-size:1.1rem; font-weight:800; margin:0 0 4px; display:flex; align-items:center; gap:8px; flex-wrap:wrap}

/* Avto-baho banneri */
.score-banner{display:flex; align-items:center; gap:16px; margin:18px 0 4px;
  background:var(--teal-soft); border:1.5px solid var(--line); border-radius:var(--radius); padding:14px 16px}
.score-ring{width:78px; height:78px; flex-shrink:0; border-radius:50%; position:relative;
  display:grid; place-items:center; background:conic-gradient(var(--green) 360deg, var(--line) 0); transition:background .3s}
.score-ring::before{content:""; position:absolute; inset:7px; border-radius:50%; background:var(--card)}
.score-ring span{position:relative; z-index:1; font-size:1.5rem; font-weight:800; line-height:1}
.score-ring b{position:relative; z-index:1; font-size:.8rem; font-weight:700; margin-left:1px}
.score-cap{font-weight:700; color:var(--muted); font-size:.9rem}
.score-band{font-size:1.18rem; font-weight:800; color:var(--green); margin:1px 0 3px}

/* Kuzov asboblari */
.body-tools{display:flex; gap:9px; margin:8px 0}
.body-hint{margin:2px 0 12px}

/* Kuzov qismlari to'ri */
.body-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:10px; margin-bottom:6px}
.bp-card{background:var(--card); border:1.5px solid var(--line); border-radius:12px; padding:11px 12px; box-shadow:var(--shadow)}
.bp-card.marked.lvl-warn{border-color:var(--amber); box-shadow:0 0 0 1px var(--amber) inset}
.bp-card.marked.lvl-bad{border-color:var(--red); box-shadow:0 0 0 1px var(--red) inset}
.bp-name{font-weight:700; font-size:.95rem; margin-bottom:7px}
.bp-sel{width:100%; border:1px solid var(--line); border-radius:8px; padding:8px 9px;
  font-family:inherit; font-size:.92rem; background:var(--bg); color:var(--ink); cursor:pointer}
.bp-card.marked.lvl-warn .bp-sel{color:var(--amber-dark); font-weight:700}
.bp-card.marked.lvl-bad .bp-sel{color:var(--red); font-weight:700}

/* O'ralib ketadigan chiplar (jihoz + salon) */
.chips-wrap{display:flex; flex-wrap:wrap; gap:9px; margin:6px 0 4px}
.chips-wrap .chip{position:relative; cursor:pointer; user-select:none; transition:.12s}
.chips-wrap .chip input{position:absolute; opacity:0; width:0; height:0; pointer-events:none}
.chips-wrap .chip:hover{border-color:#2f6bff}
.chips-wrap .chip.on,
.chips-wrap .chip:has(input:checked){background:#2f6bff; border-color:#2f6bff; color:#fff}

/* Jihoz guruhi */
.feat-group{margin:8px 0 2px}
.feat-group-title{font-weight:700; color:var(--muted); font-size:.92rem; margin:14px 0 2px}

/* E'lon sahifasidagi avto-baho va kuzov ko'rinishi */
.ad-score{display:flex; align-items:center; gap:14px; background:var(--teal-soft);
  border:1.5px solid var(--line); border-radius:var(--radius); padding:14px 16px; margin:14px 0}
.ad-defects{display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 4px}
.dchip{display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border-radius:999px;
  font-weight:700; font-size:.9rem; border:1.5px solid var(--line); background:var(--card)}
.dchip.lvl-warn{border-color:var(--amber); color:var(--amber-dark)}
.dchip.lvl-bad{border-color:var(--red); color:var(--red)}
.dchip b{font-weight:800}
.feat-list{display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 4px}
.feat-list .fpill{padding:7px 12px; border-radius:999px; background:var(--teal-soft);
  border:1px solid var(--line); font-weight:600; font-size:.9rem}

/* --- Tungi rejim moslamalari --- */
[data-theme="dark"] .bp-sel{background:#0f1c21}
[data-theme="dark"] .chips-wrap .chip.on,
[data-theme="dark"] .chips-wrap .chip:has(input:checked){background:#3b76ff; border-color:#3b76ff; color:#fff}
[data-theme="dark"] .dchip{background:var(--card)}
[data-theme="dark"] .feat-list .fpill{background:var(--teal-soft)}

@media (max-width:480px){
  .body-grid{grid-template-columns:repeat(2, 1fr); gap:8px}
  .score-ring{width:68px; height:68px}
  .score-ring span{font-size:1.3rem}
}

/* ============ AVATAR RASMINI DUMALOQ QILISH (tortburchak emas) ============ */
.avatar-sm, .avatar-lg{overflow:hidden}
.avatar-sm img, .avatar-lg img{width:100%; height:100%; object-fit:cover; border-radius:50%; display:block}

/* ============ HEADER: XABARLAR TUGMASI ============ */
.msg-btn{position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:12px; background:var(--card); border:1px solid var(--line);
  text-decoration:none; font-size:1.15rem; flex-shrink:0}
.msg-btn:hover{border-color:var(--teal)}
.msg-badge{position:absolute; top:-5px; right:-5px; min-width:18px; height:18px; padding:0 4px;
  background:var(--red); color:#fff; border-radius:999px; font-size:.68rem; font-weight:800;
  display:flex; align-items:center; justify-content:center; line-height:1}

/* ============ SHIKOYAT HAVOLASI ============ */
.report-link{display:inline-block; margin-top:10px; color:var(--muted); text-decoration:none; font-weight:600}
.report-link:hover{color:var(--red)}

/* ============ YOZISHMALAR RO'YXATI (INBOX) ============ */
.convo-list{display:flex; flex-direction:column; gap:8px; margin-top:10px}
.convo-row{display:flex; align-items:center; gap:12px; padding:12px 14px; background:var(--card);
  border:1px solid var(--line); border-radius:14px; text-decoration:none; color:inherit; box-shadow:var(--shadow)}
.convo-row:hover{border-color:var(--teal)}
.convo-row.unread{background:var(--teal-soft); border-color:var(--teal)}
.convo-row .avatar-sm{width:46px; height:46px; font-size:1.1rem; display:flex; align-items:center; justify-content:center; background:#cfe0e3; color:var(--teal-dark); font-weight:800}
.convo-main{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.convo-top{display:flex; justify-content:space-between; gap:8px; align-items:baseline}
.convo-name{font-size:1rem}
.convo-ad{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.convo-prev{font-size:.92rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.convo-row.unread .convo-prev{font-weight:700}
.convo-badge{min-width:22px; height:22px; padding:0 6px; background:var(--red); color:#fff; border-radius:999px;
  font-size:.78rem; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0}

/* ============ CHAT (SUHBAT) ============ */
.chat-head{display:flex; align-items:center; gap:12px; padding:12px 0 14px; border-bottom:1px solid var(--line); margin-bottom:12px}
.chat-head .avatar-sm{width:46px; height:46px; font-size:1.1rem; display:flex; align-items:center; justify-content:center; background:#cfe0e3; color:var(--teal-dark); font-weight:800}
.chat-head-info{min-width:0}
.chat-name{font-weight:800; font-size:1.05rem; text-decoration:none; color:var(--ink); display:block}
.chat-ad{display:flex; align-items:center; gap:7px; text-decoration:none; color:var(--muted); margin-top:2px}
.chat-ad img{width:26px; height:26px; border-radius:6px; object-fit:cover}
.chat-body{display:flex; flex-direction:column; gap:9px; max-height:54vh; overflow-y:auto; padding:6px 2px 12px}
.chat-hint{text-align:center; padding:24px 10px}
.bubble{max-width:78%; padding:9px 13px; border-radius:16px; box-shadow:var(--shadow)}
.bubble-text{white-space:pre-wrap; word-break:break-word; line-height:1.4}
.bubble-time{font-size:.7rem; opacity:.6; margin-top:3px; text-align:right}
.bubble.me{align-self:flex-end; background:var(--teal); color:#fff; border-bottom-right-radius:5px}
.bubble.them{align-self:flex-start; background:var(--card); border:1px solid var(--line); border-bottom-left-radius:5px}

/* Narx taklifi kartochkasi */
.offer-card{max-width:80%; padding:12px 14px; border-radius:16px; border:1.5px solid var(--amber);
  background:var(--card); box-shadow:var(--shadow)}
.offer-card.me{align-self:flex-end}
.offer-card.them{align-self:flex-start}
.offer-top{font-weight:700; font-size:.82rem; color:var(--amber-dark)}
.offer-amount{font-size:1.4rem; font-weight:800; margin:3px 0 6px}
.offer-actions{display:flex; gap:8px; flex-wrap:wrap}
.offer-status{font-weight:700; font-size:.9rem}
.offer-status.ok{color:var(--green)}
.offer-status.no{color:var(--red)}
.offer-card.off-accepted{border-color:var(--green)}
.offer-card.off-declined{opacity:.65}
.deal-line{align-self:center; background:#e6f7ec; color:#137a3a; border:1px solid #a7e3bd;
  padding:8px 16px; border-radius:999px; font-weight:700; font-size:.9rem; text-align:center}

/* Yuborish formasi */
.quick-replies{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:12px}
.quick-replies .qr-label{margin-right:2px}
.qr-chip{border:1.5px solid var(--line); background:var(--card); color:var(--ink); cursor:pointer;
  border-radius:999px; padding:7px 13px; font-family:inherit; font-size:.92rem; font-weight:600;
  transition:border-color .15s, background .15s, color .15s}
.qr-chip:hover{border-color:var(--teal); background:var(--teal-soft)}
[data-theme="dark"] .qr-chip{background:var(--card)}
[data-theme="dark"] .qr-chip:hover{background:#123} 
.chat-send{display:flex; gap:8px; align-items:flex-end; margin-top:10px}
.chat-send textarea{flex:1; resize:none; border:1.5px solid var(--line); border-radius:14px; padding:11px 14px;
  font-family:inherit; font-size:1rem; background:var(--bg); color:var(--ink); max-height:120px}
.offer-box{margin-top:10px}
.offer-box summary{display:inline-flex; list-style:none; cursor:pointer}
.offer-box summary::-webkit-details-marker{display:none}
.offer-form{margin-top:10px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px}
.offer-row{display:flex; gap:8px; flex-wrap:wrap}
.offer-row input[type="number"]{flex:1; min-width:130px; border:1.5px solid var(--line); border-radius:10px; padding:9px 12px; font-family:inherit; background:var(--bg); color:var(--ink)}
.offer-row select{border:1.5px solid var(--line); border-radius:10px; padding:9px 10px; font-family:inherit; background:var(--bg); color:var(--ink)}

/* ============ ADMIN: ban / shikoyat / yozishma ============ */
.ban-box summary{display:inline-flex; list-style:none; cursor:pointer}
.ban-box summary::-webkit-details-marker{display:none}
.ban-form{display:flex; gap:7px; flex-wrap:wrap; margin-top:8px; align-items:center}
.ban-form select, .ban-form input{border:1.5px solid var(--line); border-radius:9px; padding:7px 9px; font-family:inherit; background:var(--bg); color:var(--ink)}
.ban-form input{min-width:160px}
.arow-dim{opacity:.62}
.report-note{margin-top:5px; font-style:italic; color:var(--ink); background:var(--bg); border-left:3px solid var(--amber); padding:5px 10px; border-radius:6px}
.arow-link{text-decoration:none; color:inherit}
.admin-thread{display:flex; flex-direction:column; gap:7px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px}
.at-row{display:flex; gap:8px; flex-wrap:wrap; align-items:baseline; padding:5px 0; border-bottom:1px dashed var(--line)}
.at-from{font-weight:800; color:var(--teal-dark)}
.at-offer{color:var(--amber-dark); font-weight:700}
.at-deal{color:var(--green); font-weight:700}
.at-time{margin-left:auto}

[data-theme="dark"] .deal-line{background:#16321f; color:#7fe0a4; border-color:#2e6a44}
[data-theme="dark"] .chat-send textarea,
[data-theme="dark"] .offer-row input,
[data-theme="dark"] .offer-row select,
[data-theme="dark"] .ban-form select,
[data-theme="dark"] .ban-form input{background:#0f1c21}
[data-theme="dark"] .report-note{background:#0f1c21}

/* ============================================================
   YANGI: kuzov yashil holati, reklama aylanishi, asoschi, murojaat
   ============================================================ */

/* --- Kuzov kartochkasi ASL (original) bo'lsa — YASHIL --- */
.bp-card.lvl-ok{border-color:var(--green); box-shadow:0 0 0 1px var(--green) inset}
.bp-card.lvl-ok .bp-name::after{content:" ✓"; color:var(--green); font-weight:800}
.bp-card.lvl-ok .bp-sel{color:var(--green-dark); font-weight:700}
[data-theme="dark"] .bp-card.lvl-ok{box-shadow:0 0 0 1px var(--green) inset}

/* --- Reklama (banner) aylanuvchi --- */
.banner-rotator{position:relative; margin:14px 0}
/* Tepa reklamalar 2 ustun (har biri alohida video/rasm reklama) */
.top-banners{display:grid; gap:14px; margin:14px 0}
.top-banners.cols-2{grid-template-columns:1fr 1fr}
.top-banners .banner-rotator{margin:0}
@media (max-width:700px){ .top-banners.cols-2{grid-template-columns:1fr} }
.banner-slide{display:none; margin:0}
.banner-slide.on{display:block; animation:bannerFade .5s ease}
@keyframes bannerFade{from{opacity:.3} to{opacity:1}}
.banner-slide video,
.banner-slide iframe{width:100%; max-height:240px; min-height:160px; object-fit:cover; display:block; border:0; background:#000}
.banner-caption{position:absolute; left:0; right:0; bottom:0; padding:14px 16px; color:#fff;
  font-weight:700; font-size:1.05rem; background:linear-gradient(transparent, rgba(0,0,0,.65)); z-index:2}
.banner-dots{position:absolute; bottom:10px; left:50%; transform:translateX(-50%); display:flex; gap:7px; z-index:3}
.bdot{width:9px; height:9px; border-radius:50%; border:0; cursor:pointer; padding:0;
  background:rgba(255,255,255,.55); box-shadow:0 0 0 1px rgba(0,0,0,.2)}
.bdot.on{background:#fff; width:22px; border-radius:5px}

/* --- Banner ovoz tugmasi (video/YouTube uchun, YouTube uslubida) --- */
.banner-sound{position:absolute; bottom:10px; right:10px; z-index:4;
  width:40px; height:40px; border:0; border-radius:50%; cursor:pointer;
  background:rgba(0,0,0,.55); color:#fff; font-size:1.1rem; line-height:1;
  display:flex; align-items:center; justify-content:center; transition:background .15s, transform .15s}
.banner-sound:hover{background:rgba(0,0,0,.78); transform:scale(1.06)}

/* --- Yon (vertikal) reklama ustunlari --- */
:root{ --rail-w:150px; --rail-gap:28px; --rail-edge:16px; }
.side-rail{position:fixed; top:92px; width:var(--rail-w); z-index:30; display:none;
  max-height:calc(100vh - 108px); overflow:hidden}
.side-rail.side-left{left:var(--rail-edge)}
.side-rail.side-right{right:var(--rail-edge)}
.side-rail .banner-rotator{margin:0}
.side-rail .banner{margin:0; min-height:0}
.side-rail .banner-slide{border-radius:var(--radius); overflow:hidden}
.side-rail .banner img{width:100%; height:auto; aspect-ratio:3/5; object-fit:cover; max-height:calc(100vh - 124px)}
.side-rail .banner-video,
.side-rail .banner-yt{width:100%; min-height:0; max-height:calc(100vh - 124px); aspect-ratio:9/16; object-fit:cover}
.side-rail .banner-text{font-size:.95rem; padding:16px 12px}
.side-rail .banner-sound{width:32px; height:32px; font-size:.9rem; bottom:8px; right:8px}
.side-rail .banner-dots{bottom:8px}
.side-rail .banner-caption{font-size:.9rem; padding:10px 12px}

/* Yon reklamalar FAQAT yetarli joy bo'lgandagina ko'rinadi.
   Har bir tomonda ajratilgan joy = rail(150) + gap(28) + chekka(16) = 194px.
   Kontent kengligi shu joyga moslashadi va 1180px'dan oshmaydi —
   shu sababli reklamalar matn yoki kartochka ustiga HECH QACHON chiqmaydi.
   1280px'dan tor oynada esa ular butunlay yashiriladi (display:none). */
@media (min-width:1280px){
  .side-rail{display:block}
  :root{ --maxw:min(1180px, calc(100vw - 388px)); }
}

/* --- Reyting (baho) --- */
.rating-line{display:flex; align-items:center; gap:7px; margin:6px 0 2px; font-size:1.02rem}
.stars{color:#f5a623; letter-spacing:1px; font-size:1.05rem}
.stars.muted{color:var(--line)}
.rate-box{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px; margin:18px 0}
.rate-form{display:flex; flex-direction:column; gap:12px}
.star-pick{display:flex; gap:6px}
.star-pick.shake{animation:shake .4s}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.star-btn{background:none; border:0; cursor:pointer; font-size:2rem; line-height:1; color:var(--line); padding:0 2px; transition:transform .1s}
.star-btn.on{color:#f5a623}
.star-btn:hover{transform:scale(1.15)}
.rate-form textarea{width:100%; border:1.5px solid var(--line); border-radius:12px; padding:10px 12px; font:inherit; resize:vertical; background:var(--card); color:var(--ink)}
.rate-hint{margin:10px 0}
.reviews{margin:18px 0}
.review{border-bottom:1px solid var(--line); padding:12px 0}
.review:last-child{border-bottom:0}
.review-top{display:flex; align-items:center; gap:9px; flex-wrap:wrap}
.review-name{font-size:.95rem}
.review-text{margin-top:5px; line-height:1.5}
.founder-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow);
  padding:24px; max-width:640px; margin:18px auto}
.founder-top{display:flex; align-items:center; gap:18px; margin-bottom:14px}
.founder-photo{width:84px; height:84px; border-radius:50%; object-fit:cover; flex-shrink:0;
  background:var(--teal-soft); display:flex; align-items:center; justify-content:center; font-size:2rem; font-weight:800; color:var(--teal)}
.founder-photo img{width:100%; height:100%; object-fit:cover; border-radius:50%}
.founder-name{font-size:1.5rem; font-weight:800; margin:0}
.founder-role{color:var(--teal); font-weight:700; font-size:.95rem}
.founder-about{line-height:1.6; margin:12px 0; white-space:pre-wrap}
.social-row{display:flex; flex-wrap:wrap; gap:10px; margin-top:14px}
.social-btn{display:inline-flex; align-items:center; gap:8px; padding:11px 16px; border-radius:12px;
  font-weight:700; text-decoration:none; border:1.5px solid var(--line); background:var(--bg); color:var(--ink)}
.social-btn:hover{border-color:var(--teal)}
.social-tg{background:#e7f1fb; color:#1366c4; border-color:#cfe3fa}
.social-ig{background:#fdebf3; color:#c1306c; border-color:#f7d3e4}
[data-theme="dark"] .social-tg{background:#152a40; color:#79bafc}
[data-theme="dark"] .social-ig{background:#3a1326; color:#f48fbb}
.founder-badge{display:inline-block; background:var(--teal); color:#fff; padding:3px 12px; border-radius:999px;
  font-size:.78rem; font-weight:700; letter-spacing:.3px}

/* Asoschi panel: admin jurnali */
.log-row{display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1px solid var(--line);
  border-radius:10px; background:var(--card); margin-bottom:8px; box-shadow:var(--shadow)}
.log-ic{font-size:1.1rem; flex-shrink:0}
.log-main{flex:1; min-width:0}
.log-act{font-weight:700; font-size:.92rem}
.log-meta{color:var(--muted); font-size:.78rem}
.founder-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:12px; margin:14px 0}
.fstat{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px; text-align:center; box-shadow:var(--shadow)}
.fstat-num{font-size:1.7rem; font-weight:800; color:var(--teal); line-height:1}
.fstat-lbl{color:var(--muted); font-size:.82rem; margin-top:4px}

/* --- Murojaat (appeal) --- */
.bubble-from{margin-bottom:2px; font-weight:700; opacity:.85}
.bubble.me .bubble-from{color:#dff}
.appeal-status-bar{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin:8px 0 14px}
.contact-admin-card{border-color:var(--teal)!important}
.contact-admin-card .cab-ic{color:var(--teal)}
.admin-appeal-thread{max-height:48vh}

/* ===== Video (e'lon formasi + e'lon sahifasi) ===== */
.upload-box-vid{border-color:#8b5cf6; color:#6d28d9; background:#f3effe}
[data-theme="dark"] .upload-box-vid{background:#241a3a; color:#c4b5fd}
.upload-box-vid:hover{background:#e9e1fb}
.previews .pv-vid{aspect-ratio:16/10}
.previews .pv-vid video{width:100%; height:100%; object-fit:cover; background:#000}
.ad-videos{margin:18px 0}
.ad-video{width:100%; max-height:60vh; border-radius:var(--radius); background:#000; box-shadow:var(--shadow); margin-bottom:12px; display:block}

/* ===== "Xabar yuborilgan" belgisi (e'lon chetida) ===== */
.sent-badge{display:flex; align-items:center; justify-content:center; gap:6px;
  background:#e9f9ef; color:#10692f; border:1.5px solid #b8ebc9; border-radius:var(--radius-sm);
  font-weight:700; font-size:.9rem; padding:9px 12px; margin-bottom:9px}
[data-theme="dark"] .sent-badge{background:#0f2c1b; color:#7ee2a4; border-color:#1d5e38}

/* ===== Chatdagi rasm/video pufakchasi ===== */
.bubble-media{display:block; max-width:240px; border-radius:12px; overflow:hidden; margin-bottom:5px}
.bubble-media img,.bubble-media video{display:block; width:100%; max-height:320px; object-fit:cover; background:#000; border-radius:12px}
.bubble.me .bubble-media{margin-left:auto}

/* ===== Chatda fayl biriktirish tugmasi ===== */
.chat-attach{flex:0 0 auto; width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  font-size:1.25rem; border:1.5px solid var(--line); border-radius:14px; cursor:pointer;
  background:var(--card); user-select:none; transition:.15s}
.chat-attach:hover{background:var(--teal-soft); border-color:var(--teal)}
.chat-attach.has-file{background:var(--teal); color:#fff; border-color:var(--teal)}
.chat-attach-preview{margin-top:8px}
.attach-chip{display:inline-flex; align-items:center; gap:8px; max-width:100%;
  background:var(--teal-soft); color:var(--teal-dark); border:1px solid var(--teal);
  border-radius:999px; padding:6px 6px 6px 12px; font-size:.85rem; font-weight:600;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
[data-theme="dark"] .attach-chip{background:#0c2b30; color:#7fd4df}
.attach-rm{flex:0 0 auto; width:22px; height:22px; border:none; border-radius:50%;
  background:rgba(0,0,0,.12); color:inherit; font-size:1rem; line-height:1; cursor:pointer}
.attach-rm:hover{background:rgba(0,0,0,.25)}

/* ===== Ogohlantiruvchi flash (e'lon o'chirilgan) ===== */
.flash-warn{background:#fff7e6; color:#8a5a00; border:1.5px solid #f3d68a}
[data-theme="dark"] .flash-warn{background:#33270d; color:#f0c264; border-color:#5e4716}

/* ===== Kartochka teglari (probeg, kredit, kelishish) ===== */
.card-tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:6px}
.ctag{font-size:.74rem; font-weight:700; padding:3px 8px; border-radius:7px; background:var(--teal-soft); color:var(--teal-dark)}
[data-theme="dark"] .ctag{background:#0c2b30; color:#7fd4df}
.ctag-credit{background:#f3effe; color:#6d28d9}
[data-theme="dark"] .ctag-credit{background:#241a3a; color:#c4b5fd}

/* ===== Yuklash progressi (rasm/video tile) ===== */
.pv-prog{position:absolute; left:0; right:0; bottom:0; height:6px; background:rgba(0,0,0,.25)}
.pv-prog span{display:block; height:100%; width:0; background:var(--teal); transition:width .2s}
.pv-failed{outline:2px solid var(--red)}
.pv-err{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--red); font-size:1.6rem}
.pv-vid video{width:100%; height:100%; object-fit:cover; background:#000}

/* ===== Narx qutisidagi belgilar ===== */
.neg-badge{display:inline-block; margin-top:8px; margin-right:6px; background:rgba(255,255,255,.2); color:#fff;
  font-size:.8rem; font-weight:700; padding:4px 10px; border-radius:999px}
.neg-badge.credit{background:rgba(255,255,255,.28)}

/* ===== Bozor narxi tahlili ===== */
.market-box{border:1.5px solid var(--line); border-radius:var(--radius); padding:16px; margin:6px 0 12px}
.market-verdict{font-size:1.15rem; font-weight:800; margin-bottom:8px}
.market-deal{display:inline-block; font-size:.85rem; font-weight:700; margin-left:6px; padding:2px 9px; border-radius:999px; vertical-align:middle}
.market-row{display:flex; justify-content:space-between; align-items:center; margin:4px 0}
.mv-good{background:#e9f9ef; border-color:#b8ebc9} .mv-good .market-verdict{color:#10692f} .mv-good .market-deal{background:#10692f; color:#fff}
.mv-bad{background:#fdecec; border-color:#f6c5c5}  .mv-bad .market-verdict{color:#b42121}  .mv-bad .market-deal{background:#b42121; color:#fff}
.mv-fair{background:var(--card)}                   .mv-fair .market-verdict{color:var(--ink)}
[data-theme="dark"] .mv-good{background:#0f2c1b} [data-theme="dark"] .mv-good .market-verdict{color:#7ee2a4}
[data-theme="dark"] .mv-bad{background:#3a1414}  [data-theme="dark"] .mv-bad .market-verdict{color:#f3a0a0}

/* ===== Solishtirish jadvali ===== */
.cmp-table{border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; margin:6px 0 10px}
.cmp-head,.cmp-row{display:grid; grid-template-columns:1.2fr 1fr 1fr 0.9fr; gap:6px; align-items:center; padding:10px 12px}
.cmp-head{background:var(--bg-soft,#f1f5f6); font-size:.78rem; font-weight:700; color:var(--muted)}
[data-theme="dark"] .cmp-head{background:#121b20}
.cmp-row{border-top:1px solid var(--line)}
.cmp-row .cmp-l{font-weight:700; font-size:.86rem}
.cmp-this{font-weight:800}
.cmp-avg{font-size:.9rem}
.cmp-tag{justify-self:end; font-size:.72rem; font-weight:700; padding:3px 8px; border-radius:999px; text-align:center}
.cmp-better{background:#e9f9ef; color:#10692f}
.cmp-worse{background:#fdecec; color:#b42121}
.cmp-same{background:var(--teal-soft); color:var(--teal-dark)}
[data-theme="dark"] .cmp-better{background:#0f2c1b; color:#7ee2a4}
[data-theme="dark"] .cmp-worse{background:#3a1414; color:#f3a0a0}
[data-theme="dark"] .cmp-same{background:#0c2b30; color:#7fd4df}

/* ===== O'xshash e'lonlar ===== */
.similar-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; margin:6px 0 10px}
.sim-card{display:block; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--card); transition:.15s}
.sim-card:hover{box-shadow:var(--shadow); transform:translateY(-2px)}
.sim-img{aspect-ratio:4/3; background:#eef2f3; overflow:hidden}
.sim-img img{width:100%; height:100%; object-fit:cover}
.sim-img .noimg{display:flex; align-items:center; justify-content:center; height:100%; font-size:2rem}
[data-theme="dark"] .sim-img{background:#0a1115}
.sim-body{padding:9px 11px}
.sim-price{font-weight:800; color:var(--teal-dark)}
[data-theme="dark"] .sim-price{color:#7fd4df}
.sim-title{font-weight:600; font-size:.9rem; margin:2px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}

/* ===== Biznes akkaunt kartochkasi ===== */
.biz-card{border:1.5px solid var(--line); border-radius:var(--radius); padding:18px; margin:6px 0}
.biz-card-active{border-color:#10692f; background:#e9f9ef}
[data-theme="dark"] .biz-card-active{background:#0f2c1b; border-color:#1d5e38}
.biz-active-title{font-weight:800; color:#10692f; font-size:1.1rem}
[data-theme="dark"] .biz-active-title{color:#7ee2a4}
.biz-price{font-size:1.5rem; font-weight:800; color:var(--teal-dark)}
[data-theme="dark"] .biz-price{color:#7fd4df}
.biz-pending-badge{display:inline-block; font-weight:800; color:#8a5a00; background:#fff7e6; border:1px solid #f3d68a; padding:6px 12px; border-radius:999px}
[data-theme="dark"] .biz-pending-badge{background:#33270d; color:#f0c264; border-color:#5e4716}

/* ===== Admin: parol tiklash paneli + qo'shimcha pillar ===== */
.pill-amber{background:#fff7e6; color:#8a5a00}
[data-theme="dark"] .pill-amber{background:#33270d; color:#f0c264}
.pwreset-panel{border:1.5px solid #f3d68a; background:#fffaf0; border-radius:var(--radius); padding:16px; margin-bottom:18px}
[data-theme="dark"] .pwreset-panel{background:#2a2310; border-color:#5e4716}
.pwreset-row{display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; padding:10px 0; border-top:1px dashed var(--line)}
.pwreset-row .ban-form{display:flex; gap:6px}
.arow-hl{outline:2px solid #f3d68a; border-radius:var(--radius)}

/* ===== Kartochka o'rami + Layk (saralangan) tugmasi ===== */
.card-wrap{position:relative; display:flex}
.card-wrap > .card{flex:1 1 auto; width:100%}
.grid-vip > .card-wrap{flex:1 1 230px; min-width:230px; max-width:300px}
@media (max-width:700px){ .grid-vip > .card-wrap{flex-basis:200px; min-width:200px} }
@media (max-width:480px){ .grid-vip > .card-wrap{flex-basis:150px; min-width:150px} }
.fav-btn{position:absolute; top:10px; right:10px; z-index:3; width:36px; height:36px; border:none;
  border-radius:50%; background:rgba(255,255,255,.92); box-shadow:0 2px 6px rgba(0,0,0,.18);
  font-size:1.05rem; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:transform .12s}
.fav-btn:hover{transform:scale(1.12)}
.fav-btn.on{background:#fff}
[data-theme="dark"] .fav-btn{background:rgba(20,30,34,.92)}
.fav-btn-lg{display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:12px;
  background:rgba(255,255,255,.16); color:#fff; border:1.5px solid rgba(255,255,255,.4);
  border-radius:var(--radius-sm); padding:11px; font-weight:700; cursor:pointer; transition:.15s}
.fav-btn-lg:hover{background:rgba(255,255,255,.26)}
.fav-btn-lg.on{background:#fff; color:var(--teal-dark); border-color:#fff}
.fav-emoji{font-size:1.15rem}

/* Header dagi saralangan tugmasi */
.fav-nav{position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:12px; text-decoration:none; transition:.15s}
.fav-nav:hover{background:rgba(0,0,0,.06)}
[data-theme="dark"] .fav-nav:hover{background:rgba(255,255,255,.08)}
.fav-ico{font-size:1.2rem; line-height:1}
.fav-badge{position:absolute; top:2px; right:2px; min-width:17px; height:17px; padding:0 4px;
  background:var(--red); color:#fff; border-radius:9px; font-size:.66rem; font-weight:800;
  display:flex; align-items:center; justify-content:center}

/* ===== Ommaviy ID rozetkasi ===== */
.uid-badge{display:inline-block; background:var(--teal-soft); color:var(--teal-dark);
  font-size:.78rem; font-weight:800; padding:2px 9px; border-radius:999px; vertical-align:middle; margin-left:4px}
[data-theme="dark"] .uid-badge{background:#0c2b30; color:#7fd4df}

/* ===== Kuzov diagrammasi (interaktiv) ===== */
.body-diagram{margin:6px 0 8px}
.bd-stage{position:relative; max-width:360px; margin:0 auto; padding:18px 30px}
.bd-svg{width:100%; height:auto; display:block; overflow:visible}
.bd-outline{fill:var(--card); stroke:var(--line); stroke-width:3}
.bd-glass{fill:#cfe0e6; opacity:.55}
[data-theme="dark"] .bd-glass{fill:#23424c}
.bd-roof{fill:#e8eef0}
[data-theme="dark"] .bd-roof{fill:#1a2a30}
.bd-wheel{fill:#94a4aa}
.bd-wheel-o{fill:none; stroke:#94a4aa; stroke-width:8}
.bd-line{fill:none; stroke:var(--line); stroke-width:6; stroke-linecap:round}
.body-variant[hidden]{display:none}
.bd-label{position:absolute; font-size:.72rem; font-weight:800; color:var(--muted); text-transform:uppercase; letter-spacing:.04em}
.bd-front{top:2px; left:50%; transform:translateX(-50%)}
.bd-rear{bottom:2px; left:50%; transform:translateX(-50%)}
.bd-left{left:0; top:50%; transform:translateY(-50%) rotate(-90deg); transform-origin:left center}
.bd-right{right:0; top:50%; transform:translateY(-50%) rotate(90deg); transform-origin:right center}
/* Bosiladigan nuqtalar */
.bp-dot{cursor:pointer}
.bp-dot-hit{fill:transparent}
.bp-dot-core{stroke:#fff; stroke-width:2; transition:fill .15s, r .15s}
[data-theme="dark"] .bp-dot-core{stroke:#0e1418}
.bp-dot.lvl-ok   .bp-dot-core{fill:#16a34a}
.bp-dot.lvl-warn .bp-dot-core{fill:#f59e0b}
.bp-dot.lvl-bad  .bp-dot-core{fill:#dc2626}
.bp-dot.marked .bp-dot-core{r:10}
.bp-dot:hover .bp-dot-core,.bp-dot:focus .bp-dot-core{r:11}
.bp-dot:focus{outline:none}
.bp-dot:focus .bp-dot-hit{fill:rgba(14,122,138,.15)}
/* Izoh (legend) */
.bd-legend{display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin:6px 0 10px; font-size:.85rem; font-weight:600}
.bd-legend .lg{display:inline-block; width:12px; height:12px; border-radius:50%; margin-right:5px; vertical-align:-1px}
.lg-ok{background:#16a34a}.lg-warn{background:#f59e0b}.lg-bad{background:#dc2626}
.bd-bottom{justify-content:center; max-width:360px; margin:0 auto}

/* Holat tanlash popup'i */
.bp-pop{position:absolute; z-index:200; background:var(--card); border:1px solid var(--line);
  border-radius:12px; box-shadow:var(--shadow-lg); padding:6px; min-width:170px; max-width:230px}
.bp-pop-title{font-size:.8rem; font-weight:800; color:var(--muted); padding:6px 10px 8px}
.bp-pop-opt{display:flex; align-items:center; gap:8px; width:100%; text-align:left; border:none;
  background:transparent; padding:9px 10px; border-radius:8px; font-size:.92rem; font-weight:600;
  color:var(--ink); cursor:pointer}
.bp-pop-opt:hover{background:var(--teal-soft)}
[data-theme="dark"] .bp-pop-opt:hover{background:#0c2b30}
.bp-pop-opt.on{background:var(--teal); color:#fff}
.bp-pop-opt .lg{width:11px; height:11px; border-radius:50%; flex:0 0 auto}

/* ============ Rasmni to'g'rilash (crop) modali ============ */
.crop-overlay{position:fixed; inset:0; z-index:1000; background:rgba(8,20,24,.66);
  display:flex; align-items:center; justify-content:center; padding:16px}
.crop-box{background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow-lg); padding:18px; max-width:420px; width:100%}
.crop-title{font-weight:800; font-size:1.1rem; margin-bottom:4px; color:var(--ink)}
.crop-hint{color:var(--muted); font-size:.86rem; margin:0 0 12px}
.crop-stage{position:relative; margin:0 auto; border-radius:var(--radius-sm); overflow:hidden;
  background:#000; touch-action:none; cursor:grab}
.crop-stage:active{cursor:grabbing}
.crop-canvas{display:block}
.crop-frame{position:absolute; inset:0; pointer-events:none;
  box-shadow:0 0 0 100vmax rgba(0,0,0,.0); border:2px solid rgba(255,255,255,.9)}
.crop-frame::before,.crop-frame::after{content:""; position:absolute; background:rgba(255,255,255,.45)}
.crop-frame::before{left:33.3%; right:33.3%; top:0; bottom:0; border-left:1px solid rgba(255,255,255,.45); border-right:1px solid rgba(255,255,255,.45); background:none}
.crop-frame::after{top:33.3%; bottom:33.3%; left:0; right:0; border-top:1px solid rgba(255,255,255,.45); border-bottom:1px solid rgba(255,255,255,.45); background:none}
.crop-controls{display:flex; align-items:center; gap:10px; margin:14px 2px 4px}
.crop-zoom{flex:1; accent-color:var(--teal)}
.crop-zoom-ic{font-size:1.05rem}
.crop-actions{display:flex; gap:10px; justify-content:flex-end; margin-top:12px}

/* ============ To'lov (Click) kartochkasi ============ */
.pay-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:20px; max-width:480px; margin:16px 0}
.pay-card-title{font-weight:800; font-size:1.05rem; margin:0 0 14px; color:var(--ink)}
.pay-row{display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-bottom:1px dashed var(--line)}
.pay-row b{text-align:right}
.pay-total{border-bottom:0; margin-top:6px; font-size:1.15rem}
.pay-total b{color:var(--teal)}

/* ============ Akkauntni o'chirish ============ */
.del-card{background:var(--card); border:1.5px solid #f3c6c6; border-radius:var(--radius); padding:18px; margin-top:8px}
[data-theme="dark"] .del-card{border-color:#5a2b2b}
.del-pending-banner{display:flex; flex-direction:column; align-items:flex-start; gap:4px}
.del-pending-inline{background:#fff5f5; border:1px solid #f3c6c6; border-radius:var(--radius-sm); padding:12px}
[data-theme="dark"] .del-pending-inline{background:#3a1f1f; border-color:#5a2b2b}

/* Admin: tugmalar qatori (saqlash + test) */
.row-btns{display:flex; gap:10px; flex-wrap:wrap; align-items:center}

/* PWA "Ilovani o'rnatish" suzuvchi tugmasi */
.pwa-install-btn{
  position:fixed; left:50%; transform:translateX(-50%); bottom:18px; z-index:900;
  background:var(--amber); color:#3b2600; border:0; cursor:pointer;
  font-family:inherit; font-weight:800; font-size:1rem; padding:13px 22px;
  border-radius:999px; box-shadow:var(--shadow-lg); align-items:center; gap:8px;
  animation:pwaPop .3s ease}
.pwa-install-btn:hover{background:var(--amber-dark)}
@keyframes pwaPop{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}
@media (min-width:768px){ .pwa-install-btn{ left:auto; right:22px; transform:none } 
  @keyframes pwaPop{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}} }

/* Online holati (last seen) */
.online-line,.chat-online{font-size:.82rem;color:var(--muted);margin-top:2px}
.online-line.is-online,.chat-online.is-online{color:#16a34a;font-weight:700}
.chat-online{line-height:1.2}

/* Sotuv statistikasi (profil) */
.sold-stats{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.sold-stat{background:var(--teal-soft);color:var(--teal-dark);border-radius:10px;
  padding:8px 14px;font-size:.9rem}
.sold-stat b{font-size:1.15rem;color:var(--teal)}
[data-theme="dark"] .sold-stat{background:#0f3a40;color:#bfe6ea}

/* Admin: sotilgan statistikasi */
.stat-ok{background:#dcfce7;color:#166534}
[data-theme="dark"] .stat-ok{background:#14331f;color:#86efac}

/* ====================== KATEGORIYA TANLAGICH ====================== */
.cat-picker-btn{display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  padding:15px 16px; border:1.5px solid var(--line); border-radius:14px;
  background:var(--card); color:var(--ink); font-family:inherit; font-size:1.02rem; cursor:pointer;
  transition:border-color .15s, box-shadow .15s, transform .05s}
.cat-picker-btn:hover{border-color:var(--teal); box-shadow:0 4px 14px rgba(14,122,138,.10)}
.cat-picker-btn:active{transform:scale(.995)}
.cat-picker-ico{font-size:1.5rem; line-height:1; width:40px; height:40px; min-width:40px; display:flex;
  align-items:center; justify-content:center; background:var(--bg); border-radius:11px}
.cat-picker-label{flex:1; color:var(--muted); font-weight:600}
.cat-picker-label.has-val{color:var(--ink); font-weight:700}
.cat-picker-chev{color:var(--muted); font-size:1.1rem}

.cat-modal[hidden]{display:none}
.cat-modal{position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; padding:16px}
.cat-modal-backdrop{position:absolute; inset:0; background:rgba(21,40,46,.55); backdrop-filter:blur(2px)}
.cat-modal-box{position:relative; width:min(1000px,100%); max-height:90vh; background:var(--card);
  border-radius:22px; box-shadow:0 24px 60px rgba(0,0,0,.28); display:flex; flex-direction:column; overflow:hidden}
.cat-modal-head{display:flex; align-items:center; justify-content:space-between; padding:22px 26px 10px}
.cat-modal-title{margin:0; font-size:1.7rem; font-weight:800; color:var(--ink)}
.cat-modal-close{border:0; background:var(--bg); font-size:1.25rem; color:var(--ink); cursor:pointer; line-height:1;
  width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:50%; transition:.15s}
.cat-modal-close:hover{background:var(--line); transform:rotate(90deg)}
.cat-modal-search{position:relative; margin:6px 26px 16px}
.cat-modal-search .cat-search-ico{position:absolute; left:16px; top:50%; transform:translateY(-50%); color:var(--muted)}
.cat-modal-search input{width:100%; padding:15px 14px 15px 46px; border:1.5px solid var(--line); border-radius:13px;
  font-family:inherit; font-size:1.02rem; background:var(--bg); color:var(--ink); transition:.15s}
.cat-modal-search input:focus{outline:none; border-color:var(--teal); background:var(--card); box-shadow:0 0 0 3px rgba(14,122,138,.12)}
.cat-modal-body{overflow:auto; padding:4px 26px 26px; flex:1}

/* 1-daraja: rangli kartalar */
.cat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.cat-card{display:flex; align-items:center; gap:15px; padding:18px; border:1px solid rgba(0,0,0,.04); border-radius:18px;
  cursor:pointer; font-family:inherit; text-align:left; transition:transform .12s, box-shadow .15s; box-shadow:0 1px 2px rgba(0,0,0,.04)}
.cat-card:hover{transform:translateY(-3px); box-shadow:0 12px 24px rgba(0,0,0,.12)}
.cat-card:active{transform:translateY(-1px)}
.cat-card-ico{width:56px; height:56px; min-width:56px; display:flex; align-items:center; justify-content:center;
  font-size:1.9rem; background:rgba(255,255,255,.7); border-radius:16px; box-shadow:0 2px 6px rgba(0,0,0,.06)}
.cat-card-txt{font-size:1.1rem; font-weight:800; color:#15282e; line-height:1.25}

/* 2+ daraja: ustunlar (drill-down) */
.cat-cols-bar{margin-bottom:14px; display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.cat-seeall-btn{border:0; background:var(--teal); color:#fff; font-family:inherit; font-weight:700;
  padding:10px 16px; border-radius:11px; cursor:pointer; font-size:.92rem; transition:.15s}
.cat-seeall-btn:hover{background:var(--teal-dark); color:#06303a}
.cat-back-btn{display:inline-flex; align-items:center; gap:6px; border:0; background:var(--bg); color:var(--ink);
  font-family:inherit; font-weight:700; padding:10px 16px; border-radius:11px; cursor:pointer; font-size:.95rem; transition:.15s}
.cat-back-btn:hover{background:var(--teal); color:#fff}
.cat-cols{display:flex; gap:14px; overflow-x:auto; padding-bottom:8px; scroll-behavior:smooth}
.cat-col{flex:0 0 auto; width:264px; max-width:74vw; display:flex; flex-direction:column; gap:8px}
.cat-row{display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%;
  padding:14px 15px; border:1.5px solid var(--line); background:var(--card);
  font-family:inherit; font-size:1rem; font-weight:600; color:var(--ink); cursor:pointer; text-align:left;
  border-radius:12px; transition:border-color .12s, background .12s, transform .05s}
.cat-row:hover{background:var(--bg); border-color:var(--teal)}
.cat-row:active{transform:scale(.99)}
.cat-row.active{background:var(--teal); border-color:var(--teal); color:#fff; font-weight:800; box-shadow:0 4px 12px rgba(14,122,138,.25)}
.cat-row.active .cat-row-arr{color:#fff}
[data-theme="dark"] .cat-row.active{background:var(--teal); color:#fff}
.cat-row-txt{flex:1}
.cat-row-arr{color:var(--muted); font-size:1.35rem; line-height:1}

/* Qidiruv natijalari */
.cat-search-list{display:flex; flex-direction:column; gap:8px}
.cat-search-row{display:flex; align-items:center; gap:14px; width:100%; padding:13px 14px;
  border:1.5px solid var(--line); background:var(--card); cursor:pointer; text-align:left; font-family:inherit;
  border-radius:12px; transition:border-color .12s, background .12s}
.cat-search-row:hover{background:var(--bg); border-color:var(--teal)}
.cat-search-ico2{width:44px; height:44px; min-width:44px; display:flex; align-items:center; justify-content:center;
  font-size:1.35rem; background:var(--bg); border-radius:12px}
.cat-search-path{display:flex; flex-direction:column}
.cat-search-path b{font-size:1.02rem; color:var(--ink)}
.cat-search-path small{font-size:.84rem; color:var(--muted)}
.cat-search-empty{padding:34px; text-align:center; color:var(--muted)}

@media (max-width:720px){
  .cat-modal{padding:0}
  .cat-modal-box{width:100%; max-height:100vh; height:100dvh; border-radius:0}
  .cat-modal-head{padding:16px 18px 8px}
  .cat-modal-title{font-size:1.3rem}
  .cat-modal-search{margin:4px 18px 12px}
  .cat-modal-body{padding:4px 18px 24px}
  .cat-grid{grid-template-columns:1fr 1fr; gap:11px}
  .cat-card{padding:13px; flex-direction:column; align-items:flex-start; gap:10px}
  .cat-card-ico{width:48px; height:48px; min-width:48px; font-size:1.6rem}
  .cat-card-txt{font-size:.98rem}
  /* Drill-down: telefonда gorizontal emas, vertikal (bitta ustun) */
  /* Ustunlar KICHRAYADI, lekin yonma-yon qoladi (o'ngga siljitib ko'rish mumkin) */
  .cat-cols{flex-direction:row; gap:8px; overflow-x:auto; -webkit-overflow-scrolling:touch}
  .cat-col{width:200px; min-width:200px; max-width:66vw}
  .cat-row{padding:12px 12px; font-size:.95rem}
}
@media (max-width:380px){
  .cat-grid{grid-template-columns:1fr}
  .cat-card{flex-direction:row; align-items:center}
}
.detail-crumbs{font-size:.92rem; margin-bottom:4px}

/* ============================================================
   ===============  YANGI (v17) KOMPONENTLAR  =================
   ============================================================ */

/* --- Bosh sahifa: kategoriya tanlash tugmasi --- */
.home-cat-btn{display:flex; align-items:center; gap:10px; width:100%; max-width:420px; margin:14px 0 2px;
  padding:14px 16px; border:1.5px solid var(--line); border-radius:14px; background:var(--card); color:var(--ink);
  font-family:inherit; font-size:1.02rem; font-weight:700; cursor:pointer; box-shadow:var(--shadow); transition:.15s}
.home-cat-btn:hover{border-color:var(--teal); box-shadow:0 4px 14px rgba(14,122,138,.12)}
.home-cat-ico{font-size:1.35rem; width:38px; height:38px; min-width:38px; display:flex; align-items:center; justify-content:center; background:var(--bg); border-radius:10px}
.home-cat-label{flex:1; text-align:left}
.home-cat-chev{color:var(--muted)}

/* --- Reklama muddat tanlash (promote.php) --- */
.dur-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:6px 0 14px}
.dur-opt{cursor:pointer; margin:0}
.dur-opt input{position:absolute; opacity:0; width:0; height:0}
.dur-card{display:flex; flex-direction:column; gap:4px; padding:14px; border:2px solid var(--line);
  border-radius:14px; transition:.15s; background:var(--card)}
.dur-opt:hover .dur-card{border-color:var(--teal)}
.dur-opt input:checked + .dur-card{border-color:var(--teal); background:var(--teal-soft); box-shadow:0 4px 14px rgba(14,122,138,.15)}
.dur-name{font-weight:700; font-size:1.02rem}
.dur-price{font-size:.98rem; color:var(--ink)}
.dur-price .free{color:var(--green-dark, #10692f)}
.promo-total{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 16px;
  background:var(--bg); border-radius:12px; margin-bottom:14px; font-size:1.15rem}
.promo-total b{font-size:1.25rem}

/* --- Admin: narx jadvali --- */
.price-matrix{display:flex; flex-direction:column; gap:8px}
.pm-row{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; align-items:center}
.pm-row.pm-head{font-weight:700; color:var(--muted); font-size:.9rem}
.pm-row input{padding:11px 12px}
.pm-dur{font-weight:600}

/* --- Chat: 18+ qoida + shikoyat --- */
.chat-rulebar{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap;
  padding:8px 12px; margin:8px 0; background:var(--bg); border-radius:10px; border:1px solid var(--line)}
.chat-rule{flex:1; min-width:180px; line-height:1.35}
.chat-report{flex-shrink:0; color:var(--red); font-weight:700; font-size:.9rem; padding:6px 12px;
  border:1.5px solid var(--red); border-radius:20px; text-decoration:none; white-space:nowrap}
.chat-report:hover{background:var(--red); color:#fff}

/* --- Chat: optimistik (yuborilayotgan) xabar --- */
.bubble.pending{opacity:.65}

/* --- Ogohlantirish "tushundim" tugmasi --- */
.warn-ack{display:inline-block; margin-left:8px; font-weight:700; text-decoration:underline; cursor:pointer; white-space:nowrap}

/* ================= QO'SHIMCHA MOSLIK (barcha telefonlar) ================= */
@media (max-width:560px){
  .home-cat-btn{max-width:100%; font-size:1rem; padding:13px 14px}
  .dur-grid{grid-template-columns:1fr 1fr; gap:8px}
  .dur-card{padding:12px}
  .pm-row{grid-template-columns:64px 1fr 1fr; gap:7px}
  .pm-row input{padding:10px}
  .chat-rulebar{padding:8px 10px}
  .tiers{gap:8px}
}
/* Juda kichik ekranlar (eski/kichik telefonlar ~320px) */
@media (max-width:360px){
  .dur-grid{grid-template-columns:1fr}
  .head-inner{gap:7px}
  .lang-switch a{padding:7px 8px}
  .cur-switch a{min-width:18px}
  .btn{padding:12px 13px}
  .card-title{font-size:.9rem}
  .price-big{font-size:1.4rem}
}
/* Planshet (tablet) — oraliq kenglik */
@media (min-width:561px) and (max-width:920px){
  .grid{grid-template-columns:repeat(3,1fr)}
  .dur-grid{grid-template-columns:repeat(4,1fr)}
}
/* Katta ekranларда kontent juda cho'zilmasin — LEKIN yon reklamalarga joy qoldiradi
   (aks holda kontent yon banner ustiga chiqib ketadi). */
@media (min-width:1400px){
  .wrap{max-width:min(1320px, calc(100vw - 388px))}
}
/* Chat maydoni telefon balandligiga moslashadi */
@media (max-width:700px){
  .chat-body{max-height:calc(100vh - 320px)}
}

/* --- Header: oyna kichrayganda ham buzilmasin (rasm 1) --- */
@media (max-width:960px){
  .head-inner{gap:8px; row-gap:10px}
  .btn-post span:not(.plus){display:none}   /* faqat + belgisi */
  .btn-post{padding:11px 13px}
  .btn-post .plus{font-size:1.35rem}
  /* head-tools alohida to'liq qatorga tushib, ichidagi tugmalar o'ralsin —
     hech qaysi tugma (reklama, +, magazin) chetга chiqib qirqilmasin */
  .head-tools{flex:1 1 100%; min-width:0; gap:8px; row-gap:8px; flex-wrap:wrap; justify-content:center}
  .head-shops .shops-label, .head-adv .shops-label{display:none}  /* faqat ikonka */
  .user-btn .user-name{max-width:90px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
}
@media (max-width:700px){
  .search{order:3; flex-basis:100%; min-width:0}   /* qidiruv pastga to'liq enga */
  .home-cat-btn{max-width:100%}
}
@media (max-width:420px){
  .head-tools{gap:6px}
  .head-tools .btn-sm{padding:9px 10px}
}
/* Kategoriya popup tugmasi va chiplar orasida joy */
.home-cat-btn + .chips{margin-top:6px}

/* --- Admin: hisobot (statistika) --- */
.stats-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin:8px 0}
.stat-card{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px; box-shadow:var(--shadow)}
.stat-card-h{font-weight:800; font-size:1.05rem; margin-bottom:8px; color:var(--teal)}
.stat-line{font-size:.98rem; margin:4px 0}
.stat-line b{font-size:1.05rem}
.table-scroll{overflow-x:auto}
.stats-table{width:100%; border-collapse:collapse; min-width:360px}
.stats-table th, .stats-table td{padding:10px 12px; text-align:left; border-bottom:1px solid var(--line)}
.stats-table th{font-size:.9rem; color:var(--muted); font-weight:700}
.stats-table td{font-size:1rem}
.stats-table tbody tr:hover{background:var(--bg)}

/* --- Biznes akkaunt imkoniyatlari ro'yxati --- */
.biz-benefits-list{list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; gap:8px}
.biz-benefits-list li{background:var(--bg); border-radius:10px; padding:10px 12px; font-size:.95rem; line-height:1.4}
.biz-card .biz-price .free{color:var(--green-dark, #10692f); font-weight:800}

/* --- Jonli efir --- */
.live-badge{display:inline-flex; align-items:center; gap:6px; font-weight:800; font-size:.9rem;
  padding:6px 12px; border-radius:20px; text-decoration:none}
.live-badge.live-now{background:#fee2e2; color:#c81e1e; animation:livePulse 1.4s infinite}
.live-badge.live-soon{background:var(--bg); color:var(--ink); border:1.5px solid var(--line)}
@keyframes livePulse{0%,100%{opacity:1}50%{opacity:.55}}
.live-line{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:6px 0}
.live-report{color:var(--red); font-weight:700; font-size:.85rem; text-decoration:none}
.live-report:hover{text-decoration:underline}
.live-section{margin-top:14px}
.live-title{color:#c81e1e}
.live-strip{display:flex; gap:12px; overflow-x:auto; padding:6px 2px 10px; scrollbar-width:none}
.live-strip::-webkit-scrollbar{display:none}
.live-card{flex:0 0 auto; width:96px; display:flex; flex-direction:column; align-items:center; gap:5px; text-align:center; text-decoration:none; color:var(--ink)}
.live-card-av{position:relative; width:72px; height:72px; border-radius:50%; overflow:visible; display:flex; align-items:center; justify-content:center;
  background:var(--teal); color:#fff; font-weight:800; font-size:1.5rem; box-shadow:0 0 0 3px var(--card), 0 0 0 5px var(--line)}
.live-card.is-now .live-card-av{box-shadow:0 0 0 3px var(--card), 0 0 0 5px #e11d48}
.live-card-av img{width:100%; height:100%; border-radius:50%; object-fit:cover}
.live-dot{position:absolute; bottom:-6px; left:50%; transform:translateX(-50%); background:#e11d48; color:#fff;
  font-size:.6rem; font-weight:800; padding:2px 7px; border-radius:8px; letter-spacing:.5px; line-height:1.2}
.live-card.is-now .live-dot::before{content:''}
.live-card-name{font-size:.85rem; font-weight:700; max-width:96px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.live-card-time{font-size:.72rem}

/* --- Admin: adminlar ro'yxati va faoliyat jurnali --- */
.admin-list{display:flex; flex-direction:column; gap:8px; margin:8px 0}
.admin-log-list{display:flex; flex-direction:column; gap:6px; margin-top:8px; max-height:420px; overflow:auto}
.log-row{display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:9px 12px; background:var(--card);
  border:1px solid var(--line); border-radius:10px; font-size:.9rem}
.log-who{font-weight:600}
.log-detail{flex:1; min-width:120px}
.log-time{white-space:nowrap}

/* --- Footer: Telegram kanal havolalari --- */
.foot-social{display:flex; flex-wrap:wrap; gap:10px; margin-top:12px}
.tg-link{display:inline-flex; align-items:center; gap:7px; padding:8px 13px; border-radius:22px;
  background:#229ED9; color:#fff; font-weight:700; font-size:.9rem; text-decoration:none; transition:.15s}
.tg-link:hover{background:#1b8ec4; transform:translateY(-1px)}
.tg-link .tg-ico{display:block}


/* ===== Ulashish (share) tugmalari — e'lon sahifasi ===== */
.share-box{margin-top:12px; padding:12px; border:1px solid var(--line); border-radius:14px; background:#fff}
.share-title{font-weight:700; margin-bottom:8px}
.share-btns{display:flex; flex-wrap:wrap; gap:8px}
.share-btn{flex:1 1 auto; text-align:center; padding:10px 12px; border-radius:10px; border:1px solid var(--line);
  background:#f7f9fb; color:var(--ink); font-weight:700; font-size:.92rem; cursor:pointer; text-decoration:none; transition:.15s}
.share-btn:hover{transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.08)}
.share-btn.sb-tg{background:#e8f4fd; border-color:#bfe0f7; color:#0b6ea8}
.share-btn.sb-wa{background:#e9f8ee; border-color:#c2ebd2; color:#137a3c}
.share-btn.sb-copy{flex-basis:100%}
.share-btn.copied{background:#e9f8ee; border-color:#c2ebd2; color:#137a3c}

/* Admin narx jadvali — mobil ustunlari */
@media (max-width:560px){
  .pm-row{grid-template-columns:1fr 1fr; gap:8px}
  .pm-row.pm-head{display:none}
  .pm-row .pm-dur{grid-column:1 / -1; font-weight:700}
}

/* Kartochkada ikkinchi valyuta (kichik) */
.card-price-alt{display:block; font-size:.78rem; font-weight:600; color:var(--muted); margin-top:1px; letter-spacing:.1px}
.detail-price-alt{display:block; font-size:.95rem; font-weight:700; color:rgba(255,255,255,.9); margin-top:3px}
/* Yashil narx qutisidagi "Sotuvda bor / tugagan" ham oq bo'lsin */
.price-box .stock-line.in{color:#c6f6d5}
.price-box .stock-line.out{color:#ffd7d0}
.price-box .price-drop.big{background:rgba(255,255,255,.2); color:#fff}
.price-box .price-drop.big .pd-old{color:rgba(255,255,255,.85)}

/* Admin: kategoriya kanallari */
.cat-ch-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.cat-ch-row{display:grid; grid-template-columns:180px 1fr; gap:8px; align-items:center}
.cat-ch-name{font-weight:700; font-size:.92rem}
@media (max-width:860px){ .cat-ch-grid{grid-template-columns:1fr} }
@media (max-width:520px){ .cat-ch-row{grid-template-columns:1fr; gap:4px} }

/* Ro'yxatdan o'tishda email takliflari */
.email-sugg{margin-top:8px}
.email-sugg-list{display:flex; flex-wrap:wrap; gap:6px; margin-top:5px}
.email-chip{padding:7px 11px; border-radius:999px; border:1px dashed var(--line); background:#f7fafb;
  color:var(--ink); font-size:.85rem; font-weight:600; cursor:pointer; transition:.15s}
.email-chip:hover{background:var(--teal-soft, #e6f4f6); border-style:solid; border-color:var(--teal, #0e7a8a)}

/* Admin: yangilash qo'llanmasi */
.upd-guide{border:1px solid var(--line); border-radius:14px; padding:14px 18px; background:#fbfdfe}
.upd-guide ol{margin:0; padding-left:20px}
.upd-guide li{margin:7px 0; line-height:1.6}
.upd-guide code{background:#eef3f5; padding:1px 6px; border-radius:5px; font-size:.88em}

/* ===== Narx tushishi (arzonlashdi) ===== */
.price-drop{display:inline-flex; align-items:center; gap:6px; margin-top:5px; padding:3px 9px; border-radius:999px;
  background:#e9f8ee; color:#137a3c; font-size:.8rem; font-weight:800}
.price-drop.big{font-size:.92rem; padding:5px 12px; margin-top:8px}
.price-drop .pd-old{font-weight:600; color:#5f7a68; text-decoration:line-through; font-size:.92em}
.price-drop.big .pd-old{text-decoration:none}
.badge-drop{position:absolute; left:10px; bottom:10px; background:#137a3c; color:#fff; font-weight:800;
  font-size:.74rem; padding:3px 8px; border-radius:999px; box-shadow:0 2px 8px rgba(0,0,0,.25)}

/* Narx tarixi ro'yxati */
.phist-box{margin-top:12px; padding:12px 14px; border:1px solid var(--line); border-radius:14px; background:#fff}
.phist-title{font-weight:800; margin-bottom:8px; font-size:.95rem}
.phist-list{list-style:none; margin:0; padding:0}
.phist-list li{display:flex; align-items:center; gap:8px; justify-content:space-between;
  padding:6px 0; border-bottom:1px dashed var(--line); font-size:.86rem}
.phist-list li:last-child{border-bottom:0}
.phist-list .ph-date{color:var(--muted); white-space:nowrap}
.ph-down .ph-vals b{color:#137a3c}
.ph-up .ph-vals b{color:#b4472c}

/* ===== Ishonch bali ===== */
.trust-box{margin-top:12px; padding:14px; border:1px solid var(--line); border-radius:14px; background:#fff}
.trust-head{display:flex; align-items:center; gap:12px}
.trust-ring{width:56px; height:56px; border-radius:50%; display:grid; place-items:center; flex:0 0 56px; position:relative}
.trust-ring::after{content:''; position:absolute; inset:5px; background:#fff; border-radius:50%}
.trust-ring span{position:relative; z-index:1; font-weight:800; font-size:1.05rem}
.trust-title{font-weight:800; font-size:.95rem}
.trust-level{font-weight:700; font-size:.9rem}
.trust-list{list-style:none; margin:10px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:6px}
.trust-list li{font-size:.8rem; padding:3px 9px; border-radius:999px; font-weight:600}
.trust-list .tl-ok{background:#e9f8ee; color:#137a3c}
.trust-list .tl-bad{background:#fdecec; color:#b4472c}
.trust-hint{margin-top:10px; line-height:1.55}

/* Profilda narxni tez o'zgartirish */
.price-edit{display:flex; gap:5px; align-items:center; flex-wrap:wrap}
.price-edit input[type=text]{width:110px; padding:7px 9px; border:1px solid var(--line); border-radius:9px; font-size:.88rem}
.price-edit select{padding:7px 6px; border:1px solid var(--line); border-radius:9px; font-size:.85rem}

/* Biznes profil banneri */
.profile-banner{display:block; width:100%; border-radius:16px; overflow:hidden; margin-bottom:14px;
  box-shadow:0 6px 20px rgba(0,0,0,.08); background:#f2f5f7}
.profile-banner img{display:block; width:100%; height:auto; max-height:280px; object-fit:cover}
.bnr-prev{margin:6px 0; border-radius:12px; overflow:hidden; border:1px solid var(--line)}
.bnr-prev img{display:block; width:100%; max-height:180px; object-fit:cover}

/* Rang mavzusi tanlash */
.theme-grid{display:flex; flex-wrap:wrap; gap:8px; margin-top:6px}
.theme-opt{display:inline-flex; align-items:center; gap:7px; padding:7px 12px; border:2px solid var(--line);
  border-radius:999px; cursor:pointer; font-size:.86rem; font-weight:600; transition:.15s}
.theme-opt input{display:none}
.theme-chip{width:16px; height:16px; border-radius:50%; display:inline-block}
.theme-opt:has(input:checked){border-color:var(--ink); background:#f6f9fa}

/* ==========================================================
   MAGAZINLAR (do'konlar) — katalog, vitrina, mahsulotlar
   ========================================================== */
.shops-hero{padding:18px 0 8px}
.shops-hero .page-title{margin-bottom:4px}
.shops-hero .lead{max-width:720px}

/* --- Qidiruv paneli --- */
.shop-search{background:#fff; border:1px solid var(--line); border-radius:18px; padding:14px; margin:14px 0 18px;
  box-shadow:0 4px 16px rgba(0,0,0,.05)}
.ss-row{display:grid; grid-template-columns:2fr 1fr 1fr; gap:9px}
.ss-row input, .ss-row select{padding:11px 13px; border:1px solid var(--line); border-radius:11px; font-size:.95rem; width:100%}
.ss-size{display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:11px}
.ss-size-lbl{font-weight:800; font-size:.9rem}
.ss-size input{width:88px; padding:10px 12px; border:1px solid var(--line); border-radius:11px; text-align:center}
.ss-size input[name=size]{width:190px; text-align:left}
.ss-dash{color:var(--muted); font-weight:700}
.ss-or{color:var(--muted); font-size:.85rem}
.ss-chips, .sf-chips{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:10px}
.size-chip{padding:6px 12px; border-radius:999px; border:1px solid var(--line); background:#f7fafb;
  font-size:.85rem; font-weight:700; color:var(--ink); text-decoration:none; transition:.15s}
.size-chip:hover{border-color:var(--teal, #0e7a8a); background:#eaf5f7}
.size-chip.on{background:var(--teal, #0e7a8a); border-color:var(--teal, #0e7a8a); color:#fff}

/* --- Yo'nalish tugmalari --- */
.kind-strip{display:flex; gap:8px; overflow-x:auto; padding:4px 2px 12px; -webkit-overflow-scrolling:touch}
.kind-pill{flex:0 0 auto; padding:9px 15px; border-radius:999px; border:1px solid var(--line); background:#fff;
  font-weight:700; font-size:.9rem; color:var(--ink); text-decoration:none; white-space:nowrap}
.kind-pill.on{background:var(--ink); color:#fff; border-color:var(--ink)}

/* --- Magazin kartochkalari --- */
.shop-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:16px; margin-bottom:30px}
.shop-card{display:block; background:#fff; border:1px solid var(--line); border-radius:18px; overflow:hidden;
  text-decoration:none; color:var(--ink); transition:.18s; position:relative}
.shop-card:hover{transform:translateY(-3px); box-shadow:0 10px 26px rgba(0,0,0,.10); border-color:var(--sc, var(--line))}
.shop-cover{position:relative; height:118px; background:var(--sc-soft, #eef4f6); overflow:hidden}
.shop-cover img{width:100%; height:100%; object-fit:cover; display:block}
.shop-cover-ph{display:grid; place-items:center; height:100%; font-size:2.4rem; opacity:.55}
.shop-fresh{position:absolute; top:9px; right:9px; background:#137a3c; color:#fff; font-size:.7rem; font-weight:800;
  padding:3px 9px; border-radius:999px}
.shop-fresh.inline{position:static; display:inline-block; margin-left:6px; vertical-align:middle}
.shop-card-body{padding:30px 14px 14px; position:relative}
.shop-logo{position:absolute; top:-26px; left:14px; width:52px; height:52px; border-radius:14px; overflow:hidden;
  background:#fff; border:3px solid #fff; box-shadow:0 3px 10px rgba(0,0,0,.14); display:grid; place-items:center; font-size:1.5rem}
.shop-logo img{width:100%; height:100%; object-fit:cover}
.shop-logo.lg{position:static; width:76px; height:76px; border-radius:18px; font-size:2rem; flex:0 0 76px}
.shop-name{font-weight:800; font-size:1.02rem; line-height:1.3}
.shop-kind{font-size:.85rem; margin-top:8px; line-height:1.6}
.shop-meta{margin-top:3px}
.shop-stats{display:flex; flex-wrap:wrap; gap:6px; margin-top:9px}

/* --- Bosh sahifadagi magazin lentasi --- */
.shops-section{margin:18px auto}
.sec-more{float:right; font-size:.85rem; font-weight:700; text-decoration:none; color:var(--teal, #0e7a8a)}
.shop-strip{display:flex; gap:12px; overflow-x:auto; padding:6px 2px 12px; -webkit-overflow-scrolling:touch}
.shop-mini{flex:0 0 138px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:14px 10px;
  text-align:center; text-decoration:none; color:var(--ink); position:relative; transition:.15s}
.shop-mini:hover{transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,.09); border-color:var(--sc, var(--line))}
.shop-mini-logo{display:grid; place-items:center; width:56px; height:56px; margin:0 auto 8px; border-radius:16px;
  background:var(--sc-soft, #eef4f6); overflow:hidden; font-size:1.6rem}
.shop-mini-logo img{width:100%; height:100%; object-fit:cover}
.shop-mini-name{display:block; font-weight:800; font-size:.88rem; line-height:1.25;
  overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical}
.shop-mini-sub{display:block; font-size:.75rem; color:var(--muted); margin-top:3px}
.shop-mini-fresh{position:absolute; top:7px; right:8px; font-size:.75rem}

/* --- Magazin sahifasi (vitrina) --- */
.shop-page .back{display:inline-block; margin-bottom:10px}
.shop-hero{border:1px solid var(--line); border-radius:20px; overflow:hidden; background:#fff; margin-bottom:16px}
.shop-hero-bg{height:190px; background:var(--sc-soft, #eef4f6); overflow:hidden}
.shop-hero-bg img{width:100%; height:100%; object-fit:cover; display:block}
.shop-hero-ph{display:grid; place-items:center; height:100%; font-size:3.4rem; opacity:.5}
.shop-hero-info{display:flex; gap:14px; row-gap:10px; align-items:flex-start; padding:22px 18px 20px; flex-wrap:wrap}
.shop-hero-txt .shop-h1{margin-bottom:2px}
.shop-hero-info .shop-logo.lg{margin-top:-48px; position:relative; z-index:2}
.shop-hero-txt{flex:1 1 240px; min-width:0}
.shop-h1{margin:0; font-size:1.45rem; line-height:1.25}
.shop-sub{font-size:.88rem; margin-top:3px}
.shop-hero-actions{display:flex; flex-wrap:wrap; gap:7px; align-items:center}
.shop-about{border:1px solid var(--line); border-radius:16px; background:#fff; padding:14px 18px; margin-bottom:14px; line-height:1.65}
.shop-hours{margin-top:7px; font-weight:700; font-size:.9rem}
.shop-inline{font-weight:800; text-decoration:none; color:var(--sc, var(--teal, #0e7a8a))}

/* --- Vitrina filtri --- */
.shop-filter{background:#fff; border:1px solid var(--line); border-radius:16px; padding:12px 14px; margin-bottom:16px}
.sf-row{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.sf-row input[type=search], .sf-row select{padding:10px 12px; border:1px solid var(--line); border-radius:11px; font-size:.92rem}
.sf-row input[type=search]{flex:1 1 200px}
.sf-size{display:flex; align-items:center; gap:5px; font-size:.9rem; font-weight:700}
.sf-size input{width:72px; padding:9px 8px; border:1px solid var(--line); border-radius:10px; text-align:center}

/* --- Mahsulot kartochkalari --- */
.prod-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:14px; margin-bottom:26px}
.prod-grid.small-grid{grid-template-columns:repeat(auto-fill, minmax(150px, 1fr))}
.prod-card{display:block; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden;
  text-decoration:none; color:var(--ink); transition:.16s}
.prod-card:hover{transform:translateY(-3px); box-shadow:0 9px 22px rgba(0,0,0,.10)}
.prod-img{position:relative; aspect-ratio:1/1; background:#f4f7f8; overflow:hidden}
.prod-img img{width:100%; height:100%; object-fit:cover; display:block}
.prod-img .noimg{display:grid; place-items:center; height:100%; font-size:2rem; opacity:.5}
.prod-disc{position:absolute; top:8px; left:8px; background:#dc2626; color:#fff; font-size:.75rem; font-weight:800;
  padding:3px 8px; border-radius:999px}
.prod-vid{position:absolute; top:8px; right:8px; background:rgba(0,0,0,.6); color:#fff; font-size:.75rem;
  padding:3px 7px; border-radius:999px}
.prod-out{position:absolute; inset:auto 0 0 0; background:rgba(0,0,0,.65); color:#fff; text-align:center;
  font-size:.78rem; font-weight:700; padding:5px}
.prod-body{padding:10px 11px 12px}
.prod-price{font-weight:800; font-size:1rem}
.prod-old{color:var(--muted); font-weight:600; font-size:.82rem; margin-left:5px}
.prod-title{font-size:.88rem; line-height:1.35; margin-top:2px;
  overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical}
.prod-brand{margin-top:2px}
.prod-sizes{display:flex; flex-wrap:wrap; gap:4px; margin-top:7px}
.psize{font-size:.72rem; font-weight:700; padding:2px 7px; border-radius:6px; background:var(--sc-soft, #eef4f6); color:var(--ink)}
.psize.more{background:transparent; color:var(--muted)}
[data-theme="dark"] .psize{background:#16242a; color:var(--ink); border:1px solid #2a3f48}
[data-theme="dark"] .psize.more{background:transparent; border-color:transparent; color:var(--muted)}
.prod-upd{margin-top:7px}

/* --- Mahsulot sahifasi --- */
.size-list{display:flex; flex-wrap:wrap; gap:7px; margin:8px 0}
.size-box{padding:8px 14px; border:2px solid var(--line); border-radius:10px; font-weight:800; font-size:.92rem}
.stock-line{margin-top:8px; font-weight:800; font-size:.92rem}
.stock-line.in{color:#137a3c}
.stock-line.out{color:#b4472c}

/* --- Magazin egasi paneli --- */
.shop-intro{background:#fff; border:1px solid var(--line); border-radius:18px; padding:16px 20px; margin-bottom:16px}
.shop-benefits{list-style:none; margin:10px 0 0; padding:0; display:grid; gap:7px}
.shop-benefits li{font-size:.94rem}
.myshop-bar{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap;
  background:#fff; border:1px solid var(--line); border-left:5px solid var(--sc, var(--teal, #0e7a8a));
  border-radius:14px; padding:12px 16px; margin-bottom:12px}
.myshop-actions{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px}
.size-pack{margin-bottom:12px}
.size-pack-h{font-weight:800; font-size:.88rem; color:var(--muted); margin-bottom:5px}
.size-pick{display:flex; flex-wrap:wrap; gap:6px}
.size-opt{cursor:pointer}
.size-opt input{display:none}
.size-opt span{display:inline-block; padding:7px 12px; border:2px solid var(--line); border-radius:9px;
  font-size:.85rem; font-weight:700; transition:.12s}
.size-opt input:checked + span{background:var(--teal, #0e7a8a); border-color:var(--teal, #0e7a8a); color:#fff}
.edit-media{display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 12px}
.em-item{width:110px; border:1px solid var(--line); border-radius:11px; overflow:hidden; cursor:pointer; background:#fff}
.em-item img, .em-item video{display:block; width:100%; height:88px; object-fit:cover}
.em-del{display:block; padding:5px 6px; font-size:.72rem; color:var(--muted); text-align:center}

/* Sarlavhadagi "Magazinlar" tugmasi */
.head-shops{white-space:nowrap}

@media (max-width:860px){
  .ss-row{grid-template-columns:1fr}
  .shop-hero-bg{height:140px}
  .shop-hero-info .shop-logo.lg{margin-top:-40px; width:64px; height:64px; flex-basis:64px}
  .shops-label{display:none}
}
@media (max-width:520px){
  .prod-grid{grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:10px}
  .shop-grid{grid-template-columns:1fr}
  .ss-size input[name=size]{width:100%}
}

/* ==========================================================
   v27: bo'limlar, sharhlar, obuna, bildirishnoma, banner sozlash
   ========================================================== */

/* Katalog bo'limlari (do'kon / avto / xizmat) */
.group-strip{display:flex; gap:8px; flex-wrap:wrap; margin:6px 0 10px}
.group-tab{padding:10px 18px; border-radius:14px; border:2px solid var(--line); background:#fff;
  font-weight:800; font-size:.95rem; color:var(--ink); text-decoration:none; transition:.15s}
.group-tab:hover{border-color:var(--teal, #0e7a8a)}
.group-tab.on{background:var(--teal, #0e7a8a); border-color:var(--teal, #0e7a8a); color:#fff}
.sec-sub{margin:-6px 0 10px}

/* Magazin reytingi */
.shop-rate{display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:4px; font-size:.9rem}
.shop-rate .stars{color:#f5a623; letter-spacing:1px}
.shop-rate.small{font-size:.82rem; margin-top:3px}
.shop-report-btn{color:#b4472c}

/* Sharhlar */
.review-form{background:#fff; border:1px solid var(--line); border-radius:16px; padding:14px; margin-bottom:16px}
.review-form textarea{width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:11px; font-size:.95rem}
.review-actions{display:flex; gap:8px; margin-top:9px}
.star-pick{display:inline-flex; flex-direction:row-reverse; gap:3px; margin-bottom:9px}
.star-pick input{display:none}
.star-pick label{font-size:1.9rem; color:#d8dee2; cursor:pointer; line-height:1; transition:.1s}
.star-pick input:checked ~ label,
.star-pick label:hover, .star-pick label:hover ~ label{color:#f5a623}
.review-list{display:grid; gap:11px; margin-bottom:26px}
.review-item{background:#fff; border:1px solid var(--line); border-radius:14px; padding:13px 15px}
.review-head{display:flex; align-items:center; gap:10px}
.review-name{font-weight:800; font-size:.95rem}
.review-meta .stars{color:#f5a623}
.review-text{margin-top:8px; line-height:1.6; font-size:.94rem}
.review-reply{margin-top:9px; padding:9px 12px; background:var(--sc-soft, #eef4f6); border-radius:10px;
  font-size:.9rem; line-height:1.55}
.review-reply-form{display:flex; gap:6px; margin-top:9px}
.review-reply-form input{flex:1; padding:9px 11px; border:1px solid var(--line); border-radius:10px; font-size:.9rem}
.small-empty{padding:18px}

/* Bildirishnomalar */
.notif-nav .fav-ico{filter:none}
.notif-list{display:grid; gap:9px}
.notif-item{display:flex; gap:11px; align-items:flex-start; background:#fff; border:1px solid var(--line);
  border-radius:14px; padding:12px 14px; text-decoration:none; color:var(--ink); transition:.15s}
.notif-item:hover{box-shadow:0 6px 18px rgba(0,0,0,.08)}
.notif-item.unread{border-left:4px solid var(--teal, #0e7a8a); background:#f6fbfc}
.notif-ico{font-size:1.3rem; flex:0 0 auto}
.notif-img{flex:0 0 56px; width:56px; height:56px; border-radius:10px; overflow:hidden; background:#f2f5f7}
.notif-img img{width:100%; height:100%; object-fit:cover; display:block}
.notif-body{display:flex; flex-direction:column; gap:3px; min-width:0}
.notif-title{font-weight:800; font-size:.94rem}
.notif-text{font-size:.88rem; color:var(--muted)}

/* Banner joylashuvini sozlash */
.bnr-adjust{background:#fbfdfe; border:1px solid var(--line); border-radius:14px; padding:13px}
.bnr-live{width:100%; border-radius:12px; overflow:hidden; background:#eef2f4; margin:8px 0}
.bnr-live img{width:100%; height:100%; object-fit:cover; display:block}
.bnr-live-ph{display:grid; place-items:center; height:100%; color:var(--muted); font-size:.88rem}
.bnr-ctrl{display:flex; align-items:center; gap:10px; margin-top:7px}
.bnr-ctrl input[type=range]{flex:1; accent-color:var(--teal, #0e7a8a)}
.bnr-ctrl output{min-width:52px; text-align:right; font-weight:700; font-size:.85rem; color:var(--muted)}

/* Biznes akkaunt talab qilinadigan ekran */
.biz-gate{background:#fff; border:2px dashed var(--line); border-radius:20px; padding:26px 22px; text-align:center}
.biz-gate-ico{font-size:2.6rem}
.biz-gate p{max-width:560px; margin:8px auto 14px; line-height:1.65}
.biz-gate .shop-benefits{max-width:440px; margin:14px auto; text-align:left}

/* Yuklash oldindan koʻrish — MAGAZIN formalarida ham grid boʻlib qolsin
   (avvalgi flex qoidasi rasmni haddan tashqari kattalashtirib yuborgandi) */
.previews{display:grid !important; grid-template-columns:repeat(auto-fill, minmax(92px, 110px)); gap:8px; margin-top:10px}
.previews .pv{width:100%; max-width:110px; aspect-ratio:1 !important; height:auto}
.previews .pv img, .previews .pv video{width:100%; height:100%; object-fit:cover; max-height:110px}
.previews .pv-vid{aspect-ratio:1 !important}
/* Bitta rasm (banner/logotip) uchun biroz kengroq */
#shopBannerPreview{grid-template-columns:minmax(150px, 240px)}
#shopBannerPreview .pv{max-width:240px; aspect-ratio:16/6 !important}
#shopBannerPreview .pv img{max-height:100px}
#bizBannerPreview{grid-template-columns:minmax(150px, 240px)}
#bizBannerPreview .pv{max-width:240px; aspect-ratio:16/6 !important}
#bizBannerPreview .pv img{max-height:100px}
#shopLogoPreview{grid-template-columns:minmax(72px, 92px)}
#shopLogoPreview .pv{max-width:92px}


/* ==========================================================
   v28: tariflar, kuzatuv, filiallar, mahsulot qidiruvi
   ========================================================== */

/* Biznes tariflari */
.plan-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:11px; margin:8px 0 14px}
.plan-opt{cursor:pointer}
.plan-opt input{display:none}
.plan-card{position:relative; display:flex; flex-direction:column; gap:4px; padding:16px 14px;
  border:2px solid var(--line); border-radius:16px; background:#fff; text-align:center; transition:.15s}
.plan-opt:hover .plan-card{border-color:var(--teal, #0e7a8a)}
.plan-opt input:checked + .plan-card{border-color:var(--teal, #0e7a8a); background:var(--teal-soft, #e6f4f6);
  box-shadow:0 6px 18px rgba(14,122,138,.16)}
.plan-name{font-weight:800; font-size:1.05rem}
.plan-price{font-size:1.02rem}
.plan-price .free{color:#137a3c}
.plan-save{position:absolute; top:-10px; right:10px; background:#dc2626; color:#fff; font-size:.72rem;
  font-weight:800; padding:3px 9px; border-radius:999px}
.pay-methods{display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin:10px 0}
.pay-chip{padding:7px 13px; border-radius:10px; border:1px solid var(--line); background:#fff;
  font-weight:700; font-size:.86rem}
.pay-chip i{font-style:normal; color:var(--muted); font-size:.78rem}
.pay-chip.pay-click{border-color:#1a73e8; color:#1a73e8}

/* Egalik belgilari (biznes / magazin) */
.owner-badges{display:flex; flex-wrap:wrap; gap:7px; margin-top:6px}
.own-badge{display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:999px;
  font-size:.85rem; font-weight:700; text-decoration:none; border:1px solid var(--line); background:#fff; color:var(--ink)}
.own-badge.biz{background:#eef4ff; border-color:#cfe0ff; color:#1e3a8a}
.own-badge.shop{background:#e9f8ee; border-color:#c2ebd2; color:#137a3c}
.own-badge .ob-sub{font-weight:600; opacity:.7; font-size:.78rem}
.shop-badge{text-decoration:none}

/* Kuzatuv (meni qiziqtirgan) */
.watch-form{background:#fff; border:1px solid var(--line); border-radius:18px; padding:16px}
.watch-row .arow-title{font-weight:800}

/* Filiallar — tahrirlash */
.branch-list{display:grid; gap:10px; margin:8px 0}
.branch-item{position:relative; border:1px solid var(--line); border-radius:13px; padding:12px 12px 8px; background:#fbfdfe}
.branch-item .grid2{gap:8px; margin-bottom:8px}
.branch-item input, .branch-item select{width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:9px; font-size:.9rem}
.branch-del{position:absolute; top:6px; right:8px; width:26px; height:26px; border-radius:50%; border:0;
  background:#f3f5f7; color:#b4472c; font-size:1.1rem; line-height:1; cursor:pointer}
.branch-del:hover{background:#fdecec}

/* Filiallar — ko'rinish */
.branch-box{border:1px solid var(--line); border-radius:16px; background:#fff; padding:14px 16px; margin-bottom:14px}
.branch-title{font-weight:800; margin-bottom:9px}
.branch-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:10px}
.branch-card{border:1px solid var(--line); border-radius:12px; padding:11px 13px; background:#fbfdfe}
.branch-card.main{border-color:var(--sc, var(--teal, #0e7a8a)); background:var(--sc-soft, #eef4f6)}
.branch-name{font-weight:800; font-size:.88rem}
.branch-addr{font-size:.86rem; margin-top:3px; line-height:1.5}
.branch-tel, .branch-map{display:inline-block; margin-top:5px; margin-right:9px; font-size:.85rem;
  font-weight:700; text-decoration:none; color:var(--sc, var(--teal, #0e7a8a))}
.branch-hours{font-size:.82rem; color:var(--muted); margin-top:3px}

/* Mahsulot qidiruvi natijalari */
.prod-card-wrap{display:flex; flex-direction:column; background:#fff; border:1px solid var(--line);
  border-radius:16px; overflow:hidden; transition:.16s}
.prod-card-wrap:hover{transform:translateY(-3px); box-shadow:0 9px 22px rgba(0,0,0,.10)}
.prod-card-wrap .prod-card{border:0; border-radius:0; background:transparent}
.prod-card-wrap .prod-card:hover{transform:none; box-shadow:none}
.prod-best{position:absolute; top:8px; left:8px; background:#137a3c; color:#fff; font-size:.72rem;
  font-weight:800; padding:3px 9px; border-radius:999px; z-index:2}
.prod-shop{display:flex; align-items:center; gap:8px; padding:9px 11px; border-top:1px solid var(--line);
  background:var(--sc-soft, #f7fafb); text-decoration:none; color:var(--ink)}
.prod-shop:hover{background:#eef4f6}
.prod-shop-logo{flex:0 0 30px; width:30px; height:30px; border-radius:8px; overflow:hidden; background:#fff;
  display:grid; place-items:center; font-size:.95rem}
.prod-shop-logo img{width:100%; height:100%; object-fit:cover}
.prod-shop-txt{display:flex; flex-direction:column; min-width:0; line-height:1.25}
.prod-shop-txt b{font-size:.85rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ss-hint{margin-top:9px}

/* ==========================================================
   v29: magazin TOP/VIP, inline reklama, banner joylari
   ========================================================== */

/* Magazin TOP/VIP belgilari */
.shop-badge-top, .shop-badge-vip{position:absolute; top:9px; left:9px; font-size:.72rem; font-weight:800;
  padding:3px 9px; border-radius:999px; color:#fff; z-index:2; box-shadow:0 2px 8px rgba(0,0,0,.2)}
.shop-badge-top{background:linear-gradient(135deg,#f59e0b,#d97706)}
.shop-badge-vip{background:linear-gradient(135deg,#8b5cf6,#6d28d9)}
.shop-card.shop-vip{border-color:#8b5cf6; box-shadow:0 6px 20px rgba(139,92,246,.18)}
.shop-card.shop-top{border-color:#f59e0b; box-shadow:0 6px 18px rgba(245,158,11,.16)}
.shop-mini.shop-vip{border-color:#8b5cf6}
.shop-mini.shop-top{border-color:#f59e0b}
.pill-violet{background:#f0e9ff; color:#6d28d9}
.pill-gold{background:#fef3c7; color:#b45309}

/* Inline reklama (e'lonlar oqimida va sahifa ichida) */
.inline-ad{grid-column:1/-1; display:block; border-radius:16px; overflow:hidden; position:relative;
  border:1px solid var(--line); background:#fff; box-shadow:0 3px 12px rgba(0,0,0,.05); text-decoration:none}
.inline-ad img, .inline-ad video{display:block; width:100%; max-height:200px; object-fit:cover}
.inline-ad .ia-label{position:absolute; top:8px; right:10px; background:rgba(0,0,0,.5); color:#fff;
  font-size:.68rem; font-weight:700; padding:2px 8px; border-radius:999px; letter-spacing:.3px}
.inline-ad-strip{margin:14px 0}

/* Sahifa tepa/past banner (e'lon, magazin, mahsulot) */
.page-banner{display:block; margin:0 0 16px; border-radius:16px; overflow:hidden; position:relative;
  border:1px solid var(--line); background:#fff; text-decoration:none; box-shadow:0 3px 12px rgba(0,0,0,.06)}
.page-banner.bottom{margin:22px 0 0}
.page-banner img, .page-banner video{display:block; width:100%; max-height:240px; object-fit:cover}
.page-banner .ia-label{position:absolute; top:8px; right:10px; background:rgba(0,0,0,.5); color:#fff;
  font-size:.68rem; font-weight:700; padding:2px 8px; border-radius:999px}

/* Biznes tugash cheklovi ekrani */
.biz-lock{background:#fff; border:2px dashed var(--amber, #d97706); border-radius:16px; padding:18px; text-align:center}

/* ==========================================================
   v30: yaqinda ko'rilgan, trend, kalkulyator, QR, bump
   ========================================================== */
.recent-section, .trend-section{margin:18px auto}
.recent-strip{display:flex; gap:11px; overflow-x:auto; padding:6px 2px 12px; -webkit-overflow-scrolling:touch}
.recent-card{flex:0 0 148px; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden;
  text-decoration:none; color:var(--ink); transition:.15s}
.recent-card:hover{transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,.09)}
.recent-img{position:relative; aspect-ratio:4/3; background:#f2f5f7; overflow:hidden}
.recent-img img{width:100%; height:100%; object-fit:cover}
.recent-img .noimg{display:grid; place-items:center; height:100%; font-size:1.8rem; opacity:.5}
.recent-views{position:absolute; bottom:6px; left:6px; background:rgba(0,0,0,.6); color:#fff; font-size:.7rem;
  font-weight:700; padding:2px 7px; border-radius:999px}
.recent-price{font-weight:800; font-size:.92rem; padding:7px 9px 0}
.recent-title{font-size:.8rem; padding:2px 9px 9px; line-height:1.3; color:var(--muted);
  overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical}

/* Nasiya kalkulyatori */
.calc-box{background:#fff; border:1px solid var(--line); border-radius:14px; padding:14px}
.calc-row{display:flex; align-items:center; gap:10px; margin-bottom:10px; flex-wrap:wrap}
.calc-row label{flex:0 0 130px; font-weight:700; font-size:.9rem}
.calc-row input[type=range]{flex:1; accent-color:var(--teal, #0e7a8a); min-width:120px}
.calc-row select{padding:9px 11px; border:1px solid var(--line); border-radius:10px}
.calc-row output{min-width:44px; font-weight:800}
.calc-result{background:var(--teal-soft, #e6f4f6); border-radius:11px; padding:12px; margin:8px 0}
.calc-monthly{font-size:1.05rem}
.calc-monthly b{font-size:1.35rem; color:var(--teal-dark, #0b5560)}

/* QR */
.qr-box{background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden}
.qr-inner{padding:14px; text-align:center}
.qr-img{width:200px; height:200px; max-width:100%; border-radius:10px}

/* Bump owner bar */
.owner-bar{display:flex; align-items:center; gap:10px; flex-wrap:wrap; background:#fff; border:1px solid var(--line);
  border-radius:12px; padding:10px 14px; margin-bottom:14px}

/* Banner o'lchamlari (admin tanlaydi) */
.page-banner.sz-small img, .page-banner.sz-small video, .inline-ad.sz-small img, .inline-ad.sz-small video{max-height:120px}
.page-banner.sz-medium img, .page-banner.sz-medium video, .inline-ad.sz-medium img, .inline-ad.sz-medium video{max-height:200px}
.page-banner.sz-large img, .page-banner.sz-large video, .inline-ad.sz-large img, .inline-ad.sz-large video{max-height:320px}
.page-banner.sz-full img, .page-banner.sz-full video, .inline-ad.sz-full img, .inline-ad.sz-full video{max-height:460px}
/* Admin banner preview */
.bnr-ad-preview{margin-top:10px; border:1px solid var(--line); border-radius:12px; overflow:hidden; max-width:520px}
.bnr-ad-preview img{display:block; width:100%; max-height:240px; object-fit:cover}

/* ==========================================================
   v31: yangi funksiyalar (yuqoriga, mic, lightbox, compare...)
   ========================================================== */
.to-top{position:fixed; right:16px; bottom:78px; width:46px; height:46px; border-radius:50%; border:0;
  background:var(--teal, #0e7a8a); color:#fff; font-size:1.4rem; cursor:pointer; opacity:0; visibility:hidden;
  transition:.2s; z-index:60; box-shadow:0 4px 14px rgba(0,0,0,.25)}
.to-top.show{opacity:1; visibility:visible}
/* Ovozli qidiruv tugmasi — qidiruv panelining ichida, tugmadan oldin */
/* Ovozli qidiruv — shaffof, toza dumaloq (rasm 5 uslubi) */
.mic-btn{flex:0 0 auto; align-self:center; display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; margin:0 2px; border:0; border-radius:50%; background:transparent;
  color:#9aa4ab; cursor:pointer; transition:.15s}
.mic-btn:hover{background:rgba(14,122,138,.10); color:var(--teal, #0e7a8a)}
.mic-btn.listening{color:#dc2626; background:rgba(220,38,38,.12); animation:micPulse 1s infinite}
.mic-btn svg{width:19px; height:19px}
@keyframes micPulse{0%,100%{opacity:1; transform:scale(1)}50%{opacity:.5; transform:scale(1.12)}}
[data-theme="dark"] .mic-btn{color:#7f8b93; background:transparent}
[data-theme="dark"] .mic-btn:hover{background:rgba(255,255,255,.08); color:#cfe8ec}
.lightbox{position:fixed; inset:0; background:rgba(0,0,0,.9); z-index:200; display:grid; place-items:center; cursor:zoom-out}
.lightbox img{max-width:94vw; max-height:90vh; object-fit:contain; border-radius:8px}
.lb-close{position:fixed; top:16px; right:18px; background:rgba(255,255,255,.15); color:#fff; border:0;
  width:44px; height:44px; border-radius:50%; font-size:1.3rem; cursor:pointer}
.copy-phone{background:transparent; border:0; font-size:1.1rem; cursor:pointer; margin-left:6px}
.ad-tools{display:flex; gap:8px; margin-top:8px}
.ad-tool{flex:1; padding:8px; border:1px solid var(--line); border-radius:10px; background:#fff;
  font-weight:600; font-size:.85rem; cursor:pointer}
.ad-tool:hover{border-color:var(--teal, #0e7a8a)}
.fav-count{display:block; text-align:center; margin-top:6px}
.today-badge{display:inline-block; background:var(--teal-soft, #e6f4f6); color:var(--teal-dark, #0b5560);
  font-weight:800; padding:8px 16px; border-radius:999px; margin:6px 0}
/* Compare bar (suzuvchi) */
.cmp-bar{position:fixed; left:50%; transform:translateX(-50%); bottom:16px; z-index:70; display:flex; align-items:center; gap:10px;
  background:#1f2937; color:#fff; padding:9px 14px; border-radius:999px; box-shadow:0 6px 20px rgba(0,0,0,.35)}
[data-theme="dark"] .cmp-bar{background:#16242a; border:1px solid #2a3f48}
.cmp-bar .cmp-count{font-weight:800}
.cmp-bar .cmp-go{background:var(--teal, #0e7a8a); color:#fff; padding:6px 14px; border-radius:999px; text-decoration:none; font-weight:700}
.cmp-bar .cmp-clear{background:transparent; border:0; color:#fff; font-size:1.1rem; cursor:pointer}
[data-compare].on{background:var(--teal, #0e7a8a); color:#fff; border-color:var(--teal, #0e7a8a)}
/* Compare jadvali */
.cmp-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch}
/* Scope to compare-page table only (must NOT leak onto ad-page .cmp-table grid) */
.cmp-scroll .cmp-table{border-collapse:collapse; width:100%; min-width:520px; border-radius:0; overflow:visible}
.cmp-scroll .cmp-table th, .cmp-scroll .cmp-table td{border:1px solid var(--line); padding:10px 12px; text-align:center; vertical-align:middle}
.cmp-scroll .cmp-table th{background:#f7fafb; text-align:left; font-size:.85rem; color:var(--muted); white-space:nowrap}
[data-theme="dark"] .cmp-scroll .cmp-table th{background:#121b20; color:var(--muted)}
[data-theme="dark"] .cmp-scroll .cmp-table td{background:var(--card)}
.cmp-imgs td img{width:100%; max-width:180px; aspect-ratio:4/3; object-fit:cover; border-radius:10px}
.cmp-imgs td .noimg{aspect-ratio:4/3; display:grid; place-items:center; font-size:2rem; background:#f2f5f7; border-radius:10px}
[data-theme="dark"] .cmp-imgs td .noimg{background:#16242a}
.cmp-price-row td b{font-size:1.1rem; color:var(--teal-dark, #0b5560)}
[data-theme="dark"] .cmp-price-row td b{color:#7fd4df}
.cmp-name{font-weight:700}
@media print{ .site-head, .site-foot, .to-top, .cmp-bar, .owner-bar, .ad-tools, .share-box, .safety-box, .detail-side .seller-box, .qr-box, aside.side-rail{display:none !important} }

.cmp-btn{position:absolute; top:46px; right:10px; width:34px; height:34px; border-radius:50%; border:0;
  background:rgba(255,255,255,.92); font-size:.95rem; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.15); z-index:3}
.cmp-btn.on{background:var(--teal, #0e7a8a)}

/* v32: galereya hisoblagich, belgi sanagich, toast */
.gal-counter{position:absolute; right:10px; bottom:10px; background:rgba(0,0,0,.6); color:#fff;
  font-size:.78rem; font-weight:700; padding:3px 10px; border-radius:999px; pointer-events:none}
.char-count{text-align:right; font-size:.78rem; color:var(--muted); margin-top:3px}
.char-count.near{color:#dc2626; font-weight:700}
.flash-fade{opacity:0; transition:opacity .5s}

/* v32: kategoriya narx statistikasi + xarita havolasi */
.cat-price-stats{display:flex; flex-wrap:wrap; align-items:center; gap:14px; background:#fff; border:1px solid var(--line);
  border-radius:14px; padding:11px 16px; margin:8px 0 14px}
.cps-lbl{font-weight:800; font-size:.9rem}
.cps-item{font-size:.88rem; color:var(--muted)}
.cps-item b{color:var(--teal-dark, #0b5560); font-size:.98rem}
.map-link{margin-left:8px; font-weight:700; text-decoration:none; color:var(--teal, #0e7a8a)}
@media (max-width:560px){ .cat-price-stats{gap:10px; font-size:.85rem} }

/* v33: shoshilinch belgisi + reklama sahifasi */
.badge-urgent{position:absolute; top:10px; left:10px; background:linear-gradient(135deg,#f43f5e,#dc2626); color:#fff;
  font-size:.72rem; font-weight:800; padding:3px 9px; border-radius:999px; z-index:2; box-shadow:0 2px 8px rgba(220,38,38,.35)}
.urgent-strip{background:linear-gradient(135deg,#f43f5e,#dc2626); color:#fff; font-weight:800; text-align:center;
  padding:8px; border-radius:12px; margin-bottom:10px}
.urgent-opt{border:1px solid #fecdd3; background:#fff5f6; border-radius:12px; padding:10px 12px; margin:10px 0}
.adv-prices{background:#fff; border:1px solid var(--line); border-radius:14px; padding:14px 18px; margin:10px 0 16px}
.adv-price-title{font-weight:800; margin-bottom:6px}
.adv-prices ul{margin:0; padding-left:18px; line-height:1.9}
.adv-total{display:flex; justify-content:space-between; align-items:center; background:var(--teal-soft, #e6f4f6);
  border-radius:12px; padding:12px 16px; margin:12px 0; font-size:1.05rem}
.adv-total b{font-size:1.3rem; color:var(--teal-dark, #0b5560)}

/* v33: bugun belgisi + kurs */
.new-today{margin-right:3px}
.today-rate-row{display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; margin:10px 0 2px}
.rate-badge{background:#fff; border:1px solid var(--line); border-radius:999px; padding:8px 16px; font-weight:600; font-size:.9rem}
.rate-badge b{color:var(--teal-dark, #0b5560)}
.head-adv{white-space:nowrap}
@media (max-width:860px){ .head-adv .shops-label{display:none} }

/* v33: yordam/FAQ */
.safety-hero{background:#fffbeb; border:1px solid #fde8b0; border-radius:14px; padding:14px 18px; margin:8px 0 16px; line-height:1.6}
.safety-hero p{margin:6px 0 0}
.faq-list{display:grid; gap:9px}
.faq-item{background:#fff; border:1px solid var(--line); border-radius:12px; padding:2px 4px}
.faq-item summary{padding:13px 14px; font-weight:700; cursor:pointer; list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::before{content:'＋'; color:var(--teal, #0e7a8a); font-weight:800; margin-right:9px}
.faq-item[open] summary::before{content:'－'}
.faq-a{padding:0 14px 14px 32px; line-height:1.65; color:var(--muted)}
.help-contact{text-align:center; margin:22px 0}

/* v34: reklama (admin only), bloklangan foydalanuvchi ogohlantirishi */
.adv-admin-only{background:#fff; border:1px solid var(--line); border-radius:18px; padding:26px 22px; text-align:center; margin-top:14px}
.adv-ao-ico{font-size:2.6rem}
.adv-admin-only p{max-width:520px; margin:8px auto 14px; line-height:1.65}
.adv-contact-box{margin:12px 0}
.adv-contact-val{font-size:1.3rem; font-weight:800; color:var(--teal-dark, #0b5560); text-decoration:none}
.ban-public{display:flex; gap:14px; align-items:flex-start; background:#fef2f2; border:1px solid #fecaca;
  border-radius:16px; padding:16px 18px; margin-bottom:14px}
.ban-public-ico{font-size:2rem}
.ban-public-txt{line-height:1.55}
.ban-warn{margin-top:6px; color:#b4472c}

.shp-card{background:#fff; border:2px solid var(--line); border-radius:16px; padding:18px 16px; text-align:center; display:flex; flex-direction:column; gap:8px}
.shp-card:hover{border-color:var(--teal, #0e7a8a)}
.shp-icon{font-size:2.2rem}.shp-name{font-weight:800; font-size:1.1rem}
.shp-price{font-size:1.05rem}.shp-price .free{color:#137a3c}
.shp-days{padding:9px 11px; border:1px solid var(--line); border-radius:10px}

/* v35: javob tezligi */
.reply-speed{text-align:center; padding:6px 0}

.pay-contact{text-align:center; margin:10px 0; font-size:1.05rem}

.biz-warn-days{color:#b4472c; font-weight:700}

.badge-salon{position:absolute; left:8px; top:8px; background:linear-gradient(135deg,#1a2a44,#26406b); color:#fff; font-size:11px; font-weight:700; padding:3px 8px; border-radius:8px; z-index:2; box-shadow:0 2px 6px rgba(0,0,0,.25)}
.neg-badge.salon{background:linear-gradient(135deg,#1a2a44,#26406b); color:#fff}

/* ====== 20+ QO'SHIMCHA QULAYLIKLAR (MSP.uz) ====== */
button.is-loading{opacity:.6; position:relative; pointer-events:none}
button.is-loading::after{content:''; position:absolute; right:12px; top:50%; width:14px; height:14px; margin-top:-7px; border:2px solid rgba(255,255,255,.5); border-top-color:#fff; border-radius:50%; animation:msp-spin .7s linear infinite}
@keyframes msp-spin{to{transform:rotate(360deg)}}
.pw-wrap{position:relative; display:block}
.pw-wrap input{padding-right:46px !important; width:100%}
.pw-eye{position:absolute; right:8px; top:50%; transform:translateY(-50%); width:34px; height:34px;
  display:inline-flex; align-items:center; justify-content:center; border:0; background:transparent;
  color:#9aa4ab; cursor:pointer; border-radius:8px; padding:0; transition:.15s}
.pw-eye svg{width:20px; height:20px}
.pw-eye:hover{background:rgba(14,122,138,.10); color:var(--teal)}
.pw-eye.on{color:var(--teal)}
[data-theme="dark"] .pw-eye{color:#7f8b93}
[data-theme="dark"] .pw-eye:hover{background:rgba(255,255,255,.08); color:#cfe8ec}
.net-toast{position:fixed; left:50%; bottom:24px; transform:translate(-50%,20px); background:#b4472c; color:#fff; padding:10px 18px; border-radius:12px; font-size:14px; z-index:9999; opacity:0; transition:.35s; box-shadow:0 6px 20px rgba(0,0,0,.25)}
.net-toast.ok{background:#2f9e44}
.net-toast.show{opacity:1; transform:translate(-50%,0)}
.sticky-call{position:fixed; left:0; right:0; bottom:0; padding:10px 14px; background:#fff; border-top:1px solid #e5e7eb; z-index:900; box-shadow:0 -4px 14px rgba(0,0,0,.08)}
.read-progress{position:fixed; left:0; top:0; height:3px; width:0; background:linear-gradient(90deg,#f59e0b,#f97316); z-index:9999; transition:width .1s}
.price-hint{margin-top:4px}
.head-hidden{transform:translateY(-100%); transition:transform .3s}
.site-head{transition:transform .3s}
.tap-pulse{animation:msp-pulse .3s ease}
@keyframes msp-pulse{0%{transform:scale(1)}50%{transform:scale(1.18)}100%{transform:scale(1)}}
nav a.is-active, .nav a.is-active{font-weight:700; color:#f59e0b}

.ad-share-btn{background:none; border:1px solid #e5e7eb; border-radius:8px; cursor:pointer; font-size:15px; padding:2px 8px; vertical-align:middle; margin-left:8px; opacity:.7}
.ad-share-btn:hover{opacity:1; border-color:#f59e0b}

/* ====== ADMIN PANEL — matn rangi olovrang, temaga mos (rasm/talab #2) ====== */
.admin .sec-title{color:#d64500}                 /* olovrang (yorug'da o'qiladi) */
.admin .field label{color:#c2410c; font-weight:700}
.admin .admin-hello{color:#c2410c}
[data-theme="dark"] .admin .sec-title{color:#ffd257}   /* qorong'ida sariq */
[data-theme="dark"] .admin .field label{color:#ffcf4d}
[data-theme="dark"] .admin .admin-hello{color:#ffd257}
[data-theme="dark"] .admin .admin-bar{background:#12242a; border-color:#20323a}
[data-theme="dark"] .admin .stat-card,[data-theme="dark"] .admin .adm-card{background:#12242a; border-color:#20323a}

/* ====== KIRISH SAHIFASI — jonli, ijtimoiy tugmalar (rasm 11,12) ====== */
.auth-shell{display:grid; grid-template-columns:1fr 1fr; gap:26px; align-items:stretch; max-width:960px}
.auth-hero{position:relative; overflow:hidden; border-radius:20px; color:#fff;
  background:linear-gradient(150deg,#0e7a8a 0%,#12616e 55%,#0b4650 100%); box-shadow:var(--shadow)}
.auth-hero-inner{position:relative; z-index:2; padding:34px 30px; height:100%; display:flex; flex-direction:column; justify-content:center}
.auth-hero-logo{font-size:1.7rem; font-weight:800; letter-spacing:.3px}
.auth-hero-sub{opacity:.95; margin:8px 0 22px; font-size:1.15rem; font-weight:600}
.auth-hero-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px}
.auth-hero-list li{display:flex; align-items:center; gap:12px; font-size:1.02rem; opacity:0; transform:translateY(10px);
  animation:authIn .5s ease forwards}
.auth-hero-list li span{font-size:1.35rem; filter:drop-shadow(0 2px 4px rgba(0,0,0,.25))}
.auth-hero-list li:nth-child(1){animation-delay:.05s}
.auth-hero-list li:nth-child(2){animation-delay:.18s}
.auth-hero-list li:nth-child(3){animation-delay:.31s}
.auth-hero-list li:nth-child(4){animation-delay:.44s}
@keyframes authIn{to{opacity:1; transform:none}}
.auth-hero-blobs span{position:absolute; border-radius:50%; filter:blur(6px); opacity:.28;
  background:radial-gradient(circle at 30% 30%, #fff, transparent 70%); animation:blobFloat 9s ease-in-out infinite}
.auth-hero-blobs span:nth-child(1){width:150px; height:150px; top:-30px; right:-20px}
.auth-hero-blobs span:nth-child(2){width:90px; height:90px; bottom:20px; left:-20px; animation-delay:2s}
.auth-hero-blobs span:nth-child(3){width:60px; height:60px; bottom:80px; right:40px; animation-delay:4s}
@keyframes blobFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
.auth-or{display:flex; align-items:center; text-align:center; gap:12px; margin:18px 0 12px; color:var(--muted); font-size:.9rem}
.auth-or::before,.auth-or::after{content:''; flex:1; height:1px; background:var(--line)}
.social-btns{display:flex; flex-direction:column; gap:10px}
.social-btn{display:flex; align-items:center; justify-content:center; gap:10px; padding:12px 14px;
  border:1.5px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); font-weight:600;
  font-size:.98rem; cursor:pointer; transition:.15s; text-decoration:none}
.social-btn:hover{border-color:#c7ced3; background:#f8fafb; transform:translateY(-1px); box-shadow:var(--shadow)}
.social-btn svg{flex:0 0 auto}
[data-theme="dark"] .social-btn{background:#12242a; border-color:#20323a; color:var(--ink)}
[data-theme="dark"] .social-btn:hover{background:#162c33}
@media (max-width:820px){
  .auth-shell{grid-template-columns:1fr; max-width:520px}
  .auth-hero{display:none}   /* mobilda faqat forma */
}

/* ====== Footer ilova tugmalari (Play / App Store) ====== */
.foot-apps{margin:16px 0 6px}
.foot-apps-title{font-size:.9rem; opacity:.8; margin-bottom:8px}
.app-badges{display:flex; gap:10px; flex-wrap:wrap}
.app-badge{display:inline-flex; align-items:center; gap:9px; padding:8px 14px; background:#000; color:#fff;
  border-radius:11px; text-decoration:none; border:1px solid #2a2a2a; transition:.15s}
.app-badge:hover{background:#141414; transform:translateY(-1px)}
.app-badge svg{flex:0 0 auto}
.app-badge span{display:flex; flex-direction:column; line-height:1.15; font-weight:700; font-size:1.02rem}
.app-badge span small{font-weight:500; font-size:.62rem; opacity:.85; letter-spacing:.4px; text-transform:uppercase}

/* ====== UMUMIY DIZAYN SAYQALI (odamga yoqishi uchun) ====== */
.card{transition:transform .16s ease, box-shadow .16s ease}
.card:hover{transform:translateY(-3px); box-shadow:0 10px 26px rgba(16,42,67,.12)}
.card-img img{transition:transform .35s ease}
.card:hover .card-img img{transform:scale(1.04)}
.btn{transition:transform .12s ease, background .15s ease, box-shadow .15s ease}
.btn:active{transform:translateY(1px) scale(.99)}
.chip{transition:.14s}
.chip:hover{border-color:var(--teal); color:var(--teal)}
.chip.active{background:var(--teal); border-color:var(--teal); color:#fff}
.sec-title{letter-spacing:.2px}
.card-price{letter-spacing:.2px}

/* ==========================================================================
   QORONG'I REJIM (DARK) — TO'LIQ QAMROV
   Barcha oq (#fff) panel/kartochka/tugma qorong'ida ham to'g'ri ranga o'tadi.
   Yorug' rejim o'zgarmaydi (bu qoidalar faqat [data-theme="dark"] uchun).
   ========================================================================== */
[data-theme="dark"] .search,
[data-theme="dark"] .filter-toggle,
[data-theme="dark"] .pg,
[data-theme="dark"] .tab,
[data-theme="dark"] .arow,
[data-theme="dark"] .user-drop,
[data-theme="dark"] .auth-card,
[data-theme="dark"] .login-card,
[data-theme="dark"] .share-box,
[data-theme="dark"] .phist-box,
[data-theme="dark"] .trust-box,
[data-theme="dark"] .shop-search,
[data-theme="dark"] .kind-pill,
[data-theme="dark"] .shop-card,
[data-theme="dark"] .shop-mini,
[data-theme="dark"] .shop-hero,
[data-theme="dark"] .shop-about,
[data-theme="dark"] .shop-filter,
[data-theme="dark"] .prod-card,
[data-theme="dark"] .shop-intro,
[data-theme="dark"] .sc-item,
[data-theme="dark"] .em-item,
[data-theme="dark"] .group-tab,
[data-theme="dark"] .review-form,
[data-theme="dark"] .review-item,
[data-theme="dark"] .notif-item,
[data-theme="dark"] .biz-gate,
[data-theme="dark"] .plan-card,
[data-theme="dark"] .pay-chip,
[data-theme="dark"] .watch-form,
[data-theme="dark"] .branch-box,
[data-theme="dark"] .prod-card-wrap,
[data-theme="dark"] .biz-lock,
[data-theme="dark"] .recent-card,
[data-theme="dark"] .calc-box,
[data-theme="dark"] .qr-box,
[data-theme="dark"] .owner-bar,
[data-theme="dark"] .ad-tool,
[data-theme="dark"] .cat-price-stats,
[data-theme="dark"] .adv-prices,
[data-theme="dark"] .adv-admin-only,
[data-theme="dark"] .adv-contact-box,
[data-theme="dark"] .faq-item,
[data-theme="dark"] .shp-card,
[data-theme="dark"] .rate-badge,
[data-theme="dark"] .today-badge,
[data-theme="dark"] .watch-link,
[data-theme="dark"] .sticky-call,
[data-theme="dark"] .biz-card{
  background:var(--card); color:var(--ink); border-color:var(--line);
}
[data-theme="dark"] .rate-badge b{color:var(--teal-dark)}
[data-theme="dark"] .prod-shop-logo{background:var(--card)}
[data-theme="dark"] .trust-ring::after{background:var(--card)}
[data-theme="dark"] .chip{background:var(--card); color:var(--ink)}
[data-theme="dark"] .seg{background:var(--teal-soft)}

/* Ogohlantirish/sarg'ish panellar — qorong'ida to'q sariq fon */
[data-theme="dark"] .safety-box,
[data-theme="dark"] .safety-hero,
[data-theme="dark"] .flash-warn,
[data-theme="dark"] .pwreset-panel,
[data-theme="dark"] .biz-pending-badge,
[data-theme="dark"] .pill-amber,
[data-theme="dark"] .pill-gold,
[data-theme="dark"] .stat-warn,
[data-theme="dark"] .urgent-opt{
  background:#2a2410; color:#ffd257; border-color:#4a3f16;
}
[data-theme="dark"] .del-pending-inline{background:#2a1414; border-color:#5a2626; color:#ffb4b4}

/* Rang tanlash (Profil rangi) — tanlangan variant qorong'ida oq bo'lmasin */
[data-theme="dark"] .theme-opt:has(input:checked){background:#1c3037; border-color:var(--ink)}

/* Ijtimoiy tugmalar allaqachon dark; select/optionlar ham to'g'ri bo'lsin */
[data-theme="dark"] select,
[data-theme="dark"] input,
[data-theme="dark"] textarea{background:#0f1c21; color:var(--ink); border-color:var(--line)}
[data-theme="dark"] option{background:#0f1c21; color:var(--ink)}

/* Ovozli qidiruv mikrofoni — qorong'ida ham aniq ko'rinsin (kattaroq) */
.mic-btn{width:42px; height:42px}
.mic-btn svg{width:22px; height:22px}
[data-theme="dark"] .mic-btn{color:#b7c4cb}
[data-theme="dark"] .mic-btn:hover{color:#eaf6f8}

/* biz-card-active (Hozircha TEKIN) — qorong'ida yashil highlight saqlansin */
[data-theme="dark"] .biz-card-active{background:#0f2c1b; border-color:#1d5e38}
/* Tanlangan tarif/segment qorong'ida teal-soft bilan ajralib tursin */
[data-theme="dark"] .plan-opt input:checked + .plan-card{background:var(--teal-soft); border-color:var(--teal)}

/* Banner sozlash oynasi va boshqa och-oq tintlar — qorong'ida */
[data-theme="dark"] .bnr-adjust{background:#12242a; border-color:var(--line)}
[data-theme="dark"] .bnr-live{background:#0f1c21}
[data-theme="dark"] .bnr-prev{border-color:var(--line)}
[data-theme="dark"] .safety-box,
[data-theme="dark"] .urgent-opt{color:#ffd257}

/* ==== DARK MODE — 2-bosqich (rasm 1,3,5,7,9) ==== */
[data-theme="dark"] .upd-guide{background:#12242a; border-color:var(--line)}
[data-theme="dark"] .upd-guide code{background:#0f1c21; color:#cfe8ec}
[data-theme="dark"] .email-chip{background:#0f1c21; border-color:var(--line); color:var(--ink)}
[data-theme="dark"] .email-chip:hover{background:var(--teal-soft); border-color:var(--teal)}
[data-theme="dark"] .prod-shop{background:#12242a; color:var(--ink)}
[data-theme="dark"] .prod-shop:hover{background:#162c33}
[data-theme="dark"] .prod-shop-logo{background:#0f1c21}
[data-theme="dark"] .myshop-bar{background:var(--card); border-color:var(--line)}
[data-theme="dark"] .pill-green{background:#0f2c1b; color:#5fd08a}
[data-theme="dark"] .pill-red{background:#331414; color:#ff8f8f}
[data-theme="dark"] .ad-share-btn{border-color:var(--line); color:var(--ink)}
/* Do'stlarga ulashish tugmalari — qorong'i variant */
[data-theme="dark"] .share-btn.sb-tg{background:#0f2733; border-color:#1c4a63; color:#7cc4ee}
[data-theme="dark"] .share-btn.sb-wa{background:#0f2a1a; border-color:#1e5233; color:#66d68f}
[data-theme="dark"] .share-btn.sb-copy{background:#12242a; border-color:var(--line); color:var(--ink)}
[data-theme="dark"] .share-btn.copied{background:#0f2a1a; border-color:#1e5233; color:#66d68f}

/* Kartochka chap-yuqori belgilar ustun bo'lib tiksin (ustma-ust tushmasin) — rasm 4 */
.card-badges{position:absolute; top:8px; left:8px; z-index:3; display:flex; flex-direction:column; align-items:flex-start; gap:5px}
.card-badges .badge-urgent,
.card-badges .badge-salon,
.card-badges .badge-vip,
.card-badges .badge-top{position:static; top:auto; left:auto; right:auto}

/* Kuzov holati — to'liq rangli xarita (e'lon sahifasi, rasm 6) */
.body-legend{display:flex; gap:16px; flex-wrap:wrap; margin:2px 0 10px; font-size:.85rem; color:var(--muted)}
.body-legend i{display:inline-block; width:12px; height:12px; border-radius:3px; vertical-align:-1px; margin-right:4px}
.body-legend .lg-ok{background:#2f9e44}
.body-legend .lg-warn{background:#f59e0b}
.body-legend .lg-bad{background:#e03131}
.body-map{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; margin-bottom:8px}
.bmap-item{display:flex; flex-direction:column; gap:1px; padding:8px 11px; border-radius:10px;
  border:1px solid var(--line); border-left:4px solid var(--line); background:var(--card)}
.bmap-item b{font-size:.9rem}
.bmap-item i{font-style:normal; font-size:.8rem; color:var(--muted)}
.bmap-item.lvl-ok{border-left-color:#2f9e44}
.bmap-item.lvl-warn{border-left-color:#f59e0b}
.bmap-item.lvl-warn i{color:#b4770a}
.bmap-item.lvl-bad{border-left-color:#e03131}
.bmap-item.lvl-bad i{color:#c92a2a}
[data-theme="dark"] .bmap-item{background:#12242a}
[data-theme="dark"] .bmap-item.lvl-warn i{color:#ffcf4d}
[data-theme="dark"] .bmap-item.lvl-bad i{color:#ff8f8f}

/* ==== BOSILGAN (FAOL) TUGMA ANIQ KO'RINSIN — hamma bo'limlarda (rasm 1) ==== */
/* Yorug'da ham faol pill/tab yanada ajralib tursin */
.group-tab.on, .kind-pill.on, .seg-opt.on, .chip.active, .size-chip.on{
  box-shadow:0 0 0 2px rgba(14,122,138,.25); font-weight:800
}
/* Qorong'i rejim — faol holatni QAYTA tasdiqlaymiz (umumiy dark override bosib ketmasin) */
[data-theme="dark"] .group-tab.on{background:var(--teal); border-color:var(--teal); color:#04222a}
[data-theme="dark"] .kind-pill.on{background:#2bb6c9; border-color:#2bb6c9; color:#04222a}
[data-theme="dark"] .seg-opt.on{background:var(--teal); color:#04222a}
[data-theme="dark"] .chip.active{background:var(--teal); border-color:var(--teal); color:#04222a}
[data-theme="dark"] .size-chip{background:#0f1c21; border-color:var(--line); color:var(--ink)}
[data-theme="dark"] .size-chip.on{background:var(--teal); border-color:var(--teal); color:#04222a}
[data-theme="dark"] .group-tab.on, [data-theme="dark"] .kind-pill.on,
[data-theme="dark"] .seg-opt.on, [data-theme="dark"] .chip.active,
[data-theme="dark"] .size-chip.on{box-shadow:0 0 0 2px rgba(43,182,201,.35)}
/* Bosilgan payt yengil "bosilish" hissi (hamma tugmalarda) */
.group-tab:active, .kind-pill:active, .chip:active, .size-chip:active, .seg-opt:active{transform:translateY(1px)}

/* Filial (branch) formasi va magazin sahifasidagi filial kartalari — dark (rasm 2,3) */
[data-theme="dark"] .branch-item{background:#12242a; border-color:var(--line)}
[data-theme="dark"] .branch-item input,
[data-theme="dark"] .branch-item select{background:#0f1c21; color:var(--ink); border-color:var(--line)}
[data-theme="dark"] .branch-card{background:#12242a; border-color:var(--line)}
[data-theme="dark"] .branch-card.main{background:#152b33; border-color:var(--sc, var(--teal))}

/* Ovozli qidiruv mikrofoni — kattaroq va aniq (rasm 4, oq/qora rejimda) */
.mic-btn{width:46px; height:46px}
.mic-btn svg{width:26px; height:26px; stroke-width:2.2}
.mic-btn{color:var(--teal)}
.mic-btn:hover{background:rgba(14,122,138,.12)}
[data-theme="dark"] .mic-btn{color:#38c6da}
[data-theme="dark"] .mic-btn:hover{background:rgba(56,198,218,.16); color:#7fe0ee}

/* Admin banner — jonli ko'rinish (stage) + sozlash */
.bnr-ad-stage{position:relative; width:100%; height:200px; border-radius:12px; overflow:hidden;
  background:#0f1c21; border:1px solid var(--line); display:grid; place-items:center; margin:6px 0}
.bnr-ad-stage img{width:100%; height:100%; object-fit:cover; object-position:center}
.bnr-ad-ph{color:var(--muted); font-size:.9rem; text-align:center; padding:0 12px}
.bnr-ad-stage .banner-tag{position:absolute; top:8px; right:8px; background:rgba(0,0,0,.55); color:#fff;
  font-size:.7rem; padding:3px 8px; border-radius:6px}
.bnr-ad-ctrls{display:flex; flex-direction:column; gap:8px; margin-top:8px}
.bac-row{display:grid; grid-template-columns:150px 1fr 52px; align-items:center; gap:10px; font-size:.9rem}
.bac-row input[type=range]{width:100%; accent-color:var(--teal)}
.bac-row output{text-align:right; font-weight:700; font-size:.85rem}
.bac-row select{padding:8px 10px; border:1px solid var(--line); border-radius:9px}
@media (max-width:560px){ .bac-row{grid-template-columns:1fr; gap:3px} .bac-row output{text-align:left} }

/* Magazin yo'nalishlari — "+N" bosilsa ochiladi (rasm 2) */
.shop-kind .skind{white-space:nowrap}
.shop-kind .skind + .skind::before{content:'· '; color:var(--muted); margin:0 2px}
.shop-kind .skind-x{display:none}
.shop-kind.show-all .skind-x{display:inline}
.skind-more{display:inline-block; margin-left:8px; padding:2px 10px; border-radius:999px; border:1px solid var(--line);
  background:var(--teal-soft); color:var(--teal-dark); font-weight:700; font-size:.82rem; cursor:pointer; vertical-align:middle}
.skind-more:hover{background:var(--teal); color:#fff; border-color:var(--teal)}
[data-theme="dark"] .skind-more{background:#12242a; color:#7fe0ee}

/* Banner zoom ishlashi uchun kesib ko'rsatish */
.banner-slide{overflow:hidden}
.banner img, .banner-slide img, .banner-video, .banner-slide video{transform-origin:center}

/* ==== TO'LIQ EKRAN (interstitial) REKLAMA ==== */
.inter-ad{position:fixed; inset:0; z-index:3000; display:grid; place-items:center}
.inter-ad[hidden]{display:none !important}   /* X bosilganda/dastlab yopiq turishi uchun */
.inter-backdrop{position:absolute; inset:0; background:rgba(0,0,0,.85)}
.inter-box{position:relative; z-index:1; width:min(92vw, 440px); max-height:88vh; border-radius:16px; overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.5); background:#000; animation:interIn .35s ease}
@keyframes interIn{from{opacity:0; transform:scale(.9)}to{opacity:1; transform:none}}
.inter-media{width:100%; aspect-ratio:9/16; max-height:88vh; background:#000; display:flex}
.inter-media img, .inter-media video, .inter-media iframe{width:100%; height:100%; object-fit:cover; display:block; border:0}
.inter-x{position:absolute; top:10px; right:10px; width:38px; height:38px; border-radius:50%; border:0;
  background:rgba(0,0,0,.6); color:#fff; font-size:1.1rem; cursor:pointer; display:grid; place-items:center; z-index:2}
.inter-x:hover{background:rgba(0,0,0,.85)}
.inter-timer{position:absolute; top:14px; right:14px; color:#fff; font-size:.9rem; font-weight:700;
  background:rgba(0,0,0,.55); padding:5px 10px; border-radius:999px; z-index:1}
.inter-tag{position:absolute; bottom:10px; left:10px; background:rgba(0,0,0,.55); color:#fff; font-size:.7rem;
  padding:3px 8px; border-radius:6px}

/* Rangli (ajratilgan) e'lon — highlight ramka (#10 monetizatsiya) */
.card-hl{border:2px solid #f59e0b; box-shadow:0 0 0 3px rgba(245,158,11,.18), var(--shadow)}
.card-hl::before{content:'★'; position:absolute; z-index:3; top:6px; right:8px; color:#f59e0b; font-size:1rem; text-shadow:0 1px 2px rgba(0,0,0,.3)}
.card-wrap{position:relative}
[data-theme="dark"] .card-hl{border-color:#ffcf4d; box-shadow:0 0 0 3px rgba(255,207,77,.2)}
.arow-actions form{margin:0}

/* Kuzov holati — vizual diagramma (e'lon sahifasi, o'qish rejimi) */
.body-view .bd-stage{max-width:320px}
.body-view .bp-dot{cursor:pointer}
.body-view .bp-dot.marked .bp-dot-core{r:11}
.body-view .bp-dot.bp-active .bp-dot-core{stroke:#111; stroke-width:3}
.bd-info{margin:10px auto 2px; max-width:340px; border:1px solid var(--line); border-left:5px solid var(--line);
  border-radius:12px; padding:10px 14px; background:var(--card); display:none}
.bd-info.show{display:block; animation:bannerFade .2s ease}
.bd-info b{display:block; font-size:.98rem}
.bd-info i{font-style:normal; font-size:.86rem; color:var(--muted)}
.bd-info.lvl-ok{border-left-color:#16a34a}
.bd-info.lvl-warn{border-left-color:#f59e0b}
.bd-info.lvl-warn i{color:#b4770a}
.bd-info.lvl-bad{border-left-color:#dc2626}
.bd-info.lvl-bad i{color:#c92a2a}
[data-theme="dark"] .bd-info.lvl-warn i{color:#ffcf4d}
[data-theme="dark"] .bd-info.lvl-bad i{color:#ff8f8f}

/* Kuzov "% original" belgisi */
.body-view-head{text-align:center; margin:4px 0 2px}
.body-orig-pct{display:inline-block; padding:5px 14px; border-radius:999px; font-weight:800; font-size:.92rem;
  background:var(--teal-soft); color:var(--teal-dark); border:1px solid var(--line)}
.body-orig-pct.full{background:#e9f9ef; color:#12823b; border-color:#bfe8cd}
[data-theme="dark"] .body-orig-pct{background:#12242a; color:#7fe0ee}
[data-theme="dark"] .body-orig-pct.full{background:#0f2c1b; color:#5fd08a; border-color:#1d5e38}

/* ====== MOBIL: gorizontal "toshib ketish" (overflow) ni tuzatish ====== */
html, body{overflow-x:hidden; max-width:100%}
/* Grid/flex bolalari kichrayishига ruxsat — keng element sahifani cho'zib yubormaydi */
.detail-grid > *{min-width:0}
.detail-main, .detail-side{min-width:0}
.specs{max-width:100%}
.spec{min-width:0}
.spec-l, .spec-v{min-width:0; overflow-wrap:anywhere; word-break:break-word}
.spec-v{white-space:normal}
.cmp-table, .market-box{max-width:100%}
.cmp-l, .cmp-this, .cmp-avg{min-width:0; overflow-wrap:anywhere}
.similar-grid, .grid, .prod-grid{max-width:100%}
.sim-title, .sim-price, .card-title, .prod-title{min-width:0; overflow-wrap:anywhere}
.detail-crumbs, .detail-title{overflow-wrap:anywhere}

@media (max-width:560px){
  /* Solishtirish jadvali telefonda sig'sin */
  .cmp-head, .cmp-row{grid-template-columns:1.1fr 1fr 1fr auto; gap:4px; padding:9px 8px}
  .cmp-head{font-size:.72rem}
  .cmp-row .cmp-l{font-size:.8rem}
  .cmp-this{font-size:.88rem}
  .cmp-avg{font-size:.82rem}
  .cmp-tag{font-size:.64rem; padding:2px 6px}
  /* O'xshash e'lonlar — telefonда 2 tadan, bir xil o'lchamда */
  .similar-grid{grid-template-columns:repeat(2,1fr); gap:10px}
  /* Kuzov diagrammasi va boshqa keng bloklar sig'sin */
  .body-view .bd-stage{max-width:260px}
}

/* ====== v59: qolgan mobil tuzatishlar ====== */
/* Ad-page bozor-solishtirish jadvali (grid) — HECH QACHON min-width bo'lmasin */
.market-box .cmp-table{min-width:0; width:100%; max-width:100%}
.market-box, .market-row{max-width:100%; overflow-wrap:anywhere}
.market-row > *{min-width:0}
/* Feed (e'lonlar ro'yxati) — o'ng chetга yopishmasin/toshmasin */
.grid, .grid-vip{max-width:100%}
.grid > *, .grid-vip > *{min-width:0}
.card{min-width:0}
.card-meta{min-width:0}
.card-meta .loc{min-width:0}
.card-tags{max-width:100%}
/* Magazin yo'nalishlari (kind) telefonда sig'sin va o'ralsin */
.shop-hero-info, .shop-hero-info > *{min-width:0}
.shop-kind{overflow-wrap:anywhere; word-break:normal; max-width:100%}
.shop-kind .skind{white-space:normal}
@media (max-width:560px){
  .shop-kind{font-size:.8rem; line-height:1.5}
  /* Sarlavha ustidagi header tugmalari toza o'ralsin (rasm: tepa qismi) */
  .head-tools{gap:6px; row-gap:8px}
  .head-tools .btn-sm{padding:8px 9px; font-size:.9rem}
  /* "E'lon joylash" — telefonda pastda to'liq enli, ko'zga tashlanadigan tugma */
  .head-tools .btn-post{flex:1 1 100%; order:9; justify-content:center; gap:6px; padding:12px 14px; font-size:1rem; font-weight:800; margin-top:2px}
  .head-tools .btn-post .post-label{display:inline !important}
  .head-tools .btn-post .plus{font-size:1.15rem}
  /* Bozor narxi qutisi — uzun narx o'ralsin, chetга chiqmasin */
  .market-verdict{font-size:1.02rem}
  .market-row{flex-wrap:wrap; gap:2px 8px}
}