/* Classes that replace inline style="…" attributes. The site's Content-Security-Policy
   (style-src 'self') blocks inline style attributes, so those layouts never applied. */

/* Anything marked hidden stays hidden, even inside layout containers that set display. */
[hidden]{display:none!important}

/* Text and scrolling helpers */
.u-pre{white-space:pre-wrap;overflow-wrap:anywhere}
.u-wrap{overflow-wrap:anywhere}
.u-block{display:block}
.u-block-gap{display:block;margin:12px 0}
.u-block-gap-lg{display:block;margin:16px 0}
.u-mt{margin-top:24px}
.u-m0{margin:0}
.u-float-right{float:right}
.u-scroll-x{overflow-x:auto}
.u-scroll{overflow:auto}
.u-scroll-200{max-height:200px;overflow:auto}
.u-scroll-280{max-height:280px;overflow:auto}
.u-scroll-420{max-height:420px;overflow:auto}
.u-scroll-550{max-height:550px;overflow:auto}
.u-scroll-45vh{max-height:45vh;overflow:auto}
.u-scroll-55vh{max-height:55vh;overflow:auto}
.u-list-button{display:block;width:100%;text-align:left;margin:6px 0;white-space:normal;box-sizing:border-box}
.u-text-left{text-align:left;white-space:normal}
.u-inline-small{width:6em}
.text-ok{color:#357329}

/* Field tools: signature pad and 360° viewer must not scroll the page while drawing / panning */
.sign-pad{width:100%;height:150px;background:#fff;border:1px solid #64748b;border-radius:8px;touch-action:none}
.sign-pad-image{width:100%;height:auto}
.pano-canvas{display:block;width:100%;max-width:100%;height:auto;touch-action:none}

/* Schedule timeline */
.gantt-scroll.is-limited{max-height:440px}
.gantt-bar.work-order-bar{fill:#3974c6;cursor:pointer}

/* Report layout review cells */
.cell-wide{min-width:130px}
.cell-narrow{min-width:90px}

/* Sidebar brand button */
.brand-logo-wrap{border:0;width:100%}

/* Room scope saved items */
.rs-saved-item{display:flex;gap:12px;align-items:start;justify-content:space-between}
.rs-delete{flex:0 0 44px;min-height:44px}

/* Important repairs banner */
.important-repairs{border-left:5px solid #ff6600;background:#fffaf2}
.important-repairs-title{font-weight:650;overflow-wrap:anywhere}

/* Notification tray rows */
.tray-row{border-bottom:1px solid #dfe6df;padding:10px 0}

/* Portal controls checkboxes */
.portal-check{display:flex;gap:12px;padding:9px}

/* Grids used by supply hub, product library, business development and vendor screens */
.u-grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px}
.u-grid-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.u-grid-stack{display:grid;gap:12px;margin-block:16px}
.u-card{min-width:0;border:1px solid #d5dee4;border-radius:12px;padding:12px}
.u-card-scroll{height:200px;overflow:auto;overscroll-behavior:contain}
.u-tile-image{width:100%;height:140px;object-fit:cover}
.u-cover{object-fit:cover}
.u-sticky-head{position:sticky;top:0;background:var(--surface,#fff);z-index:1}

/* Carrier report review */
.carrier-frame{width:100%;height:70vh;border:1px solid #aaa;background:#fff}

/* Volume management dialog */
.volume-dialog{width:min(680px,calc(100vw - 32px));max-height:75dvh;overflow:auto;padding:18px;border:1px solid #c9d0d5;border-radius:12px}
.volume-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.volume-row{padding:10px 0;border-bottom:1px solid #ddd}

/* Sign-in landing stats */
.landing-stat-number{font-size:2rem;font-weight:800}
.landing-stat-label{font-size:1rem}

/* Product library search results */
.u-results-grid{max-height:220px;overflow:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:6px}

/* Product tour timeline bars */
.gc-2-4{grid-column:2 / 4}.gc-2-3{grid-column:2 / 3}.gc-3-5{grid-column:3 / 5}.gc-3-4{grid-column:3 / 4}.gc-4-6{grid-column:4 / 6}

/* Workload popover */
.volume-dialog{box-shadow:0 12px 50px #0003}

/* Buttons whose labels wrap */
.u-wrap-button{white-space:normal;max-width:100%}
.u-list-button.u-tall{min-height:48px}

/* Field time correction buttons */
.u-touch-block{display:block;margin:8px 0;min-height:44px}

/* Field mode: one-tap directions / call, and a quiet mode switch */
.phone-field-contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin:10px 0 0}
.phone-field-contact a{display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:12px;border:1px solid var(--line,#c9d0d5);font-weight:700;text-decoration:none;color:inherit}
.phone-field-contact a.primary{background:#0b5cad;border-color:#0b5cad;color:#fff}
.phone-field-switch{all:unset;cursor:pointer;display:block;margin:6px auto 0;padding:10px;font-size:14px;text-decoration:underline;color:var(--muted,#5b6660)}
.phone-field-switch:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.field-job-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.field-job-actions>button.primary[data-enter-phone-field]{min-height:48px;padding-inline:22px;font-size:16px}

/* Compact header on phones: crews need the job on screen, not the marketing tagline.
   Desktop and tablet keep the full brand header. */
@media (max-width:700px){
 header.topbar{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 10px;padding:8px 12px!important;min-height:0!important}
 header.topbar .topbar-brand{display:flex!important;align-items:center;gap:10px;min-width:0}
 header.topbar .company-mobile-header-logo{max-height:34px;width:auto}
 header.topbar .platform-header-brand{display:flex!important;align-items:center;gap:8px;min-width:0}
 header.topbar .platform-header-brand img{max-height:24px;width:auto}
 header.topbar .platform-primary-motto,header.topbar .platform-playful-motto,header.topbar .header-product-share{display:none!important}
 header.topbar .profile{grid-column:2;grid-row:1;justify-self:end}
 header.topbar .task-navigator{grid-column:1/-1;margin:0!important;padding:6px 0 0!important;border:0!important;box-shadow:none!important;background:transparent!important}
 .workflow-review-notice{font-size:12px;padding:4px 12px!important}
 .flow-encouragement{display:none!important}
}