/* admin.css: Patrix's thin layer over rastrillo's design system, loaded
   after tokens.css and theme.css. Layout for the screens the system has
   no component for (the editor's two columns, the media grid), and the
   columns of each list. Properties alphabetised within a rule. */

/* Type: IBM Plex Sans (OFL, fonts/ibm-plex-sans/OFL.txt), the variable
   cut, split by script so a page fetches only the subsets its text uses.
   Served from static/, so the CSP holds and nothing is fetched from
   elsewhere. theme.css names the family; this replaces it. */
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: normal; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-roman-cyrillic.woff2") format("woff2"); unicode-range: U+0400-045F, U+0462-0463, U+046A-046B, U+0472-0475, U+0490-04C2, U+04CF-04D9, U+04DC-04E9, U+04EE-04F9, U+0524-0525; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: normal; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-roman-greek.woff2") format("woff2"); unicode-range: U+037E, U+0386-038A, U+038C, U+038E-03A1, U+03A3-03CE; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: normal; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-roman-latin1.woff2") format("woff2"); unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: normal; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-roman-latin2.woff2") format("woff2"); unicode-range: U+0100-0101, U+0104-0130, U+0132-0151, U+0154-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01FA-01FF, U+0218-021B, U+0237, U+0259, U+1E80-1E85, U+1E9E, U+20A1, U+20A4, U+20A6, U+20A8-20AA, U+20AD-20AE, U+20B1-20B2, U+20B4-20B5, U+20B8-20BA, U+20BD, U+20BF; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: normal; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-roman-latin3.woff2") format("woff2"); unicode-range: U+0102-0103, U+01CD-01DC, U+1EA0-1EF9, U+20AB; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: normal; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-roman-pi.woff2") format("woff2"); unicode-range: U+0E3F, U+2000-200D, U+2015, U+2028-2029, U+202F, U+2032-2033, U+2070, U+2074-2079, U+2080-2089, U+2113, U+2116, U+2126, U+212E, U+2150-2151, U+2153-215E, U+2190-2199, U+21A9-21AA, U+21B0-21B3, U+21B6-21B7, U+21BA-21BB, U+21C4, U+21C6, U+2202, U+2206, U+220F, U+2211, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+2713, U+274C, U+2B0E-2B11, U+ECE0, U+EFCC, U+FEFF, U+FFFD; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: italic; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-italic-cyrillic.woff2") format("woff2"); unicode-range: U+0400-045F, U+0462-0463, U+046A-046B, U+0472-0475, U+0490-04C2, U+04CF-04D9, U+04DC-04E9, U+04EE-04F9, U+0524-0525; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: italic; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-italic-greek.woff2") format("woff2"); unicode-range: U+037E, U+0386-038A, U+038C, U+038E-03A1, U+03A3-03CE; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: italic; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-italic-latin1.woff2") format("woff2"); unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: italic; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-italic-latin2.woff2") format("woff2"); unicode-range: U+0100-0101, U+0104-0130, U+0132-0151, U+0154-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01FA-01FF, U+0218-021B, U+0237, U+0259, U+1E80-1E85, U+1E9E, U+20A1, U+20A4, U+20A6, U+20A8-20AA, U+20AD-20AE, U+20B1-20B2, U+20B4-20B5, U+20B8-20BA, U+20BD, U+20BF; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: italic; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-italic-latin3.woff2") format("woff2"); unicode-range: U+0102-0103, U+01CD-01DC, U+1EA0-1EF9, U+20AB; }
@font-face { font-display: swap; font-family: "IBM Plex Sans"; font-stretch: 85% 100%; font-style: italic; font-weight: 100 700; src: url("fonts/ibm-plex-sans/0.2.0/IBMPlexSansVar-italic-pi.woff2") format("woff2"); unicode-range: U+0E3F, U+2000-200D, U+2015, U+2028-2029, U+202F, U+2032-2033, U+2070, U+2074-2079, U+2080-2089, U+2113, U+2116, U+2126, U+212E, U+2150-2151, U+2153-215E, U+2190-2199, U+21A9-21AA, U+21B0-21B3, U+21B6-21B7, U+21BA-21BB, U+21C4, U+21C6, U+2202, U+2206, U+220F, U+2211, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+2713, U+274C, U+2B0E-2B11, U+ECE0, U+EFCC, U+FEFF, U+FFFD; }
:root { --rst-font: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }

