/* ============================================================
   Flowet CRM — styles
   Floral, modern, light + dark. Self-contained, no CDN.
   ============================================================ */

:root {
  /* Brand palette (floral) */
  --pink-50:#fff1f5; --pink-100:#ffe0ea; --pink-200:#ffc2d6;
  --pink-300:#ff9ebd; --pink-400:#f9679b;
  --rose:#e5487f; --rose-dark:#c73267;
  --green:#2f9e6f; --green-soft:#e6f6ee;
  --amber:#e0a300; --amber-soft:#fdf3d6;
  --red:#dc4b52; --red-soft:#fde8e8;
  --blue:#3b7cd4; --blue-soft:#e6effb;
  --violet:#7c5cd6;

  /* Light theme tokens */
  --bg:#f6f5f8;
  --bg-elev:#ffffff;
  --bg-soft:#faf9fb;
  --card:#ffffff;
  --border:#ece9f0;
  --border-strong:#ddd8e4;
  --text:#241f2e;
  --text-soft:#6b6577;
  --text-mute:#9a94a6;
  --accent:#e5487f;
  --accent-soft:#ffe7f0;
  --accent-contrast:#ffffff;
  --shadow-sm:0 1px 2px rgba(30,20,40,.06),0 1px 3px rgba(30,20,40,.05);
  --shadow-md:0 4px 14px rgba(40,25,55,.08);
  --shadow-lg:0 18px 50px rgba(40,25,55,.16);
  --radius:14px;
  --radius-sm:10px;
  --radius-lg:20px;
  --sidebar-w:250px;
  --topbar-h:64px;
  --font:'Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
}

:root[data-theme="dark"]{
  --bg:#141019;
  --bg-elev:#1d1826;
  --bg-soft:#221c2e;
  --card:#1d1826;
  --border:#2c2439;
  --border-strong:#3a3049;
  --text:#f3eff8;
  --text-soft:#b3a9c2;
  --text-mute:#7d7391;
  --accent:#ff6fa5;
  --accent-soft:#3a1f2d;
  --accent-contrast:#1a0f14;
  --green-soft:#153125;
  --amber-soft:#332a10;
  --red-soft:#3a1a1c;
  --blue-soft:#152439;
  --shadow-sm:0 1px 2px rgba(0,0,0,.3);
  --shadow-md:0 6px 20px rgba(0,0,0,.35);
  --shadow-lg:0 22px 60px rgba(0,0,0,.55);
}

*{box-sizing:border-box;}
[hidden]{display:none!important;}
html,body{height:100%;}
body{
  margin:0;
  font-family:var(--font);
  background:var(--bg);
  color:var(--text);
  font-size:14.5px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;cursor:pointer;}
button{font-family:inherit;}
input,select,textarea{font-family:inherit;font-size:14px;}
h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-.01em;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:20px;border:2px solid var(--bg);}
::-webkit-scrollbar-thumb:hover{background:var(--text-mute);}

