/* =====================================================================
   Formly's Forms layout! (body.os-office) A light page, violet chrome and
   the form card in the middle. Formly Classic stays untouched!
   ===================================================================== */
body.os-office {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
    height: 100vh;
    height: 100dvh;
    background: #f4f1fe;
    color: #252525;
}
body.os-office.os-dark { background: #1a1530; }
body.os-office #os-top { grid-column: 1; grid-row: 1; }
body.os-office #os-status { grid-column: 1; grid-row: 3; }
body.os-office .aero-sidebar, body.os-office .sheets-toolbar { display: none !important; }
body.os-office .workspace-viewport-wrapper { grid-column: 1; grid-row: 2; height: auto; min-height: 0; width: auto; padding: 0; animation: osFade 0.3s; }
body.os-office #spreadsheet-container { height: 100%; max-width: none; margin: 0; padding: 28px 24px 60px; border: 0; border-radius: 0; box-shadow: none; background: #f4f1fe; backdrop-filter: none; overflow-y: auto; }
body.os-office.os-dark #spreadsheet-container { background: #1a1530; }
body.os-office .form-meta-card, body.os-office .form-field-card { border: 1px solid #e3dcfb !important; box-shadow: 0 1px 4px rgba(124, 79, 240, 0.12) !important; background: #fff !important; }

.fm-bs-doc img { width: 36px; height: 36px; }
.fm-classic-layout { margin-top: 2px; }
.os-dlg.fm-layout-dlg { width: 560px; }

/* The File screen's "this document" card (the shared bb-bs-doc class had no rules here, so the icon blew up and the text ran together!) */
.bb-bs-doc { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--os-menu-line); border-radius: 10px; max-width: 560px; }
.bb-bs-doc img { width: 36px; height: 36px; flex: none; }
.bb-bs-doc div { display: flex; flex-direction: column; gap: 3px; }
.bb-bs-doc span { color: var(--os-dim); font-size: 12.5px; }