/* webhaus Redaktion – Optik angelehnt an wp-admin (Leiste links #1d2327, Inhalt #f0f0f1, Kästen weiß, Primär #2271b1) */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: #f0f0f1; color: #1d2327;
  font: 14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}
a { color: #2271b1; }
a:hover { color: #135e96; }
h1, h2, h3 { color: #1d2327; }
.boot { padding: 40px; text-align: center; color: #50575e; }
.hidden { display: none !important; }
.muted { color: #646970; }
.small { font-size: 12px; }
.nowrap { white-space: nowrap; }
svg.ic { width: 20px; height: 20px; fill: currentColor; vertical-align: middle; flex: none; }

/* ---- Rahmen ---- */
#adminbar {
  position: fixed; top: 0; left: 0; right: 0; height: 32px; z-index: 50; display: flex; align-items: center; gap: 4px;
  background: #1d2327; color: #f0f0f1; font-size: 13px; padding: 0 8px 0 0;
}
#adminbar a, #adminbar button { color: #f0f0f1; text-decoration: none; background: none; border: 0; font: inherit; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 10px; }
#adminbar a:hover, #adminbar button:hover { background: #2c3338; color: #72aee6; }
#adminbar .grow { flex: 1; }
#adminbar .site-name { font-weight: 600; }
#adminbar .menu-toggle { display: none; }
#adminbar .jobstate { font-size: 12px; opacity: .9; }
#adminbar .jobstate.warn { color: #f0c33c; }
#adminbar .jobstate.err { color: #ff8085; }
#adminbar .user { color: #c3c4c7; padding: 0 6px; }

#adminmenu {
  position: fixed; top: 32px; bottom: 0; left: 0; width: 160px; z-index: 40; background: #1d2327; overflow-y: auto; padding: 12px 0;
}
#adminmenu a { display: flex; align-items: center; gap: 8px; color: #f0f0f1; text-decoration: none; padding: 8px 12px; font-size: 14px; line-height: 18px; }
#adminmenu a:hover { background: #2271b1; color: #fff; }
#adminmenu a.current { background: #2271b1; color: #fff; font-weight: 600; position: relative; }
#adminmenu a.current::after { content: ""; position: absolute; right: 0; top: 50%; margin-top: -8px; border: 8px solid transparent; border-right-color: #f0f0f1; }
#adminmenu .sep { height: 1px; background: #3c434a; margin: 10px 0; }
#adminmenu svg.ic { opacity: .75; }
#adminmenu a.current svg.ic, #adminmenu a:hover svg.ic { opacity: 1; }

#content { margin: 32px 0 0 160px; padding: 10px 20px 60px; min-height: calc(100vh - 32px); }
.wrap { max-width: 1280px; }
.wrap > h1, .page-title { font-size: 23px; font-weight: 400; margin: 12px 0 14px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.subtitle { margin: -8px 0 14px; color: #50575e; }

/* ---- Bedienelemente ---- */
.button {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 32px; padding: 0 12px; margin: 0;
  border: 1px solid #2271b1; border-radius: 3px; background: #f6f7f7; color: #2271b1; font: inherit; font-size: 13px; line-height: 1.2;
  cursor: pointer; text-decoration: none; white-space: nowrap; -webkit-appearance: none; appearance: none;
}
.button:hover { background: #f0f0f1; border-color: #0a4b78; color: #0a4b78; }
.button:focus-visible { outline: 2px solid #2271b1; outline-offset: 1px; }
.button-primary { background: #2271b1; border-color: #2271b1; color: #fff; }
.button-primary:hover { background: #135e96; border-color: #135e96; color: #fff; }
.button-large { min-height: 38px; padding: 0 16px; font-size: 14px; }
.button[disabled], .button.disabled { opacity: .55; cursor: default; pointer-events: none; }
.button-small { min-height: 26px; padding: 0 8px; font-size: 12px; }
.button-link { background: none; border: 0; color: #2271b1; text-decoration: underline; cursor: pointer; font: inherit; padding: 0; }
.button-link:hover { color: #135e96; }
.button-link-delete, .delete-link { color: #b32d2e !important; }
.button-link-delete:hover { color: #8a2424 !important; }
.icon-btn { background: none; border: 1px solid transparent; border-radius: 3px; color: #50575e; cursor: pointer; min-width: 32px; min-height: 32px;
  display: inline-flex; align-items: center; justify-content: center; font-size: 16px; padding: 0 6px; }
.icon-btn:hover { border-color: #c3c4c7; background: #f6f7f7; color: #1d2327; }
.icon-btn.danger:hover { color: #b32d2e; border-color: #b32d2e; }
.icon-btn[disabled] { opacity: .35; pointer-events: none; }
.page-title-action { font-size: 13px; }

input[type=text], input[type=search], input[type=password], input[type=number], input[type=date], input[type=datetime-local], select, textarea {
  font: inherit; font-size: 14px; color: #2c3338; background: #fff; border: 1px solid #8c8f94; border-radius: 4px;
  min-height: 34px; padding: 3px 8px; max-width: 100%;
}
textarea { min-height: 80px; width: 100%; }
input:focus, select:focus, textarea:focus { border-color: #2271b1; box-shadow: 0 0 0 1px #2271b1; outline: 2px solid transparent; }
input.wide, select.wide { width: 100%; }
label.field { display: block; font-weight: 600; margin: 10px 0 4px; }
.field-row { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: flex-end; }
.field-row > div { display: flex; flex-direction: column; gap: 4px; }
.field-row label { font-weight: 600; font-size: 13px; }
.check { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; min-height: 32px; }
.check input { width: 18px; height: 18px; margin: 0; }
.hint { font-size: 12px; color: #646970; margin: 4px 0 0; }

/* ---- Kästen ---- */
.postbox, .card { background: #fff; border: 1px solid #c3c4c7; box-shadow: 0 1px 1px rgba(0, 0, 0, .04); margin: 0 0 20px; }
.postbox > h2, .card-head { font-size: 14px; font-weight: 600; margin: 0; padding: 10px 12px; border-bottom: 1px solid #c3c4c7;
  display: flex; align-items: center; gap: 8px; }
.postbox .inside, .card-body { padding: 12px; }
.card-head .grow { flex: 1; min-width: 0; }
.card-head .title-preview { font-weight: 400; color: #50575e; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-head .grow .title-preview { display: block; }
.main, .side, .card, .postbox { min-width: 0; }

.notice { background: #fff; border: 1px solid #c3c4c7; border-left: 4px solid #72aee6; box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
  margin: 6px 0 16px; padding: 8px 12px; }
.notice p { margin: 4px 0; }
.notice ul { margin: 4px 0; padding-left: 20px; }
.notice-error { border-left-color: #d63638; }
.notice-success { border-left-color: #00a32a; }
.notice-warning { border-left-color: #dba617; }
.notice-info { border-left-color: #72aee6; }

/* ---- Editor-Spalten ---- */
.columns { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 20px; align-items: start; }
.side { position: sticky; top: 52px; }
.titlewrap input { width: 100%; font-size: 1.6em; padding: 6px 10px; min-height: 46px; }
.permalink { margin: 8px 0 14px; font-size: 13px; color: #50575e; word-break: break-all; }
.slugrow { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: -6px 0 14px; font-size: 13px; }
.slugrow input { min-height: 28px; font-size: 13px; flex: 1; min-width: 200px; max-width: 520px; }

/* Veröffentlichen-Kasten */
.pubbox .misc { padding: 10px 12px; border-bottom: 1px solid #dcdcde; display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.pubbox .misc b { font-weight: 600; }
.pubbox .minor { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; padding: 10px 12px; }
.pubbox .major { background: #f6f7f7; border-top: 1px solid #dcdcde; padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.pubbox .progress { padding: 10px 12px; border-top: 1px solid #dcdcde; font-size: 13px; }
.vd-laden { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 12px 0; }
.vd-laden p { margin: 4px 0; }
.vd-spinner { width: 44px; height: 44px; border-width: 4px; margin-bottom: 10px; }
.vd-text { font-size: 16px; font-weight: 600; }
.vd-link { text-align: center; margin: 18px 0; }
.pubbox .livebox { padding: 10px 12px; border-top: 3px solid #d63638; background: #fcf9e8; font-size: 13px; }
.pubbox .livebox h3 { margin: 0 0 6px; font-size: 14px; }
.pubbox .livebox p { margin: 6px 0; }
.pubbox .livebox .live-offen { color: #8a2424; font-weight: 600; }
.pubbox .live-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; margin-top: 8px; }
.pubbox .live-btn:not(:disabled) { background: #d63638; border-color: #b32d2e; }
.pubbox .live-btn:not(:disabled):hover { background: #b32d2e; }
.steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.steps li { display: flex; gap: 8px; align-items: flex-start; }
.steps .dot { width: 18px; height: 18px; border-radius: 50%; flex: none; margin-top: 1px; display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; color: #fff; background: #c3c4c7; }
.steps .ok .dot { background: #00a32a; }
.steps .run .dot { background: #2271b1; animation: pulse 1.2s infinite; }
.steps .wait .dot { background: #dba617; }
.steps .err .dot { background: #d63638; }
@keyframes pulse { 50% { opacity: .45; } }
.saving { color: #646970; font-size: 12px; }
.spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid #c3c4c7; border-top-color: #2271b1; border-radius: 50%; animation: spin .8s linear infinite; vertical-align: middle; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Versionen */
.versions { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.versions li { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px solid #f0f0f1; }
.versions li:last-child { border-bottom: 0; }
.versions .cur { color: #00a32a; font-weight: 600; font-size: 12px; }

/* ---- Tagesmenüs ---- */
.weekhead { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.weekhead .range { font-size: 15px; font-weight: 600; }
.day.ruhetag .card-head { background: #f6f7f7; }
.day .chip, .chip { font-size: 12px; font-weight: 400; border-radius: 10px; padding: 1px 8px; background: #f0f6fc; color: #135e96; border: 1px solid #c5d9ed; white-space: nowrap; }
.chip.grey { background: #f6f7f7; color: #50575e; border-color: #dcdcde; }
.chip.orange { background: #fcf9e8; color: #8a6d00; border-color: #f0d983; }
.chip.red { background: #fcf0f1; color: #8a2424; border-color: #f0b8b9; }
.chip.green { background: #edfaef; color: #00701a; border-color: #b8e6bf; }
.lines { display: flex; flex-direction: column; gap: 6px; margin: 6px 0; }
.lines .line { display: flex; gap: 6px; align-items: center; }
.lines .line input { flex: 1; min-width: 0; }
.addrow { margin-top: 4px; }
.daygrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 20px; }
@media (min-width: 1300px) { .daygrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---- Reiter ---- */
.tabcard .card-head { cursor: pointer; }
.tabcard .card-head .tw { transition: transform .15s; display: inline-block; color: #646970; }
.tabcard.open .card-head .tw { transform: rotate(90deg); }

/* ---- Liste (Beiträge) ---- */
.subsubsub { list-style: none; margin: 4px 0 10px; padding: 0; display: flex; flex-wrap: wrap; gap: 4px; font-size: 13px; color: #646970; }
.subsubsub a { text-decoration: none; }
.subsubsub a.current { color: #000; font-weight: 600; }
.subsubsub li + li::before { content: "|"; margin-right: 4px; color: #a7aaad; }
.tablenav { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; margin: 6px 0; }
.wp-list-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid #c3c4c7; box-shadow: 0 1px 1px rgba(0, 0, 0, .04); }
.wp-list-table th, .wp-list-table td { text-align: left; padding: 9px 10px; vertical-align: top; font-size: 13px; }
.wp-list-table thead th { border-bottom: 1px solid #c3c4c7; font-weight: 400; color: #2c3338; }
.wp-list-table tbody tr:nth-child(odd) { background: #f6f7f7; }
.wp-list-table .row-title { font-weight: 600; font-size: 14px; text-decoration: none; }
.wp-list-table .post-state { font-weight: 600; color: #50575e; }
.row-actions { font-size: 12px; color: #a7aaad; margin-top: 4px; visibility: hidden; display: flex; gap: 6px; flex-wrap: wrap; }
.row-actions a, .row-actions button { font-size: 12px; }
tr:hover .row-actions, tr:focus-within .row-actions { visibility: visible; }
.pagination { display: flex; gap: 4px; align-items: center; font-size: 13px; }
.empty { padding: 20px; text-align: center; color: #646970; }

/* Beitragsbild */
.featured img { max-width: 100%; height: auto; display: block; border: 1px solid #dcdcde; background: #f6f7f7; }
.featured .actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }

/* ---- Seitenwahl ---- */
.sites { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.sites a.card { display: block; padding: 18px; text-decoration: none; color: #1d2327; }
.sites a.card:hover { border-color: #2271b1; }
.sites .name { font-size: 18px; font-weight: 600; margin-bottom: 4px; }

/* ---- Login ---- */
.login { min-height: 100vh; display: flex; align-items: flex-start; justify-content: center; padding: 8vh 16px 40px; }
.login .box { width: 100%; max-width: 340px; }
.login h1 { text-align: center; font-size: 22px; font-weight: 600; margin: 0 0 20px; }
.login h1 span { color: #2271b1; }
.login form { background: #fff; border: 1px solid #c3c4c7; box-shadow: 0 1px 3px rgba(0, 0, 0, .04); padding: 24px; }
.login label { display: block; margin-bottom: 4px; }
.login input[type=password], .login input[type=text] { width: 100%; font-size: 20px; min-height: 42px; margin-bottom: 16px; }
.login input[type=text] { margin-bottom: 2px; }
.login .login-hint { margin: 0 0 14px; }
.login .submit { display: flex; justify-content: flex-end; }
.login .foot { text-align: center; color: #50575e; font-size: 13px; margin-top: 16px; }

/* ---- Dialoge ---- */
.modal-bg { position: fixed; inset: 0; background: rgba(0, 0, 0, .7); z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.modal { background: #fff; width: 100%; max-width: 560px; max-height: calc(100vh - 32px); display: flex; flex-direction: column; box-shadow: 0 5px 15px rgba(0, 0, 0, .7); }
.modal.wide { max-width: 1000px; height: calc(100vh - 32px); }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 0 0 0 16px; border-bottom: 1px solid #dcdcde; min-height: 50px; }
.modal-head h2 { font-size: 20px; font-weight: 600; margin: 0; }
.modal-body { padding: 16px; overflow: auto; flex: 1; }
.modal-foot { padding: 12px 16px; border-top: 1px solid #dcdcde; display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; align-items: center; }
.modal-foot .grow { flex: 1; }

/* Mediathek (Seite + Dialog) */
.dropzone { border: 2px dashed #c3c4c7; background: #fff; padding: 12px 16px; text-align: center; margin-bottom: 12px; color: #50575e; }
.modal .dropzone { background: none; }
.dropzone.over { border-color: #2271b1; background: #f0f6fc; }
.dropzone .dz-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: center; }
.dropzone .hint { margin-top: 6px; }
.upload-status:not(:empty) { margin-top: 8px; color: #1d2327; }
.media-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 12px; }
.media-toolbar input[type=search] { flex: 1 1 200px; max-width: 320px; margin-left: auto; }
.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.media-grid > .empty, .media-grid > .notice, .media-grid > p { grid-column: 1 / -1; }
.media-cell { position: relative; min-width: 0; }
.media-item { position: relative; width: 100%; border: 1px solid #dcdcde; background: #f6f7f7; aspect-ratio: 1; cursor: pointer; padding: 0; overflow: hidden;
  display: flex; align-items: center; justify-content: center; font: inherit; color: #1d2327; }
.media-item:focus-visible { outline: 2px solid #2271b1; outline-offset: 1px; }
.media-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.media-item .file { padding: 8px; font-size: 12px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; max-width: 100%; }
.media-item .file svg.ic { width: 40px; height: 40px; color: #8c8f94; }
.media-item .fname { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-word; }
.media-item .badge { position: absolute; left: 4px; top: 4px; background: rgba(255, 255, 255, .9); font-size: 11px; padding: 0 4px; border-radius: 2px; }
.media-cell.sel .media-item { outline: 3px solid #2271b1; outline-offset: -3px; }
.media-check { position: absolute; top: 0; right: 0; width: 36px; height: 36px; padding: 0; border: 0; background: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center; }
.media-check span { width: 22px; height: 22px; border-radius: 3px; border: 2px solid #fff; background: rgba(0, 0, 0, .3); box-shadow: 0 0 0 1px rgba(0, 0, 0, .35);
  display: flex; align-items: center; justify-content: center; color: #fff; font-size: 14px; line-height: 1; }
.media-cell.sel .media-check span { background: #2271b1; }
.media-cell.sel .media-check span::after { content: "✓"; }
.media-check:focus-visible { outline: 2px solid #2271b1; outline-offset: -2px; }
@media (hover: hover) {
  .media-cell:not(.sel) .media-check { opacity: 0; }
  .media-cell:hover .media-check, .media-check:focus-visible { opacity: 1; }
}
.media-more { display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 16px 0 4px; }
.modal-foot .media-info { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.media-details .preview { background: #f6f7f7; border: 1px solid #dcdcde; display: flex; align-items: center; justify-content: center; min-height: 120px; margin-bottom: 12px; }
.media-details .preview img { max-width: 100%; max-height: 50vh; display: block; }
.media-details .file-big { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 20px; word-break: break-all; text-align: center; }
.media-details .file-big svg.ic { width: 64px; height: 64px; color: #8c8f94; }
.media-meta { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 12px; margin: 0; font-size: 13px; }
.media-meta dt { color: #646970; }
.media-meta dd { margin: 0; word-break: break-word; }
.copyrow { display: flex; gap: 6px; }
.copyrow input { flex: 1; min-width: 0; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12px; }
.used-in { margin: 4px 0 8px; padding-left: 20px; }

/* Meldungen */
#toasts { position: fixed; right: 16px; bottom: 16px; z-index: 200000; display: flex; flex-direction: column; gap: 8px; max-width: min(420px, calc(100vw - 32px)); }
.toast { background: #1d2327; color: #fff; padding: 10px 14px; border-radius: 3px; box-shadow: 0 3px 8px rgba(0, 0, 0, .3); font-size: 13px; }
.toast.err { background: #8a2424; }
.toast.ok { background: #00701a; }

/* TinyMCE-Rahmen */
.tox-tinymce { border-radius: 0 !important; border-color: #dcdcde !important; }
.editor-wrap { margin: 6px 0 4px; }
.editor-wrap textarea { min-height: 200px; }

/* ---- Handy ---- */
.mobilebar { display: none; }
@media (max-width: 850px) {
  .columns { grid-template-columns: minmax(0, 1fr); }
  .side { position: static; }
  .mobilebar { display: flex; align-items: center; gap: 8px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; background: #fff;
    border-top: 1px solid #dcdcde; box-shadow: 0 -2px 8px rgba(0, 0, 0, .08); padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); }
  .mobilebar .mb-status { flex: 1; min-width: 0; font-size: 13px; color: #646970; line-height: 1.3; }
  .mobilebar .mb-status.pending { color: #b26200; font-weight: 600; }
  .mobilebar .button { white-space: nowrap; }
  #content { padding-bottom: 96px; }
  #toasts { bottom: 76px; }
}
@media (max-width: 782px) {
  #adminbar { height: 46px; font-size: 14px; }
  #adminbar a, #adminbar button { height: 46px; }
  #adminbar .menu-toggle { display: inline-flex; }
  #adminbar .hide-mobile { display: none; }
  #adminmenu { top: 46px; width: 100%; max-width: 300px; display: none; box-shadow: 4px 0 12px rgba(0, 0, 0, .3); }
  body.menu-open #adminmenu { display: block; }
  #adminmenu a { padding: 12px 16px; font-size: 16px; }
  #content { margin: 46px 0 0; padding: 8px 10px 96px; }
  .wrap > h1, .page-title { font-size: 20px; }
  .button { min-height: 40px; font-size: 14px; }
  .icon-btn { min-width: 40px; min-height: 40px; }
  input[type=text], input[type=search], input[type=password], input[type=number], input[type=date], input[type=datetime-local], select { min-height: 40px; font-size: 16px; }
  .row-actions { visibility: visible; }
  .card-head .title-preview { white-space: normal; }
  .wp-list-table .col-date { display: none; }
  .wp-list-table .mobile-date { display: block !important; }
  .modal.wide { height: calc(100vh - 16px); height: calc(100dvh - 16px); }
  .modal { max-height: calc(100dvh - 16px); }
  .modal-bg { padding: 8px; }
  .modal-body { padding: 12px; }
  .media-grid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 6px; }
  .media-toolbar select { flex: 1 1 40%; }
  .media-toolbar input[type=search] { flex-basis: 100%; max-width: none; margin-left: 0; }
  .modal-foot .media-info { flex-basis: 100%; }
}
@media (hover: none) { .dropzone .dz-text { display: none; } }
.wp-list-table .mobile-date { display: none; font-size: 12px; color: #646970; margin-top: 2px; }

/* FAQ (champs, Modultyp faq) */
.faq-liste { margin: 0 0 28px; }
.faq-liste-titel { font-size: 17px; font-weight: 600; margin: 18px 0 8px; }
.faq-liste-titel .muted { font-weight: 400; }
.faq-twin { margin: 10px 0 12px; }
.faq-twin p { margin: 4px 0; }
/* langer Knopftext („Frage und Antwort auch bei … übernehmen“): .button ist nowrap → Text ragte bei 390 px über den Rand (scrollWidth 420) */
.faq-twin .button { white-space: normal; max-width: 100%; padding-top: 6px; padding-bottom: 6px; text-align: center; }

/* Preise (champs, Modultyp preise) */
.preis-seite { margin: 0 0 28px; }
.preis-spalten { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.preis-spalte { margin-bottom: 12px; }
.phase-row { display: flex; gap: 6px; }
.phase-row input { flex: 1; min-width: 0; }
.phase-row select { flex: none; width: 104px; }
.preis-row { display: flex; flex-wrap: wrap; gap: 0 24px; align-items: flex-start; }
.preis-feld { white-space: nowrap; }
.preis-input { width: 104px; text-align: right; }
input.invalid { border-color: #d63638; box-shadow: 0 0 0 1px #d63638; }
@media (max-width: 1100px) { .preis-spalten { grid-template-columns: minmax(0, 1fr); } }

/* Termine (champs, Modultyp termine) */
.termin-seite { margin: 0 0 28px; }
.termin-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0 0 8px; }
.termin-label { flex: none; width: 112px; font-weight: 600; }
.termin-row input[type=date], .termin-row input[type=time] { min-width: 0; }
.termine-form textarea.wide { width: 100%; }
/* Handy: Bezeichnung über der Zeile, damit „von – bis“ nebeneinander passt (390 px) */
@media (max-width: 600px) { .termin-label { width: 100%; } }

/* Workshops + Trainer (champs, Modultypen workshops/trainer): Liste mit Suche → Formular */
.karten-suche { margin: 0 0 12px; max-width: 520px; }
.karten-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px; }
.karten-gruppe { grid-column: 1 / -1; font-size: 15px; font-weight: 600; margin: 14px 0 2px; }
.karten-liste > .hint { grid-column: 1 / -1; }
.karte-zeile { display: flex; align-items: center; gap: 10px; min-width: 0; width: 100%; padding: 6px; text-align: left; cursor: pointer;
  background: #fff; border: 1px solid #c3c4c7; border-radius: 2px; font: inherit; color: #1d2327; }
.karte-zeile:hover, .karte-zeile:focus-visible { border-color: #2271b1; }
.karte-zeile img, .karte-ohne { flex: 0 0 64px; width: 64px; height: 48px; object-fit: cover; background: #f0f0f1; border-radius: 2px; }
.karte-ohne { display: flex; align-items: center; justify-content: center; font-size: 11px; color: #646970; text-align: center; }
.karte-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.karte-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.karte-unter { font-size: 12px; color: #646970; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.karte-badge { flex: 0 0 auto; font-size: 11px; padding: 2px 6px; border-radius: 9px; background: #fcf0f1; color: #8a2424; white-space: nowrap; }
.karten-kopf { margin: 0 0 8px; }
.karten-titel { font-size: 20px; font-weight: 600; margin: 8px 0 2px; overflow-wrap: anywhere; }
.karten-felder { max-width: 820px; }
.karten-bild img { max-width: 360px; max-height: 270px; width: auto; }
.karten-check { display: flex; align-items: center; gap: 6px; margin: 16px 0 0; font-weight: 600; }
.karten-abw { margin: 8px 0; }
.karten-abw ul { margin: 4px 0 4px 18px; }
.karten-abw .button { white-space: normal; max-width: 100%; }
@media (max-width: 782px) {
  .karten-liste { grid-template-columns: minmax(0, 1fr); }
  .karten-bild img { max-width: 100%; }
}

/* Workshops/Trainer (29.10.2026): Anlegen, Loeschen, Wochenplan, Zuordnung */
.karten-neu { margin: 0 0 12px; }
.karten-neu .button { margin-bottom: 4px; }
.karten-plan { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 4px 0 2px; }
.karten-plan .field { margin: 0; }
.karten-plan select, .karten-plan input[type=number] { min-width: 120px; }
.karten-plan input[type=number] { width: 90px; }
.karten-plan .hint { flex-basis: 100%; margin: 2px 0 0; }
.karten-zuordnung { max-height: 320px; overflow: auto; border: 1px solid #dcdcde; border-radius: 4px; padding: 8px 10px; margin: 4px 0 10px; background: #fff; }
.karten-zuordnung .karten-check { display: block; margin: 2px 0; }
.karten-loeschen { margin: 24px 0 8px; }
.karten-loeschen .button-link-delete { color: #b32d2e; }
@media (max-width: 640px) {
  .karten-plan select, .karten-plan input[type=number] { width: 100%; }
}

/* CAMPS FOR CHAMPS (champs, Modultyp sommercamp, 29.10.2026): ganze Seite + Wochenplan mit Kacheln */
.sc-nav { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 16px; }
.sc-nav a { font-size: 13px; padding: 4px 10px; border: 1px solid #c3c4c7; border-radius: 14px; background: #fff; color: #2271b1; text-decoration: none; }
.sc-nav a:hover { border-color: #2271b1; }
.sc-abschnitt { scroll-margin-top: 56px; }
.sc-felder { max-width: 900px; }
.sc-teil { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; }
.sc-teil-nr { flex: 0 0 auto; font-size: 12px; color: #646970; min-width: 56px; }
.sc-rich-vorschau { display: block; width: 100%; text-align: left; font: inherit; color: #1d2327; background: #f6f7f7; border: 1px dashed #c3c4c7;
  border-radius: 4px; padding: 8px 10px; cursor: text; margin: 0 0 6px; white-space: normal; line-height: 1.45; }
.sc-rich-vorschau:hover { border-color: #2271b1; background: #fff; }
.sc-reiter { border-left: 3px solid #dcdcde; padding: 2px 0 6px 10px; margin: 0 0 12px; }
.sc-extern { margin: 18px 0 0; padding: 12px; background: #f6f7f7; border: 1px solid #dcdcde; border-radius: 4px; }
.sc-extern h3 { font-size: 14px; margin: 0 0 4px; }
.sc-preise { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.sc-preis h4 { margin: 0; font-size: 13px; }
.sc-beschriftung { margin: 0 0 14px; }
.sc-beschriftung summary { cursor: pointer; font-weight: 600; }
.sc-woche { border: 1px solid #c3c4c7; border-radius: 6px; padding: 10px; margin: 0 0 14px; background: #fffdf5; }
.sc-woche-kopf { font-size: 15px; margin: 0 0 8px; }
.sc-woche-datum { color: #646970; font-weight: 400; }
.sc-woche-raster { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; }
.sc-zwei { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.sc-block-kopf { font-weight: 600; text-align: center; border: 2px solid #3c434a; border-radius: 6px; padding: 4px 6px; margin: 0 0 6px; background: #fff; }
.sc-spalte { display: flex; flex-direction: column; gap: 6px; margin: 0 0 8px; }
.sc-spalte-kopf { font-weight: 600; text-align: center; border: 2px solid #3c434a; border-radius: 6px; padding: 3px 6px; background: #fff; font-size: 13px; }
.sc-kachel { display: flex; align-items: center; gap: 2px; background: var(--farbe, #f0f0f1); border-radius: 6px; min-height: 40px; }
.sc-kachel.aus { background: repeating-linear-gradient(45deg, #d5d5d5, #d5d5d5 5px, #e6e6e6 5px, #e6e6e6 10px); }
.sc-kachel.aus .sc-kachel-titel { color: #646970; }
.sc-kachel-titel { flex: 1; min-width: 0; background: none; border: 0; font: inherit; font-weight: 600; color: #3c434a; padding: 8px 6px; cursor: pointer; text-align: center; overflow-wrap: anywhere; }
.sc-kachel-titel:hover { text-decoration: underline; }
.sc-kachel-knoepfe { display: flex; flex-direction: column; }
.sc-kachel-knoepfe .icon-btn { min-height: 20px; min-width: 26px; font-size: 12px; padding: 0 4px; }
.sc-kachel-neu { background: none; border: 1px dashed #8c8f94; border-radius: 6px; color: #2271b1; padding: 6px; cursor: pointer; font: inherit; font-size: 13px; }
.sc-kachel-neu:hover { border-color: #2271b1; background: #fff; }
.sc-nachmittag { background: #fdf3dc; border-radius: 6px; padding: 8px; }
.sc-adventure { margin-top: 4px; }
.sc-farben { display: flex; flex-wrap: wrap; gap: 6px; }
.sc-farbe { background: var(--farbe); border: 2px solid transparent; border-radius: 6px; padding: 6px 10px; font: inherit; font-weight: 600; color: #3c434a; cursor: pointer; }
.sc-farbe.an { border-color: #1d2327; box-shadow: 0 0 0 2px #fff inset; }
.sc-dialog { min-width: min(520px, 80vw); }
@media (max-width: 782px) {
  .sc-woche-raster, .sc-preise { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 480px) {
  .sc-zwei { grid-template-columns: minmax(0, 1fr); }
}

/* Seiten-Formular: Bilderlisten (Galerie, Karussell, Logo-Leiste), mitbearbeitete Seite (29.10.2026) */
.sc-liste-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 4px 0 8px; }
.sc-liste-item { display: flex; flex-direction: column; gap: 4px; background: #f6f7f7; border: 1px solid #dcdcde; border-radius: 4px; padding: 6px; min-width: 0; }
.sc-liste-item img { width: 100%; height: 100px; object-fit: contain; background: #fff; border-radius: 2px; }
.sc-liste-item input { width: 100%; min-height: 28px; font-size: 12px; }
.sc-liste-knoepfe { display: flex; justify-content: space-between; }
.sc-liste-knoepfe .icon-btn { min-height: 26px; min-width: 30px; }
.sc-liste-fuss { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sc-mitseite { font-size: 17px; margin: 30px 0 10px; padding-top: 14px; border-top: 3px solid #c3c4c7; scroll-margin-top: 56px; }
/* Personen-Karten (champs Core-Team) */
.sc-person { background: #f6f7f7; border: 1px solid #dcdcde; border-radius: 4px; padding: 8px 10px 10px; margin: 0 0 12px; }
.sc-person-kopf { display: flex; align-items: center; gap: 6px; margin: 0 0 8px; }
.sc-person-kopf .sc-person-name { flex: 1 1 auto; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-person-kopf .sc-liste-knoepfe { gap: 4px; }
.sc-person-body { display: flex; gap: 12px; align-items: flex-start; }
.sc-person-foto { flex: 0 0 140px; display: flex; flex-direction: column; gap: 6px; }
.sc-person-foto img { width: 140px; height: 140px; object-fit: cover; background: #fff; border-radius: 4px; }
.sc-person-felder { flex: 1 1 auto; min-width: 0; }
@media (max-width: 600px) { .sc-person-body { flex-direction: column; } .sc-person-foto { flex-basis: auto; flex-direction: row; align-items: center; } .sc-person-foto img { width: 96px; height: 96px; } }
@media (max-width: 480px) { .sc-liste-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Menü: Reiter mit Untermenü (modules[].gruppe, champs „Webseiten“, 29.10.2026) */
#adminmenu .menu-gruppe { display: flex; align-items: center; gap: 8px; width: 100%; background: none; border: 0; color: #f0f0f1; cursor: pointer;
  padding: 8px 12px; font: inherit; font-size: 14px; line-height: 18px; text-align: left; }
#adminmenu .menu-gruppe:hover { background: #2271b1; color: #fff; }
#adminmenu .menu-gruppe .grow { flex: 1; }
#adminmenu .menu-gruppe .caret { font-size: 11px; transition: transform .15s; }
#adminmenu .menu-gruppe-wrap.open .menu-gruppe .caret { transform: rotate(90deg); }
#adminmenu .menu-gruppe-wrap.aktiv > .menu-gruppe { color: #fff; font-weight: 600; }
#adminmenu .submenu { display: none; background: #2c3338; padding: 4px 0; }
#adminmenu .menu-gruppe-wrap.open .submenu { display: block; }
#adminmenu .submenu a { padding: 6px 12px 6px 38px; font-size: 13px; }
#adminmenu .submenu a svg.ic { display: none; }
#adminmenu .menu-gruppe svg.ic { opacity: .75; }
@media (max-width: 782px) { #adminmenu .menu-gruppe { padding: 12px 16px; font-size: 16px; } #adminmenu .submenu a { padding: 10px 16px 10px 44px; font-size: 15px; } }
/* Download-Kacheln (ms-stainz Downloads, mod-sommercamp.js downloadsFeld) */
.sc-dl { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 8px; }
.sc-dl-item { background: #f6f7f7; border: 1px solid #dcdcde; border-radius: 4px; padding: 8px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sc-dl-kopf { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.sc-dl-kopf .sc-liste-knoepfe { gap: 4px; }
.sc-dl-fuss { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sc-dl-datei { overflow-wrap: anywhere; font-size: 12px; }

/* ---- Nachvollziehbarkeit (30.10.2026): Versionen vergleichen, Protokoll, Bearbeitungssperre ---- */
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.diff-link { align-self: flex-start; font-size: 13px; }
.versions li { flex-wrap: wrap; }
.versions .v-text { flex: 1 1 140px; }
.versions .v-knoepfe { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.versions-mehr:not(:empty) { margin-top: 8px; font-size: 13px; }
.diff-fassungen { display: flex; gap: 12px; align-items: stretch; flex-wrap: wrap; margin-bottom: 4px; }
.diff-fassung { flex: 1 1 220px; border: 1px solid #dcdcde; background: #f6f7f7; padding: 8px 10px; font-size: 13px; }
.diff-pfeil { align-self: center; color: #50575e; font-size: 18px; }
.diff-list { list-style: none; margin: 0; padding: 0; }
.diff-item { border: 1px solid #dcdcde; border-left: 4px solid #72aee6; background: #fff; padding: 8px 12px; margin: 0 0 10px; }
.diff-item.op-neu { border-left-color: #00a32a; }
.diff-item.op-entfernt { border-left-color: #d63638; }
.diff-item.op-verschoben { border-left-color: #dba617; }
.diff-kopf { display: flex; gap: 8px; align-items: baseline; justify-content: space-between; flex-wrap: wrap; font-size: 13px; margin-bottom: 4px; }
.diff-op { font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: #50575e; }
.diff-op.op-neu { color: #007017; } .diff-op.op-entfernt { color: #b32d2e; }
.diff-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; line-height: 1.6; }
.diff-text del, .diff-list del { background: #ffe9e9; color: #8a2424; text-decoration: line-through; }
.diff-text ins, .diff-list ins { background: #e6f6e6; color: #00450c; text-decoration: none; }
.diff-gap { color: #8c8f94; }
.diff-hinweis { margin-top: 4px; }
.diff-fmt { margin: 6px 0 0; font-size: 13px; color: #50575e; }
.diff-fmt summary { cursor: pointer; }
.diff-fmt ul { margin: 6px 0 0 18px; padding: 0; }
.diff-bilder { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.diff-bild { margin: 0; max-width: 220px; }
.diff-bild img { display: block; max-width: 100%; max-height: 160px; object-fit: contain; background: #f0f0f1; border: 3px solid transparent; }
.diff-bild.vorher img { border-color: #f2b8b8; opacity: .8; }
.diff-bild.nachher img { border-color: #9fd99f; }
.diff-bild.leer { padding: 20px; border: 1px dashed #c3c4c7; }
.protokoll .proto-boxen { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 0 20px; }
.proto-liste { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.proto-liste > li { padding: 6px 0; border-bottom: 1px solid #f0f0f1; }
.proto-liste > li:last-child { border-bottom: 0; }
.proto-live { border-top: 3px solid #d63638; }
.proto-changes { margin: 4px 0 2px 18px; padding: 0; font-size: 12px; color: #3c434a; }
.proto-changes li { margin: 1px 0; }
.proto-table .col-zeit { width: 140px; white-space: nowrap; }
.proto-table .col-wer { width: 180px; }
.proto-table .proto-system td { color: #646970; }
.proto-table .proto-live-row td { background: #fcf0f1; }
.proto-table .proto-zeit-mobil { display: none; }
.row-actions.visible { visibility: visible; }
.proto-mehr { margin: 12px 0; }
.protokoll .tablenav { justify-content: flex-start; }
.protokoll .tablenav .button { margin-left: auto; }
.post-lock { font-size: 12px; color: #8a2424; display: flex; align-items: center; gap: 4px; margin-top: 2px; }
.post-lock .ic { width: 14px; height: 14px; fill: currentColor; }
.live-liste ul { margin: 2px 0 4px 18px; padding: 0; }
.modal .live-liste ul { max-height: 40vh; overflow: auto; }
.wrap.gesperrt .main, .wrap.gesperrt .side { opacity: .55; }
@media (max-width: 782px) {
  .proto-table .col-zeit, .proto-table .col-wer { display: none; }
  .proto-table .proto-zeit-mobil { display: block; }
  .protokoll .proto-boxen { grid-template-columns: minmax(0, 1fr); }
  .diff-pfeil { display: none; }
}

/* ---- KI-Chat (js/mod-ki.js, KI-Seiten) ---- */
.ki { max-width: 900px; }
.ki-lead { margin: -4px 0 12px; }
.ki-list { background: #fff; border: 1px solid #c3c4c7; border-radius: 4px; padding: 14px; height: min(58vh, 560px); min-height: 260px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }
.ki-empty { margin: auto; max-width: 560px; color: #3c434a; }
.ki-empty p { margin: 0 0 10px; }
.ki-msg { max-width: 82%; padding: 9px 12px; border-radius: 8px; line-height: 1.45; overflow-wrap: anywhere; }
.ki-msg.user { align-self: flex-end; background: #e5f1fa; border: 1px solid #b8d9ef; }
.ki-msg.bot { align-self: flex-start; background: #f6f7f7; border: 1px solid #dcdcde; }
.ki-msg.undone { opacity: .6; }
.ki-msg .who { margin-bottom: 3px; }
.ki-text p { margin: 0 0 8px; }
.ki-text p:last-child { margin-bottom: 0; }
.ki-files { margin-top: 8px; font-size: 12px; color: #50575e; }
.ki-files ul { margin: 4px 0 0; padding-left: 18px; max-height: 160px; overflow: auto; }
.ki-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.ki-att, .ki-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ki-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 220px; padding: 3px 8px 3px 4px; border: 1px solid #c3c4c7; border-radius: 14px; background: #fff; font-size: 12px; }
.ki-chip img { width: 22px; height: 22px; object-fit: cover; border-radius: 3px; }
.ki-chip .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ki-chip .x { border: 0; background: none; cursor: pointer; font-size: 16px; line-height: 1; color: #646970; padding: 0 2px; }
.ki-chip .x:hover { color: #d63638; }
.ki-status { margin: 10px 0 0; min-height: 4px; }
.ki-line { padding: 8px 12px; border-radius: 4px; background: #fcf9e8; border: 1px solid #dba617; }
.ki-line.ok { background: #edfaef; border-color: #00a32a; }
.ki-composer { margin-top: 12px; }
.ki-input { width: 100%; box-sizing: border-box; padding: 9px 11px; font: inherit; font-size: 14px; line-height: 1.45; border: 1px solid #8c8f94; border-radius: 4px; resize: vertical; min-height: 78px; }
.ki-input:focus { outline: 2px solid #2271b1; outline-offset: 0; border-color: #2271b1; }
.ki-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; }
@media (max-width: 782px) { .ki-msg { max-width: 94%; } .ki-list { height: 50vh; } }
.page-title .grow { flex: 1; }