/* Панель администратора компании, chakchak.net/b2b/.
   Палитра, шрифты и кнопки - как у жёлтого кабинета (chakapp/static/style.css),
   шрифты берём с основного сайта по абсолютному пути /fonts/. */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/montserrat-400-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/montserrat-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+2212;}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/montserrat-500-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/montserrat-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+2212;}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/montserrat-700-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/montserrat-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+2212;}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/montserrat-800-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/montserrat-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+2212;}
@font-face{font-family:'Chakra Petch';font-style:italic;font-weight:700;font-display:swap;src:url(/fonts/chakra-700i-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F;}

:root{
  --ground:#FFFFFF; --ink:#0D0C0B; --muted:#6B665B; --hairline:#EAE7DC; --wash:#F8F7F2;
  --accent:#FFC107; --danger:#C8341F; --ok:#00C853; --ok-ink:#06210F; --warn:#B07A00;
  --r:14px; --s--1:.8125rem; --s0:.9375rem; --s1:1.125rem;
}
*{box-sizing:border-box;}
/* Авторский display перебивает браузерное display:none от атрибута hidden. */
[hidden]{display:none !important;}
html,body{min-height:100%;}
body{margin:0; background:var(--ground); color:var(--ink);
  font-family:'Montserrat',system-ui,sans-serif; font-size:var(--s0); line-height:1.5;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;}
h1,h2,h3{font-weight:800; letter-spacing:-.02em; margin:0; line-height:1.25;}
h1{font-size:1.35rem;} h3{font-size:var(--s1);}
a{color:var(--ink); font-weight:600; text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:3px;}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--ink); outline-offset:2px;}
.vh{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

.app{margin:0 auto; padding:0 16px;}
.screen{display:flex; flex-direction:column; gap:16px; min-height:100dvh; padding:24px 0;}
.screen.center{justify-content:center;}
.narrow{max-width:420px; margin:0 auto;}
.wide{max-width:1180px; margin:0 auto; padding:20px 0 48px;}

.brand-row{display:flex; align-items:center; gap:9px; min-width:0;}
.chak-mark{width:30px; height:30px; object-fit:contain; flex:none;}
.brand-row:has(.mark.big) .chak-mark{width:44px; height:44px;}
/* Chakra Petch без кириллицы - кириллица марки падает на Montserrat. */
.mark{font-family:'Chakra Petch','Montserrat',sans-serif; font-style:italic; font-weight:700;
  font-size:1.3rem; letter-spacing:-.035em; white-space:nowrap;}
.mark.big{font-size:1.85rem;}
.mark b{color:var(--accent);}

.sub{color:var(--muted); font-size:var(--s--1); margin:0;}
.tiny{font-size:11px; color:var(--muted); line-height:1.45; margin:0; font-weight:500;}
.legal-foot{margin-top:18px !important; text-align:center;}
.legal-foot a{color:var(--muted); font-weight:500; text-decoration:none;}
.err{color:var(--danger); font-size:var(--s--1); font-weight:600; margin:0;}
.blocked-text{font-weight:700; font-size:var(--s1); margin:0;}
label{display:block; font-size:11px; text-transform:uppercase; letter-spacing:.12em;
  color:var(--muted); margin-bottom:6px; font-weight:500;}

.field{width:100%; border:1.5px solid var(--hairline); border-radius:10px; padding:12px 13px;
  font:inherit; font-size:var(--s0); color:var(--ink); background:var(--ground);}
.field:focus{border-color:var(--ink); outline:none;}
textarea.field{resize:vertical; min-height:110px; line-height:1.45;}
select.field{appearance:auto;}
.code-input{font-weight:800; letter-spacing:.3em; font-variant-numeric:tabular-nums;}

.btn{display:block; width:100%; text-align:center; background:var(--accent); color:var(--ink);
  border:1.5px solid var(--accent); border-radius:10px; padding:13px 14px; font-family:inherit; font-weight:800;
  font-size:var(--s0); letter-spacing:-.01em; cursor:pointer; text-decoration:none;}
.btn:disabled{opacity:.5; cursor:default;}
.btn.ghost{background:transparent; border-color:var(--hairline);}
.btn.ghost:hover:not(:disabled){border-color:var(--ink);}
.btn.danger{background:var(--danger); border-color:var(--danger); color:#fff;}
.btn.sm{width:auto; display:inline-block; padding:9px 14px; font-size:var(--s--1); white-space:nowrap;}

/* ── шапка ── */
.top{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  padding-bottom:14px; border-bottom:2px solid var(--ink); margin-bottom:18px;}
.who-box{display:flex; align-items:center; gap:12px; min-width:0;}
.who-txt{display:flex; flex-direction:column; align-items:flex-end; min-width:0; text-align:right;}
.who-txt b{font-weight:800; overflow-wrap:anywhere;}
.who-txt .sub{overflow-wrap:anywhere;}

/* ── сводка ── */
.stats{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:18px;}
.stat{border:1.5px solid var(--hairline); border-radius:var(--r); padding:13px 14px;
  display:flex; flex-direction:column; gap:3px; min-width:0;}
.stat .sv b{font-weight:800; font-size:1.45rem; letter-spacing:-.03em; font-variant-numeric:tabular-nums;}
.stat.alert{border-color:var(--danger);}
.stat.alert .sv b{color:var(--danger);}
.k{font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:var(--muted);}

/* ── панель инструментов ── */
.toolbar{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:8px;}
.search{flex:1 1 240px; width:auto; padding:10px 12px;}
.tb-acts{display:flex; gap:8px; flex-wrap:wrap;}
.selbar{display:flex; align-items:center; gap:14px; flex-wrap:wrap; padding:6px 2px 10px;}
.selbar #stats-at{margin-left:auto;}
.chk{display:inline-flex; align-items:center; gap:7px; margin:0; font-size:var(--s--1);
  text-transform:none; letter-spacing:0; color:var(--ink); font-weight:600; cursor:pointer;}
input[type=checkbox]{width:17px; height:17px; accent-color:var(--ink); margin:0; cursor:pointer;}

/* ── таблица ── */
.tbl-wrap{border:1.5px solid var(--hairline); border-radius:var(--r); overflow:hidden;}
table.links{width:100%; border-collapse:collapse; font-size:var(--s--1); table-layout:auto;}
.links th{text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
  font-weight:600; padding:10px; background:var(--wash); border-bottom:1.5px solid var(--hairline); vertical-align:bottom;}
.links th .tiny{text-transform:none; letter-spacing:0;}
.links td{padding:9px 10px; border-bottom:1px solid var(--hairline); vertical-align:middle;}
.links tbody tr:last-child td{border-bottom:none;}
.links tbody tr:hover{background:var(--wash);}
.links tr.sel{background:#FFF8E1;}
.links tr.off .lbl,.links tr.off .url{color:var(--muted);}
.c-sel{width:34px;}
.c-num{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap;}
.c-label .lbl{font-weight:700; overflow-wrap:anywhere;}
.c-label .lbl.none{color:var(--muted); font-weight:500; font-style:italic;}
.c-url{max-width:280px;}
.c-url .url{display:block; font-size:11px; color:var(--muted); overflow-wrap:anywhere; margin-bottom:4px;
  font-variant-numeric:tabular-nums;}
.c-status{white-space:nowrap;}
.c-online{white-space:nowrap; color:var(--muted);}
.c-act{text-align:right; width:1%;}
.mini{border:1.5px solid var(--hairline); background:var(--ground); color:var(--ink); border-radius:8px;
  padding:5px 9px; font:inherit; font-size:11px; font-weight:700; cursor:pointer; white-space:nowrap;}
.mini:hover:not(:disabled){border-color:var(--ink);}
.mini:disabled{opacity:.5; cursor:default;}
.mini.danger{color:var(--danger);}
.tag{display:inline-block; background:var(--ok); color:var(--ok-ink); font-size:10px; font-weight:800;
  padding:3px 8px; border-radius:99px; letter-spacing:.02em; white-space:nowrap;}
.tag.off{background:var(--hairline); color:var(--muted);}
.tag.warn{background:#FDE7E3; color:var(--danger);}
.empty{margin:0; padding:36px 16px; text-align:center; color:var(--muted); font-weight:600;}

/* ── телефон: строки таблицы превращаются в карточки ── */
@media (max-width:760px){
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));}
  .who-txt{align-items:flex-start; text-align:left;}
  .top{align-items:flex-start;}
  .tb-acts{width:100%;}
  .tb-acts .btn{flex:1 1 auto;}
  .tbl-wrap{border:none; border-radius:0; overflow:visible;}
  table.links,.links tbody,.links tr,.links td{display:block; width:100%;}
  .links thead{display:none;}
  .links tbody tr{position:relative; border:1.5px solid var(--hairline); border-radius:var(--r);
    padding:12px 12px 10px 44px; margin-bottom:10px;}
  .links tbody tr:hover{background:transparent;}
  .links tr.sel{background:#FFF8E1;}
  .links td{border:none; padding:3px 0; max-width:none; text-align:left;}
  .links td[data-k]::before{content:attr(data-k); display:block; font-size:10px; text-transform:uppercase;
    letter-spacing:.1em; color:var(--muted); font-weight:500;}
  .links td.c-label::before{display:none;}
  .links td.c-label .lbl{font-size:var(--s0);}
  .links td.c-sel{position:absolute; left:13px; top:14px; width:auto; padding:0;}
  .links td.c-act{position:absolute; right:10px; top:10px; width:auto; padding:0;}
  .links td.c-label{padding-right:84px;}
  .links td.c-num{text-align:left;}
  .c-url .url{font-size:11px;}
}
@media (max-width:380px){
  .stats{grid-template-columns:minmax(0,1fr);}
}

/* ── лист (модальное окно) ── */
.sheet-bg{position:fixed; inset:0; z-index:60; background:rgba(13,12,11,.5);
  display:flex; align-items:center; justify-content:center; padding:16px;}
.sheet{width:100%; max-width:480px; max-height:calc(100dvh - 32px); overflow:auto; background:var(--ground);
  border-radius:var(--r); padding:20px 18px; display:flex; flex-direction:column; gap:12px;}
@media (max-width:760px){
  .sheet-bg{align-items:flex-end; padding:0;}
  .sheet{border-radius:var(--r) var(--r) 0 0; max-height:92dvh;
    padding-bottom:calc(18px + env(safe-area-inset-bottom));}
}
.sheet p{margin:0;}
.sheet .sheet-sub{overflow-wrap:anywhere;}
.sheet-opts{display:flex; flex-direction:column; gap:8px;}
.sheet .opt{display:block; width:100%; text-align:left; background:var(--wash); color:var(--ink);
  border:1.5px solid var(--hairline); border-radius:10px; padding:12px 14px;
  font:inherit; font-size:var(--s0); font-weight:700; cursor:pointer;}
.sheet .opt:hover{border-color:var(--ink);}
.sheet .opt.danger{color:var(--danger);}
.sheet .opt .tiny{display:block; margin-top:2px;}
.sheet-row{display:flex; gap:8px;}
.sheet-row .btn{flex:1;}
.dev-row{display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--hairline);}
.dev-row:last-child{border-bottom:none;}
.dev-info{display:flex; flex-direction:column; min-width:0; flex:1;}
.dev-info b{overflow-wrap:anywhere;}
.dev-info .tiny{overflow-wrap:anywhere;}
.made{display:flex; flex-direction:column; gap:0; max-height:46dvh; overflow:auto;
  border:1.5px solid var(--hairline); border-radius:10px; padding:4px 12px;}
.made-row{padding:8px 0; border-bottom:1px solid var(--hairline); display:flex; gap:10px; align-items:center;}
.made-row:last-child{border-bottom:none;}
.made-row .dev-info .tiny{font-variant-numeric:tabular-nums;}

.toast{position:fixed; left:50%; bottom:24px; transform:translateX(-50%); max-width:calc(100vw - 32px);
  background:var(--ink); color:var(--ground); padding:11px 18px; border-radius:99px;
  font-size:var(--s--1); font-weight:600; z-index:70; text-align:center; overflow-wrap:anywhere;}
.toast.bad{background:var(--danger); color:#fff;}
.sheet-bg ~ .toast{bottom:auto; top:24px;}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}