/* ---------- Loading ---------- */
.app-loading{
  position:fixed;inset:0;display:flex;flex-direction:column;gap:16px;
  align-items:center;justify-content:center;background:var(--bg);z-index:9999;
}
.loader-flower{font-size:56px;animation:spin 2.4s linear infinite;}
.loader-text{color:var(--text-soft);font-weight:600;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ---------- Layout ---------- */
.layout{display:grid;grid-template-columns:var(--sidebar-w) 1fr;min-height:100vh;}

/* ---------- Sidebar ---------- */
.sidebar{
  background:var(--bg-elev);
  border-right:1px solid var(--border);
  display:flex;flex-direction:column;
  padding:18px 14px;
  position:sticky;top:0;height:100vh;
  z-index:60;
}
.brand{display:flex;align-items:center;gap:12px;padding:6px 8px 20px;}
.brand-logo{font-size:30px;filter:drop-shadow(0 3px 6px rgba(229,72,127,.35));}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-name{font-weight:800;font-size:20px;letter-spacing:-.02em;
  background:linear-gradient(90deg,var(--rose),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;}
.brand-sub{font-size:11.5px;color:var(--text-mute);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px;}

.nav{display:flex;flex-direction:column;gap:3px;margin-top:6px;flex:1;overflow-y:auto;}
.nav-item{
  display:flex;align-items:center;gap:12px;
  padding:10px 12px;border-radius:var(--radius-sm);
  color:var(--text-soft);font-weight:600;font-size:14px;
  transition:background .15s,color .15s,transform .1s;user-select:none;
}
.nav-item:hover{background:var(--bg-soft);color:var(--text);}
.nav-item.active{background:var(--accent-soft);color:var(--accent);}
.nav-item.active .nav-ico{transform:scale(1.12);}
.nav-ico{font-size:17px;width:22px;text-align:center;transition:transform .15s;}

.sidebar-foot{margin-top:12px;display:flex;flex-direction:column;gap:8px;}
.version{font-size:11px;color:var(--text-mute);text-align:center;}
#theme-toggle .ico-dark{display:none;}
:root[data-theme="dark"] #theme-toggle .ico-light{display:none;}
:root[data-theme="dark"] #theme-toggle .ico-dark{display:inline;}

/* группы меню: на виду только нужное, редкое свёрнуто */
.nav-group{margin-bottom:2px;}
.nav-group-head{width:100%;display:flex;align-items:center;gap:9px;background:transparent;border:none;cursor:pointer;
  padding:9px 12px;border-radius:10px;color:var(--text-mute);font-size:11.5px;font-weight:750;
  text-transform:uppercase;letter-spacing:.04em;transition:.15s;font-family:inherit;}
.nav-group-head:hover{background:var(--bg-soft);color:var(--text-soft);}
.ng-ico{font-size:14px;}
.ng-label{flex:1;text-align:left;}
.ng-count{background:var(--bg-soft);border-radius:8px;padding:1px 7px;font-size:10.5px;font-weight:700;}
.ng-chev{transition:transform .18s;font-size:14px;opacity:.7;}
.nav-group.open .ng-chev{transform:rotate(90deg);}
.nav-group-items{display:none;padding-left:4px;}
.nav-group.open .nav-group-items{display:block;animation:navIn .18s ease-out;}
@keyframes navIn{from{opacity:0;transform:translateY(-4px);}}

.nav-badge{margin-left:auto;background:var(--accent);color:#fff;font-size:11px;font-weight:800;min-width:20px;height:20px;
  border-radius:10px;display:flex;align-items:center;justify-content:center;padding:0 6px;box-shadow:0 2px 6px rgba(229,72,127,.35);}

/* индикатор связи с сервером */
.conn-chip{display:flex;align-items:center;gap:7px;border:1px solid var(--border);background:var(--card);color:var(--text-soft);
  border-radius:999px;padding:7px 13px;font-size:12.5px;font-weight:650;cursor:pointer;white-space:nowrap;box-shadow:var(--sh-sm);}
.conn-chip:hover{border-color:var(--accent);}
.conn-dot{width:8px;height:8px;border-radius:50%;background:var(--text-mute);flex:none;}
.conn-chip.ok .conn-dot{background:var(--green);}
.conn-chip.warn{border-color:var(--amber);color:var(--amber);}
.conn-chip.warn .conn-dot{background:var(--amber);}
.conn-chip.err{border-color:var(--red);color:var(--red);background:var(--red-soft);}
.conn-chip.err .conn-dot{background:var(--red);animation:pulseDot 1.4s infinite;}
@keyframes pulseDot{50%{opacity:.35;}}

/* предупреждение о неправильном адресе запуска */
.origin-warn{background:var(--amber-soft);border-bottom:1px solid var(--amber);color:var(--text);
  padding:10px 16px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:10px;}
.origin-warn b{color:var(--amber);}

.sidebar-backdrop{display:none;}

/* ---------- Main ---------- */
.main{display:flex;flex-direction:column;min-width:0;}
.topbar{
  height:var(--topbar-h);position:sticky;top:0;z-index:40;
  background:color-mix(in srgb,var(--bg-elev) 88%,transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:14px;padding:0 22px;
}
.topbar-title{font-size:18px;font-weight:800;white-space:nowrap;}
.topbar-search{flex:1;max-width:420px;margin-left:6px;}
.topbar-search input{
  width:100%;padding:9px 14px;border-radius:999px;border:1px solid var(--border);
  background:var(--bg-soft);color:var(--text);outline:none;transition:border .15s,box-shadow .15s;
}
.topbar-search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.topbar-actions{margin-left:auto;display:flex;gap:8px;}
.burger{display:none;}

.content{padding:22px;max-width:1400px;width:100%;margin:0 auto;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  border:1px solid transparent;border-radius:var(--radius-sm);
  padding:9px 15px;font-weight:650;font-size:13.5px;cursor:pointer;
  transition:transform .08s,background .15s,box-shadow .15s,border-color .15s,color .15s;
  white-space:nowrap;color:var(--text);background:transparent;
}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--accent);color:var(--accent-contrast);box-shadow:0 2px 8px rgba(229,72,127,.28);}
.btn-primary:hover{filter:brightness(1.06);box-shadow:0 4px 14px rgba(229,72,127,.36);}
.btn-secondary{background:var(--bg-soft);border-color:var(--border-strong);color:var(--text);}
.btn-secondary:hover{background:var(--card);border-color:var(--accent);color:var(--accent);}
.btn-ghost{background:transparent;color:var(--text-soft);}
.btn-ghost:hover{background:var(--bg-soft);color:var(--text);}
.btn-danger{background:var(--red);color:#fff;}
.btn-danger:hover{filter:brightness(1.06);}
.btn-success{background:var(--green);color:#fff;}
.btn-icon{padding:8px;width:38px;height:38px;border-radius:10px;font-size:16px;background:transparent;color:var(--text-soft);}
.btn-icon:hover{background:var(--bg-soft);color:var(--text);}
.btn-block{width:100%;}
.btn-sm{padding:6px 11px;font-size:12.5px;border-radius:8px;}
.btn[disabled]{opacity:.5;cursor:not-allowed;}

/* ---------- Cards ---------- */
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);}
.card-pad{padding:18px 20px;}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;}
.card-head h3{font-size:16px;}
.card-head .sub{font-size:12.5px;color:var(--text-mute);font-weight:500;}

