.content:has(> .page-editor-header):not(:has(> .member-editor-header)) {
    --toolbar-gutter: clamp(24px, 5vw, 72px);
    padding-top: 0;
    padding-inline: var(--toolbar-gutter);
}

.content > .page-editor-header {
    position: sticky;
    top: 0;
    z-index: 5;
    max-width: none;
    border-width: 0 0 1px;
    border-radius: 0;
}

.content > .page-editor-header:not(.member-editor-header) {
    width: calc(100% + 2 * var(--toolbar-gutter));
    margin: 0 calc(-1 * var(--toolbar-gutter));
}

@media (max-width: 1180px) {
    .content:has(> .page-editor-header):not(:has(> .member-editor-header)) {
        --toolbar-gutter: 28px;
    }
}

@media (max-width: 760px) {
    .page-editor-header .editor-toolbar-breadcrumb { max-width: 44vw; gap: 6px; }
    .page-editor-header .calendar-breadcrumb-ancestor { display: none; }
    .content:has(> .page-editor-header):not(:has(> .member-editor-header)) {
        --toolbar-gutter: 18px;
    }
}

.app-shell:has(.content > .member-editor-header) > .app-nav,
.app-shell:has(.content > .member-editor-header) .menu-toggle {
    display: none;
}

.app-shell:has(.content > .member-editor-header) > .content {
    top: 88px;
}

.app-shell:has(.content > .member-editor-header) .top-actions {
    margin-left: auto;
}

.app-shell:has(.content > .member-editor-header) .top-actions form {
    display: block;
}

.content:has(> .member-editor-header) {
    padding: 0;
}

.member-editor-header {
    position: sticky;
    top: 0;
    z-index: 5;
    width: 100%;
    max-width: none;
    margin: 0;
    border-width: 0 0 1px;
    border-radius: 0;
}

.member-editor-form {
    width: 100%;
    max-width: none;
    gap: 0;
    padding: 0;
}

.member-editor-form .form-card {
    margin: 0;
    padding: 12px clamp(24px, 5vw, 72px);
    border-width: 0 0 1px;
    border-radius: 0;
}

.member-editor-form .form-grid {
    gap: 10px 22px;
}

