
/* v3.100.71: новый вид раздела «Оплаты» — только оформление, логика и кнопки прежние */
.kp-page.ct-page{max-width:1480px}
.kp-page .page-head{align-items:center;margin-bottom:14px}
.kp-page .page-head .eyebrow{color:var(--ink-faint);font-weight:500;font-size:11.5px;letter-spacing:.01em;margin-bottom:2px}
.kp-page .page-head h1{font:700 26px/1.15 var(--font-display);letter-spacing:-.01em}
.kp-page .kp-head-right{gap:10px}
.kp-page .kp-head-right .btn{border-radius:10px;padding:8px 14px;font-size:13px}
.kp-page .kp-head-right .kp-pill.paid{padding:5px 11px;font-size:12px}

/* вкладки — переключатель */
.kp-page .hub-tabs.kp-tabs{position:relative;top:auto;display:inline-flex;flex-wrap:nowrap;max-width:100%;overflow-x:auto;scrollbar-width:none;gap:2px;padding:4px;margin:0 0 14px;border-radius:12px;background:var(--surface);border:1px solid var(--line);box-shadow:0 1px 2px rgba(16,24,40,.04)}
.kp-page .hub-tabs.kp-tabs::-webkit-scrollbar{display:none}
.kp-page .kp-tabs .hub-tab{flex:none;border:0;background:transparent;border-radius:9px;padding:8px 15px;font:600 13px var(--font-body);color:var(--ink-soft);white-space:nowrap;transition:background .15s,color .15s}
.kp-page .kp-tabs .hub-tab:hover{background:var(--surface-2);color:var(--ink)}
.kp-page .kp-tabs .hub-tab.on{background:var(--ink);color:var(--surface)}
.kp-page .kp-tabs .hub-tab b{font:700 11px/18px var(--font-body);margin-left:7px;padding:0 7px;border-radius:999px;background:var(--surface-2);color:var(--ink-soft)}
.kp-page .kp-tabs .hub-tab.on b{background:rgba(255,255,255,.2);color:inherit}

/* карточки-блоки */
.kp-page section.block{border-radius:16px;border-color:var(--line);box-shadow:0 1px 2px rgba(16,24,40,.04),0 6px 20px -12px rgba(16,24,40,.12)}
.kp-page .block-head{padding:12px 16px}
.kp-page .block-title{font-size:14px;font-weight:700}