.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;flex-wrap:wrap;}
.section-head h2{font-size:22px;}
.section-head .muted{color:var(--text-mute);font-size:13px;font-weight:500;}
.section-actions{display:flex;gap:8px;flex-wrap:wrap;}

/* ---------- KPI grid ---------- */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:20px;}
.kpi{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:16px 18px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;
}
.kpi::after{content:"";position:absolute;right:-20px;top:-20px;width:90px;height:90px;border-radius:50%;
  background:var(--accent-soft);opacity:.55;}
.kpi-ico{font-size:22px;position:relative;}
.kpi-label{color:var(--text-soft);font-size:12.5px;font-weight:600;margin:10px 0 4px;position:relative;}
.kpi-value{font-size:25px;font-weight:800;letter-spacing:-.02em;position:relative;}
.kpi-delta{font-size:12px;font-weight:700;margin-top:6px;position:relative;display:inline-flex;gap:4px;align-items:center;}
.kpi-delta.up{color:var(--green);}
.kpi-delta.down{color:var(--red);}
.kpi-delta.flat{color:var(--text-mute);}

/* ---------- Grid helpers ---------- */
.grid{display:grid;gap:16px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.cols-2-1{grid-template-columns:2fr 1fr;}
@media(max-width:900px){.grid-2,.grid-3,.cols-2-1{grid-template-columns:1fr;}}

/* ---------- Table ---------- */
.table-wrap{overflow-x:auto;border-radius:var(--radius);border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow-sm);}
table.tbl{width:100%;border-collapse:collapse;min-width:560px;}
.tbl thead th{
  text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;
  color:var(--text-mute);font-weight:700;padding:12px 14px;border-bottom:1px solid var(--border);
  background:var(--bg-soft);position:sticky;top:0;white-space:nowrap;cursor:default;
}
.tbl thead th.sortable{cursor:pointer;user-select:none;}
.tbl thead th.sortable:hover{color:var(--accent);}
.tbl tbody td{padding:12px 14px;border-bottom:1px solid var(--border);vertical-align:middle;}
.tbl tbody tr:last-child td{border-bottom:none;}
.tbl tbody tr{transition:background .12s;}
.tbl tbody tr:hover{background:var(--bg-soft);}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.tbl .center{text-align:center;}
.cell-strong{font-weight:700;}
.cell-mute{color:var(--text-mute);font-size:12.5px;}
.row-click{cursor:pointer;}

