/* Согласования как раздел оболочки (не диалог). Палитра и размеры — токены style.css. */
.approvals-page[hidden]{display:none!important}
.approvals-page{flex:1;display:flex;flex-direction:column;min-height:0;background:var(--panel);overflow:hidden}
.approvals-page .approval-shell{display:flex;flex-direction:column;flex:1;min-height:0;padding:16px 20px;box-sizing:border-box;min-width:0;font-size:14px;line-height:1.4}
.approvals-page .approval-page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none;border-bottom:1px solid var(--rule);padding-bottom:10px}
.approvals-page .approval-page-head h2{margin:0}
.approvals-page .approval-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;flex:none}
.approvals-page .approval-tabs [aria-pressed="true"]{border-color:var(--accent);outline:1px solid var(--accent)}
.approvals-page main{margin-top:16px;flex:1;min-height:0;overflow:auto}
.approvals-page .approval-compose{display:flex;flex-direction:column;gap:12px;max-width:860px}
.approvals-page .approval-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:12px;align-items:end;margin:0}
.approvals-page :is(input,select,button,textarea){font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--rule);border-radius:6px;padding:6px 10px;box-sizing:border-box;max-width:100%;min-width:0}
.approvals-page :is(input,select,button){min-height:36px}
.approvals-page button{cursor:pointer}
.approvals-page button:hover:not(:disabled){background:var(--hover)}
.approvals-page :disabled{opacity:.6;cursor:default}
.approvals-page .approval-compose > button{align-self:flex-start}
.approvals-page .approval-form-actions{position:sticky;top:0;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 0;background:var(--panel);border-bottom:1px solid var(--rule)}
.approvals-page .approval-form-actions .hint{margin:0}
.approvals-page :is(.approval-compose,.approval-filters) label{margin:0;font-size:12px;color:var(--muted);min-width:0}
.approvals-page label :is(input,select){width:100%;margin:0}
.approvals-page [data-actions]{position:sticky;top:0;z-index:2;display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0;padding:8px 0;background:var(--surface);border-bottom:1px solid var(--rule)}
.approvals-page [data-actions] textarea{flex-basis:100%;min-height:90px;resize:vertical}
.approvals-page [data-files]{display:flex;gap:8px}
.approvals-page [data-files] > div{display:flex;flex-wrap:wrap;align-items:center;gap:8px;overflow-wrap:anywhere}
.approvals-page .approval-attempt :is(h3,p){margin:0 0 8px;overflow-wrap:anywhere}
.approvals-page .approval-attempt h3{font-size:16px}
.approvals-page .approval-attempt li{margin-bottom:8px;overflow-wrap:anywhere}
.approvals-page button:focus-visible,.approvals-page input:focus-visible,.approvals-page select:focus-visible{outline:2px solid var(--accent,#456a84);outline-offset:2px}
.approvals-page pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:1.5}
.approvals-page [role=alert]{min-height:1.5em;margin:8px 0 0;color:var(--ink)}
.approvals-page .ui-close{min-width:36px;font-size:20px}
.approvals-page time{font-variant-numeric:tabular-nums}
.approvals-page [data-files]{flex-direction:column}
.approvals-page .approval-filters label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.approvals-page .approval-compose label{display:flex;flex-direction:column;gap:4px}
/* Повтор карточек из roles-approvals.css в контексте страницы (классы те же). */
.approvals-page .approval-attempt{border:1px solid var(--rule);border-radius:12px;padding:12px;margin-top:12px;background:var(--surface)}
.approvals-page .approval-attempt blockquote{white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0}
.approvals-page .approval-compose section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 36px 36px auto;gap:8px;align-items:end;margin:0 0 12px}
/* Native select WebKit иначе добавляет 2px к высоте соседних действий. */
.approvals-page .approval-compose section :is(select,button){height:36px}
@media(max-width:900px){.approvals-page .approval-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.approvals-page .approval-compose section{grid-template-columns:repeat(2,minmax(0,1fr))}.approvals-page .approval-compose section button{justify-self:start}.approvals-page .approval-filters{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){.approvals-page input,.approvals-page select,.approvals-page button{min-height:44px}.approvals-page .ui-close{min-width:44px}}

/* Мобильный page-паттерн (/m): раздел — полноэкранная страница над таб-баром. */
.approvals-page.mobile-page{position:absolute;inset:0 0 auto 0;bottom:0;z-index:90;background:var(--surface);color:var(--ink);padding-top:var(--safe-top,0px)}
.approvals-page.mobile-page .approval-shell{padding:12px 16px calc(16px + var(--mobile-tabbar-height,calc(58px + var(--safe-bottom,0px))))}
.approvals-page.mobile-page .approval-tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
.approvals-page.mobile-page input,.approvals-page.mobile-page select,.approvals-page.mobile-page button{min-height:44px}