.member-editor-name {
    margin: 0 0 16px;
    color: var(--awo);
    font-size: clamp(28px, 3vw, 42px);
    font-weight: 400;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.member-editor-form .form-grid label {
    margin-bottom: 4px;
}

.member-editor-form .form-grid input,
.member-editor-form .form-grid select,
.member-editor-form .form-grid textarea {
    padding: 8px 10px;
}

.content:has(> .member-editor-header) > .association-editor-tabs {
    padding-inline: clamp(24px, 5vw, 72px);
    min-width: 0;
    max-width: 100%;
    overflow: visible;
    flex-wrap: wrap;
}

.content:has(> .member-editor-header) > .association-editor-tabs :is(button,a) {
    padding-block: 8px 6px;
    flex: 0 0 auto;
    white-space: nowrap;
}

.member-editor-form .association-tab-panel.active {
    padding: 12px clamp(24px, 5vw, 72px);
}

.content:has(> .member-editor-header) > .status-message {
    margin: 14px clamp(8px, 1vw, 12px) 0;
}

.content:has(> #profileTabs) {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.content:has(> #profileTabs) > .member-editor-header,
#profileTabs {
    flex: 0 0 auto;
}

.profile-tab-panel {
    flex: 1 1 0;
    min-height: 0;
    overflow: auto;
}

.profile-tab-panel[hidden] {
    display: none;
}

.profile-payments-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.profile-payments-panel > .e-grid {
    flex: 1 1 auto;
    min-height: 0;
    border: 0;
    border-radius: 0;
}

.member-payment-settings {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior-y: contain;
}

.profile-payments-panel:has(> .e-grid) > .member-payment-settings {
    flex: 0 0 auto;
    max-height: 40%;
}

.profile-payments-panel:has(> .member-payment-settings) > .e-grid {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    height: auto !important;
}

.profile-payments-panel:has(> .member-payment-settings) > .e-grid > :is(.e-toolbar, .e-gridheader, .e-pager) { flex: 0 0 auto; }
.profile-payments-panel:has(> .member-payment-settings) > .e-grid > .e-gridcontent { flex: 1 1 0; min-height: 0; overflow: hidden !important; }
.profile-payments-panel:has(> .member-payment-settings) > .e-grid > .e-gridcontent > .e-content { height: 100% !important; }

@media (max-height: 500px) {
    .profile-payments-panel:has(> .e-grid) > .member-payment-settings { max-height: 25%; }
}

.content:has(> .member-payments-tab) {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-bottom: 0;
}

.content:has(> .member-payments-tab) > .page-editor-header,
.content:has(> .member-payments-tab) > .detail-tabs {
    flex: 0 0 auto;
}

.content > .member-payments-tab {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-height: 0;
    max-width: none;
    padding: 0;
    overflow: hidden;
    margin-inline: calc(-1 * var(--toolbar-gutter));
}

.member-payments-tab > .e-grid {
    flex: 1 1 auto;
    min-height: 0;
    border: 0;
    border-radius: 0;
}

.compact-dialog {
    width: min(420px, calc(100vw - 32px));
    padding: 0;
    border: 1px solid #cfcfcf;
    border-radius: 0;
    background: #fff;
}

.compact-dialog::backdrop { background: rgb(0 0 0 / 45%); }
.compact-dialog__fields { display: grid; gap: 10px; padding: 16px; }
.compact-dialog__fields label { display: block; margin-bottom: 4px; font-weight: 700; }
.compact-dialog__fields input { width: 100%; padding: 8px 10px; }
.compact-dialog footer { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 16px; border-top: 1px solid #ddd; }
.compact-dialog footer button { padding: 8px 14px; border: 1px solid #aaa; border-radius: 0; background: #fff; }
.compact-dialog footer button[type="submit"] { border-color: var(--awo); color: var(--awo); font-weight: 700; }

.association-master-fields { border: 0; margin: 0; padding: 0; min-width: 0; }

/* Every association grid shares the remaining height, including short landscape screens. */
.content > .association-content-panel.active {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    height: auto;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}
.association-content-panel.active > .e-grid {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-height: 0;
}
.association-content-panel.active > .e-grid > .e-gridcontent { flex: 1 1 0; min-height: 0; overflow: hidden !important; }
.association-content-panel.active > .e-grid > .e-gridcontent > .e-content { height: 100% !important; }
.association-content-panel.active > .e-grid > :is(.e-toolbar,.e-gridheader,.e-pager) { flex: 0 0 auto; }

/* Hidden grids must not prevent scrolling in association form tabs. */
.content:has(> #associationEditorForm) {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}
.content:has(> #associationEditorForm) > .member-editor-header,
.content:has(> #associationEditorForm) > .association-editor-tabs {
    flex: 0 0 auto;
}
#associationEditorForm:not(:has(> .association-tab-panel.active)) {
    display: none;
}
#associationEditorForm:has(> .association-tab-panel.active) {
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    padding-block: 0;
}

.meeting-panel[hidden] { display: none !important; }
.content:has(> #meetingTabs) { display: flex; flex-direction: column; overflow: hidden; min-height: 0; }
.content:has(> #meetingTabs) > .member-editor-header, #meetingTabs { flex: 0 0 auto; }
#meetingEditorForm { flex: 1 1 0; min-height: 0; overflow: auto; }
#meetingEditorForm:has(#meetingTermin[hidden]) { display: none; }
.meeting-grid-panel { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; overflow: hidden; }
.meeting-grid-panel > .e-treegrid,
.meeting-grid-panel .e-treegrid > .e-grid { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; overflow: hidden; }
.meeting-grid-panel .e-grid > .e-toolbar,
.meeting-grid-panel .e-grid > .e-gridheader,
.meeting-grid-panel .e-grid > .e-pager { flex: 0 0 auto; }
.meeting-grid-panel .e-grid > .e-gridcontent { flex: 1 1 0; min-height: 0; overflow: hidden !important; }
.meeting-grid-panel .e-gridcontent > .e-content { height: 100% !important; }
.meeting-grid-panel > [hidden] { display: none !important; }
.meeting-document-view { flex: 1 1 0; min-height: 0; overflow: auto; background: var(--canvas); }
.meeting-document-paper { max-width: 980px; margin: 24px auto; padding: 40px 48px; background: white; border: 1px solid var(--line); }
.meeting-document-header { display: flex; align-items: flex-start; gap: 24px; }
.meeting-document-heading { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.meeting-document-logo { flex: 0 0 auto; width: 104px; height: 84px; object-fit: contain; object-position: right top; }
.meeting-document-paper h1 { margin: 12px 0; font-size: 30px; }
.meeting-document-title { margin: 0 0 12px; font-size: 21px; }
.meeting-document-association { font-weight: 700; margin: 0; }
.meeting-document-header--agenda { margin-bottom: 20px; }
.meeting-document-header--agenda .meeting-document-logo { object-position: left top; }
.meeting-document-letterhead { width: max-content; min-width: 42%; max-width: calc(100% - 128px); margin: 0 0 0 auto; font-style: normal; font-size: 14px; line-height: 1.25; color: #000; overflow-wrap: anywhere; }
.meeting-document-letterhead p { margin: 0; }
.meeting-document-letterhead .meeting-document-association { font-size: 16px; line-height: 1.2; margin-bottom: 6px; }
.meeting-document-letterhead .meeting-letterhead-office { font-weight: 700; margin-bottom: 2px; }
.meeting-letterhead-line { display: flex; align-items: flex-start; gap: 6px; }
.meeting-letterhead-line svg { width: 14px; height: 14px; flex: 0 0 14px; margin-top: 2px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; }
.meeting-letterhead-line a { min-width: 0; color: #0000ee; text-decoration: underline; }
.meeting-document-meta { color: var(--muted); line-height: 1.5; margin: 8px 0; }
.meeting-point { margin-left: calc(var(--top-depth) * 16px); padding: 22px 0; border-bottom: 1px solid var(--line); }
.meeting-point-header { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.meeting-point-number { color: var(--awo); white-space: nowrap; }
.meeting-point-header .meeting-point-field { margin: 0; }
.meeting-point-header .meeting-point-label { display: none; }
.meeting-point-field--kind { min-width: 120px; max-width: 180px; }
.meeting-point-field--kind select { max-width: 100%; padding: 5px 20px 5px 4px; font: inherit; color: inherit; background: white; border: 0; border-bottom: 1px dashed #aaa; cursor: pointer; }
.meeting-point-actions { margin-left: auto; display: flex; flex-wrap: wrap; }
.meeting-point-actions .e-btn { padding: 6px 8px; }
.meeting-point-label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 3px; }
.meeting-point-field { margin: 12px 0; }
.meeting-point .e-inplaceeditor { width: 100%; }
.meeting-point .e-editable-value-wrapper { border: 1px solid transparent; padding: 5px 4px; }
.meeting-point .e-editable-value-wrapper:hover { border-color: #ccc; }
.meeting-point .e-editable-value { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.55; }
.meeting-point .e-editable-component textarea { min-height: 100px; line-height: 1.55; }
.meeting-point-field--title .e-editable-value, .meeting-point-heading { font-size: 20px; font-weight: 700; }
.meeting-point-heading { margin: 14px 0 8px; }
.meeting-point-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.55; }
.meeting-document-add { margin-top: 18px; }
.meeting-validation { flex: 0 0 auto; padding-inline: clamp(24px, 5vw, 72px); }
.meeting-validation:empty, .meeting-validation.validation-summary-valid { display: none; }
@media(max-width:760px) {
    .meeting-document-paper { margin: 0; padding: 22px 18px; border: 0; }
    .meeting-document-header { gap: 14px; }
    .meeting-document-logo { width: 64px; height: 64px; }
    .meeting-document-letterhead { width: calc(100% - 78px); min-width: 0; max-width: calc(100% - 78px); }
    .meeting-document-paper h1 { font-size: 24px; hyphens: auto; }
    .meeting-point { margin-left: calc(var(--top-depth) * 8px); }
    .meeting-point-header { gap: 8px; }
    .meeting-point-actions { width: 100%; margin-left: 0; }
}
.meeting-panel textarea { width: 100%; }
.meeting-member-results, .meeting-participants { list-style: none; padding: 0; margin: .5rem 0; }
.meeting-participant-group { margin-top: 1rem; }
.meeting-participant-group h3 { margin: 0 0 .5rem; font-size: 1rem; }
.meeting-participant-group .meeting-participants:empty { display: none; }
.meeting-member-results { max-height: 16rem; overflow-y: auto; }
.meeting-participants { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .5rem; }
.meeting-participants li { display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr) 32px; align-items: center; gap: .5rem; max-width: 100%; padding: .35rem .5rem .35rem .85rem; border: 1px solid #ccc; border-radius: 1.5rem; background: #fff; }
.meeting-participants li a, .meeting-participants li > span { overflow-wrap: anywhere; }
.meeting-participants li a { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.meeting-participants li a > span { min-width: 0; }
.meeting-participant-logo { width: 20px; height: 20px; object-fit: contain; flex: 0 0 auto; }
.meeting-participants li > button { flex: 0 0 auto; width: 32px; height: 32px; padding: 0; border-radius: 50%; }
.meeting-participants li > span { color: #555; }
.meeting-participants li > .meeting-minutes-state { grid-column: 1 / 3; grid-row: 2; font-size: .875em; overflow-wrap: normal; }
.meeting-participants li > button { grid-column: 3; grid-row: 1; }
@media(max-width:600px) {
    .meeting-participants li { grid-template-columns: minmax(0, 1fr) 32px; }
    .meeting-participants li > a { grid-column: 1; grid-row: 1; }
    .meeting-participants li > span { grid-column: 1 / -1; grid-row: 2; }
    .meeting-participants li > .meeting-minutes-state { grid-column: 1 / -1; grid-row: 3; }
    .meeting-participants li > button { grid-column: 2; grid-row: 1; }
}
.member-editor-form .form-grid > .member-status-employee { display: flex; flex-direction: row; align-items: flex-end; gap: 16px; min-width: 0; }
.member-status-employee > div { flex: 1; min-width: 0; }

/* Leave usable rows in grids on short landscape screens. */
@media (max-height: 500px) and (max-width: 1180px) {
    .app-shell .topbar { height: 56px; }
    .app-shell .brand-logo.compact img { height: 40px; }
    .app-shell > .content,
    .app-shell:has(.content > .member-editor-header) > .content { top: 56px; }
    .app-shell > .app-nav { top: 56px; max-height: calc(100dvh - 100px); }
    .app-shell .accounting-balance { padding-block: 3px; font-size: 13px; }
    .app-shell .accounting-balance strong { font-size: 16px; }
}
.member-editor-form .form-grid .member-employee-checkbox { display: flex; align-items: center; gap: 6px; min-height: 32px; margin: 0; white-space: nowrap; }
.member-editor-form .member-employee-checkbox input[type="checkbox"] { width: 18px; height: 18px; margin: 0; padding: 0; }

/* Internal tab bars use additional rows instead of horizontal scrolling. */
.association-editor-tabs,
.detail-tabs {
    flex-wrap: wrap;
    overflow: visible;
    row-gap: 0;
    max-width: 100%;
}
.association-editor-tabs :is(button,a),
.detail-tabs a {
    max-width: 100%;
    overflow-wrap: anywhere;
}.readonly-value{display:block;min-height:1.5em;padding:4px 0;color:inherit;white-space:pre-wrap;overflow-wrap:anywhere;font-weight:400}
 .association-website-tabs,.association-website-mode{display:flex;flex-wrap:wrap;flex:0 0 auto;gap:8px 24px;padding:0 5%;border-bottom:1px solid #eee}
 .association-website-tabs[hidden],.association-website-mode[hidden],.association-website-mode button[hidden]{display:none}
 .association-website-tabs button,.association-website-mode button{background:none;border:0;border-bottom:4px solid transparent;padding:8px 2px;font:inherit;font-weight:700;cursor:pointer}
 .association-website-tabs button.active,.association-website-mode button.active{color:#e30020;border-bottom-color:#000}
 .member-editor-form .website-image-preview{display:block;width:auto;height:auto;max-width:100%;max-height:180px;object-fit:contain;margin:12px 0}
 .member-editor-form .website-remove-image{display:flex;align-items:center;gap:8px}
 .member-editor-form .website-remove-image input{width:auto;min-height:0;margin:0}
 .content > .association-website-tabs,.content > .association-website-mode{padding-inline:5%}
 .member-payment-settings [hidden]{display:none!important}

/* Keep a usable grid beneath nested website tabs in short landscape windows. */
@media (max-height: 480px) and (orientation: landscape) {
    .app-shell:has(.content > .member-editor-header) > .topbar { height: 56px; }
    .app-shell:has(.content > .member-editor-header) > .topbar .brand-logo img { height: 40px; }
    .app-shell:has(.content > .member-editor-header) > .content { top: 56px; }
    .content:has(> .member-editor-header) > .association-editor-tabs :is(button,a),
    .content > .association-website-tabs button,
    .content > .association-website-mode button { padding-block: 3px; }
}

.meeting-document-participants { margin: 16px 0; }
.meeting-document-participants > strong { display: block; margin-bottom: 4px; }
.meeting-document-participant { display: grid; grid-template-columns: minmax(0, 1fr) 8rem; align-items: baseline; gap: 12px; max-width: 34rem; padding: 3px 0; }
.meeting-document-participant > a { overflow-wrap: anywhere; }
.meeting-document-participant > label { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; margin: 0; font-weight: normal; cursor: pointer; }
.meeting-document-participant input { margin: 0; }

.meeting-vote-row { display:grid; grid-template-columns:minmax(0,1fr) 3.5rem 4rem 7rem; align-items:center; gap:8px; max-width:42rem; padding:5px 0; }
.meeting-vote-row > span { overflow-wrap:anywhere; }
.meeting-vote-choice { display:flex; align-items:center; gap:5px; margin:0; font-weight:normal; cursor:pointer; }
.meeting-vote-choice input { margin:0; flex:none; }
.meeting-vote-row:first-child { font-weight:700; border-bottom:1px solid var(--line); margin-bottom:5px; }
@media(max-width:600px) {
 .meeting-vote-row { grid-template-columns:minmax(0,1fr) 2.4rem 3rem 5.6rem; gap:4px; font-size:12px; }
 .meeting-vote-choice { gap:3px; }
}

.meeting-document-brand { flex:0 0 26%; min-width:0; text-align:right; }
.meeting-document-address { margin-top:8px; font-style:normal; font-size:14px; line-height:1.4; overflow-wrap:anywhere; }
@media(max-width:600px) { .meeting-document-brand { flex-basis:30%; } .meeting-document-address { font-size:11px; } }

.meeting-signature { margin-top:40px; break-inside:avoid; }
.meeting-signature p { margin:4px 0; }
.meeting-signature-line { border-top:1px solid currentColor; max-width:300px; margin-top:56px; padding-top:5px; font-size:12px; color:var(--muted); }
