/* ============================================================================
   BankDash design system — Sotuvchi Bot panel
   Static theme (no build step). Loaded via Filament HEAD render hook.
   Source: Claude Design handoff — "Dizayn tizimi.dc.html".
   ========================================================================== */

/* ---- 1. Design tokens ---------------------------------------------------- */
:root {
  --bg:#EEF3FC; --surface:#FFFFFF; --surface-2:#F4F7FE; --surface-3:#E9F0FB;
  --sidebar:#FFFFFF; --border:#E9F0F9; --border-strong:#DFE8F4;
  --heading:#1B2A4E; --text:#3A4A68; --muted:#7089B0; --faint:#9BABC9;
  --primary:#2D60FF;
  --primary-600:color-mix(in srgb,var(--primary),#000 15%);
  --primary-soft:color-mix(in srgb,var(--primary) 11%,#FFFFFF);
  --slate:#5B6B86; --slate-soft:#EDF1F8;
  --teal:#11B98C; --teal-soft:#E0F6EF;
  --amber:#F5A524; --amber-soft:#FDF2DC;
  --green:#22C55E; --green-soft:#E2F8EB;
  --grey:#94A3B8; --grey-soft:#EEF1F5;
  --violet:#7A5AF8; --violet-soft:#EDE9FE;
  --red:#EF4444; --red-soft:#FCEAEA;
  --grad:linear-gradient(135deg,var(--primary) 0%,color-mix(in srgb,var(--primary),#7C5CFF 45%) 100%);
  --shadow-card:0 4px 18px rgba(28,55,120,0.06),0 1px 3px rgba(28,55,120,0.04);
  --shadow-lg:0 16px 40px rgba(37,71,160,0.16);
  --shadow-primary:0 14px 30px color-mix(in srgb,var(--primary) 38%,transparent);
  --ring-track:#E7EEF8;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,monospace;
  --sans:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
}
:root.dark, :root[data-theme="dark"] {
  --bg:#0A0F1D; --surface:#131A2B; --surface-2:#1A2338; --surface-3:#222D46;
  --sidebar:#0F1524; --border:rgba(255,255,255,0.07); --border-strong:rgba(255,255,255,0.11);
  --heading:#EAF1FC; --text:#C3D0E6; --muted:#8496B5; --faint:#5F6E8C;
  --primary:#5B82FF;
  --primary-600:color-mix(in srgb,var(--primary),#000 8%);
  --primary-soft:color-mix(in srgb,var(--primary) 22%,transparent);
  --slate:#94A6C4; --slate-soft:rgba(148,166,196,0.15);
  --teal:#2DD4BF; --teal-soft:rgba(45,212,191,0.14);
  --amber:#FBBF24; --amber-soft:rgba(251,191,36,0.15);
  --green:#34D399; --green-soft:rgba(52,211,153,0.14);
  --grey:#94A3B8; --grey-soft:rgba(148,163,184,0.13);
  --violet:#A78BFA; --violet-soft:rgba(167,139,250,0.18);
  --red:#F87171; --red-soft:rgba(248,113,113,0.15);
  --grad:linear-gradient(135deg,var(--primary) 0%,color-mix(in srgb,var(--primary),#8B5CF6 50%) 100%);
  --shadow-card:0 4px 18px rgba(0,0,0,0.34),0 1px 2px rgba(0,0,0,0.3);
  --shadow-lg:0 18px 48px rgba(0,0,0,0.5);
  --shadow-primary:0 14px 34px rgba(0,0,0,0.45);
  --ring-track:rgba(255,255,255,0.09);
}

/* ---- 2. Keyframes -------------------------------------------------------- */
@keyframes bd-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--green) 55%,transparent);}70%{box-shadow:0 0 0 5px transparent;}100%{box-shadow:0 0 0 0 transparent;}}
/* chat-panel dizayn nomi bilan bir xil (sb-pulse == bd-pulse) */
@keyframes sb-pulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55);}70%{box-shadow:0 0 0 7px rgba(34,197,94,0);}100%{box-shadow:0 0 0 0 rgba(34,197,94,0);}}
@keyframes bd-spin{to{transform:rotate(360deg);}}
.bd-spin{animation:bd-spin .8s linear infinite;transform-origin:center;}
[x-cloak]{display:none !important;}
/* chat ro'yxati: faqat MATN blokini cheklaymi — avatar/badge o'lchamiga tegmaymiz */
.cp-item > div:last-child{min-width:0;overflow:hidden;}

/* ---- 3. Scoped base (only inside our redesigned surfaces) ---------------- */
.bd-root{font-family:var(--sans);color:var(--text);}
.bd-root ::selection{background:color-mix(in srgb,var(--primary) 22%,transparent);}
.bd-root *{box-sizing:border-box;}

