/* Yendi & Partner: shared website/cockpit assets; font licenses in ./fonts. */
@font-face {
  font-family: Inter; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("fonts/8e9860b6e62d6359-s.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: Inter; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("fonts/e4af272ccee01ff0-s.p.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Playfair Display"; font-style: normal; font-weight: 400 900; font-display: swap;
  src: url("fonts/28a2004cf8372660-s.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Playfair Display"; font-style: normal; font-weight: 400 900; font-display: swap;
  src: url("fonts/eaead17c7dbfcd5d-s.p.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  --ink: #2D2D2D; --muted: #626872; --nav: #0D1526; --blue: #1A2B5E;
  --gold: #C9A84C; --cream: #F5F0E8; --canvas: #F5F5F5; --line: #E1E5EB;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}
h1, h2, .brand > span { font-family: "Playfair Display", Georgia, serif; color: var(--blue); }
h1, .page-heading h1 { font-size: 32px; font-weight: 600; letter-spacing: -.4px; }
h2 { font-weight: 600; }
.sidebar { background: white; color: var(--blue); border-right: 1px solid var(--line); }
.sidebar .brand { gap: 10px; padding: 0 4px 22px; letter-spacing: 0; }
.brand-image { display: block; flex-shrink: 0; object-fit: contain; border-radius: 8px; }
.brand > span { font-size: 17px; font-weight: 600; line-height: 1.3; }
.brand small { color: #6F5928; font: 500 12px/1.5 Inter, sans-serif; margin-top: 4px; }
.sidebar nav a { color: var(--ink); border-radius: 8px; }
.sidebar nav a:hover { background: #F5F5F5; color: var(--blue); text-decoration: none; }
.sidebar nav a[aria-current] { color: var(--blue); background: #F7F2E5; box-shadow: inset 3px 0 var(--gold); font-weight: 600; }
.sidebar nav span { color: #6F7785; }
.sidebar nav a[aria-current] span { color: #806421; }
.nav-divider { background: var(--line); }
.sidebar-footer { color: var(--muted); }
.sidebar-footer .dot { background: #1A7A3C; }
.topbar { border-top: 3px solid var(--gold); }
.client-context select { background: #F5F5F5; color: var(--blue); border-radius: 8px; }
.pill { background: var(--cream); color: #605338; border-color: #DCD2BD; }
.primary { background: var(--gold); color: var(--nav); border-color: var(--gold); }
.primary:hover { background: #B8923E; border-color: #B8923E; filter: none; }
.secondary { color: var(--blue); border-color: #C3C9D3; border-radius: 8px; }
button, .button { border-radius: 8px; }
button:disabled { cursor: not-allowed; }
:focus-visible { outline-color: var(--blue); }
.workflow-notice { background: var(--cream); border-color: #E4DCCF; border-radius: 12px; padding: 0; gap: 0; overflow: hidden; flex-wrap: nowrap; }
.workflow-copy { flex: 1; padding: 22px 24px; min-width: 0; }
.workflow-copy strong { color: var(--blue); font-size: 16px; }
.workflow-copy p { margin: 6px 0 14px; line-height: 1.6; }
.workflow-copy button { margin: 0; padding: 8px 13px; background: white; font-size: 12px; }
.workflow-art { width: 176px; height: 100%; min-height: 168px; align-self: stretch; object-fit: cover; object-position: 16% center; }
.overview-tabs a[aria-current] { border-bottom-color: var(--gold); }
.overview-tabs span { background: #E9E5DC; color: var(--blue); }
.table-wrap, .panel, .connection-list, .welcome { border-radius: 8px; }
th { background: #FAFAF9; color: #595F6A; }
td { border-bottom-color: var(--line); font-variant-numeric: tabular-nums; }
.empty-icon, .document-symbol { color: #8A7440; }
.empty strong { color: var(--blue); }
.search-field, input:not([type=checkbox]), select, textarea { border-color: #BBC1CB; border-radius: 8px; }
.search-field:focus-within { outline: 2px solid var(--blue); outline-offset: 2px; }
.search-field input[type=search]:focus-visible { outline: none; }
.notice:not(.danger):not(.success) { background: #EDF0F6; border-left-color: var(--blue); }
.upload-dialog { border-radius: 16px; border-color: var(--line); box-shadow: 0 20px 60px rgb(13 21 38 / 25%); }
.upload-dialog::backdrop { background: rgb(13 21 38 / 48%); }
.dialog-heading { padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.dialog-heading h2 { font-size: 26px; }
.upload-guidance { background: var(--cream); border-left: 3px solid var(--gold); border-radius: 8px; }
.dropzone { background: #FAFAF9; border-color: #B8BDC6; border-radius: 8px; }
.dropzone.dragover { background: #F7F2E5; border-color: var(--blue); }
.upload-symbol { color: #806421; }
.login-page { min-height: 100dvh; padding: 9vh 20px; background: linear-gradient(rgb(13 21 38 / 62%), rgb(13 21 38 / 76%)), url("brand/hero-kanzlei.png") center/cover fixed; }
.login-page .login { width: min(490px, 100%); margin: 0 auto; padding: 32px; border-radius: 16px; box-shadow: 0 16px 48px rgb(13 21 38 / 24%); }
.login-page .brand { letter-spacing: 0; }
.login-page .brand > span { font-size: 22px; }
.login-page .brand-image { width: 72px; height: 72px; }
@media (max-width: 760px) {
  h1, .page-heading h1 { font-size: 29px; }
  .sidebar { border-right: 0; border-bottom: 1px solid var(--line); }
  .sidebar .brand { padding: 0 6px 14px; }
  .sidebar .brand-image { width: 48px; height: 48px; }
  .sidebar nav a { font-size: 13px; }
  .workflow-copy { padding: 20px; }
  .workflow-art { width: 112px; }
  .dialog-heading h2 { font-size: 24px; }
}
@media (max-width: 480px) {
  .workflow-art { display: none; }
  .topbar { height: auto; min-height: 64px; padding-top: 10px; padding-bottom: 10px; flex-wrap: wrap; }
  .client-context { flex-basis: 100%; }
  .login-page { padding: 5vh 12px; }
  .login-page .login { padding: 24px; }
}

/* Seiteneditor: Kanzleifarben, klare Papierflächen und sichtbare Tastaturbedienung. */
.page-editor { padding: 26px; }
.page-editor .eyebrow { color: var(--gold, #a98735); text-transform: uppercase; letter-spacing: .12em; font-size: .76rem; font-weight: 700; }
.page-editor .page-heading { margin-bottom: 12px; }
.layout-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 12px 0; }
.layout-toolbar select { width: auto; min-width: 170px; margin: 0; }
.layout-toolbar button { margin: 0; }
.layout-toolbar [data-selection-count] { min-width: 150px; font-size: .9rem; }
.layout-savebar { padding: 14px 0; border-top: 1px solid #dce1ea; border-bottom: 1px solid #dce1ea; }
.layout-savebar p { flex: 1 1 240px; margin: 0; font-size: .9rem; }
.page-editor-workspace { display: grid; grid-template-columns: minmax(330px, 1.1fr) minmax(270px, 1fr); gap: 24px; align-items: start; }
.page-groups { min-width: 0; }
.page-group { border: 1px solid #cbd4e1; border-radius: 10px; padding: 16px; margin: 0 0 18px; background: #fafbfd; }
.page-group.changed { border-left: 4px solid #b28a30; }
.page-group.drag-target { outline: 3px solid #b28a30; background: #fff9e9; }
.page-group-heading { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.page-group-heading h3 { flex: 1 1 80px; margin: 0; }
.page-group-heading button { margin: 0; padding: 7px 10px; font-size: .78rem; min-height: 36px; }
.page-group .hint { margin: 10px 0; overflow-wrap: anywhere; }
.page-tiles { display: flex; flex-wrap: wrap; gap: 10px; min-height: 100px; padding: 10px 0 16px; }
.page-tile { width: 142px; border: 2px solid #dce1ea; border-radius: 7px; background: #fff; padding: 7px; }
.page-tile[draggable=true] { cursor: grab; }
.page-tile.selected { border-color: #8a691d; background: #fff6dd; }
.page-selection { display: flex; align-items: center; gap: 6px; font-size: .8rem; margin: 0 0 6px; }
.page-selection input { width: 20px; height: 20px; margin: 0; accent-color: #1a2b5e; }
.page-thumbnail { display: block; width: 100%; padding: 0; margin: 0; border: 1px solid #dce1ea; background: white; border-radius: 2px; }
.page-thumbnail[aria-pressed=true] { outline: 2px solid #1a2b5e; outline-offset: 1px; }
.page-thumbnail img { display: block; width: 100%; height: 160px; object-fit: contain; }
.page-arrows { display: flex; justify-content: space-between; gap: 8px; padding-top: 6px; }
.page-arrows button { margin: 0; min-height: 32px; padding: 3px 12px; }
.page-editor-preview { position: sticky; top: 20px; background: #e9edf4; padding: 16px; border-radius: 10px; min-width: 0; max-height: 84vh; overflow: auto; }
.page-editor-preview h3 { margin: 0; }
.page-editor-preview img { display: block; background: #fff; width: 100%; height: auto; box-shadow: 0 2px 8px #1a2b5e20; }
.page-editor button:disabled { cursor: default; opacity: .5; }
.page-editor button:focus-visible, .page-editor input:focus-visible, .page-editor select:focus-visible { outline: 3px solid #896715; outline-offset: 3px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 1100px) { .page-editor-workspace { grid-template-columns: 1fr; } .page-editor-preview { position: static; max-height: none; } }
@media (max-width: 650px) { .page-editor { padding: 14px; } .layout-toolbar button, .layout-toolbar select { flex: 1 1 150px; } .page-tile { width: 125px; } }

.page-preview-dialog { width: min(900px, calc(100vw - 28px)); max-height: calc(100dvh - 28px); padding: 18px; border: 1px solid #cbd4e1; border-radius: 12px; color: #1a2b5e; overflow: auto; }
.page-preview-dialog::backdrop { background: rgb(13 21 38 / 55%); }
.page-preview-dialog .dialog-heading { position: sticky; top: -18px; background: #fff; z-index: 1; gap: 12px; padding-top: 12px; }
.page-preview-dialog .dialog-heading h2 { font-size: 22px; margin: 0; }
.page-preview-dialog img { display: block; width: 100%; height: auto; }
@media (max-width: 1100px) { .page-editor-preview { display: none; } }

/* Belegtyp-Aufgaben öffnen einen gemeinsamen, bildorientierten Sortierarbeitsplatz. */
.sorting-task-table tr[data-task-url] { cursor: pointer; }
.sorting-task-table tr[data-task-url]:hover { background: #f6f3e9; }
.task-action { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 20px; background: #efedf6; color: #26325b; font-weight: 700; white-space: nowrap; }
.sorting-dialog { --sort-page-width: 220px; width: calc(100vw - 48px); max-width: 1800px; height: calc(100dvh - 48px); max-height: none; padding: 0; border: 1px solid #cbd1dd; border-radius: 14px; color: #242b4b; background: #f4f5f7; overflow: auto; }
.sorting-dialog::backdrop { background: rgb(17 23 38 / 52%); }
.sorting-heading { position: sticky; top: 0; z-index: 4; display: flex; align-items: center; gap: 28px; padding: 18px 26px; background: #fff; border-bottom: 1px solid #d4d9e2; }
.sorting-heading h1 { font-size: 28px; margin: 0; }
.sorting-heading p { margin: 4px 0; font-size: .85rem; }
.sorting-heading .eyebrow { color: #716335; }
.sorting-zoom { display: flex; align-items: center; gap: 10px; margin-left: auto; font-size: .9rem; }
.sorting-zoom input { width: 150px; margin: 0; accent-color: #27315a; }
.sorting-zoom output { min-width: 52px; }
.sorting-body { display: grid; grid-template-columns: 205px minmax(0,1fr); }
.sorting-files { padding: 22px 16px; background: #eceef2; border-right: 1px solid #d4d9e2; }
.sorting-files h2 { font-size: 16px; margin: 0 0 18px; }
.sorting-files a { display: block; padding: 12px; margin-bottom: 10px; color: #253251; border: 1px solid transparent; border-radius: 8px; overflow-wrap: anywhere; }
.sorting-files a[aria-current=page] { background: #fff; border-color: #b89a47; box-shadow: 0 2px 5px #202c4e12; }
.sorting-files small { display: block; margin-top: 5px; font-size: .78rem; }
.sorting-canvas { padding: 22px; min-width: 0; }
.sorting-file-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.sorting-file-heading h2 { margin: 0 0 12px; font-size: 20px; overflow-wrap: anywhere; }
.sorting-dialog .page-editor { padding: 0; box-shadow: none; border: 0; background: transparent; }
.sorting-dialog .page-editor > .page-heading h2 { font-size: 19px; }
.sorting-dialog .page-editor > p.notice { padding: 10px 14px; font-size: .8rem; }
.sorting-dialog .page-editor-workspace { display: block; }
.sorting-dialog .page-editor-preview { display: none; }
.sorting-dialog .page-groups { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 20px; }
.sorting-dialog .page-group { min-width: 0; max-width: 100%; margin: 0; padding: 12px; border-top: 5px solid #27315a; background: #fff; box-shadow: 0 3px 8px #202c4e12; }
.sorting-dialog .page-group.changed { border-top-color: #b28a30; }
.sorting-dialog .page-group-heading { max-width: 640px; }
.sorting-dialog .page-group-heading h3 { font-size: 16px; }
.sorting-dialog .page-group .hint { max-width: 620px; font-size: .8rem; }
.sorting-dialog .page-tiles { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; align-items: stretch; padding-bottom: 10px; }
.sorting-dialog .page-tile { position: relative; width: min(var(--sort-page-width),calc(100vw - 130px)); flex-shrink: 0; border-width: 1px; border-radius: 3px; }
.sorting-dialog .page-thumbnail img { height: calc(var(--sort-page-width) * 1.4); }
.page-boundary { font-size: .74rem; padding: 5px 8px; min-height: 32px; margin-bottom: 8px; }
.sorting-dialog .layout-savebar { background: #fff; border-radius: 8px; padding: 12px; }
@media (max-width: 900px) {
  .sorting-dialog { width: calc(100vw - 16px); height: calc(100dvh - 16px); }
  .sorting-heading { padding: 14px; flex-wrap: wrap; gap: 12px; }
  .sorting-heading h1 { font-size: 23px; }
  .sorting-zoom { margin-left: 0; order: 3; flex-basis: 100%; }
  .sorting-heading > a { margin-left: auto; }
  .sorting-body { grid-template-columns: minmax(0,1fr); }
  .sorting-files { display: flex; gap: 8px; overflow-x: auto; padding: 10px; border-right: 0; border-bottom: 1px solid #d4d9e2; }
  .sorting-files h2, .sorting-files p { display: none; }
  .sorting-files a { flex: 0 0 175px; margin-bottom: 0; }
  .sorting-canvas { padding: 12px; }
}
.sorting-help { font-size: .85rem; margin: 0 0 12px; }
.sorting-help > summary { color: #26325b; cursor: pointer; padding: 8px 0; }
.sorting-dialog .page-editor > .page-heading .eyebrow, .sorting-dialog .page-editor > .page-heading h2 { display: none; }
.sorting-dialog .page-editor > .page-heading { margin-bottom: 6px; }
.sorting-dialog .page-editor > .page-heading p { margin: 4px 0; }
@media (max-width: 900px) {
  .sorting-files a strong { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .sorting-files a { padding: 9px; }
}