/* Internal hierarchy. Table workspaces, dialogs and branding previews keep their contracts. */
body[bp-layout="vertical"] .page-body > main {
    --vera-section-space: 24px;
    --vera-content-inset: 20px;
    --vera-content-gap: 16px;
}
body[bp-layout="vertical"] main :is(.device-section-heading,.vera-lab-section-heading,.iot-section-heading) {
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
    min-width: 0; gap: 12px; padding: 0; margin-bottom: var(--vera-content-gap);
}
body[bp-layout="vertical"] main :is(.device-section-heading,.vera-lab-section-heading,.iot-section-heading) > div {
    min-width: 0;
}
body[bp-layout="vertical"] main :is(.device-section-heading,.iot-section-heading) {
    padding-bottom: 12px;
    border-bottom: 1px solid var(--vera-border);
}
body[bp-layout="vertical"] main :is(.device-section-heading,.vera-lab-section-heading,.iot-section-heading) h2 {
    margin: 0; font-size: var(--vera-type-section,1.25rem) !important;
    font-weight: 600; line-height: 1.35; color: var(--vera-text); overflow-wrap: anywhere;
}
body[bp-layout="vertical"] main :is(.device-section-heading,.vera-lab-section-heading,.iot-section-heading) :is(p,.text-secondary) {
    margin: 8px 0 0; color: var(--vera-muted); line-height: 1.5;
}
/* Grid sections already supply their own gap: do not add a second heading margin. */
body[bp-layout="vertical"] main :is(.vera-lab-functional-section,.vera-lab-trends,.vera-lab-actions-section) {
    gap: var(--vera-content-gap);
}
body[bp-layout="vertical"] main :is(.vera-lab-functional-section,.vera-lab-trends,.vera-lab-actions-section) > .vera-lab-section-heading {
    margin-bottom: 0;
}
body[bp-layout="vertical"] main .device-section {
    padding-block: var(--vera-section-space);
}
body[bp-layout="vertical"] main :is(.device-facts,.device-management-features) { margin-bottom: var(--vera-content-gap); }
body[bp-layout="vertical"] main .device-facts dt { font-size: var(--vera-type-small,.8125rem); line-height: 1.5; }
body[bp-layout="vertical"] main .device-facts dd { margin-top: 4px; line-height: 1.5; }

/* Only non-table cards. Do not affect table headers, bulk actions, filters or pagination. */
body[bp-layout="vertical"] main .card:not(:where(.registry-register,.registry-filters,.registry-bulk,.registry-table-bulk,[data-table-contract],.registry-unified-toolbar *,dialog *,.modal *,.branding-ui-preview *,.ot-login-preview *)):not(:has(table,[data-table-contract],.registry-unified-toolbar)) > :is(.card-header,.card-body,.card-footer) {
    padding: var(--vera-content-gap) var(--vera-content-inset);
}
body[bp-layout="vertical"] main .card:not(:where(.registry-register,.registry-filters,.registry-bulk,.registry-table-bulk,[data-table-contract],.registry-unified-toolbar *,dialog *,.modal *,.branding-ui-preview *,.ot-login-preview *)):not(:has(table,[data-table-contract],.registry-unified-toolbar)) > .card-header {
    min-height: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
}
body[bp-layout="vertical"] main .card:not(:where(.registry-register,.registry-filters,.registry-bulk,.registry-table-bulk,[data-table-contract],.registry-unified-toolbar *,dialog *,.modal *,.branding-ui-preview *,.ot-login-preview *)):not(:has(table,[data-table-contract],.registry-unified-toolbar)) > .card-header > .card-actions {
    flex: 0 1 auto; min-width: 0; max-width: 100%; margin-left: auto !important;
}
body[bp-layout="vertical"] main .card:not(:where(.registry-register,[data-table-contract],dialog *,.modal *,.branding-ui-preview *,.ot-login-preview *)):not(:has(table,[data-table-contract],.registry-unified-toolbar)) :is(.card-title,.card-header h2,.card-header h3) {
    margin: 0; font-size: var(--vera-type-card,1rem) !important; font-weight: 600;
    line-height: 1.4; color: var(--vera-text); overflow-wrap: anywhere; min-width: 0;
}
body[bp-layout="vertical"] main :is(.vera-lab-functional-card > header,.telemetry-section-heading) {
    gap: 12px;
    min-width: 0; flex-wrap: wrap;
}
body[bp-layout="vertical"] main .vera-lab-functional-card > header { padding: 8px 16px; }
body[bp-layout="vertical"] main .telemetry-section-heading { padding: var(--vera-content-gap) var(--vera-content-inset); }
body[bp-layout="vertical"] main :is(.vera-lab-functional-card > header,.telemetry-section-heading) > div { min-width: 0; }
body[bp-layout="vertical"] main :is(.vera-lab-functional-card h3,.telemetry-section-heading h2,.telemetry-chart-panel h3) {
    font-size: var(--vera-type-card,1rem) !important; line-height: 1.4; font-weight: 600;
    margin: 0; color: var(--vera-text); overflow-wrap: anywhere;
}
body[bp-layout="vertical"] main :is(.vera-lab-functional-grid,.vera-lab-trend-grid,.telemetry-primary-grid) { gap: var(--vera-content-gap); }
body[bp-layout="vertical"] main :is(.telemetry-chart-panel,.telemetry-primary-metric) { padding: var(--vera-content-inset); min-width: 0; }
body[bp-layout="vertical"] main .telemetry-chart-panel h3 { margin-bottom: var(--vera-content-gap); }
body[bp-layout="vertical"] main :is(.telemetry-primary-metric header strong,.registry-overview__metric small) {
    font-size: var(--vera-type-small,.8125rem); line-height: 1.5; font-weight: 500; text-transform: none;
}
/* Settings sections are open bands, not nested decorative cards. Preview surfaces are untouched. */
body[bp-layout="vertical"] main .ot-company-branding-section {
    padding: 0 0 var(--vera-section-space); margin: 0 0 var(--vera-section-space);
    border: 0; border-bottom: 1px solid var(--vera-border); border-radius: 0;
    box-shadow: none; background: transparent; overflow: visible;
}
body[bp-layout="vertical"] main .ot-company-branding-section > header {
    padding: 0; margin-bottom: var(--vera-content-gap); border: 0; gap: 8px;
}
body[bp-layout="vertical"] main .ot-company-branding-section > header h2 {
    margin: 0; font-size: var(--vera-type-section,1.25rem) !important; line-height: 1.35;
    font-weight: 600; color: var(--vera-text); overflow-wrap: anywhere;
}
body[bp-layout="vertical"] main .ot-company-branding-section > .row { padding: 0; margin-inline: -8px; --bs-gutter-x: 16px; --tblr-gutter-x: 16px; }
body[bp-layout="vertical"] main .ot-company-branding-section > .row > * { min-width: 0; }
body[bp-layout="vertical"] main .ot-company-branding-section input[type="file"] { max-width: 100%; min-width: 0; }
@media (max-width: 767.98px) {
    body[bp-layout="vertical"] .page-body > main { --vera-section-space: 20px; --vera-content-inset: 16px; }
    body[bp-layout="vertical"] main :is(.device-section-heading,.vera-lab-section-heading,.iot-section-heading) { align-items: flex-start; }
    body[bp-layout="vertical"] main .device-summary-columns { gap: 0; }
}