/* ---- 4. Cards ------------------------------------------------------------ */
.bd-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-card);}
.bd-card-pad{padding:clamp(16px,1.8vw,22px);}
.bd-section-eyebrow{font-size:13.5px;font-weight:800;letter-spacing:.1em;color:var(--primary);text-transform:uppercase;}
.bd-section-title{font-size:21.5px;font-weight:800;color:var(--heading);letter-spacing:-0.01em;}
.bd-h1{font-size:clamp(22px,3vw,28px);font-weight:800;color:var(--heading);letter-spacing:-0.02em;margin:0;}

/* ---- 5. Badges ----------------------------------------------------------- */
.bd-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:8px;font-size:13.5px;font-weight:700;line-height:1;white-space:nowrap;}
.bd-badge .bd-dot{width:7px;height:7px;border-radius:50%;flex:0 0 auto;}
/* lid_status */
.bd-badge--kuzatilmoqda{background:var(--slate-soft);color:var(--slate);} .bd-badge--kuzatilmoqda .bd-dot{background:var(--slate);}
.bd-badge--qiziqadi{background:var(--teal-soft);color:var(--teal);} .bd-badge--qiziqadi .bd-dot{background:var(--teal);}
.bd-badge--issiq{background:var(--amber-soft);color:var(--amber);} .bd-badge--issiq .bd-dot{background:var(--amber);}
.bd-badge--sotildi{background:var(--green-soft);color:var(--green);} .bd-badge--sotildi .bd-dot{background:var(--green);}
.bd-badge--qiziqmaydi{background:var(--grey-soft);color:var(--grey);} .bd-badge--qiziqmaydi .bd-dot{background:var(--grey);}
.bd-badge--violet{background:var(--violet-soft);color:var(--violet);} .bd-badge--violet .bd-dot{background:var(--violet);}
.bd-badge--red{background:var(--red-soft);color:var(--red);} .bd-badge--red .bd-dot{background:var(--red);}
/* bot status */
.bd-badge--running{background:var(--green-soft);color:var(--green);} .bd-badge--running .bd-dot{background:var(--green);animation:bd-pulse 2s infinite;}
.bd-badge--stopped{background:var(--amber-soft);color:var(--amber);} .bd-badge--stopped .bd-dot{background:var(--amber);}
.bd-badge--nosession{background:var(--slate-soft);color:var(--slate);} .bd-badge--nosession .bd-dot{background:var(--slate);}
.bd-badge--disabled{background:var(--red-soft);color:var(--red);} .bd-badge--disabled .bd-dot{background:var(--red);}
/* trend */
.bd-trend{display:inline-flex;align-items:center;gap:3px;padding:4px 9px;border-radius:8px;font-size:14px;font-weight:700;}
.bd-trend--up{background:var(--green-soft);color:var(--green);}
.bd-trend--down{background:var(--red-soft);color:var(--red);}

/* ---- 6. Buttons ---------------------------------------------------------- */
.bd-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:13px;border:1px solid transparent;font-family:var(--sans);font-weight:700;font-size:15px;cursor:pointer;transition:all .18s ease;white-space:nowrap;}
.bd-btn--primary{background:var(--primary);color:#fff;box-shadow:var(--shadow-primary);}
.bd-btn--primary:hover{background:var(--primary-600);color:#fff;}
.bd-btn--ghost{background:var(--surface);border-color:var(--border);color:var(--muted);}
.bd-btn--ghost:hover{background:var(--surface-2);color:var(--heading);}
.bd-btn--sm{height:36px;padding:0 13px;border-radius:10px;font-size:14px;}

/* ---- 7. Inputs ----------------------------------------------------------- */
.bd-input{height:44px;padding:0 14px;border-radius:13px;border:1px solid var(--border);background:var(--surface);color:var(--heading);font-family:var(--sans);font-size:15.5px;font-weight:600;width:100%;transition:border-color .18s ease,box-shadow .18s ease;}
.bd-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 16%,transparent);}
.bd-input::placeholder{color:var(--faint);}

/* ---- 8. Progress / ring -------------------------------------------------- */
.bd-progress{height:9px;border-radius:999px;background:var(--ring-track);overflow:hidden;}
.bd-progress > span{display:block;height:100%;border-radius:999px;background:var(--grad);}

/* ---- 9. Utility ---------------------------------------------------------- */
.bd-mono{font-family:var(--mono);}
.bd-muted{color:var(--muted);}
.bd-faint{color:var(--faint);}
.bd-heading{color:var(--heading);}
.bd-grid{display:grid;gap:clamp(14px,1.6vw,20px);}

/* ============================================================================
   10. Filament shell restyle → BankDash custom shell
   Targets Filament v5 sidebar/topbar classes. !important to win over the
   framework theme (bankdash.css is loaded at HEAD_END, after Filament CSS).
   ========================================================================== */