.prod-cell{display:flex;align-items:center;gap:11px;min-width:180px;}
.prod-emoji{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:19px;flex:none;background:var(--accent-soft);}
.prod-name{display:flex;flex-direction:column;line-height:1.25;}
.prod-name b{font-weight:700;font-size:14px;}
.prod-name small{color:var(--text-mute);font-size:11.5px;}

/* ---------- Badges / chips ---------- */
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:700;line-height:1.6;}
.badge-green{background:var(--green-soft);color:var(--green);}
.badge-amber{background:var(--amber-soft);color:var(--amber);}
.badge-red{background:var(--red-soft);color:var(--red);}
.badge-blue{background:var(--blue-soft);color:var(--blue);}
.badge-gray{background:var(--bg-soft);color:var(--text-mute);}
.badge-accent{background:var(--accent-soft);color:var(--accent);}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;}

.chip-row{display:flex;gap:8px;flex-wrap:wrap;}
.chip{padding:7px 13px;border-radius:999px;border:1px solid var(--border-strong);background:var(--card);
  font-size:13px;font-weight:600;color:var(--text-soft);cursor:pointer;transition:all .12s;user-select:none;}
.chip:hover{border-color:var(--accent);color:var(--accent);}
.chip.active{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast);}

/* ---------- Forms ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.form-grid.one{grid-template-columns:1fr;}
.field{display:flex;flex-direction:column;gap:6px;}
.field.full{grid-column:1/-1;}
.field label{font-size:12.5px;font-weight:650;color:var(--text-soft);}
.field label .req{color:var(--accent);}
.input,.select,.textarea{
  width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--border-strong);
  background:var(--bg-soft);color:var(--text);outline:none;transition:border .15s,box-shadow .15s;
}
.input:focus,.select:focus,.textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--card);}
.textarea{resize:vertical;min-height:70px;}
.field .hint{font-size:11.5px;color:var(--text-mute);}
.input-group{display:flex;align-items:stretch;}
.input-group .input{border-radius:10px 0 0 10px;}
.input-group .suffix{display:flex;align-items:center;padding:0 12px;border:1px solid var(--border-strong);border-left:none;
  border-radius:0 10px 10px 0;background:var(--bg-soft);color:var(--text-mute);font-weight:600;font-size:13px;}

.emoji-pick{display:flex;flex-wrap:wrap;gap:6px;}
.emoji-pick button{width:38px;height:38px;border-radius:10px;border:1px solid var(--border);background:var(--bg-soft);font-size:18px;cursor:pointer;transition:all .12s;}
.emoji-pick button:hover{border-color:var(--accent);}
.emoji-pick button.sel{background:var(--accent-soft);border-color:var(--accent);}

/* line items editor */
.lines{display:flex;flex-direction:column;gap:10px;}
.line{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:end;}
.line.line-4{grid-template-columns:2fr 1fr 1fr 1fr auto;}
.line .field{gap:4px;}
.comp-line{display:grid;grid-template-columns:2fr 1fr auto;gap:10px;align-items:end;}
.seg{display:inline-flex;background:var(--bg-soft);border:1px solid var(--border-strong);border-radius:10px;padding:3px;gap:3px;}
.seg button{border:none;background:transparent;padding:7px 14px;border-radius:8px;font-weight:650;font-size:13px;color:var(--text-soft);cursor:pointer;}
.seg button.on{background:var(--accent);color:var(--accent-contrast);}
.line-total{background:var(--bg-soft);border:1px dashed var(--border-strong);border-radius:10px;padding:12px 14px;
  display:flex;justify-content:space-between;align-items:center;font-weight:700;}