/* поиск и выбор объекта */
.kp-page .op-top{padding:16px 16px 10px;gap:10px}
.kp-page .op-sel,.kp-page .op-q{height:42px;box-sizing:border-box;border-radius:11px;border:1px solid transparent;background-color:var(--surface-2);font-size:14px;transition:border-color .15s,box-shadow .15s,background-color .15s}
.kp-page .op-sel{font-weight:700;padding:0 12px}
.kp-page .op-q{padding:0 14px 0 38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23868D93' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:13px center}
.kp-page .op-sel:hover,.kp-page .op-q:hover{border-color:var(--line)}
.kp-page .op-sel:focus,.kp-page .op-q:focus{outline:none;border-color:var(--accent);background-color:var(--surface);box-shadow:0 0 0 3px var(--accent-soft)}
.kp-page .op-top .btn-sm{height:42px;border-radius:11px;padding:0 14px;font-size:13px}
.kp-page .op-date{height:36px;border-radius:10px}

/* фильтры — одна строка, листается вбок */
.kp-page .kp-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:6px;padding:6px 16px 10px;border-bottom:0}
.kp-page .kp-filters::-webkit-scrollbar{display:none}
.kp-page .kp-filters .btn-sm,.kp-page .op-od .btn-sm,.kp-page .op-mvday .btn-sm{flex:none;display:inline-flex;align-items:center;border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600;background:var(--surface);border:1px solid var(--line);color:var(--ink-soft);white-space:nowrap;transition:border-color .15s,color .15s,background .15s}
.kp-page .kp-filters .btn-sm:hover,.kp-page .op-od .btn-sm:hover{border-color:var(--ink-faint);color:var(--ink)}
.kp-page .kp-filters .btn-sm.btn-primary,.kp-page .op-od .btn-sm.btn-primary{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.kp-page .kp-filters select{flex:none;height:32px;border-radius:999px;padding:0 10px}
.kp-page .kp-cnt,.kp-page .op-od .btn-sm b{display:inline-block;min-width:18px;margin-left:6px;padding:0 6px;border-radius:999px;background:var(--surface-2);color:var(--ink-soft);font:700 11px/18px var(--font-body);text-align:center}
.kp-page .btn-primary .kp-cnt,.kp-page .op-od .btn-primary b{background:rgba(255,255,255,.2);color:inherit}

/* блок «Сегодня» */
.kp-page .op-today{margin:6px 16px 14px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}
.kp-page .op-today-t{line-height:1.5}
.kp-page .op-today-h{font-size:15px}
.kp-page .op-tbs{gap:10px;margin:12px 0 4px}
.kp-page .op-tb{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:12px;padding:13px 14px 12px;background:var(--surface);transition:transform .12s,box-shadow .12s,border-color .12s}
.kp-page .op-tb::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--ink-faint)}
.kp-page .op-tb.w::before{background:var(--warn)}.kp-page .op-tb.b::before{background:var(--bad)}.kp-page .op-tb.a::before{background:var(--accent)}
.kp-page .op-tb:hover{background:var(--surface);transform:translateY(-1px);box-shadow:0 8px 18px -10px rgba(16,24,40,.3)}
.kp-page .op-tb.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.kp-page .op-tb .l{font-size:12.5px;font-weight:600;color:var(--ink-soft)}
.kp-page .op-tb b{font:700 28px/1.1 var(--font-display);margin:5px 0 2px;color:var(--ink)}
.kp-page .op-tb .s{font-size:12px}
.kp-page .op-od{gap:6px;margin-top:10px}
.kp-page .op-today-a{margin-top:6px;padding-top:12px;border-top:1px dashed var(--line)}
.kp-page .op-today-a .btn-primary{border-radius:10px;padding:9px 16px;font-size:13px;background:var(--accent);border-color:var(--accent);color:#fff}
.kp-page .op-today-a .btn-primary:hover{filter:brightness(.95)}
.kp-page .op-n1{margin:4px 16px 10px;border-radius:12px}

/* цифры (занято, собрано, журнал, касса) */
.kp-page .kp-kpis{gap:10px}
.kp-page .kp-kpi,.kp-page .op-cs-t,.kp-page .op-cs-w{border-radius:12px;border:1px solid var(--line);background:var(--surface);transition:transform .12s,box-shadow .12s}
.kp-page .kp-kpi{padding:12px 14px 11px}
.kp-page .kp-kpi::before{left:0;right:0;top:0;bottom:auto;width:auto;height:3px}
.kp-page .kp-kpi:hover,.kp-page .op-cs-w:hover{transform:translateY(-1px);box-shadow:0 8px 18px -10px rgba(16,24,40,.3)}
.kp-page .kp-kpi .l{font:600 12px var(--font-body);text-transform:none;letter-spacing:0;color:var(--ink-soft)}
.kp-page .kp-kpi .v{font:700 24px/1.15 var(--font-display);margin-top:5px}
.kp-page .kp-kpi .s{font-size:12px;margin-top:2px}
.kp-page .op-kpis{grid-template-columns:repeat(4,minmax(0,1fr));padding:0 16px;margin:0 0 6px}
.kp-page .op-cs-tot,.kp-page .op-cs-mgr{gap:10px;padding:4px 16px 8px}
.kp-page .op-cs-t{padding:12px 14px}.kp-page .op-cs-t b{font:700 20px var(--font-display)}

/* таблица ячеек */
.kp-page .op-list{border-top:1px solid var(--line);margin-top:4px}
.kp-page .op-head{background:var(--surface-2);font-size:11px;font-weight:700;letter-spacing:.05em;padding:10px 16px;color:var(--ink-faint)}
.kp-page .op-row{padding:12px 16px;font-size:13.5px;transition:background .12s}
.kp-page .op-row:last-child{border-bottom:0}
.kp-page .op-row:hover{background:var(--surface-2)}
.kp-page .op-row.bad{box-shadow:inset 3px 0 0 var(--bad);background:color-mix(in srgb,var(--bad-soft) 40%,var(--surface))}
.kp-page .op-row.bad:hover{background:color-mix(in srgb,var(--bad-soft) 70%,var(--surface))}
.kp-page .op-row.open,.kp-page .op-row.sel{background:color-mix(in srgb,var(--accent-soft) 50%,var(--surface))}
.kp-page .op-row.free{opacity:.55}
.kp-page .op-cell b{font:700 15px var(--font-display);letter-spacing:-.01em}
.kp-page .op-cell .kp-sub{font-size:11.5px;margin-top:1px}
.kp-page .op-who b{font-weight:600}
.kp-page .op-phone{color:var(--ink-soft);font-size:12.5px}
.kp-page .op-to .op-v{font-size:12.5px;color:var(--ink-soft)}
.kp-page .op-rent{font-weight:700;font-variant-numeric:tabular-nums}
.kp-page .op-tag{padding:2px 8px;font-weight:600;background:var(--surface-2);border-color:transparent}
.kp-page .op-tag.many{background:var(--accent-soft);border-color:transparent;color:var(--accent-dark)}
.kp-page .kp-pill{padding:3px 9px;font-size:11.5px;line-height:1.35}
.kp-page .kp-pill.manual{padding:3px 9px}
.kp-page .op-cf{font-size:11px;padding:2px 8px;font-weight:600}
.kp-page .op-cf.ok{background:var(--free-soft);border-color:transparent}
.kp-page .op-cf.kno{background:var(--warn-soft);border-color:transparent}
.kp-page .op-cf.no{background:var(--surface-2);border-color:transparent;color:var(--ink-faint)}
.kp-page .op-m{font-weight:600}
.kp-page .op-m.unk{color:var(--ink-faint);font-weight:500}
.kp-page .op-ic{width:32px;height:32px;border-radius:9px;border:1px solid transparent;background:var(--surface-2);transition:background .12s,border-color .12s}
.kp-page .op-ic:hover{background:var(--accent-soft);border-color:var(--accent)}
.kp-page .op-chev{opacity:.6}
.kp-page .op-det{padding:14px 4px 8px}
.kp-page .op-ph{border-radius:12px;background:var(--surface)}
.kp-page .op-bulk{border-radius:12px;margin:8px 16px;box-shadow:0 8px 20px -12px rgba(16,24,40,.35)}

/* журнал и списки */
.kp-page .kp-thead{padding:9px 16px;font:700 10.5px var(--font-body);letter-spacing:.05em}
.kp-page .kp-row{padding:9px 16px;font-size:12.5px;transition:background .12s}
.kp-page .kp-row .num{font-family:var(--font-body);font-weight:700;font-variant-numeric:tabular-nums}
.kp-page .kp-ic{border-radius:8px;padding:3px 8px;background:var(--surface-2);border-color:transparent}
.kp-page .kp-ic:hover{background:var(--accent-soft);border-color:var(--accent)}
.kp-page .op-cs-head{background:var(--surface-2);padding:10px 16px;letter-spacing:.05em}
.kp-page .op-cs-row{padding:11px 16px}
.kp-page .kp-empty{padding:34px 16px}
.kp-page .kp-empty .ic{font-size:28px;margin-bottom:8px}

@media (min-width:901px){
  .kp-page .kp-filters{flex-wrap:wrap;overflow:visible}
  .kp-page .op-st .op-v{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
  .kp-page .op-st .kp-pill{white-space:nowrap;margin:0}
  .kp-page .op-cf{margin:0}
  .kp-page .op-head,.kp-page .op-row{grid-template-columns:120px minmax(160px,1.5fr) 56px 100px minmax(190px,1.4fr) 120px minmax(140px,1.1fr) 148px}
}
@media (max-width:900px){
  .kp-page .op-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kp-page .page-head h1{font-size:22px}
  .kp-page .hub-tabs.kp-tabs{display:flex}
  .kp-page .op-today{margin:4px 12px 12px;padding:12px}
  .kp-page .op-top{padding:12px 12px 8px}
  .kp-page .kp-filters{padding:6px 12px 10px}
  .kp-page .op-row{padding:12px}
}