.fi-body, .fi-layout, .fi-main-ctn{background:var(--bg) !important;font-family:var(--sans) !important;}

/* ---- Sidebar ---- */
/* sidebar ekran chetiga tekis yopishadi — bo'shliq ichki padding orqali beriladi */
.fi-sidebar, .fi-main-sidebar{background:var(--sidebar) !important;border-right:1px solid var(--border) !important;margin-inline-start:0 !important;}
.fi-sidebar-header{background:var(--sidebar) !important;border-bottom:1px solid var(--border) !important;box-shadow:none !important;}
.fi-sidebar-header-ctn{padding:12px 22px 14px !important;}
.fi-sidebar-nav{padding:2px 18px 14px !important;overflow-x:hidden;}
.fi-sidebar-nav-groups{gap:3px !important;}
/* Filament'ning ichki chekinishlarini nolga tushiramiz — menyu elementi aynan nav
   padding chizig'idan boshlanadi, shunda faol indikator sidebar chetiga tushadi */
.fi-sidebar-nav-groups, .fi-sidebar-group, .fi-sidebar-group-items, .fi-sidebar-item{margin-inline:0 !important;padding-inline:0 !important;}
.fi-sidebar-item-btn{margin-inline:0 !important;}
.fi-sidebar-group + .fi-sidebar-group{margin-top:4px !important;}
.fi-sidebar-group-label{font-size:11.5px !important;font-weight:800 !important;letter-spacing:.09em !important;color:var(--faint) !important;text-transform:uppercase !important;padding:12px 12px 6px !important;}
.fi-sidebar-group-btn{padding-inline:0 !important;}
/* dizaynda guruh sarlavhasi oddiy matn — yig'ish strelkasi yo'q */
.fi-sidebar-group-btn svg{display:none !important;}

/* items */
.fi-sidebar-item-btn{border-radius:12px !important;color:var(--muted) !important;font-weight:600 !important;font-size:15px !important;gap:13px !important;padding:11px 13px !important;position:relative;transition:background-color .16s ease,color .16s ease;white-space:nowrap;}
.fi-sidebar-item-btn:hover{background:var(--surface-2) !important;color:var(--heading) !important;}
.fi-sidebar-item-icon{color:currentColor !important;width:22px !important;height:22px !important;flex:0 0 auto;}
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn{background:var(--primary-soft) !important;color:var(--primary) !important;font-weight:700 !important;}
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn::before{content:'';position:absolute;left:-18px;top:50%;transform:translateY(-50%);width:4px;height:22px;border-radius:0 4px 4px 0;background:var(--primary);}

/* ---- Topbar ---- */
.fi-topbar{background:transparent !important;}
.fi-topbar-ctn{background:var(--surface) !important;border-bottom:1px solid var(--border) !important;box-shadow:none !important;}

/* ---- Main content ---- */
.fi-main{background:var(--bg) !important;padding-left:clamp(16px,1.7vw,36px) !important;padding-right:clamp(16px,1.7vw,36px) !important;padding-top:clamp(8px,0.8vw,14px) !important;padding-bottom:clamp(20px,2vw,34px) !important;}
/* `.fi-main-ctn` — `.fi-layout` ning flex bolasi. `min-width:0` bo'lmasa uning
   avtomatik minimal o'lchami kontentning min-content kengligiga teng bo'ladi:
   bitta keng jadval butun qobiqni ekrandan tashqariga surib yuboradi va
   `.fi-layout{overflow-x:clip}` uni SKROLLSIZ kesib tashlaydi. Natijada
   1280px noutbukda "Amallar" ustuni ko'rinmaydi va unga yetib ham bo'lmaydi.
   (ClickUp 86eyf4d85) */
.fi-main-ctn{padding-left:0 !important;padding-right:0 !important;min-width:0 !important;}

/* Keng "jadval" bloklari uchun: sarlavha va qatorlar BIRGA gorizontal siljiydi,
   shuning uchun ustunlar hech qachon sarlavhadan ajralib qolmaydi.
   `--bd-tbl-min` — jadvalning eng kichik kengligi (har sahifada o'ziniki). */
.bd-tbl{overflow-x:auto;overflow-y:visible;}
.bd-tbl > *{min-width:var(--bd-tbl-min,720px);}
.bd-tbl [data-tblrow]{flex-wrap:nowrap !important;}
.fi-page{background:transparent !important;}
/* top spacing sinxron — Filament default 32px page-header padding-ni bosadi (barcha sahifada bir xil) */
.fi-page-header-main-ctn{padding-block:clamp(8px,0.9vw,14px) !important;}
.fi-page-content{row-gap:clamp(14px,1.6vw,20px) !important;}