@media(max-width:640px){.line{grid-template-columns:1fr 1fr;}.form-grid{grid-template-columns:1fr;}}

/* ---------- Modal ---------- */
.modal-host{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;}
.modal-backdrop{position:absolute;inset:0;background:rgba(20,12,28,.5);backdrop-filter:blur(3px);animation:fade .18s;}
.modal{
  position:relative;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);width:100%;max-width:640px;max-height:90vh;display:flex;flex-direction:column;
  animation:pop .2s cubic-bezier(.2,.9,.3,1.2);
}
.modal.wide{max-width:860px;}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--border);}
.modal-head h3{font-size:18px;}
.modal-body{padding:20px 22px;overflow-y:auto;}
.modal-foot{padding:16px 22px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;}
@keyframes fade{from{opacity:0;}}
@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.97);}}

/* ---------- Toast ---------- */
.toast-host{position:fixed;bottom:22px;right:22px;z-index:300;display:flex;flex-direction:column;gap:10px;}
.toast{
  background:var(--card);border:1px solid var(--border);border-left:4px solid var(--accent);
  border-radius:12px;box-shadow:var(--shadow-lg);padding:12px 16px;min-width:260px;max-width:360px;
  display:flex;gap:10px;align-items:center;animation:slidein .25s;
}
.toast.ok{border-left-color:var(--green);}
.toast.err{border-left-color:var(--red);}
.toast.warn{border-left-color:var(--amber);}
.toast-ico{font-size:18px;}
.toast-msg{font-size:13.5px;font-weight:600;}
@keyframes slidein{from{opacity:0;transform:translateX(30px);}}

/* ---------- Empty state ---------- */
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  padding:56px 20px;text-align:center;color:var(--text-mute);}
.empty-ico{font-size:46px;opacity:.7;}
.empty h3{color:var(--text-soft);font-size:16px;}
.empty p{font-size:13.5px;max-width:340px;}

/* ---------- Progress / mini bars ---------- */
.bar{height:8px;border-radius:6px;background:var(--bg-soft);overflow:hidden;position:relative;min-width:80px;}
.bar > span{display:block;height:100%;border-radius:6px;background:var(--accent);}
.bar.green > span{background:var(--green);}
.bar.amber > span{background:var(--amber);}
.bar.red > span{background:var(--red);}

/* ---------- Toolbar ---------- */
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px;}
.toolbar .search{flex:1;min-width:200px;}
.toolbar .search input{width:100%;padding:9px 14px;border-radius:10px;border:1px solid var(--border-strong);background:var(--card);color:var(--text);outline:none;}
.toolbar .search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}

/* ---------- Charts ---------- */
.chart-box{width:100%;}
.chart-box svg{width:100%;height:auto;display:block;overflow:visible;}
.chart-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px;}
.chart-legend .lg{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text-soft);font-weight:600;}
.chart-legend .sw{width:11px;height:11px;border-radius:3px;}
.spark{display:block;}

