/* Normal account controls must not occupy the document workspace while scrolling.
   Support-context and locked-offline warnings retain their existing behavior. */
@media screen and (max-width:900px), screen and (max-height:500px){
  .secure-session-bar:not(.secure-support-mode):has([data-secure-logout]){position:static;flex-wrap:nowrap;padding:6px 12px;gap:12px}
  .secure-session-bar:not(.secure-support-mode):has([data-secure-logout])>strong{width:auto;min-width:0;flex:1;overflow-wrap:anywhere}
  .secure-session-bar:not(.secure-support-mode)>[data-secure-logout]{flex:0 0 auto;width:auto;min-height:48px}
}
/* Communication's native date/time input must not widen the narrow dialog grid. */
#housingExtensionForm[data-housing-type="communication"]{grid-template-columns:minmax(0,1fr)}
#housingExtensionForm[data-housing-type="communication"]>label{min-width:0}
#housingExtensionForm[data-housing-type="communication"] input[type="datetime-local"]{min-width:0;max-width:100%;width:100%}
/* New sections inherit Housing's existing design tokens and components. */
.housing-tools{margin-top:24px;min-width:0}
.housing-tool-actions{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.housing-tool-actions button,.housing-sync-control{min-height:44px;padding:8px 12px}
.housing-record-list{display:grid;gap:10px}
.housing-record-list button{text-align:left;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:12px;min-height:48px;overflow-wrap:anywhere}
.housing-record-list small{display:block;color:var(--muted);margin-top:4px}
.housing-record-list button:focus-visible,.housing-tool-actions button:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
.housing-extension-form textarea{font:inherit;min-height:100px;width:100%;resize:vertical;color:var(--ink);background:var(--canvas);border:1px solid var(--line);border-radius:7px;padding:10px}
.housing-extension-form fieldset{min-width:0;border:1px solid var(--line)}
.housing-extension-form .housing-inline{display:flex;align-items:center;gap:8px}
.housing-extension-form .housing-inline input{width:auto}
.housing-sync-control{font-size:12px;max-width:200px;white-space:normal}
.housing-offline-settings{grid-column:1/-1}
.housing-file-status{color:var(--muted);font-size:13px}
.housing-attachment{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0;min-width:0}
.housing-photo-preview{display:block;max-width:100%;max-height:260px;object-fit:contain;border-radius:8px}
.modal:has(#housingOfflineUnlock){z-index:50000}
.modal:has([data-housing-offline-choice]){z-index:50000}
/* Renter record only: retain the variable-height session banner above the dialog.
   The measured inset is maintained by client-notices.js; print is untouched. */
@media screen and (max-width:900px), screen and (max-height:500px){
  .modal:has(>.client-notice-modal){padding-top:var(--renter-dialog-top,12px);padding-bottom:12px}
  .modal>.modal-card.client-notice-modal{max-height:calc(100dvh - var(--renter-dialog-top,12px) - 12px)}
  /* Repair edit opts into the same measured inset; other forms remain excluded. */
  .modal:has(form[data-form="repair"]){padding-top:var(--renter-dialog-top,12px);padding-bottom:12px}
  .modal:has(form[data-form="repair"])>.modal-card{max-height:calc(100dvh - var(--renter-dialog-top,12px) - 12px)}
  /* Existing Inspection edit only; Conditions and other forms are unchanged. */
  .modal:has(form[data-form="edit-inspection"]){padding-top:var(--renter-dialog-top,12px);padding-bottom:12px}
  .modal:has(form[data-form="edit-inspection"])>.modal-card{max-height:calc(100dvh - var(--renter-dialog-top,12px) - 12px)}
}
/* Short, wide Property forms clear the normal single-row session banner (65px).
   Keep the banner visible and reserve a bounded scroll area, without changing
   portrait, full-height desktop, support-context, or unrelated dialog layouts. */
@media(min-width:721px) and (max-height:500px){
  body:has(.secure-session-bar:not(.secure-support-mode)):not(:has(.secure-support-mode)) .modal:has(form[data-form="property"]){padding-top:82px}
  body:has(.secure-session-bar:not(.secure-support-mode)):not(:has(.secure-support-mode)) .modal:has(form[data-form="property"]) .modal-card{max-height:calc(100dvh - 102px)}
}
/* Keep only reminder overlays above support or normal session banners (layer 100). */
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="reminder"]){z-index:101}
/* Keep maintenance Close above the same session banners without moving either component. */
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="maintenance"]){z-index:101}
/* Scope the same banner clearance to the employee access dialog only. */
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingFeatureAccessForm){z-index:101}
/* Photo Vault uses the same modal beneath either session banner. */
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="property_media"]){z-index:101}
/* Equipment alone needs the same clearance; leave all other dialogs unchanged. */
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="equipment"]){z-index:101}
/* Nested equipment service history retains the parent dialog's banner stacking. */
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="equipment_service"]){z-index:101}
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="inspection_condition"]){z-index:101}
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="repair_event"]){z-index:101}
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="communication"]){z-index:101}
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="turnover"]){z-index:101}
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="application"]){z-index:101}
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="signature_request"]){z-index:101}
body:has(.secure-support-mode,.secure-session-bar) .modal:has(#housingExtensionForm[data-housing-type="expense"]){z-index:101}
.housing-tools .housing-record-list{max-height:400px;overflow-y:auto}
@media print{.housing-tools,.housing-tool-actions{display:none!important}}
@media(max-width:550px){.housing-tool-actions>*{flex:1 1 120px}.housing-sync-control{max-width:100%;min-height:44px}.housing-tools{width:100%}}
/* Dashboard intrinsic content must fit throughout the existing mobile breakpoint.
   Wrap in place without removing information or changing desktop styles. */
@media(max-width:720px){
  .dashboard-grid{grid-template-columns:minmax(0,1fr)}
  .dashboard-grid .card{min-width:0}
  .dashboard-grid .card-title,.dashboard-grid .occupancy{flex-wrap:wrap}
}
/* Preserve the existing smallest-phone support layout scope. */
@media(max-width:360px){
  .support-grid{grid-template-columns:minmax(0,1fr)}
  .support-card,.support-card form,.support-card fieldset,.support-card label{min-width:0}
  .support-card h3,.donation-link{overflow-wrap:anywhere}
  .support-card input,.support-card textarea{min-width:0;max-width:100%}
  .topic-bubbles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .donation-link{flex-wrap:wrap;max-width:100%}
}