/* Shared spacing and action layout for the office and customer portal. */
:root{--js-action-gap:10px;--js-panel-gap:20px}
.toolbar,.toolbar-left,.toolbar-right,.actions,.modal-footer>div,.v9535-page-head,.kp-top-actions,#kpTopActions{gap:var(--js-action-gap)!important;align-items:center;flex-wrap:wrap}
.toolbar{padding:14px 16px!important;margin-bottom:20px!important;row-gap:12px!important}
.toolbar-left,.toolbar-right,.actions,.modal-footer>div{display:flex;flex-wrap:wrap}
.toolbar>button,.toolbar-left>button,.toolbar-right>button,.actions>button,.modal-footer button,.v9535-page-head>button{margin:0!important;min-height:42px;border-radius:10px!important;line-height:1.3}
.toolbar-left{flex:1 1 460px}.toolbar-right{justify-content:flex-end;flex:0 1 auto}
.modal-header{display:flex;align-items:center;flex-wrap:wrap;gap:12px!important}.modal-header>div:first-child{flex:1 1 240px}.modal-header>.close{margin-left:auto}
.modal-body .field+.field{margin-top:10px}.form-grid>.field+.field{margin-top:0}
.modal-footer{gap:12px!important;flex-wrap:wrap}.modal-footer .actions{justify-content:flex-end}
.top-actions{gap:10px!important;flex-wrap:wrap}.top-actions>button{min-height:42px}
.v9535-page-head{display:flex}.v9535-page-head>div:first-child{flex:1 1 380px}
.v9535-panel{margin-bottom:20px}.v9535-panel>.field{margin-bottom:16px}
#mcValues{margin:16px 0}#mcPreviewBox{margin-top:20px}#mcPreviewBox pre{padding:20px;border:1px solid #dce6ed;border-radius:12px;background:#f7fafc}
#mcAttachments>div,#mtAttachments>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #e3ebf0}
#kpTopActions{display:flex;justify-content:flex-end}#kpTopActions button{min-height:42px}dialog .actions{display:flex;gap:10px;flex-wrap:wrap}dialog::backdrop{background:#0b263866}
.toolbar+ .kpi-grid,.kpi-grid{gap:16px}.tools-grid,.tool-grid{gap:16px}
@media(max-width:900px){.toolbar-left{flex-basis:100%}.toolbar-right{justify-content:flex-start}.toolbar{align-items:flex-start!important}.top-actions{justify-content:flex-start}.v9535-page-head>div:first-child{flex-basis:100%}}
@media(max-width:600px){.toolbar button,.toolbar-left button,.toolbar-right button{flex:1 1 140px}.modal-footer>div{width:100%}.modal-footer button{flex:1 1 130px}.kp-top{flex-wrap:wrap;gap:12px}#kpTopActions{justify-content:flex-start;width:100%}.v9535-page-head>button{flex:1 1 150px}}

@media(min-width:1100px){.v950-portal-card:has(>.v950-portal-kpi){grid-column:span 3}}
.card-grid{gap:16px!important}.entity-card .stats{gap:10px!important}.entity-card h3{margin-bottom:8px}.entity-card>.meta{margin-bottom:14px}
.modal.v9533-order-modal{width:min(1640px,96vw)!important;max-width:1640px!important;height:94vh!important;max-height:94vh!important;display:flex;flex-direction:column;border-radius:20px!important}
.v9533-order-modal>.modal-body{flex:1;min-height:0;overflow-y:auto;padding:20px 24px!important}
.v9533-order-modal>.modal-header,.v9533-order-modal>.modal-footer{flex-shrink:0}
.v9533-order-modal>.modal-body>.tabs{display:flex!important;flex-wrap:wrap!important;overflow:visible!important;gap:8px!important;position:relative!important;top:auto!important}
.v9533-order-modal>.modal-body>.tabs button{flex:0 1 auto;min-height:42px;font-size:13px;padding:10px 14px!important}
.v9533-order-shell{grid-template-columns:minmax(0,1fr) 320px!important;gap:24px!important}
.v9533-card-body{gap:18px!important;padding:20px!important}.v9533-card-stack{gap:20px!important}
.v9533-order-modal input[type="checkbox"]{width:18px!important;height:18px!important;min-height:18px!important;vertical-align:middle}
@media(max-width:1050px){.v9533-order-shell{grid-template-columns:minmax(0,1fr)!important}.v9533-order-aside{position:static!important}}
@media(max-width:650px){.modal.v9533-order-modal{width:100vw!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important}.v9533-order-modal>.modal-body{padding:12px!important}.v9533-card-body{grid-template-columns:1fr!important;padding:14px!important}.v9533-order-modal>.modal-body>.tabs button{flex:1 1 130px}}

/* Portal actions may wrap on small screens. */
.kp-top{height:auto;min-height:76px;padding-top:12px;padding-bottom:12px}