.stat-list{display:flex;flex-direction:column;gap:2px;}
.stat-row{display:flex;align-items:center;gap:12px;padding:9px 4px;border-bottom:1px solid var(--border);}
.stat-row:last-child{border-bottom:none;}
.stat-row .rank{width:22px;height:22px;border-radius:7px;background:var(--accent-soft);color:var(--accent);
  font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;flex:none;}
.stat-row .grow{flex:1;min-width:0;}
.stat-row .grow b{font-size:13.5px;}
.stat-row .val{font-weight:800;font-variant-numeric:tabular-nums;}

.pos-amt{color:var(--green);font-weight:700;}
.neg-amt{color:var(--red);font-weight:700;}
.muted{color:var(--text-mute);}
.nowrap{white-space:nowrap;}
.right{text-align:right;}
.mt8{margin-top:8px;} .mt16{margin-top:16px;} .mt24{margin-top:24px;}
.mb0{margin-bottom:0;} .mb16{margin-bottom:16px;}
.flex{display:flex;} .between{justify-content:space-between;} .aic{align-items:center;} .gap8{gap:8px;} .gap12{gap:12px;} .wrap{flex-wrap:wrap;}
.hidden{display:none!important;}

/* ---------- Help / quick start ---------- */
.help-steps{display:flex;flex-direction:column;gap:10px;}
.help-step{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--bg-soft);}
.help-step-num{width:24px;height:24px;border-radius:8px;background:var(--accent);color:var(--accent-contrast);font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;flex:none;}
.help-step-ico{font-size:22px;flex:none;}
.help-step-txt{flex:1;font-size:13.5px;line-height:1.5;}
.help-sections{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.help-sec{display:flex;gap:10px;align-items:center;padding:9px 12px;border:1px solid var(--border);border-radius:10px;}
.help-sec-ico{font-size:18px;}
.help-sec b{font-size:13.5px;}
.help-sec .muted{font-size:12px;}
@media(max-width:600px){.help-sections{grid-template-columns:1fr;}}

/* ---------- Alerts list ---------- */
.alert-item{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;background:var(--bg-soft);border:1px solid var(--border);margin-bottom:8px;}
.alert-item:last-child{margin-bottom:0;}
.alert-item .a-ico{font-size:18px;}
.alert-item .a-txt{flex:1;font-size:13px;}
.alert-item .a-txt b{font-weight:700;}

/* ---------- Mobile bottom nav ---------- */
.bottom-nav{display:none;}
.bnav-item{background:transparent;border:none;cursor:pointer;}

/* ---------- Responsive / iOS ---------- */
@media(max-width:860px){
  .layout{grid-template-columns:1fr;}
  .sidebar{position:fixed;left:0;top:0;height:100vh;width:280px;transform:translateX(-100%);transition:transform .25s;padding-top:max(18px,env(safe-area-inset-top));}
  .sidebar.open{transform:translateX(0);box-shadow:var(--shadow-lg);}
  .sidebar-backdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:55;opacity:0;pointer-events:none;transition:opacity .2s;}
  .sidebar-backdrop.show{opacity:1;pointer-events:auto;}
  .burger{display:inline-flex;}
  .topbar-search{display:none;}
  .topbar{padding-left:14px;padding-right:14px;padding-top:env(safe-area-inset-top);height:calc(var(--topbar-h) + env(safe-area-inset-top));}
  .content{padding:16px 16px calc(90px + env(safe-area-inset-bottom));}

  /* bottom nav */
  .bottom-nav{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;
    background:var(--bg-elev);border-top:1px solid var(--border);
    padding:6px 6px calc(6px + env(safe-area-inset-bottom));
    justify-content:space-around;align-items:center;box-shadow:0 -4px 20px rgba(0,0,0,.06);
  }
  .bnav-item{display:flex;flex-direction:column;align-items:center;gap:2px;flex:1;
    color:var(--text-mute);font-size:10.5px;font-weight:600;padding:5px 2px;border-radius:10px;min-height:48px;justify-content:center;}
  .bnav-item.active{color:var(--accent);}
  .bn-ico{font-size:19px;line-height:1;}
  .bnav-fab{flex:0 0 auto;width:52px;height:52px;border-radius:50%;border:none;margin-top:-22px;
    background:var(--accent);color:var(--accent-contrast);font-size:26px;font-weight:400;line-height:1;
    box-shadow:0 6px 16px rgba(229,72,127,.45);cursor:pointer;}
  .modal-host{padding:0;align-items:flex-end;}
  .modal{max-width:100%;max-height:92vh;border-radius:20px 20px 0 0;animation:sheet .25s cubic-bezier(.2,.9,.3,1);}
  .modal.wide{max-width:100%;}
  @keyframes sheet{from{transform:translateY(100%);}}
  .modal-foot{position:sticky;bottom:0;background:var(--card);padding-bottom:calc(16px + env(safe-area-inset-bottom));}
  .toast-host{bottom:calc(80px + env(safe-area-inset-bottom));right:12px;left:12px;}
  .toast{min-width:0;max-width:none;}
  /* 16px inputs => iOS Safari won't zoom on focus */
  .input,.select,.textarea,.topbar-search input,.toolbar .search input,input,select,textarea{font-size:16px;}
  .btn{padding:10px 15px;}
  .btn-icon{width:42px;height:42px;}
  .kpi-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
  .kpi-value{font-size:21px;}
}
@media(max-width:560px){
  .section-head h2{font-size:19px;}
  .section-head{gap:10px;}
  .section-actions{width:100%;}
  .chip{padding:8px 13px;}
  .tbl thead th,.tbl tbody td{padding:11px 10px;}
}
@media(min-width:861px){ .bottom-nav{display:none!important;} }
* { -webkit-tap-highlight-color: rgba(229,72,127,.15); }
.table-wrap{ -webkit-overflow-scrolling:touch; }

