/* ---------- FORMS, SCHEDULING, AUTOMATIONS, PORTAL, INBOX · continued ---------- */
/* PORTAL: page head on the scrim, the client's view as a paper sheet, portal settings and the approval decision as a glass rail on the end side */
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal.active { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); gap: 16px 20px; align-items: start; max-inline-size: none; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal #client-portal-host { display: contents; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-head { grid-column: 1 / -1; margin: 4px 0 0; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-head-copy { flex: 1 1 420px; min-width: 0; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-head-copy > h1 { margin: 0 !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-head .portal-summary { display: flex; align-items: center; gap: 10px; margin: 10px 0 0; font-size: 15px; font-weight: 500; line-height: 1.5; color: var(--at-ink); font-variant-numeric: tabular-nums; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-summary::before { content: ""; flex: none; inline-size: 8px; block-size: 8px; border-radius: 50%; background: var(--at-green-text); box-shadow: 0 0 0 3px color-mix(in srgb, var(--at-green-text) 18%, transparent); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-summary[data-state="waiting"]::before { background: var(--at-amber); box-shadow: 0 0 0 3px var(--at-amber-soft); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-head .portal-note { margin: 6px 0 0; max-width: 78ch; font-size: 13px; line-height: 1.55; color: var(--at-ink-2); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-head-actions { display: flex; flex-wrap: wrap; gap: 8px; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-head-actions > button { margin: 0 !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal #client-portal-host > .tool-guidance { grid-column: 1 / -1; margin: -6px 0 0 !important; }
/* the paper: the client's view on a cream sheet */
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper { --pp: #faf8f2; --pp-ink: #1b1f1d; --pp-ink-2: #535a56; --pp-line: #e5e2d8; grid-column: 1; grid-row: span 2; display: grid; gap: 10px; min-width: 0; }
html[data-theme="light"] body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper { --pp: #fff; --pp-ink: #13201a; --pp-line: #e4e8e5; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-label { display: flex; align-items: center; gap: 10px; margin: 0; padding: 0 4px; font-size: 13px !important; font-weight: 600; line-height: 1.5; color: var(--at-ink); text-shadow: var(--at-text-shadow); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-chip { display: inline-flex; align-items: center; gap: 6px; padding: 2px 9px; border-radius: 8px; background: var(--at-fill-2); box-shadow: inset 0 0 0 1px var(--at-line); color: var(--at-ink-2); font-size: 12px; font-weight: 500; text-shadow: none; }
html[lang="ar"] body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-chip { font-size: 13px; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-chip::before { content: ""; inline-size: 6px; block-size: 6px; border-radius: 50%; background: var(--at-amber); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > :is(article.client-portal-preview, .portal-paper-empty) { position: relative; display: block; box-sizing: border-box; min-height: 560px; margin: 0 !important; padding: 52px 60px 60px !important; border: 0 !important; border-radius: 6px !important; background: var(--pp) !important; color: var(--pp-ink) !important; box-shadow: inset 0 1px 0 rgb(255 255 255 / .4), 0 30px 80px rgb(0 0 0 / .45), 0 2px 6px rgb(0 0 0 / .3) !important; overflow-wrap: anywhere; font-family: var(--at-sans); }
html[data-theme="light"] body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > :is(article.client-portal-preview, .portal-paper-empty) { box-shadow: 0 30px 70px rgb(30 60 45 / .18), 0 2px 8px rgb(30 60 45 / .08) !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview::before { display: none; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > * { margin: 0; color: var(--pp-ink); font-size: 15px; line-height: 1.6; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > .portal-paper-brand { margin: 0 0 22px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--pp-ink-2); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > h2 { font-family: var(--at-serif) !important; font-size: 46px !important; font-weight: 400 !important; line-height: 1.05 !important; letter-spacing: -.015em !important; color: var(--pp-ink) !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > .portal-paper-client { margin: 8px 0 6px; font-size: 15px; color: var(--pp-ink-2); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > h3 { margin: 22px 0 8px; padding: 18px 0 0 !important; border: 0 !important; border-top: 1px solid var(--pp-line) !important; background: none !important; font-family: var(--at-sans) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .08em !important; text-transform: uppercase; line-height: 1.4; color: var(--pp-ink-2) !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > .portal-paper-price { margin-top: 6px; font-family: var(--at-serif); font-size: 32px; line-height: 1.15; font-variant-numeric: tabular-nums; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > ul { padding: 0; list-style: none; border-top: 1px solid var(--pp-line); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > ul > li { margin: 0; padding: 10px 0; border-bottom: 1px solid var(--pp-line); font-size: 14px; line-height: 1.55; color: var(--pp-ink); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > ul:empty { display: none; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > :is(h4, h5) { margin-top: 14px; font-size: 15px; font-weight: 600; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > pre { padding: 12px 14px; border-radius: 6px; background: color-mix(in srgb, var(--pp-ink) 5%, var(--pp)); font-size: 13px; white-space: pre-wrap; }
html[lang="ar"] body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > :is(h3, .portal-paper-brand) { font-size: 13px !important; letter-spacing: 0 !important; text-transform: none; }
html[lang="ar"] body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > h2, html[lang="ar"] body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-empty > h2 { font-family: var(--at-sans) !important; font-size: 34px !important; font-weight: 500 !important; line-height: 1.35 !important; letter-spacing: 0 !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-empty > h2 { margin: 0; font-family: var(--at-serif) !important; font-size: 40px !important; font-weight: 400 !important; line-height: 1.1 !important; color: var(--pp-ink) !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-empty > p { margin: 12px 0 34px; max-width: 52ch; font-size: 15px !important; line-height: 1.6 !important; color: var(--pp-ink-2) !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-line { display: block; block-size: 10px; margin-top: 16px; border-radius: 5px; background: var(--pp-line); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-line:nth-of-type(2) { inline-size: 84%; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-line:nth-of-type(3) { inline-size: 92%; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-line:nth-of-type(4) { inline-size: 58%; }
/* the rail: portal settings, then the approval decision */
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings { grid-column: 2; display: flex; flex-direction: column; gap: 12px; box-sizing: border-box; min-width: 0; margin: 0; padding: 18px 20px; background: var(--at-pane); border: 1px solid var(--at-line); border-radius: var(--at-r-lg); box-shadow: var(--at-sheen), var(--at-shadow); color: var(--at-ink); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings > h2 { margin: 0; font-family: var(--at-sans) !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1.35; color: var(--at-ink); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings > .portal-setting { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; font-size: 13px; line-height: 1.5; color: var(--at-ink-3); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings > .portal-setting > select, html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings > .portal-setting > .localized-control { inline-size: 100%; margin: 0; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings > p.portal-proposal-source { margin: 0 !important; font-size: 13px; line-height: 1.55; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings > button:not(:disabled), html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings > .portal-open-link { inline-size: 100%; margin: 0 !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings > .portal-delivery-editor { margin: 4px 0 0; padding: 14px !important; border: 0 !important; border-radius: 14px !important; background: var(--at-fill-1) !important; box-shadow: inset 0 0 0 1px var(--at-line-2) !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings > .portal-cloud-status { margin: 0; font-size: 13px; color: var(--at-ink-3); }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal #portal-approvals-host { grid-column: 2; margin: 0 !important; }
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal #portal-approvals-host > p { margin: 0; font-size: 13px !important; line-height: 1.55 !important; color: var(--at-ink-3); }
@media (max-width: 1100px) {
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal.active { grid-template-columns: minmax(0, 1fr); }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal :is(.portal-paper, .portal-settings, #portal-approvals-host) { grid-column: 1; grid-row: auto; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-settings { order: 1; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper { order: 2; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal #portal-approvals-host { order: 3; }
}
@media (max-width: 600px) {
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-head-actions { flex: 1 1 100%; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-head-actions > button:not(:disabled) { flex: 1 1 auto; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > :is(article.client-portal-preview, .portal-paper-empty) { min-height: 0; padding: 28px 22px 32px !important; border-radius: 14px !important; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > article.client-portal-preview > h2 { font-size: 34px !important; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-empty > h2 { font-size: 32px !important; }
}
/* ---------- PORTAL · bento r2 (work pages) ---------- */
/* The client's paper runs the rail's height instead of a fixed 560px sheet, so the two columns end on one line. */
@media (min-width: 1101px) {
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper:not(#_) { display: flex; flex-direction: column; gap: 10px; align-self: stretch; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > :is(article.client-portal-preview, .portal-paper-empty):not(#_) { flex: 1 1 auto; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > .portal-paper-empty:not(#_) { min-height: 0; }
}
@media (min-width: 601px) {
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper > .portal-paper-empty:not(#_) { padding: 40px 48px 44px !important; }
}
html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal .portal-paper-empty > p:not(#_) { margin-block-end: 24px; }
/* DENSITY 3 · Portal: from 2000px the rail is wider and the approval form two across, so the rail and the client's paper are shorter. */
@media (min-width: 2000px) {
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal.active:not(#_) { grid-template-columns: minmax(0, 1fr) minmax(440px, 520px); }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal #portal-approvals-host > form:not(#_) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal #portal-approvals-host > form > *:not(#_) { grid-column: 1 / -1; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal #portal-approvals-host > form > label.portal-decision-field:nth-of-type(1):not(#_) { grid-column: 1; grid-row: 1; }
  html body.workspace-framed.rt-route:not(#_):not(._) #panel-portal #portal-approvals-host > form > label.portal-decision-field:nth-of-type(3):not(#_) { grid-column: 2; grid-row: 1; }
}