/* ============================================================
   ADMIN PANEL — faqat admin.html tomonidan yuklanadi
   ============================================================ */

/* ---- Yuklanish skeleti — "Yuklanmoqda..." matni o'rniga ---- */
.skeleton-wrap{ display:flex; flex-direction:column; gap:10px; padding:10px 2px; }
.skeleton-row{
  height:14px; border-radius:6px;
  background:linear-gradient(90deg, var(--bg-panel) 25%, var(--line) 37%, var(--bg-panel) 63%);
  background-size:400% 100%; animation:skeleton-pulse 1.4s ease infinite;
}
@keyframes skeleton-pulse{
  0%{ background-position:100% 50%; }
  100%{ background-position:0 50%; }
}
@media (prefers-reduced-motion: reduce){
  .skeleton-row{ animation:none; }
}

/* ---- Admin: sub-navigatsiya (eski, endi sidebar ichida qayta stillangan) ---- */
.admin-subnav-btn{
  background:none; border:none; padding:10px 4px; margin-right:16px; font-size:14px; font-weight:500;
  color:var(--ink-soft); cursor:pointer; border-bottom:2px solid transparent; font-family:'Work Sans', sans-serif;
}

/* ---- Admin qobig'i — admin.html mijozlar sayti chrome'idan (nav/footer) butunlay mustaqil ---- */
@media (min-width: 721px){
  body{ overflow:hidden; }
  /* 721-859px oralig'ida yon panel (220px) + jadval ustunlarining eng kichik
     kengligi sig'may qolib, sahifa buzilib ko'rinardi — shu tufayli jadval
     o'zi ichida gorizontal aylanadigan bo'ldi (butun sahifa emas). */
  #adminOrders, #expensesList{ overflow-x:auto; }
  #adminOrders .orders-table, #expensesList .orders-table{ min-width:820px; }
}

.admin-back-link{
  position:fixed; top:14px; right:20px; z-index:50;
  display:inline-flex; align-items:center; gap:6px;
  background:var(--white); border:1px solid var(--line); border-radius:10px;
  padding:8px 14px 8px 11px; font-size:12.5px; font-weight:600; color:var(--pine);
  text-decoration:none; box-shadow:0 6px 20px rgba(22,48,42,0.10);
  transition:background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.admin-back-link svg{ width:14px; height:14px; flex-shrink:0; transition:transform .15s ease; }
.admin-back-link:hover{
  background:var(--pine); border-color:var(--pine); color:#fff;
  box-shadow:0 10px 26px rgba(22,48,42,0.2); transform:translateY(-1px);
}
.admin-back-link:hover svg{ transform:translateX(-2px); }

/* Firebase sessiyani (bor-yo'qligini) tekshirib bo'lguncha ko'rsatiladi —
   shu holat bo'lmasa, tekshiruv tugaguncha standart bo'yicha login sahifasi
   ko'rinib, sessiya bor bo'lsa ham bir lahza "yalt" etib qolardi (sekinroq
   ulanishda yoki qattiq yangilashda — Ctrl+Shift+R — bu sezilarli bo'lardi). */
.admin-auth-checking{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:var(--bg-panel);
}
.admin-auth-spinner{
  width:34px; height:34px; border-radius:50%;
  border:3px solid var(--line); border-top-color:var(--pine);
  animation:admin-auth-spin .7s linear infinite;
}
@keyframes admin-auth-spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){
  .admin-auth-spinner{ animation:none; }
}

.admin-login-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:var(--bg-panel); padding:20px;
}
.admin-login-shell{
  width:100%; max-width:920px; min-height:540px; background:var(--white);
  border-radius:20px; overflow:hidden; box-shadow:0 30px 70px rgba(22,48,42,0.16);
  display:flex;
}
.admin-login-form-panel{
  flex:1; min-width:0; padding:52px 48px; display:flex; flex-direction:column; justify-content:center;
}
.admin-login-form-panel .brand{ font-family:'Fraunces', serif; font-size:23px; font-weight:600; color:var(--pine); margin-bottom:30px; }
.admin-login-form-panel .brand span{ color:var(--rust); }
.admin-login-form-panel h2{ font-family:'Fraunces', serif; font-size:26px; line-height:1.25; color:var(--pine); margin-bottom:6px; }
.admin-login-form-panel .section-note{ margin-bottom:26px; }
.admin-login-form-panel .field input{ padding:13px 14px; font-size:14px; }
.password-field{ position:relative; }
.password-field input{ padding-right:42px !important; }
.password-toggle-btn{
  position:absolute; top:50%; right:6px; transform:translateY(-50%);
  width:30px; height:30px; display:flex; align-items:center; justify-content:center;
  background:none; border:none; color:var(--ink-soft); cursor:pointer; border-radius:6px;
  transition:color .15s ease, background .15s ease;
}
.password-toggle-btn:hover{ color:var(--pine); background:var(--bg-panel); }

/* O'ng tomondagi brend paneli — tashqi stok-foto o'rniga o'zimizning
   rangimiz (pine) va saytda allaqachon ishlatilgan chiziqli naqsh
   (.ruler bilan bir xil g'oya) — begona emas, o'zimizniki. */