.px-rows { --rst-cols: minmax(0, 1fr) auto; }
.px-entries { --rst-cols: minmax(0, 3fr) minmax(0, 1fr) 7.5rem 7rem; }
.px-entries-trash { --rst-cols: minmax(0, 3fr) minmax(0, 1fr) 7.5rem 7rem var(--rst-col-menu); }
.px-undo { margin: 0 0 var(--rst-sp-3); }
.px-trash-note { align-items: center; color: var(--rst-text-muted); display: flex; flex-wrap: wrap; font-size: var(--rst-fs-sm); gap: var(--rst-sp-2); justify-content: space-between; }
.px-people { --rst-cols: minmax(0, 2fr) minmax(0, 2fr) 6.5rem; }
.px-invites { --rst-cols: minmax(0, 2fr) minmax(0, 2fr) var(--rst-col-menu); }
.px-terms { --rst-cols: minmax(0, 2fr) minmax(0, 2fr) 4rem; }
.px-access { --rst-cols: minmax(0, 1fr) minmax(0, 1.5fr) minmax(0, 3fr); }
.px-access-members { --rst-cols: minmax(0, 1fr) minmax(0, 3fr); }
.px-revisions { --rst-cols: minmax(0, 1fr) auto; }
.px-depth { color: var(--rst-text-faint); }
.px-note { margin-block: var(--rst-sp-2) var(--rst-sp-4); }
.px-hint { color: var(--rst-text-muted); }

/* The editor: words on the left, publishing on the right, one column on
   a phone. */
.px-editor { display: grid; gap: var(--rst-sp-4); grid-template-columns: minmax(0, 1fr); max-inline-size: none; }
@media (min-width: 64rem) {
  .px-editor { align-items: start; grid-template-columns: minmax(0, 1fr) 20rem; }
  .px-editor-side { position: sticky; top: var(--rst-sp-4); }
}
.px-editor-main, .px-editor-side { display: grid; gap: var(--rst-sp-4); }
.px-side-title { font-size: var(--rst-fs-base); margin: 0 0 var(--rst-sp-3); }
.px-actions { display: grid; gap: var(--rst-sp-2); margin-block-start: var(--rst-sp-3); }
.px-body-field textarea { font-family: var(--rst-font); font-size: 1rem; inline-size: 100%; line-height: 1.6; min-block-size: 24rem; }
.px-cats { border: 0; display: grid; gap: 0.35rem; margin: 0 0 var(--rst-sp-3); padding: 0; }
.px-cats legend { font-weight: 600; margin-block-end: var(--rst-sp-2); padding: 0; }
.px-cat { align-items: center; display: flex; gap: 0.5rem; }
.px-depth-1 { padding-inline-start: 1.25rem; }
.px-depth-2 { padding-inline-start: 2.5rem; }
.px-depth-3 { padding-inline-start: 3.75rem; }

.px-rev-when, .px-rev-title { margin: 0 0 0.25rem; }

.px-comments { display: grid; gap: var(--rst-sp-3); }
.px-comment-meta { color: var(--rst-text-muted); font-size: var(--rst-fs-sm); margin: 0 0 var(--rst-sp-2); }
.px-comment-body { margin: 0 0 var(--rst-sp-3); white-space: pre-line; }
.px-comment-actions { align-items: center; display: flex; flex-wrap: wrap; gap: var(--rst-sp-2); }
.px-comment-actions form { margin: 0; }

.px-media-grid { display: grid; gap: var(--rst-sp-3); grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); list-style: none; margin: 0 0 var(--rst-sp-4); padding: 0; }
.px-media-grid a { background: var(--rst-surface); border: 1px solid var(--rst-line); border-radius: var(--rst-radius); color: var(--rst-text); display: grid; font-size: var(--rst-fs-sm); gap: 0.25rem; overflow: hidden; padding-block-end: var(--rst-sp-2); text-decoration: none; }
.px-media-grid a:hover { border-color: var(--rst-accent); }
.px-media-grid img { aspect-ratio: 4 / 3; background: var(--rst-surface-2); inline-size: 100%; object-fit: cover; }
.px-media-grid span { overflow: hidden; padding-inline: var(--rst-sp-2); text-overflow: ellipsis; white-space: nowrap; }
.px-media-noalt { color: var(--rst-tone-warning-fg); }
.px-media-preview { margin: 0 0 var(--rst-sp-4); }
.px-media-preview img { block-size: auto; border-radius: var(--rst-radius); max-block-size: 28rem; max-inline-size: 100%; }

.px-themes, .px-permalinks { border: 0; display: grid; gap: var(--rst-sp-2); margin: 0 0 var(--rst-sp-3); padding: 0; }
.px-themes legend, .px-permalinks legend { font-weight: 600; margin-block-end: var(--rst-sp-2); padding: 0; }
.px-theme, .px-permalink { align-items: baseline; border: 1px solid var(--rst-line); border-radius: var(--rst-radius-sm); display: flex; gap: 0.6rem; padding: 0.6rem 0.75rem; }
.px-theme:has(input:checked), .px-permalink:has(input:checked) { background: var(--rst-accent-soft); border-color: var(--rst-accent); }
