/* CRM: свой каркас поверх общих стилей кабинета (/static/app.css) */
.crm{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100svh}
.crm-side{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;gap:14px;padding:18px 12px 14px;background:#0B2B26;color:#DAF1DE}
.crm-brand{display:flex;align-items:center;gap:10px;padding:4px 8px 6px;font:600 15px Unbounded,sans-serif;color:#EEF8F0}
.crm-brand img{border-radius:9px}
.crm-brand small{display:block;font:700 10.5px Manrope,sans-serif;letter-spacing:.14em;color:#FD6A46;margin-top:2px}
.crm-nav{display:grid;gap:2px;flex:1;align-content:start;overflow:auto}
.crm-nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:12px;font-size:14.5px;font-weight:600;color:#A9C9B3;transition:background .15s,color .15s}
.crm-nav a:hover{background:#ffffff0d;color:#EEF8F0}
.crm-nav a[aria-current]{background:#DAF1DE;color:#0B2B26}
.crm-nav svg{width:18px;height:18px}
.crm-me{display:grid;gap:10px;padding:12px;border-radius:14px;background:#ffffff0a}
.crm-me b{display:block;font-size:14px;color:#EEF8F0}.crm-me small{font-size:12.5px;color:#A9C9B3}
.crm-me .btn{background:#ffffff12;color:#DAF1DE}.crm-me .btn:hover{background:#ffffff1f}
.crm-main{min-width:0}
.crm-top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;padding:12px clamp(16px,3vw,36px);background:#F3F8F4e6;backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.crm-search{display:flex;align-items:center;gap:10px;width:min(420px,100%);height:40px;padding:0 12px;border-radius:12px;background:var(--panel);box-shadow:inset 0 0 0 1px var(--line);color:var(--faint);font-size:14px}
.crm-search span{flex:1}
.crm-search kbd{font:600 11px Manrope,sans-serif;padding:3px 7px;border-radius:6px;background:var(--bg);color:var(--muted)}
.crm-menu{display:none;width:40px;height:40px;border-radius:12px;place-items:center}
.crm-view{padding:clamp(18px,3vw,36px)}
/* вход */
.login-crm{min-height:100svh;display:grid;place-items:center;padding:24px;background:radial-gradient(60% 60% at 50% 0%,#DAF1DE,#F3F8F4 70%)}
.lc-card{width:min(420px,100%);text-align:center;background:var(--panel);border-radius:28px;padding:40px 32px;box-shadow:var(--sh)}
.lc-card img{border-radius:14px;margin:0 auto 18px}
.lc-card h1{font-size:24px;margin-bottom:8px}
.lc-card p{color:var(--muted);margin-bottom:22px}
.lc-link{display:block;margin-top:14px;font-size:13.5px;font-weight:600;text-decoration:underline}
.lc-msg{margin:14px 0 0!important;font-size:14px;min-height:1.5em;color:var(--ink-2)!important}
/* клиенты */
.cl-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:16px;align-items:start}
.cl-segs{padding:14px;position:sticky;top:80px;display:grid;gap:2px}
.cl-segs h3{font:700 12px Manrope,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin:6px 8px 6px}
.cl-segs h3:not(:first-child){margin-top:14px}
.seg-b{display:flex;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:10px;font-size:14px;text-align:left;color:var(--ink-2)}
.seg-b:hover{background:#0b2b260a}
.seg-b[aria-pressed=true]{background:var(--ink);color:#fff}
.seg-b b{font-weight:700;color:var(--faint)}.seg-b[aria-pressed=true] b{color:#A9C9B3}
.tg{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:99px;background:var(--mint-2);font-size:12.5px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.tg button{font-size:14px;line-height:1;color:var(--faint);padding:0 0 0 2px}.tg button:hover{color:#A3321C}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.tag-f{display:flex;gap:8px}.tag-f input{flex:1;min-width:0;height:36px;padding:0 12px;border:0;border-radius:10px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);outline:0}
/* карточка клиента */
.cc-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:16px;align-items:start}
.cc-main{display:grid;gap:16px}
.note-f{display:grid;gap:8px;margin-bottom:14px}
.note-f textarea{width:100%;resize:vertical;padding:10px 12px;border:0;border-radius:12px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);font:inherit;outline:0}
.note-f textarea:focus,.tag-f input:focus{box-shadow:inset 0 0 0 2px var(--ink)}
.note-f .btn{justify-self:end}
.notes{display:grid;gap:10px}
.note{padding:12px 14px;border-radius:14px;background:#FFFBEA;border:1px solid #f2e3a6}
.note p{margin:0 0 6px;font-size:14.5px;line-height:1.5}
.note small{font-size:12.5px;color:var(--faint)}
.lnk{font-size:12.5px;color:var(--faint);text-decoration:underline}.lnk:hover{color:#A3321C}
.aud{display:grid;gap:6px;font-size:13.5px;color:var(--ink-2)}.aud span{color:var(--faint);margin-right:6px}
@media (max-width:1100px){.cl-grid,.cc-grid{grid-template-columns:minmax(0,1fr)}.cl-segs{position:static;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.cl-segs h3{grid-column:1/-1}}
@media (max-width:860px){
  .crm{grid-template-columns:minmax(0,1fr)}
  .crm-side{position:fixed;inset:0 auto 0 0;width:260px;z-index:20;transform:translateX(-105%);transition:transform .3s cubic-bezier(.16,1,.3,1)}
  body.nav-open .crm-side{transform:none;box-shadow:0 0 0 100vmax #0b2b2659}
  .crm-menu{display:grid}
}