.admin-login-visual{
  width:42%; flex-shrink:0; position:relative; overflow:hidden;
  background:linear-gradient(160deg, var(--pine) 0%, #16302a 100%);
  background-size:cover; background-position:center;
  display:flex; align-items:flex-end;
}
.admin-login-visual::before{
  content:''; position:absolute; inset:0;
  background-image: repeating-linear-gradient(90deg, rgba(255,255,255,0.5) 0 1px, transparent 1px 14px);
  background-position:top; background-size:100% 10px; background-repeat:repeat-x;
  opacity:0.3;
}
.admin-login-visual-inner{ position:relative; z-index:1; padding:40px; color:var(--white); }
.admin-login-visual-inner .eyebrow{ color:var(--gold); }
.admin-login-visual-inner h3{ font-family:'Fraunces', serif; font-size:26px; line-height:1.3; max-width:270px; color:var(--white); }

@media (max-width:760px){
  .admin-login-shell{ flex-direction:column; max-width:420px; min-height:0; }
  .admin-login-visual{ width:100%; order:-1; padding:26px; }
  .admin-login-visual-inner{ padding:0; }
  .admin-login-visual-inner h3{ font-size:21px; max-width:none; }
  .admin-login-form-panel{ padding:36px 26px; }
}

.admin-shell{ display:flex; height:100vh; }
.admin-sidebar{
  width:220px; flex-shrink:0; background:var(--pine); color:#fff;
  display:flex; flex-direction:column; padding:18px 12px;
  height:100vh; overflow-y:auto; position:sticky; top:0;
}
.admin-sidebar-topline{ display:contents; }
.admin-sidebar-brand{
  font-family:'Fraunces', serif; font-size:19px; font-weight:600; color:#fff;
  padding:2px 8px 16px; margin-bottom:10px; border-bottom:1px solid rgba(255,255,255,0.12);
}
.admin-sidebar-brand span{ color:var(--rust-light); }
.admin-burger{ display:none; }
.admin-sidebar-actions{ display:contents; }
.admin-sidebar-nav{ display:flex; flex-direction:column; gap:2px; }
.admin-sidebar .admin-subnav-btn{
  display:flex; align-items:center; gap:10px;
  text-align:left; padding:10px 12px; border-radius:8px; color:rgba(255,255,255,0.8);
  border-left:3px solid transparent;
  border-bottom:none; margin-right:0; font-size:14px; font-weight:500;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.admin-sidebar .admin-subnav-btn.active{
  background:rgba(255,255,255,0.1); color:#fff; font-weight:700;
  border-left-color:var(--rust-light);
}
.admin-sidebar .admin-subnav-btn:hover{ background:rgba(255,255,255,0.08); color:#fff; }
.nav-badge{
  margin-left:auto; background:var(--rust); color:#fff; font-size:11px; font-weight:700;
  min-width:18px; height:18px; padding:0 5px; border-radius:9px;
  display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
  font-family:'IBM Plex Mono', monospace;
}
.admin-logout-btn{
  display:flex; align-items:center; justify-content:center; gap:8px;
  background:none; border:1px solid rgba(255,255,255,0.25); color:rgba(255,255,255,0.85);
  padding:10px 12px; border-radius:8px; cursor:pointer; font-size:13px; font-family:'Work Sans', sans-serif;
  margin-top:auto; flex-shrink:0;
  transition:background .15s ease, color .15s ease;
}
.admin-logout-btn:hover{ background:rgba(255,255,255,0.1); color:#fff; }

/* ---- Admin: nav ikonkalari (SVG) va animatsiyalar ---- */
.nav-icon{ width:18px; height:18px; flex-shrink:0; transition:transform .18s ease, color .18s ease; }
.admin-sidebar .admin-subnav-btn:hover .nav-icon{ transform:translateX(2px); }
.admin-sidebar .admin-subnav-btn.active .nav-icon{ color:var(--rust-light); }
.admin-logout-btn .nav-icon{ width:16px; height:16px; }
.admin-logout-btn:hover .nav-icon{ transform:translateX(-2px); }
@keyframes navIconBounce{
  0%{ transform:scale(1) rotate(0deg); }
  40%{ transform:scale(1.28) rotate(-8deg); }
  70%{ transform:scale(0.94) rotate(5deg); }
  100%{ transform:scale(1) rotate(0deg); }
}
.nav-icon.bounce{ animation:navIconBounce .45s ease; }

.admin-main{ flex:1; min-width:0; display:flex; flex-direction:column; background:var(--bg-panel); height:100vh; overflow-y:auto; }
.admin-topbar{
  padding:20px 28px; background:var(--white); border-bottom:1px solid var(--line);
  font-size:13px; color:var(--ink-soft); flex-shrink:0;
  position:sticky; top:0; z-index:1;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.notify-enable-btn{ display:flex; align-items:center; gap:6px; font-size:12.5px; padding:8px 12px; flex-shrink:0; }
.admin-content{ padding:24px 28px; }
.full-admin-banner{
  display:none; align-items:center; gap:14px; justify-content:space-between;
  background:var(--warn-bg, #F3E7CF); color:#7A5310; border-bottom:1px solid rgba(0,0,0,0.08);
  padding:12px 28px; font-size:13px; line-height:1.4;
}
.full-admin-banner b{ font-weight:700; }
.full-admin-banner button{
  flex-shrink:0; background:none; border:none; font-size:20px; line-height:1; color:#7A5310;
  cursor:pointer; padding:0 4px;
}

@media (max-width: 720px){
  /* Fixed pozitsiya tor ekranda sidebar'ning hamburger/chiqish tugmalari
     bilan bir joyga (yuqori o'ng burchak) to'qnashib qolardi — mobilkada
     sahifa oqimidagi ixcham chiziq sifatida yuqorida ko'rsatamiz. */
  .admin-back-link{
    position:static; display:flex; align-items:center; justify-content:center; width:100%; box-sizing:border-box;
    border-radius:0; box-shadow:none; border:none; border-bottom:1px solid var(--line);
    padding:7px 16px; font-size:11px; backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--white);
  }
  .admin-shell{ flex-direction:column; height:auto; }
  .admin-sidebar{ width:100%; height:auto; position:static; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between; padding:12px 16px; gap:10px; overflow-y:visible; }
  .admin-sidebar-topline{ display:flex; align-items:center; gap:10px; }
  .admin-sidebar-brand{ margin-bottom:0; padding:0; border-bottom:none; }
  .admin-sidebar-actions{ display:flex; align-items:center; gap:8px; }
  .admin-burger{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
    width:34px; height:34px; flex-shrink:0;
    background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.25); border-radius:8px; cursor:pointer;
  }
  .admin-burger span{ display:block; width:16px; height:2px; background:#fff; border-radius:2px; transition:transform .2s ease, opacity .2s ease; }
  .admin-burger.open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
  .admin-burger.open span:nth-child(2){ opacity:0; }
  .admin-burger.open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }
  .admin-sidebar-nav{
    display:none; flex-direction:column; width:100%; order:10; margin-top:10px; gap:4px;
  }
  .admin-sidebar-nav.open{ display:flex; }
  .admin-sidebar .admin-subnav-btn{ border-left:3px solid transparent; border-bottom:none; }
  .admin-sidebar .admin-subnav-btn.active{ border-left-color:var(--rust-light); }
  .admin-logout-btn{ margin-top:0; flex-shrink:0; }
  .admin-main{ height:auto; overflow:visible; }
  .admin-content{ padding:18px; overflow-y:visible; }

  /* Jadvalni kichik ekranda kartochkalarga aylantirish */
  .orders-table{ border:none; background:none; border-radius:0; }
  .orders-table thead{ display:none; }
  .orders-table, .orders-table tbody, .orders-table tr, .orders-table td{ display:block; width:100%; }
  .orders-table tbody tr{
    background:var(--white); border:1px solid var(--line); border-radius:10px;
    margin-bottom:10px; padding:10px 14px;
  }
  .orders-table td{ padding:5px 0; }
  .orders-table td::before{
    content:attr(data-label); display:block; font-size:10.5px; text-transform:uppercase;
    letter-spacing:0.04em; color:var(--ink-soft); font-weight:700; margin-bottom:2px;
  }
  .orders-table td[data-label="Holat"]{ min-width:0; }
}

/* ---- Admin: bo'lim sarlavhasi + "Qo'shish" tugmasi ---- */
.admin-section-header{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-top:28px;
}
.admin-section-header.first{ margin-top:0; }
.admin-section-header h2{ margin-bottom:0; }
.dash-online-badge{
  display:flex; align-items:center; gap:7px; flex-shrink:0; align-self:flex-start;
  background:var(--bg-panel); border:1px solid var(--line); border-radius:99px;
  padding:7px 14px; font-size:13px; font-weight:600; color:var(--ink);
}
.dash-online-dot{
  width:8px; height:8px; border-radius:50%; background:#2E8B57; flex-shrink:0;
  box-shadow:0 0 0 3px rgba(46,139,87,.18);
  animation:dash-online-pulse 2s ease-in-out infinite;
}
@keyframes dash-online-pulse{
  0%, 100%{ opacity:1; } 50%{ opacity:.45; }
}
.admin-add-btn{
  flex-shrink:0; background:var(--pine); color:#fff; border:none; border-radius:8px;
  padding:9px 16px; font-size:13px; font-weight:600; cursor:pointer; font-family:'Work Sans', sans-serif;
  transition:background .15s ease;
}
.admin-add-btn:hover{ background:var(--pine-light); }
.report-header-btns{ display:flex; gap:8px; flex-wrap:wrap; flex-shrink:0; }
.ghost-add-btn{ background:var(--white); color:var(--pine); border:1px solid var(--pine); }
.ghost-add-btn:hover{ background:var(--pine); color:#fff; }

/* ---- Admin: umumiy modal oyna (kontent qo'shish/tahrirlash) ---- */
.modal-overlay{
  position:fixed; inset:0; background:rgba(22,32,28,0.45); z-index:100;
  display:flex; align-items:center; justify-content:center; padding:20px;
}
.modal-card{
  width:100%; max-width:480px; max-height:85vh; background:var(--white); border-radius:12px;
  box-shadow:0 20px 50px rgba(22,48,42,0.25); display:flex; flex-direction:column; overflow:hidden;
}
.modal-header{
  display:flex; align-items:center; justify-content:space-between; padding:14px 18px;
  border-bottom:1px solid var(--line); font-weight:700; color:var(--ink); flex-shrink:0;
}
.modal-close{
  background:none; border:none; font-size:22px; line-height:1; color:var(--ink-soft); cursor:pointer; padding:0 4px;
}
.modal-close:hover{ color:var(--rust); }
.modal-body{ overflow-y:auto; padding:16px 18px 18px; }
.modal-body .admin-upload-form{ max-width:none; margin-bottom:0; }

/* ---- Admin: katalog mahsulotlari — turlar bo'yicha ochiladigan guruhlar ---- */
.catalog-cat-group{
  background:var(--white); border:1px solid var(--line); border-radius:10px;
  margin-bottom:10px; overflow:hidden;
}
.catalog-cat-group summary{
  display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap;
  padding:12px 14px; cursor:pointer; font-weight:700; font-size:14px; color:var(--ink);
  list-style:none; user-select:none;
}
.catalog-cat-group summary::-webkit-details-marker{ display:none; }
.cat-group-chevron{
  width:18px; height:18px; flex-shrink:0; color:var(--ink-soft);
  display:flex; align-items:center; justify-content:center;
  transition:transform .18s ease;
}
.cat-group-chevron svg{ width:100%; height:100%; }
.catalog-cat-group[open] .cat-group-chevron{ transform:rotate(90deg); color:var(--pine); }
.cat-group-title{ flex:1; min-width:160px; display:flex; align-items:center; gap:8px; }
.cat-group-thumb{ width:28px; height:28px; border-radius:6px; object-fit:cover; flex-shrink:0; }
.cat-group-count{
  background:var(--bg-panel); color:var(--ink-soft); font-size:11.5px; font-weight:700;
  border-radius:20px; padding:2px 9px; flex-shrink:0;
}
.cat-group-actions{ display:flex; align-items:center; gap:6px; flex-shrink:0; flex-wrap:wrap; }
.cat-group-actions .admin-edit-btn, .cat-group-actions .admin-delete-btn{ font-size:11px; padding:5px 10px; }
.cat-group-add-btn{
  flex-shrink:0; background:var(--pine); color:#fff; border:none; border-radius:20px;
  padding:5px 12px; font-size:11.5px; font-weight:600; cursor:pointer; font-family:'Work Sans', sans-serif;
  transition:background .15s ease;
}
.cat-group-add-btn:hover{ background:var(--pine-light); }
.catalog-cat-group[open] summary{ border-bottom:1px solid var(--line); }
.catalog-cat-group-body .admin-content-row{ border-bottom:1px solid var(--line); }
.catalog-cat-group-body .admin-content-row:last-child{ border-bottom:none; }
.catalog-cat-group-body .empty{ padding:14px; }
.about-accordion{ margin-bottom:12px; }
.about-accordion-body{ padding:14px; display:flex; flex-direction:column; gap:12px; }
.catalog-id-badge{
  display:inline-block; font-family:'IBM Plex Mono', monospace; font-size:10.5px; font-weight:700;
  color:var(--pine); background:var(--bg-panel); border-radius:5px; padding:1px 6px; margin-right:6px;
}

/* ---- Admin: katalog mahsuloti rang qatorlari ---- */
.admin-upload-form input[readonly]{ background:var(--bg-panel); color:var(--ink-soft); cursor:not-allowed; }
.catalog-colors-list{ display:flex; flex-direction:column; gap:10px; margin-bottom:8px; }
.catalog-color-card{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:10px; padding:10px;
}
.catalog-color-card-top{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.color-preview{ width:44px; height:44px; border-radius:8px; object-fit:cover; flex-shrink:0; background:var(--white); border:1px solid var(--line); }
.color-preview.empty{ background:var(--line); }
.catalog-color-card-name{ flex:1; min-width:0; }
.catalog-color-card-name label, .color-addqty-field label{
  display:block; font-size:10.5px; font-weight:600; color:var(--ink-soft); margin-bottom:3px;
  text-transform:uppercase; letter-spacing:0.03em;
}
.catalog-color-card-name .color-name-input{
  width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:6px;
  font-size:13px; font-family:'Work Sans', sans-serif; background:var(--white);
}
.color-remove-btn{
  width:30px; height:30px; border-radius:50%; border:1px solid var(--line); background:var(--white); color:var(--rust);
  cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center; align-self:flex-end;
  transition:background .15s ease, border-color .15s ease;
}
.color-remove-btn svg{ width:14px; height:14px; }
.color-remove-btn:hover{ background:var(--rust); border-color:var(--rust); color:#fff; }
.catalog-color-card-fields{ display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap; }
.color-file-label{
  flex:1; min-width:150px; display:flex; align-items:center; gap:7px; padding:8px 10px;
  border:1px dashed var(--line); border-radius:6px; background:var(--white); color:var(--ink-soft);
  font-size:12px; cursor:pointer; transition:border-color .15s ease, color .15s ease;
}
.color-file-label:hover{ border-color:var(--pine); color:var(--pine); }
.color-file-label svg{ width:15px; height:15px; flex-shrink:0; }
.color-file-label-text{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.catalog-color-roomviz-row{ display:flex; align-items:center; gap:8px; margin-top:8px; padding-top:8px; border-top:1px dashed var(--line); }
.roomviz-preview{ background:repeating-conic-gradient(#e9e2d4 0% 25%, #fff 0% 50%) 50% / 10px 10px; }
.catalog-color-roomviz-row .color-remove-btn{ align-self:center; }

/* ---- Fayl tanlash (barcha yuklash formalarida) — native input o'rniga ---- */
.file-picker-label{
  display:flex; align-items:center; gap:9px; padding:12px 14px; width:100%;
  border:1px dashed var(--line); border-radius:8px; background:var(--white); color:var(--ink-soft);
  font-size:13.5px; font-family:'Work Sans', sans-serif; cursor:pointer;
  transition:border-color .15s ease, color .15s ease; box-sizing:border-box;
}
.file-picker-label:hover{ border-color:var(--pine); color:var(--pine); }
.file-picker-label svg{ width:18px; height:18px; flex-shrink:0; }
.file-picker-label-text{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.color-current-stock{
  flex-shrink:0; font-size:11.5px; color:var(--ink-soft); background:var(--white); border:1px solid var(--line);
  border-radius:6px; padding:8px 10px; white-space:nowrap; align-self:center;
}
.color-addqty-field{ width:100px; flex-shrink:0; }
.color-addqty-field .color-addqty-input{
  width:100%; padding:8px 10px; border:1px solid var(--pine); border-radius:6px;
  font-size:13px; font-family:'Work Sans', sans-serif; background:var(--white);
}

@media (max-width:480px){
  .catalog-color-card-fields{ flex-direction:column; align-items:stretch; }
  .color-addqty-field{ width:100%; }
  .color-current-stock{ text-align:center; }
}

/* ---- Admin: kontent ro'yxati va yuklash formasi ---- */
.admin-content-list{
  display:flex; flex-direction:column; margin-bottom:18px;
  background:var(--white); border:1px solid var(--line); border-radius:10px; overflow:hidden;
}
.admin-content-row{
  display:flex; align-items:center; gap:14px; background:var(--white);
  border-bottom:1px solid var(--line); padding:10px 14px; transition:background .12s ease;
}
.admin-content-list .admin-content-row:last-child{ border-bottom:none; }
.admin-content-row:hover{ background:var(--bg-panel); }
.drag-handle{
  display:flex; align-items:center; justify-content:center; width:18px; height:18px;
  color:var(--ink-soft); flex-shrink:0; cursor:grab; touch-action:none;
}
.drag-handle svg{ width:100%; height:100%; }
.drag-handle:active{ cursor:grabbing; }
.admin-content-row.dragging, details.catalog-cat-group.dragging{ opacity:0.4; }
.order-move-btns{ display:flex; flex-direction:column; gap:1px; flex-shrink:0; }
.order-move-btn{
  display:flex; align-items:center; justify-content:center; width:18px; height:13px;
  background:none; border:none; padding:0; color:var(--ink-soft); cursor:pointer;
  transition:color .12s ease;
}
.order-move-btn svg{ width:12px; height:12px; }
.order-move-btn:hover{ color:var(--pine); }
.admin-thumb{
  width:46px; height:46px; object-fit:cover; border-radius:6px; flex-shrink:0; background:var(--bg-panel);
}
.admin-thumb-placeholder{
  display:flex; align-items:center; justify-content:center; color:var(--pine);
  background:linear-gradient(135deg, var(--bg-panel), var(--line));
}
.admin-thumb-placeholder svg{ width:22px; height:22px; }
.admin-content-info{ flex:1; min-width:0; font-size:13px; color:var(--ink); line-height:1.4; }
.admin-content-info span{ color:var(--ink-soft); }
.contact-new-badge{
  display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:9.5px; text-transform:uppercase;
  letter-spacing:.05em; background:var(--rust); color:#fff; border-radius:4px; padding:2px 6px; margin-left:6px; vertical-align:middle;
}
.contact-review-btn{
  background:none; border:1px solid var(--pine); color:var(--pine); border-radius:6px; padding:6px 12px;
  font-size:12px; font-weight:600; cursor:pointer; font-family:'Work Sans',sans-serif; transition:background .15s ease;
}
.contact-review-btn:hover{ background:var(--pine); color:#fff; }
.stock-adjust{
  display:inline-flex; align-items:center; gap:6px; margin-left:8px;
  background:var(--bg-panel); border:1px solid var(--line); border-radius:20px; padding:2px 4px;
  vertical-align:middle;
}
.stock-btn{
  width:20px; height:20px; border-radius:50%; border:none; background:var(--white);
  color:var(--pine); font-size:13px; line-height:1; cursor:pointer; font-family:'IBM Plex Mono', monospace;
}
.stock-btn:hover{ background:var(--pine); color:#fff; }
.stock-count{ font-size:12px; font-weight:700; color:var(--ink); min-width:14px; text-align:center; font-family:'IBM Plex Mono', monospace; }
.admin-delete-btn{
  background:none; border:1px solid var(--rust); color:var(--rust); border-radius:6px; padding:6px 10px;
  font-size:11.5px; cursor:pointer; flex-shrink:0; font-family:'Work Sans', sans-serif;
}
.admin-delete-btn:hover{ background:var(--rust); color:#fff; }
.admin-clone-btn{
  background:none; border:1px solid var(--ink-soft); color:var(--ink-soft); border-radius:6px; padding:6px 10px;
  font-size:11.5px; cursor:pointer; flex-shrink:0; font-family:'Work Sans', sans-serif;
}
.admin-clone-btn:hover{ background:var(--ink-soft); color:#fff; }
.admin-upload-form{ display:flex; flex-direction:column; gap:8px; margin-bottom:8px; max-width:640px; }
.admin-upload-form input[type="text"],
.admin-upload-form input[type="number"],
.admin-upload-form input[type="date"],
.admin-upload-form select{
  width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:7px; font-size:13px;
  font-family:'Work Sans', sans-serif; background:var(--white); color:var(--ink);
}
.admin-upload-form select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238A7A67' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; padding-right:32px; cursor:pointer;
}
.admin-upload-form input[type="file"]{ font-size:12.5px; }
/* Native raqam spinnerlarini yashiramiz — saytning boshqa joylarida ham
   ko'rinmaydi, shu bilan barcha son maydonlari bir xil tekis ko'rinishda bo'ladi */
.admin-upload-form input[type="number"]::-webkit-outer-spin-button,
.admin-upload-form input[type="number"]::-webkit-inner-spin-button{
  -webkit-appearance:none; margin:0;
}
.admin-upload-form input[type="number"]{ -moz-appearance:textfield; }
/* ---- Rollar: bo'lim x amal ruxsat jadvali ---- */
.perm-matrix-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:8px; margin:4px 0 10px; }
.perm-matrix{ width:100%; border-collapse:collapse; font-size:13px; font-family:'Work Sans', sans-serif; }
.perm-matrix th, .perm-matrix td{ padding:9px 12px; text-align:center; border-bottom:1px solid var(--line); white-space:nowrap; }
.perm-matrix th:first-child, .perm-matrix td:first-child{ text-align:left; color:var(--ink); font-weight:500; }
.perm-matrix thead th{ background:var(--bg-panel); color:var(--ink-soft); font-weight:600; font-size:11px; text-transform:uppercase; letter-spacing:.03em; }
.perm-matrix tbody tr:last-child td{ border-bottom:none; }
.perm-matrix input[type="checkbox"]{ width:16px; height:16px; cursor:pointer; accent-color:var(--pine); }
.perm-na{ color:var(--line); }
.i18n-field{ display:flex; flex-direction:column; gap:6px; padding:8px; background:var(--bg-panel); border:1px dashed var(--line); border-radius:8px; }
.i18n-field input[type="text"]{ margin:0; }

/* ---- Xodimga bir nechta rol tayinlash — belgilash ro'yxati ---- */
.role-checkbox-list{
  display:flex; flex-direction:column; gap:2px; padding:6px 4px;
  background:var(--bg-panel); border:1px solid var(--line); border-radius:8px; max-height:220px; overflow-y:auto;
}
.role-checkbox-row{
  display:flex; align-items:center; gap:9px; padding:7px 8px; border-radius:6px; cursor:pointer; font-size:13px; color:var(--ink);
}
.role-checkbox-row:hover{ background:var(--white); }
.role-checkbox-row input[type="checkbox"]{ width:16px; height:16px; flex-shrink:0; cursor:pointer; accent-color:var(--pine); }
.role-checkbox-empty{ padding:10px 8px; color:var(--ink-soft); font-size:12.5px; }
.about-stat-row{ display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:8px; }
.about-stat-row input{ margin:0; }
@media (max-width:640px){
  .about-stat-row{ grid-template-columns:1fr 1fr; }
}

/* ---- Biz haqimizda formasi: har bir mazmun bo'lagi aniq ajratilgan karta ---- */
.about-field-group{
  display:flex; flex-direction:column; gap:9px; border:1px solid var(--line); border-radius:10px;
  padding:14px; background:var(--white);
}
.about-field-group-label{
  align-self:flex-start; background:var(--pine); color:#fff; font-size:11px; font-weight:600;
  padding:3px 10px; border-radius:5px; font-family:'Work Sans',sans-serif; letter-spacing:.02em;
}
.about-field-group-value{ border-color:var(--gold); }
.about-field-group-value .about-field-group-label{ background:var(--gold-deep); }

/* ---- Admin: "Xonamda ko'rish" uchun PNG rasm maydoni ---- */
.catalog-roomviz-current{
  display:flex; align-items:center; gap:10px; margin-top:8px;
  background:var(--bg-panel); border:1px solid var(--line); border-radius:10px; padding:8px 10px;
}
.catalog-roomviz-current img{ width:36px; height:36px; object-fit:contain; border-radius:6px; background:var(--white); flex-shrink:0; }
.catalog-roomviz-current span{ flex:1; font-size:12.5px; color:var(--ink-soft); }
.catalog-roomviz-current button{ flex-shrink:0; padding:5px 10px; font-size:11.5px; }

/* ---- Admin: tahrirlash/o'chirish tugmalari va forma tugmalari qatori ---- */
.admin-row-actions{ display:flex; gap:6px; flex-shrink:0; }
.admin-edit-btn{
  background:none; border:1px solid var(--pine); color:var(--pine); border-radius:6px; padding:6px 10px;
  font-size:11.5px; cursor:pointer; font-family:'Work Sans', sans-serif;
}
.admin-edit-btn:hover{ background:var(--pine); color:#fff; }
.admin-form-btns{ display:flex; gap:8px; }
.admin-form-btns .ghost{ flex-shrink:0; }

/* ---- Admin: buyurtma tarixi modal oynasi ---- */
.order-log-overlay{
  position:fixed; inset:0; background:rgba(22,32,28,0.45); z-index:100;
  display:flex; align-items:center; justify-content:center; padding:20px;
}
.order-log-card{
  width:100%; max-width:420px; max-height:80vh; background:var(--white); border-radius:12px;
  box-shadow:0 20px 50px rgba(22,48,42,0.25); display:flex; flex-direction:column; overflow:hidden;
}
.order-log-header{
  display:flex; align-items:center; justify-content:space-between; padding:14px 18px;
  border-bottom:1px solid var(--line); font-weight:700; color:var(--ink); flex-shrink:0;
}
.order-log-close{
  background:none; border:none; font-size:22px; line-height:1; color:var(--ink-soft); cursor:pointer; padding:0 4px;
}
.order-log-close:hover{ color:var(--rust); }
.customer-history-summary{ display:flex; gap:10px; padding:14px 18px 0; flex-shrink:0; }
.customer-history-stat{
  flex:1; background:var(--bg-panel); border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; text-align:center;
}
.customer-history-stat b{ display:block; font-family:'Fraunces', serif; font-size:17px; color:var(--pine); }
.customer-history-stat span{ font-size:11px; color:var(--ink-soft); text-transform:uppercase; letter-spacing:0.03em; }
.order-log-list{ overflow-y:auto; padding:10px 18px 18px; }
.order-log-item{ padding:10px 0; border-bottom:1px solid var(--line); }
.order-log-item:last-child{ border-bottom:none; }
.order-log-item-status{ font-size:13.5px; font-weight:600; color:var(--ink); }
.order-log-item-meta{ font-size:11.5px; color:var(--ink-soft); margin-top:2px; }

/* ---- Admin: buyurtma tafsiloti (o'ng tomondan sirg'aluvchi panel) ---- */
.order-detail-overlay{
  position:fixed; inset:0; background:rgba(22,32,28,0.45); z-index:100;
  display:flex; justify-content:flex-end;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .22s ease, visibility .22s;
}
.order-detail-overlay.open{ opacity:1; visibility:visible; pointer-events:auto; }
.order-detail-panel{
  width:100%; max-width:440px; height:100%; background:var(--white);
  box-shadow:-20px 0 50px rgba(22,48,42,0.25);
  display:flex; flex-direction:column; overflow:hidden;
  transform:translateX(100%);
  transition:transform .28s cubic-bezier(.2,.7,.2,1);
}
.order-detail-overlay.open .order-detail-panel{ transform:translateX(0); }
.order-detail-header{
  display:flex; align-items:flex-start; justify-content:space-between; gap:10px;
  padding:18px 20px; border-bottom:1px solid var(--line); flex-shrink:0;
}
.order-detail-id{ font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--ink-soft); display:block; margin-bottom:2px; }
.order-detail-header h3{ font-size:18px; color:var(--ink); }
.order-detail-body{ overflow-y:auto; padding:18px 20px 26px; display:flex; flex-direction:column; gap:20px; }

.order-detail-section-title{
  font-size:11px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:10px;
}
.order-detail-info-card{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:10px; padding:12px 14px;
  display:flex; flex-direction:column; gap:8px; font-size:13.5px; color:var(--ink);
}
.order-detail-info-row{ display:flex; align-items:center; gap:8px; }
.order-detail-info-row a{ color:var(--pine); text-decoration:none; }
.order-detail-info-row a:hover{ text-decoration:underline; }
.order-detail-info-row svg{ flex-shrink:0; color:var(--ink-soft); }

.order-detail-note{
  background:#FBF3E5; border:1px solid #EBD9AE; border-radius:10px; padding:12px 14px;
  font-size:13px; color:var(--ink); font-style:italic;
}

.order-detail-checklist{ display:flex; flex-direction:column; gap:2px; }
.order-detail-step{
  display:flex; align-items:center; gap:10px; padding:9px 8px; border-radius:8px; text-align:left; width:100%;
  background:none; border:none; cursor:pointer; font-family:'Work Sans', sans-serif; font-size:13.5px; color:var(--ink-soft);
  transition:background .15s ease;
}
.order-detail-step:hover{ background:var(--bg-panel); }
.order-detail-step:disabled{ cursor:default; }
.order-detail-step-dot{
  width:20px; height:20px; border-radius:50%; border:2px solid var(--line); flex-shrink:0;
  display:flex; align-items:center; justify-content:center; color:var(--white);
}
.order-detail-step.done .order-detail-step-dot{ background:var(--pine); border-color:var(--pine); }
.order-detail-step.current{ color:var(--ink); font-weight:700; }
.order-detail-step.current .order-detail-step-dot{ background:var(--rust); border-color:var(--rust); }

.order-detail-templates{ display:flex; flex-direction:column; gap:8px; }
.order-detail-template-btn{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:var(--white); border:1px solid var(--line); border-radius:10px; padding:10px 12px;
  cursor:pointer; text-align:left; font-family:'Work Sans', sans-serif;
}
.order-detail-template-btn:hover{ border-color:var(--pine); }
.order-detail-template-btn > span:first-child{ display:block; flex:1; min-width:0; }
.order-detail-template-btn b{ display:block; font-size:13px; color:var(--ink); }
.order-detail-template-btn > span:first-child > span{
  display:block; font-size:11.5px; color:var(--ink-soft); margin-top:2px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.order-detail-template-btn svg{ flex-shrink:0; color:var(--ink-soft); }

@media (max-width:600px){
  .order-detail-panel{ max-width:100%; }
}

/* ---- Admin: Chat ---- */
.chat-online-strip{
  display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 16px;
}
.chat-online-empty{ font-size:12.5px; color:var(--ink-soft); }
.chat-online-chip{
  display:flex; align-items:center; gap:6px; background:var(--white); border:1px solid var(--line);
  border-radius:20px; padding:5px 12px 5px 8px; font-size:12.5px; color:var(--ink-soft);
}
.chat-online-chip.online{ color:var(--ink); border-color:#BFE0CC; background:#F1F9F4; }
.online-dot{
  display:inline-block; width:8px; height:8px; border-radius:50%; background:#B9AF9E; flex-shrink:0;
  transition:background .2s ease;
}
.chat-online-chip.online .online-dot, .online-dot.online{ background:#3EA76B; box-shadow:0 0 0 3px rgba(62,167,107,0.18); }

.chat-shell{
  display:flex; height:calc(100vh - 260px); min-height:480px; background:var(--white); border:1px solid var(--line);
  border-radius:10px; overflow:hidden;
}
.chat-list-pane{
  width:230px; flex-shrink:0; display:flex; flex-direction:column;
  background:var(--bg-panel); border-right:1px solid var(--line);
}
.chat-list-header{
  display:flex; align-items:center; justify-content:space-between; padding:12px 14px;
  font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:var(--ink-soft);
  border-bottom:1px solid var(--line); flex-shrink:0;
}
.chat-new-group-btn{
  width:26px; height:26px; border-radius:8px; border:1px solid var(--line); background:var(--white);
  color:var(--pine); cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  transition:background .12s ease, color .12s ease;
}
.chat-new-group-btn svg{ width:15px; height:15px; }
.chat-new-group-btn:hover{ background:var(--pine); color:#fff; border-color:var(--pine); }
.chat-conversation-list{ flex:1; overflow-y:auto; padding:6px; display:flex; flex-direction:column; gap:2px; }
.chat-conv-section{
  padding:10px 10px 4px; font-size:10.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:0.04em; color:var(--ink-soft);
}
.chat-conv-item{
  display:flex; align-items:center; gap:8px;
  text-align:left; padding:9px 10px; border-radius:8px; font-size:13px; color:var(--ink);
  background:none; border:none; cursor:pointer; font-family:'Work Sans', sans-serif;
  transition:background .12s ease;
}
.chat-conv-item:hover{ background:var(--white); }
.chat-conv-item.active{ background:var(--pine); color:#fff; font-weight:600; }
.chat-conv-item.active .online-dot{ box-shadow:0 0 0 3px rgba(255,255,255,0.25); }
.chat-conv-item-label{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-conv-unread{
  flex-shrink:0; background:var(--rust); color:#fff; font-size:10.5px; font-weight:700; border-radius:9px;
  min-width:17px; height:17px; padding:0 5px; display:inline-flex; align-items:center; justify-content:center;
  font-family:'IBM Plex Mono', monospace;
}
.chat-conv-item.active .chat-conv-unread{ background:#fff; color:var(--pine); }
.chat-new-group-form{
  display:none; flex-direction:column; gap:8px; padding:12px; border-top:1px solid var(--line);
  background:var(--white); flex-shrink:0;
}
.chat-new-group-form input[type="text"]{
  padding:8px 10px; border:1px solid var(--line); border-radius:7px; font-size:13px; font-family:'Work Sans', sans-serif;
}
.chat-group-members{ max-height:130px; overflow-y:auto; display:flex; flex-direction:column; gap:4px; }
.chat-member-check{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--ink); cursor:pointer; }

.chat-pane{ flex:1; min-width:0; display:flex; flex-direction:column; }
.chat-pane-header{
  display:flex; align-items:center; gap:8px; padding:13px 16px; font-size:14px; font-weight:700; color:var(--ink);
  border-bottom:1px solid var(--line); flex-shrink:0;
}
.chat-pane-header span{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-back-btn{
  display:none; width:28px; height:28px; border-radius:8px; border:none; background:none;
  color:var(--ink); cursor:pointer; flex-shrink:0; align-items:center; justify-content:center;
}
.chat-back-btn svg{ width:18px; height:18px; }
.chat-delete-group-btn{
  width:28px; height:28px; border-radius:8px; border:none; background:none; color:var(--ink-soft);
  cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center; transition:color .12s ease;
}
.chat-delete-group-btn svg{ width:16px; height:16px; }
.chat-delete-group-btn:hover{ color:var(--rust); }
.chat-messages{
  flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:6px;
  background:var(--bg-panel);
}
.chat-msg{ max-width:75%; align-self:flex-start; display:flex; flex-direction:column; position:relative; }
.chat-msg.mine{ align-self:flex-end; align-items:flex-end; }
.chat-msg-sender{ font-size:11px; font-weight:700; color:var(--rust); margin-bottom:2px; padding:0 4px; }
.chat-msg-bubble-wrap{ position:relative; display:flex; align-items:center; gap:6px; touch-action:pan-y; }
.chat-msg.mine .chat-msg-bubble-wrap{ flex-direction:row-reverse; }
.chat-msg-reply-quote{
  font-size:11.5px; color:var(--ink-soft); border-left:2px solid var(--rust); padding:2px 8px;
  margin-bottom:4px; background:rgba(0,0,0,0.03); border-radius:0 6px 6px 0;
}
.chat-msg-reply-quote strong{ color:var(--pine); }
.chat-msg.mine .chat-msg-reply-quote{ background:rgba(255,255,255,0.14); color:rgba(255,255,255,0.75); }
.chat-msg.mine .chat-msg-reply-quote strong{ color:#fff; }
.chat-msg-bubble{
  width:fit-content; max-width:100%; background:var(--white); border:1px solid var(--line); color:var(--ink);
  padding:7px 11px; border-radius:13px 13px 13px 3px; font-size:13px; line-height:1.4;
  word-break:break-word; transition:transform .15s ease;
}
.chat-msg-text{ white-space:pre-wrap; }
.chat-msg.mine .chat-msg-bubble{
  background:var(--pine); color:#fff; border-color:var(--pine); border-radius:13px 13px 3px 13px;
}
.chat-msg-media{ max-width:200px; border-radius:10px; display:block; }
.chat-msg-time{ font-size:10px; color:var(--ink-soft); margin-top:2px; padding:0 4px; }
.chat-reply-btn{
  flex-shrink:0; width:24px; height:24px; border-radius:50%; border:none; background:var(--white);
  color:var(--ink-soft); cursor:pointer; display:flex; align-items:center; justify-content:center;
  box-shadow:0 1px 4px rgba(22,48,42,0.15); opacity:0; transition:opacity .12s ease;
}
.chat-msg:hover .chat-reply-btn{ opacity:1; }
.chat-reply-btn svg{ width:12px; height:12px; }
/* Sensorli qurilmalarda hover bo'lmagani uchun tugma o'rniga faqat surish (swipe) ishlatiladi */
@media (hover: none){
  .chat-reply-btn{ display:none; }
}
.chat-reply-bar{
  display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 14px;
  background:var(--bg-panel); border-top:1px solid var(--line); flex-shrink:0;
}
.chat-reply-bar-info{ font-size:12px; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-reply-bar-label{ color:var(--rust); font-weight:700; margin-right:4px; }
.chat-reply-bar button{ background:none; border:none; color:var(--ink-soft); font-size:18px; cursor:pointer; flex-shrink:0; padding:0 4px; }
.chat-input-row{ display:flex; align-items:center; gap:6px; padding:10px 12px; border-top:1px solid var(--line); flex-shrink:0; background:var(--white); position:relative; }
.chat-input-row input[type="text"]{
  flex:1; min-width:0; padding:10px 12px; border:1px solid var(--line); border-radius:20px; font-size:13.5px;
  font-family:'Work Sans', sans-serif;
}
.chat-icon-btn{
  flex-shrink:0; width:34px; height:34px; border-radius:50%; border:none; background:none;
  color:var(--ink-soft); cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .12s ease, color .12s ease;
}
.chat-icon-btn svg{ width:19px; height:19px; }
.chat-icon-btn:hover{ background:var(--bg-panel); color:var(--pine); }
.chat-icon-btn.uploading{ opacity:0.5; pointer-events:none; }
.chat-send-btn{
  flex-shrink:0; width:36px; height:36px; border-radius:50%; border:none; background:var(--pine);
  color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .12s ease;
}
.chat-send-btn svg{ width:16px; height:16px; }
.chat-send-btn:hover{ background:var(--pine-light); }
.chat-emoji-picker{
  position:absolute; right:10px; bottom:56px; width:260px; max-height:220px; overflow-y:auto;
  background:var(--white); border:1px solid var(--line); border-radius:12px; box-shadow:0 8px 24px rgba(22,48,42,0.18);
  padding:8px; display:flex; flex-wrap:wrap; gap:2px; z-index:5;
}
.chat-emoji-picker button{
  width:32px; height:32px; border:none; background:none; font-size:19px; cursor:pointer; border-radius:6px;
  display:flex; align-items:center; justify-content:center;
}
.chat-emoji-picker button:hover{ background:var(--bg-panel); }

/* ---- Admin: Hisobot (ombor) ---- */
.report-summary{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px; }
.report-stat{
  flex:1; min-width:140px; background:var(--pine); color:#fff; border-radius:10px;
  padding:14px 16px; display:flex; flex-direction:column; gap:4px;
}
.report-stat-label{ font-size:11px; text-transform:uppercase; letter-spacing:0.04em; opacity:0.8; }
.report-stat-value{ font-family:'IBM Plex Mono', monospace; font-size:22px; font-weight:700; }
.report-cat-block{ margin-bottom:22px; }
.report-cat-block h3{ font-size:15px; color:var(--pine); margin-bottom:8px; }
.report-table{
  width:100%; border-collapse:separate; border-spacing:0;
  background:var(--white); border:1px solid var(--line); border-radius:10px; overflow:hidden;
}
.report-table thead th{
  text-align:center; font-size:11px; text-transform:uppercase; letter-spacing:0.04em; color:var(--ink-soft);
  background:var(--bg-panel); padding:9px 12px; border-bottom:1px solid var(--line); font-weight:700;
}
.report-table thead th:first-child{ text-align:left; }
.report-table tbody tr{ background:var(--white); border-bottom:1px solid var(--line); }
.report-table tbody tr:last-child{ border-bottom:none; }
.report-table tbody tr:nth-child(even){ background:var(--bg-panel); }
.report-table td{ padding:10px 12px; font-size:13px; color:var(--ink); font-family:'IBM Plex Mono', monospace; text-align:center; }
.report-table td:first-child{ font-family:'Work Sans', sans-serif; font-weight:600; text-align:left; }
.report-remaining{ color:var(--pine); font-weight:700; }
.report-table tbody tr.report-row-low{ background:#FBEDEC; }
.report-table tbody tr.report-row-low:nth-child(even){ background:#F7E2E1; }
.report-row-low .report-remaining{ color:#B4453F; }
.report-low-badge{
  display:inline-block; margin-left:6px; padding:2px 7px; border-radius:20px;
  background:#B4453F; color:#fff; font-family:'Work Sans', sans-serif; font-size:10px;
  font-weight:700; text-transform:uppercase; letter-spacing:0.03em; vertical-align:middle;
}
.report-stat-low .report-stat-value{ color:#F3C6C4; }

@media print{
  body *{ visibility:hidden; }
  #adminView-report, #adminView-report *{ visibility:visible; }
  #adminView-report{ position:absolute; left:0; top:0; width:100%; padding:20px; }
  #reportPrintBtn{ display:none; }
}

/* ---- Admin: Mijozlar ---- */
.customers-summary{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px; }
.customers-stat{
  flex:1; min-width:150px; background:var(--pine); color:#fff; border-radius:10px;
  padding:14px 16px; display:flex; flex-direction:column; gap:4px;
}
.customers-stat-label{ font-size:11px; text-transform:uppercase; letter-spacing:0.04em; opacity:0.8; }
.customers-stat-value{ font-family:'IBM Plex Mono', monospace; font-size:22px; font-weight:700; }

.customer-name-cell{ display:flex; align-items:center; gap:10px; }
.customer-avatar{
  width:34px; height:34px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:var(--bg-panel); color:var(--pine);
  font-family:'Fraunces', serif; font-weight:700; font-size:15px;
}
.customer-name-text .cell-main{ display:block; }
.customer-name-text .cell-sub{ display:block; }

.badge.src-telegram_bot{ background:#2AABEE; }
.badge.src-phone{ background:var(--pine); }
.badge.src-email{ background:var(--ink-soft); }
.badge.src-google{ background:#DB4437; }

.customer-order-count{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:26px; height:22px; padding:0 7px; border-radius:20px;
  background:var(--bg-panel); color:var(--pine); font-family:'IBM Plex Mono', monospace;
  font-weight:700; font-size:12.5px;
}
.customer-order-count.has-orders{ background:var(--pine); color:#fff; }

@media (max-width: 720px){
  .chat-shell{ flex-direction:column; height:480px; position:relative; }
  .chat-list-pane{ width:100%; border-right:none; }
  .chat-pane{ display:none; }
  .chat-back-btn{ display:flex; }
  /* Telegram uslubi: mobilkada suhbat ochilganda ro'yxat butunlay yashirinadi,
     faqat tanlangan suhbat (orqaga tugmasi bilan) ko'rinadi — ikkalasi bir vaqtda emas. */
  .chat-shell.mobile-conv-open{
    position:fixed; inset:0; z-index:110; height:auto; border-radius:0; border:none;
  }
  .chat-shell.mobile-conv-open .chat-list-pane{ display:none; }
  .chat-shell.mobile-conv-open .chat-pane{ display:flex; height:100%; }
}

/* ---- Admin: Dashboard ---- */
.dash-period-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:16px; }
.dash-period-btn{
  background:var(--white); border:1px solid var(--line); border-radius:20px; padding:7px 16px;
  font-size:12.5px; font-family:'Work Sans', sans-serif; color:var(--ink-soft); cursor:pointer; transition:all .15s ease;
}
.dash-period-btn.active{ background:var(--pine); border-color:var(--pine); color:#fff; }
.dash-stat-negative .report-stat-value{ color:#E4A2A2; }

.dash-bento{ display:grid; grid-template-columns:1fr; gap:16px; margin-top:20px; }
.dash-bento-card{
  background:var(--white); border:1px solid var(--line); border-radius:14px; padding:18px;
}
.dash-bento-card h3{ font-size:14px; color:var(--ink); margin-bottom:10px; }

.dash-rank-card-header{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; flex-wrap:wrap; }
.dash-rank-card-header h3{ margin-bottom:0; }
.dash-rank-filter{
  font-size:12px; font-family:'Work Sans', sans-serif; color:var(--ink-soft);
  border:1px solid var(--line); border-radius:6px; padding:5px 8px; background:var(--white); cursor:pointer;
}

.dash-hero-card{
  color:#fff; display:flex; flex-direction:column; gap:10px; border:none;
  background:linear-gradient(135deg, var(--pine), var(--pine-light));
}
.dash-hero-stock{ background:linear-gradient(135deg, #8A6A2E, #C9A756); }
.dash-hero-icon{
  width:34px; height:34px; border-radius:9px; background:rgba(255,255,255,0.18);
  display:flex; align-items:center; justify-content:center;
}
.dash-hero-icon svg{ width:18px; height:18px; }
.dash-hero-label{ font-size:12px; text-transform:uppercase; letter-spacing:0.05em; opacity:0.85; }
.dash-hero-value{ font-family:'Fraunces', serif; font-size:26px; font-weight:600; }

.dash-chart-legend{ display:flex; gap:14px; margin-bottom:8px; }
.dash-legend-chip{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-soft); }
.dash-legend-dot{ width:9px; height:9px; border-radius:50%; display:inline-block; flex-shrink:0; }
.dash-chart-svg{ width:100%; height:auto; display:block; }
.dash-chart-baseline{ stroke:var(--line); stroke-width:1; }
.dash-chart-axis-label{ font-size:9px; fill:var(--ink-soft); font-family:'IBM Plex Mono', monospace; }
.dash-bar{ transition:none; }

.dash-rank-list{ display:flex; flex-direction:column; gap:10px; }
.dash-rank-row{ display:flex; align-items:center; gap:10px; }
.dash-rank-label{ width:38%; font-size:12.5px; color:var(--ink); flex-shrink:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dash-rank-bar-track{ flex:1; height:8px; background:var(--bg-panel); border-radius:6px; overflow:hidden; }
.dash-rank-bar-fill{ height:100%; border-radius:6px; background:var(--pine); }
.dash-rank-value{ font-size:11.5px; font-family:'IBM Plex Mono', monospace; color:var(--ink-soft); flex-shrink:0; min-width:60px; text-align:right; }

@media (min-width: 860px){
  .dash-bento{ grid-template-columns:1fr 1fr; }
}

/* ---- Admin: Harajatlar ---- */
.balance-card{
  background:linear-gradient(135deg, var(--pine), var(--pine-light)); color:#fff; border-radius:14px;
  padding:20px 22px; margin-bottom:18px; max-width:680px;
}
.balance-card.negative{ background:linear-gradient(135deg, var(--rust), var(--rust-light)); }
.balance-card-label{ font-size:12px; text-transform:uppercase; letter-spacing:0.05em; opacity:0.8; margin-bottom:4px; }
.balance-card-value{ font-family:'Fraunces', serif; font-size:32px; font-weight:600; margin-bottom:12px; }
.balance-card-breakdown{ display:flex; flex-wrap:wrap; gap:14px; font-size:12px; opacity:0.9; }
.balance-dot{ display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:5px; }
.balance-dot.income{ background:#8FD9B0; }
.balance-dot.expense{ background:#F3A08A; }

.expense-type-toggle{ display:flex; gap:8px; margin-bottom:16px; }
.expense-type-btn{
  flex:1; display:flex; align-items:center; justify-content:center; gap:7px;
  background:var(--bg-panel); border:1px solid var(--line); border-radius:8px; padding:10px;
  font-size:13px; font-weight:600; color:var(--ink-soft); cursor:pointer; font-family:'Work Sans', sans-serif;
  transition:all .15s ease;
}
.expense-type-btn svg{ width:15px; height:15px; }
.expense-type-btn.active[data-type="expense"]{ background:var(--rust); border-color:var(--rust); color:#fff; }
.expense-type-btn.active[data-type="income"]{ background:var(--pine); border-color:var(--pine); color:#fff; }

/* ---- 360° namunasi: uchta yuklash usuli bitta ixcham tab qatorida ---- */
.p360-tabs{ display:flex; gap:8px; margin:14px 0 18px; flex-wrap:wrap; }
.p360-tab-btn{
  flex:1; min-width:150px; display:flex; align-items:center; justify-content:center; gap:7px;
  background:var(--bg-panel); border:1px solid var(--line); border-radius:8px; padding:10px;
  font-size:12.5px; font-weight:600; color:var(--ink-soft); cursor:pointer; font-family:'Work Sans', sans-serif;
  transition:all .15s ease;
}
.p360-tab-btn svg{ width:15px; height:15px; flex-shrink:0; }
.p360-tab-btn.active{ background:var(--pine); border-color:var(--pine); color:#fff; }
.p360-panel > .section-note:first-child{ margin-top:0; }

@media (max-width:640px){
  .p360-tab-btn{ min-width:100%; }
}

.expense-form-card{
  background:var(--white); border:1px solid var(--line); border-radius:12px;
  padding:18px 20px; margin-bottom:20px; max-width:680px;
}
.expense-form-card-header{
  display:flex; align-items:center; gap:8px; font-weight:700; font-size:14.5px; color:var(--ink);
  margin-bottom:14px; padding-bottom:12px; border-bottom:1px solid var(--line);
}
.expense-form-card-header svg{
  width:26px; height:26px; padding:5px; background:var(--pine); color:#fff; border-radius:8px; flex-shrink:0;
}
.expense-form .field{ margin-bottom:0; }
.expense-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:14px; }
.expense-form .admin-form-btns .primary{ display:inline-flex; align-items:center; gap:7px; }
.expense-form .admin-form-btns .primary svg{ width:15px; height:15px; flex-shrink:0; }

.expense-cat-badge{
  display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:600;
  padding:4px 10px; border-radius:20px; white-space:nowrap;
}
.expense-cat-badge svg{ width:12px; height:12px; flex-shrink:0; }
.expense-cat-badge.cat-rent{ background:#EBDFF5; color:#6B3FA0; }
.expense-cat-badge.cat-salary{ background:#DCEBF7; color:#2E6FB0; }
.expense-cat-badge.cat-material{ background:#F3E7D6; color:#9C6B1F; }
.expense-cat-badge.cat-delivery{ background:#DDF0E4; color:#2D8659; }
.expense-cat-badge.cat-ads{ background:#FBE0E0; color:#C0392B; }
.expense-cat-badge.cat-invest{ background:#D6F0E8; color:#1B7A5C; }
.expense-cat-badge.cat-other{ background:var(--bg-panel); color:var(--ink-soft); }
.expense-table td{ vertical-align:middle; }
.expense-row-income{ background:#F4FBF7; }
.expense-type-tag{
  font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em;
  padding:3px 9px; border-radius:20px;
}
.expense-type-tag.expense{ background:#F5E4DE; color:var(--rust); }
.expense-type-tag.income{ background:#E4EEE9; color:var(--pine); }
.expense-amount-income{ color:var(--pine) !important; }
.expense-amount-expense{ color:var(--rust) !important; }

@media (max-width: 640px){
  .expense-form-grid{ grid-template-columns:1fr; }
  .expense-type-toggle{ flex-direction:column; }
}