/* Shared screen-only frame for operational editors. Printed documents stay independent. */
/* Catalog records and the two-step purchase/RMA editors share the same frame. */
@media screen{
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)){--editor-inset:22px;width:min(820px,calc(100vw - 40px));max-width:none;max-height:92dvh;box-sizing:border-box;padding:var(--editor-inset);border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);overflow:auto;overscroll-behavior:contain}
 body.app-signed-in #catalog-form>.list-heading,body.app-signed-in dialog.catalog-dialog[aria-label]>form>h2{position:sticky;top:calc(-1 * var(--editor-inset));z-index:5;background:var(--surface);padding:12px 0;margin:0 0 16px;border-bottom:1px solid var(--border);gap:10px;align-items:center;flex-wrap:wrap}
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) :is(h2,h3,p,small,label){overflow-wrap:anywhere}
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) :is(input,select,textarea){min-width:0;max-width:100%}
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) .form-grid{column-gap:14px}
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) form>.actions{position:sticky;bottom:calc(-1 * var(--editor-inset));z-index:4;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;background:var(--surface);padding:12px 0;margin:16px 0 0;border-top:1px solid var(--border)}
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) .actions>button{width:auto;margin:0}
 body.app-signed-in dialog.catalog-dialog[aria-label]>form>button{width:auto;margin:12px 8px 0 0}
 body.app-signed-in.mobile-preview :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)){width:min(430px,calc(100vw - 24px))}
}
@media screen and (min-width:901px){
 body.app-signed-in:not(.mobile-preview) :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) h2{font-size:18px;margin:0}
 body.app-signed-in:not(.mobile-preview) dialog.catalog-dialog[aria-label]>form>h2{margin-bottom:16px}
 body.app-signed-in:not(.mobile-preview) :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.app-signed-in:not(.mobile-preview) #product-photo-section .photo-editor{grid-template-columns:160px minmax(0,1fr)}
}
@media screen and (max-width:900px){
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)){--editor-inset:16px;width:calc(100vw - 16px);max-height:94dvh;border-radius:10px}
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) .actions>button{flex:1 1 130px;min-height:44px}
}
@media screen and (max-width:600px){
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) .form-grid{grid-template-columns:minmax(0,1fr)}
 body.app-signed-in :is(#catalog-editor,dialog.catalog-dialog[aria-label]:has(>form)) .form-grid>*{grid-column:1/-1}
}
@media screen{
 body.app-signed-in :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog){box-sizing:border-box;padding:22px;border:1px solid var(--border);border-radius:12px;max-height:92dvh;overflow:auto;overscroll-behavior:contain;background:var(--surface);color:var(--text)}
 body.app-signed-in :is(#order-dialog,#quote-dialog){width:min(1120px,calc(100vw - 40px));height:auto;max-width:none}
 body.app-signed-in :is(#finance-dialog,#quote-payment-dialog,#sales-detail-dialog){width:min(820px,calc(100vw - 40px));max-width:none}
 body.app-signed-in :is(.order-editor-heading,.quote-editor-heading,#finance-dialog>.heading){position:sticky;top:-22px;z-index:5;background:var(--surface);padding:12px 0;border-bottom:1px solid var(--border);margin:0 0 16px;gap:12px;align-items:center;flex-wrap:wrap}
 body.app-signed-in :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog) :is(h2,h3,p,small,label){overflow-wrap:anywhere}
 body.app-signed-in :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog) .form-grid{column-gap:14px}
 body.app-signed-in :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog) :is(input,select,textarea){max-width:100%;min-width:0}
 body.app-signed-in :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog) .actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:14px}
 body.app-signed-in :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog) .actions>button{width:auto;margin:0}
 body.app-signed-in :is(.order-heading-actions,.quote-heading-actions){max-width:100%;flex-wrap:wrap;gap:8px}
 body.app-signed-in #order-form .order-item-group{border-color:var(--border)}
 body.app-signed-in #order-form .order-item-group>.list-heading{background:var(--surface-alt);border-color:var(--border);gap:8px;flex-wrap:wrap}
 body.app-signed-in #finance-detail{overflow-wrap:anywhere}
 body.app-signed-in #finance-controls{border:0;padding:0;margin:0;min-width:0}
 body.app-signed-in #quote-add-custom-service{width:auto;margin-top:10px}
 body.app-signed-in.mobile-preview :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog){width:min(430px,calc(100vw - 24px))}
}
@media screen and (min-width:901px){
 body.app-signed-in:not(.mobile-preview) :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog) h2{font-size:18px;margin:0}
 body.app-signed-in:not(.mobile-preview) :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog) h3{font-size:15px;margin:18px 0 10px}
 body.app-signed-in:not(.mobile-preview) :is(#finance-dialog,#quote-payment-dialog) .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.app-signed-in:not(.mobile-preview) :is(#finance-form,#finance-settle-form,#finance-cancel-form,#quote-controls)>button{width:auto;margin:14px 0 0}
 body.app-signed-in:not(.mobile-preview) #quote-dialog section{margin:18px 0}
 body.app-signed-in:not(.mobile-preview) #quote-summary{padding:12px;font-size:16px;border-radius:8px}
 body.app-signed-in:not(.mobile-preview) #order-dialog #order-items .order-item{gap:10px;padding:10px 0;align-items:end}
 body.app-signed-in:not(.mobile-preview) #order-dialog #order-items .order-item>label{margin:0}
 body.app-signed-in:not(.mobile-preview) #order-dialog #order-items .order-item>button{margin:0;align-self:end;width:auto}
}
@media screen and (max-width:900px){
 body.app-signed-in :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog){width:calc(100vw - 16px);height:auto;padding:16px;max-height:94dvh;border-radius:10px}
 body.app-signed-in :is(.order-editor-heading,.quote-editor-heading,#finance-dialog>.heading){top:-16px;padding:10px 0;gap:10px}
 body.app-signed-in :is(#order-dialog,#quote-dialog,#finance-dialog,#quote-payment-dialog,#sales-detail-dialog) .actions>button{flex:1 1 140px;min-height:44px}
 body.app-signed-in .quote-heading-actions{align-items:end}
 body.app-signed-in .quote-line{gap:10px;align-items:end}
 body.app-signed-in .quote-line>label{margin:6px 0}
 body.app-signed-in .quote-line>button{margin:6px 0;min-height:44px;width:auto;justify-self:start}
}
@media screen and (max-width:600px){
 body.app-signed-in :is(#finance-dialog,#quote-dialog,#quote-payment-dialog) .form-grid{grid-template-columns:minmax(0,1fr)}
 body.app-signed-in #order-fields,body.app-signed-in #order-extra-fields{grid-template-columns:minmax(0,1fr)}
 body.app-signed-in #order-dialog :is(#order-fields,#order-extra-fields)>*{grid-column:1/-1}
 body.app-signed-in :is(.order-heading-actions,.quote-heading-actions){width:100%;align-items:end}
 body.app-signed-in .order-status-control{min-width:0;flex:1 1 140px}
 body.app-signed-in .order-status-control select{width:100%}
 body.app-signed-in .quote-selector{grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
 body.app-signed-in .quote-selector>label{margin:6px 0;min-width:0}
 body.app-signed-in .quote-selector>button{margin:6px 0;max-width:145px;min-height:44px}
}

/* A new financial account has no summary: do not reserve space for an empty one. */
@media screen{
 body.app-signed-in #finance-notice:empty,body.app-signed-in #finance-detail:empty{display:none}
 body.app-signed-in #finance-dialog:has(#finance-detail:empty) #finance-controls>#finance-form{margin-top:0;padding-top:0;border-top:0}
}

/* Desktop operational editors occupy the workspace; confirmations keep their compact frame. */
@media screen and (min-width:901px){
 body.app-signed-in:not(.mobile-preview) :is(#order-dialog,#quote-dialog,#finance-dialog,#sales-detail-dialog,#catalog-editor,#stock-dialog,#recurring-expense-dialog,.workspace-editor-dialog,.recurring-contract-dialog,.fiscal-note-dialog){
  --editor-inset:20px;position:fixed;inset:0;margin:0;box-sizing:border-box;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;padding:20px 28px;overflow:auto;overscroll-behavior:contain;
 }
 body.app-signed-in:not(.mobile-preview) :is(#order-dialog,#quote-dialog,#finance-dialog,#sales-detail-dialog,#catalog-editor,.workspace-editor-dialog) :is(.order-editor-heading,.quote-editor-heading,.dialog-header-actions){flex-wrap:wrap}
 body.app-signed-in:not(.mobile-preview) :is(#order-dialog,#quote-dialog,#catalog-editor,.workspace-editor-dialog)>form>.list-heading,
 body.app-signed-in:not(.mobile-preview) :is(#quote-dialog,#finance-dialog,#sales-detail-dialog)>.heading{position:sticky;top:-20px;z-index:5;background:var(--surface);padding:12px 0;border-bottom:1px solid var(--border)}
 body.app-signed-in:not(.mobile-preview) :is(#order-dialog,#quote-dialog,#finance-dialog,#sales-detail-dialog,#catalog-editor,.workspace-editor-dialog,.recurring-contract-dialog) :is(form,fieldset,.form-grid){min-width:0}
}