/* ---- Gemini balance widget (sidebar footer) ---- */
.bd-gemini{margin:6px 14px 12px;padding:14px 15px;border-radius:14px;background:var(--surface-2);border:1px solid var(--border);}
.bd-gemini-head{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:800;color:var(--heading);}
.bd-gemini-head svg{color:var(--primary);}
.bd-gemini-sub{font-size:13px;color:var(--muted);margin:9px 0 9px;font-weight:600;}
.bd-gemini-sub b{color:var(--heading);font-weight:800;}
.bd-gemini-link{display:inline-flex;align-items:center;gap:5px;margin-top:11px;font-size:13.5px;font-weight:700;color:var(--primary);}
.bd-gemini-link:hover{color:var(--primary-600);}

/* ---- Gemini balance card (gradient, design 1:1) ---- */
.bd-gem{position:relative;margin:8px 14px 12px;padding:16px 17px;border-radius:16px;background:var(--grad);color:#fff;overflow:hidden;box-shadow:var(--shadow-primary);}
.bd-gem-glow{position:absolute;top:-30px;right:-30px;width:110px;height:110px;border-radius:50%;background:rgba(255,255,255,.16);}
.bd-gem-hd{display:flex;align-items:center;gap:7px;font-size:14.5px;font-weight:800;position:relative;}
.bd-gem-big{font-size:27px;font-weight:800;letter-spacing:-0.02em;margin-top:9px;position:relative;font-variant-numeric:tabular-nums;}
.bd-gem-sub{font-size:14px;opacity:.9;margin-top:2px;position:relative;font-weight:600;}
.bd-gem-bar{height:8px;border-radius:99px;background:rgba(255,255,255,.28);overflow:hidden;margin-top:13px;position:relative;}
.bd-gem-bar>span{display:block;height:100%;border-radius:99px;background:#fff;}
.bd-gem-btn{display:block;margin-top:13px;text-align:center;background:#fff;color:var(--primary);font-size:14.5px;font-weight:800;padding:10px;border-radius:11px;position:relative;transition:transform .12s ease;}
.bd-gem-btn:hover{color:var(--primary);transform:translateY(-1px);}

/* ---- 11. Native form controls in custom pages (login select, radios) ---- */
.fi-main-ctn select:not(.fi-select-input):not(.fi-input):not(.bd-input):not(.cp-acc):not(.gm-inp){height:42px;padding:6px 12px;border-radius:11px;border:1px solid var(--border);background:var(--surface);color:var(--heading);font-family:var(--sans);font-size:15px;font-weight:600;cursor:pointer;outline:none;transition:border-color .15s ease;}
.fi-main-ctn select:not(.fi-select-input):not(.fi-input):not(.bd-input):not(.cp-acc):not(.gm-inp):focus{border-color:var(--primary);}
.fi-main-ctn input[type="radio"],.fi-main-ctn input[type="checkbox"]{accent-color:var(--primary);width:15px;height:15px;}

/* ---- 12. Shared account picker (Lidlar / Sotuvlar) ---- */
.bd-acc-trigger:hover{border-color:var(--border-strong);}
.bd-acc-opt:hover{background:var(--surface-2);}
/* Ochilma panel: display shu YERDA turishi shart, inline style da EMAS.
   Panelni Alpine (x-show) ko'rsatadi va yashiradi — u ko'rsatganda inline
   `display` xossasini BUTUNLAY o'chiradi, ya'ni inline yozilgan flex,
   yo'nalish va gap yo'qolib, qatorlar bir-biriga yopishib qolardi.
   Bu docs/12 dagi wire:loading tuzog'ining aynan o'sha oilasidan
   (ClickUp 86eyf4d9k). */
.bd-acc-panel{display:flex;flex-direction:column;gap:2px;}
/* Klaviatura bilan yurganda fokus ko'rinib tursin. */
.bd-acc-trigger:focus-visible,.bd-acc-opt:focus-visible{outline:2px solid var(--primary);outline-offset:1px;}

/* Foydalanuvchilar (handoff-4) — hover states (inline styles cannot express :hover) */
.bd-urow:hover{background:var(--surface-2);}
.bd-uadd:hover{background:var(--primary-600);}
.bd-uact:hover{background:var(--surface-2);color:var(--heading);}
.bd-udel:hover{background:color-mix(in srgb,var(--red) 14%,transparent);color:var(--red);}
.bd-udelbtn:hover{background:color-mix(in srgb,var(--red) 14%,transparent);}
.bd-ughost:hover{background:var(--surface-2);}
.bd-udanger:hover{background:color-mix(in srgb,var(--red),#000 12%);}
.bd-upw:hover{color:var(--heading);}

/* body'da menyu nomi takrorlanmasin — sahifa sarlavhasi yashiriladi (header amallari qoladi) */
.fi-header-heading{display:none !important;}
.fi-page-header-main-ctn:not(:has(.fi-header-actions)){padding-block:0 !important;}
