/* Клиентский контур: админ-раздел «Клиенты» и оболочка клиента. Отдельного визуального языка не вводим — берём карточки, таблицы, кнопки и модальные окна Mini App (ТЗ §32). */ #panelPortal .pt-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px;} .pt-title{font-size:20px;font-weight:700;letter-spacing:-.01em;} .pt-sub{color:var(--muted);font-size:13px;margin-top:2px;} #panelPortal .pt-toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px;} #panelPortal .pt-search{flex:1 1 220px;min-width:180px;} #panelPortal .pt-table{width:100%;border-collapse:collapse;font-size:13px;} #panelPortal .pt-table th{text-align:left;font-weight:650;color:var(--muted);font-size:12px; text-transform:uppercase;letter-spacing:.03em;padding:8px 10px;border-bottom:1px solid var(--stroke);white-space:nowrap;} #panelPortal .pt-table td{padding:11px 10px;border-bottom:1px solid var(--stroke);vertical-align:middle;} #panelPortal .pt-table tbody tr:hover{background:rgba(15,23,42,.025);} #panelPortal .pt-wrap{overflow-x:auto;} #panelPortal .pt-badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:650;} #panelPortal .pt-badge.ok{background:rgba(22,163,74,.12);color:#16a34a;} #panelPortal .pt-badge.off{background:rgba(100,116,139,.14);color:#64748b;} #panelPortal .pt-badge.warn{background:rgba(234,179,8,.15);color:#a16207;} #panelPortal .pt-badge.err{background:rgba(220,38,38,.1);color:#dc2626;} #panelPortal .pt-empty{padding:42px 20px;text-align:center;color:var(--muted);} #panelPortal .pt-empty h3{font-size:15px;color:var(--ink);margin-bottom:6px;font-weight:650;} #panelPortal .pt-tabs{display:flex;gap:4px;border-bottom:1px solid var(--stroke);margin:16px 0 18px;flex-wrap:wrap;} #panelPortal .pt-tab{padding:9px 14px;border:0;background:none;font:inherit;font-size:13px;font-weight:600; color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;} #panelPortal .pt-tab.active{color:var(--brand);border-bottom-color:var(--brand);} #panelPortal .pt-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:8px;} #panelPortal .pt-kpi{padding:14px;border:1px solid var(--stroke);border-radius:12px;background:#fff;} #panelPortal .pt-kpi b{display:block;font-size:22px;font-weight:700;letter-spacing:-.02em;} #panelPortal .pt-kpi span{color:var(--muted);font-size:12px;} .pt-switch{display:flex;align-items:center;justify-content:space-between;gap:12px; padding:11px 14px;border:1px solid var(--stroke);border-radius:10px;margin-bottom:8px;} .pt-switch label{font-weight:600;font-size:13px;} .pt-link{background:none;border:0;color:var(--brand);font:inherit;font-weight:600;cursor:pointer;padding:0;} .pt-row-actions{display:flex;gap:8px;flex-wrap:wrap;} .pt-invite-url{display:flex;gap:8px;margin-top:10px;} .pt-invite-url input{flex:1;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;} .pt-note{background:rgba(234,179,8,.08);border:1px solid rgba(234,179,8,.25); border-radius:10px;padding:11px 13px;font-size:12.5px;color:#854d0e;margin-top:12px;} /* ── Кнопки ────────────────────────────────────────────────────────────── Общего класса `.btn` в Mini App нет — есть модульные (`.opis-btn`). Поэтому у контура свои, повторяющие ту же форму: 1.5px рамка, --r-sm, заливка брендом у основной. Модалка живёт в , вне #panelPortal, поэтому классы не вложены в селектор панели. */ .pt-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px; padding:8px 14px;border:1.5px solid var(--stroke);border-radius:var(--r-sm); background:#fff;color:var(--ink);font:inherit;font-size:13px;font-weight:700; cursor:pointer;transition:.12s;white-space:nowrap;min-height:38px;} .pt-btn:hover{border-color:var(--brand);color:var(--brand);} .pt-btn:active{transform:scale(.98);} .pt-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;} .pt-btn-primary{background:var(--brand);border-color:var(--brand);color:#fff;} .pt-btn-primary:hover{background:var(--brand-strong);border-color:var(--brand-strong);color:#fff;} .pt-btn-danger{color:#dc2626;} .pt-btn-danger:hover{border-color:#dc2626;color:#dc2626;} /* Переключатель права/раздела — вместо системного чекбокса. */ .pt-toggle{position:relative;display:inline-block;width:40px;height:23px;flex:0 0 auto;} .pt-toggle input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:2;} .pt-toggle i{position:absolute;inset:0;border-radius:999px;background:#cbd5e1;transition:.16s background;pointer-events:none;} .pt-toggle i::after{content:"";position:absolute;top:2.5px;left:2.5px;width:18px;height:18px; border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.25);transition:.16s transform;} .pt-toggle input:checked + i{background:var(--brand);} .pt-toggle input:checked + i::after{transform:translateX(17px);} .pt-toggle input:focus-visible + i{box-shadow:0 0 0 3px var(--brand-dim);} /* Модальное окно контура. */ .pt-modal{position:fixed;inset:0;background:rgba(15,23,42,.45);display:flex; align-items:center;justify-content:center;padding:20px;z-index:1000;} .pt-modal-card{max-width:520px;width:100%;max-height:88vh;overflow:auto;padding:22px; background:var(--card,#fff);border:1px solid var(--stroke);border-radius:var(--r,16px); box-shadow:0 12px 40px rgba(15,23,42,.18);} .pt-modal-title{font-size:17px;font-weight:700;letter-spacing:-.01em;margin-bottom:14px;} .pt-modal .form-label{display:block;font-size:12px;font-weight:650;color:var(--muted);margin-bottom:5px;} .pt-modal-section{font-size:13px;font-weight:700;margin:18px 0 8px;} .pt-modal .pt-row-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;} /* ── Раздел доступа: модуль + его права ──────────────────────────────── */ .pt-feature{border:1px solid var(--stroke);border-radius:12px;margin-bottom:10px;overflow:hidden;} .pt-feature .pt-feature-head{border:0;border-radius:0;margin:0;background:rgba(15,23,42,.02); border-bottom:1px solid var(--stroke);align-items:flex-start;} .pt-feature .pt-feature-head label{display:block;font-size:13.5px;font-weight:700;} .pt-feature .pt-feature-head small{display:block;margin-top:3px;font-size:11.5px;font-weight:500; color:var(--muted);line-height:1.35;} .pt-feature-actions{padding:6px 10px 10px;} .pt-switch-sub{border:0;padding:7px 4px;margin:0;border-bottom:1px dashed rgba(15,23,42,.07);} .pt-switch-sub:last-child{border-bottom:0;} .pt-switch-sub label{font-size:12.5px;font-weight:600;color:var(--muted);} /* Выключенный раздел: права видно, но они ничего не значат. */ .pt-feature.is-off .pt-feature-actions{opacity:.45;} .pt-feature.is-off .pt-switch-sub label{color:#94a3b8;} .pt-toggle input:disabled{cursor:not-allowed;} .pt-toggle input:disabled + i{opacity:.5;} .pt-feature-head .pt-badge{vertical-align:2px;margin-left:6px;} /* Скелет загрузки: пустая страница выглядела как поломка. */ .pt-skeleton{padding:6px 0;} .pt-skeleton span{display:block;height:13px;border-radius:6px;margin-bottom:10px; background:linear-gradient(90deg,#eef2f7 25%,#e2e8f0 37%,#eef2f7 63%); background-size:400% 100%;animation:pt-shimmer 1.2s ease-in-out infinite;} .pt-skeleton span:nth-child(1){width:38%;} .pt-skeleton span:nth-child(2){width:100%;} .pt-skeleton span:nth-child(3){width:86%;} .pt-skeleton span:nth-child(4){width:64%;} @keyframes pt-shimmer{0%{background-position:100% 0;}100%{background-position:0 0;}} /* Оболочка клиента: недоступные разделы не показываются вовсе (ТЗ §15). */ body.portal-client .sidebar-nav > li{display:none !important;} body.portal-client .sidebar-nav > li.portal-visible{display:block !important;} body.portal-client .nav-group-label{display:none !important;} body.portal-client .topbar-btn[title="Уведомления"]{display:none;} body.portal-client #sidebarPinBtn{display:none;} .portal-org-chip{margin:6px 12px 10px;padding:8px 11px;border-radius:10px;background:var(--brand-dim); border:1px solid rgba(255,90,0,.18);font-size:12.5px;font-weight:650;line-height:1.35;} .portal-org-chip small{display:block;color:var(--muted);font-weight:500;font-size:11px;} body.sidebar-collapsed .portal-org-chip{display:none;} body.theme-dark #panelPortal .pt-kpi{background:transparent;} body.theme-dark .pt-btn{background:transparent;color:#cbd5e1;} body.theme-dark .pt-btn-primary{background:var(--brand);color:#fff;} body.theme-dark .pt-modal-card{background:#111d35;} body.theme-dark .pt-toggle i{background:#475569;} body.theme-dark .pt-feature .pt-feature-head{background:rgba(255,255,255,.03);} body.theme-dark .pt-skeleton span{background:linear-gradient(90deg,#1c2a44 25%,#26365a 37%,#1c2a44 63%);background-size:400% 100%;}