/* ============================================================
   Экран входа (серверный режим) и индикатор сессии
   ============================================================ */
.auth-screen {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  background: linear-gradient(160deg, #fdf2f6 0%, #f5f0fb 100%);
}
[data-theme="dark"] .auth-screen { background: linear-gradient(160deg, #17131b 0%, #101018 100%); }
.auth-card {
  width: 100%; max-width: 380px;
  background: var(--card, #fff);
  border: 1px solid var(--border, #eadfe6);
  border-radius: 18px;
  padding: 28px 24px 24px;
  box-shadow: 0 18px 50px rgba(80, 20, 60, .13);
}
.auth-logo { font-size: 40px; text-align: center; line-height: 1; }
.auth-title { margin: 10px 0 18px; font-size: 21px; text-align: center; }
.auth-note { margin: -6px 0 16px; font-size: 13px; line-height: 1.5; color: var(--muted, #8a7f88); }
.auth-form { display: flex; flex-direction: column; gap: 12px; }
.auth-form .field { display: flex; flex-direction: column; gap: 5px; }
.auth-form .field span { font-size: 12px; color: var(--muted, #8a7f88); }
.auth-form input {
  width: 100%; padding: 11px 12px; font-size: 16px;   /* 16px — иначе iOS зумит форму */
  border: 1px solid var(--border, #eadfe6); border-radius: 11px;
  background: var(--bg, #fff); color: inherit;
}
.auth-form input:focus { outline: 2px solid var(--accent, #e5487f); outline-offset: -1px; }
.auth-submit { margin-top: 6px; padding: 12px; font-size: 15px; }
.auth-err {
  padding: 9px 11px; border-radius: 10px; font-size: 13px;
  background: #fdecef; color: #b0184a; border: 1px solid #f6c9d5;
}
[data-theme="dark"] .auth-err { background: #351720; color: #ff9db5; border-color: #5a2434; }

.srv-chip { cursor: pointer; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }