/* Shared device layout: phone <= 640px, compact tablet <= 1199px, desktop above. */
html { -webkit-text-size-adjust: 100%; }
#office-main { scroll-margin-top: calc(var(--office-topbar-height, 68px) + 16px); }
body { padding-bottom: env(safe-area-inset-bottom, 0px); }
input, select, textarea, button { max-width: 100%; }
/* Keep native select behavior while giving its closed control a reliable touch size. */
select, .office-app select { -webkit-appearance: none; appearance: none; min-width: 0; min-height: 44px; height: 44px; padding-right: 40px; overflow: hidden; text-overflow: ellipsis; background-image: url('/assets/chevron-down.svg'); background-repeat: no-repeat; background-position: right 12px center; background-size: 16px; }
label, .grid > *, .form-grid > *, .line-controls > *, .quote-fields > * { min-width: 0; }
.mobile-cell-label { display: none; }
.table-cell-value { min-width: 0; overflow-wrap: anywhere; }
.communications-panel li { overflow-wrap: anywhere; }
.office-sidebar { padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
.office-sidebar nav { overscroll-behavior: contain; }
.office-topbar { height: auto; min-height: 68px; padding-top: env(safe-area-inset-top, 0px); }
.office-app .office-main, .office-app .detail-shell, .office-app .catalogue-shell, .office-app .technician-shell { min-width: 0; }
.office-app dialog { overscroll-behavior: contain; }
.office-app input:not([type=checkbox]):not([type=radio]), .office-app select, .office-app textarea { font-size: 16px; }
.office-app .table-cell-value a, .office-app .table-cell-value button { overflow-wrap: anywhere; white-space: normal; }
.technician-page .technician-header h1 { font-size: 32px; max-width: none; }
.technician-page .technician-header { padding-block: 24px; }
.job-card { border-radius: 8px; }
.record-context { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 16px; font-size: 14px; overflow-wrap: anywhere; }
.record-context a { display: inline-flex; align-items: center; min-height: 44px; }
.inline-address { padding: 12px 0; border-block: 1px solid var(--line); min-width: 0; }
.inline-address > summary, .finished-orders > summary { cursor: pointer; min-height: 44px; font-weight: 600; }
.inline-address fieldset { padding-top: 12px !important; }
.inline-address [data-add-inline-address] { margin-top: 12px; display: inline-flex; align-items: center; gap: 8px; }
.inline-address [role=status]:empty { display: none; }
.technician-page .job-list-panel + .job-list-panel, .finished-orders { margin-top: 28px; }
.technician-page .technician-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 24px; flex-wrap: wrap; }
.technician-page .technician-header h1 { font-size: 22px; margin: 0; }
.technician-page .technician-header .brand span { display: none; }
.technician-page .technician-header .brand { margin: 0; }
.public-page .form-shell h1 { max-width: none; overflow-wrap: anywhere; }
.technician-page .technician-header .icon-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: 0 0 44px; }
.chantier-details { padding: 12px 0; border-bottom: 1px solid var(--line); }
.chantier-details > summary { cursor: pointer; font-weight: 600; min-height: 32px; }
.technician-page .compact-form { border-radius: 6px; }
.technician-page #daily-order-form { padding: 12px; margin: 16px 0; }
.technician-page #daily-order-form button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.technician-page [data-material-id] .line-controls { grid-template-columns: minmax(64px,1fr) minmax(70px,1fr) 44px 44px; }
.technician-page [data-material-id] .line-controls button { width: 44px; height: 44px; padding: 10px; }
.technician-page .field-line button svg { width: 20px; height: 20px; }
.technician-page .field-section h3 { font-size: 20px; }
.field-quick-nav { display: flex; gap: 4px; position: sticky; top: 8px; z-index: 2; padding: 6px 0; background: white; border-bottom: 1px solid var(--line); }
.office-app .field-quick-nav { top: calc(var(--office-topbar-height, 68px) + 8px); }
.field-section { scroll-margin-top: 84px; }
.office-app .field-section { scroll-margin-top: calc(var(--office-topbar-height, 68px) + 80px); }
.field-quick-nav a { display: inline-flex; align-items: center; justify-content: center; flex: 1; gap: 6px; min-height: 44px; font-size: 14px; }
.field-quick-nav svg { width: 18px; height: 18px; }
.technician-page #material-form .grid.two { grid-template-columns: repeat(2,minmax(0,1fr)); }
@media (min-width: 1000px) {
  .technician-page .work-sections { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: 28px; align-items: start; }
  .technician-page .work-sections > :nth-child(n+3) { grid-column: 1 / -1; }
  .technician-page .field-section { min-width: 0; }
}

@media (min-width: 641px) and (max-width: 1199px) {
  .office-app .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .office-app .form-grid, .quote-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .office-app .catalogue-grid { grid-template-columns: minmax(0, 1fr); }
  .office-app .catalogue-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .line-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .line-controls label:nth-child(3) { grid-column: 1 / -1; }
  .validation-line { grid-template-columns: minmax(0, 1fr); }
  .pricing-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 641px) and (max-width: 999px) {
  .dashboard-columns { grid-template-columns: minmax(0, 1fr); }
  .dossier-grid { grid-template-columns: minmax(0, 1fr); }
  .dossier-contact { border-right: 0; border-bottom: 1px solid var(--office-line); padding: 0 0 20px; }
  .dossier-contact .detail-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .office-app .dossier-header { flex-wrap: wrap; }
  .office-app .dossier-header .row-actions { width: 100%; margin-left: 0; }
}
.employee-rates { min-width: 0; border-top: 1px solid var(--office-line); padding-top: 16px; }
.employee-rates h3 { margin: 0 0 16px; font-size: 16px; }
.employee-rate-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.employee-rate { min-width: 0; }
.employee-rate > small { display: block; margin: 8px 0; color: var(--office-muted); overflow-wrap: anywhere; }
.employee-rate input[readonly] { background: #f3f5f6; color: #28323d; }
@media (max-width: 640px) { .employee-rate-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 1199px) {
  .office-sidebar { width: min(300px, 85%); }
  .office-topbar { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
  .office-app .office-main, .office-app .detail-shell, .office-app .catalogue-shell, .office-app .technician-shell {
    padding-left: max(20px, env(safe-area-inset-left));
    padding-right: max(20px, env(safe-area-inset-right));
    padding-bottom: max(40px, env(safe-area-inset-bottom));
  }
}
@media (any-pointer: coarse), (max-width: 1199px) {
  .technician-page summary, .office-app summary { min-height: 44px; padding-block: 12px; cursor: pointer; }
  .back-link, .back-button { min-height: 44px; align-items: center; }
  .office-app input:not([type=checkbox]):not([type=radio]), .office-app select, .office-app textarea { font-size: 16px; min-height: 44px; }
  .office-app button, .office-app .office-button, .office-app .button-link, .office-app .button-secondary { min-height: 44px; }
  .office-app .icon-button, .office-app .catalogue-toolbar button[aria-label], .office-app .catalogue-row-heading button,
  .office-app .message-pagination button { width: 44px; height: 44px; min-height: 44px; flex-basis: 44px; }
  .office-sidebar nav a { min-height: 48px; }
  .office-app label.confirm-other, .office-app .communication-check, .office-app .inline-check,
  .office-app .communication-toggles label, label.check { min-height: 44px; }
  .office-app .table-cell-value > a { display: inline-flex; min-height: 44px; align-items: center; }
  .communications-panel button, .communications-panel input:not([type=checkbox]), .communications-panel select { min-height: 44px; height: auto; }
  .communication-history summary { padding-block: 12px; }
}
@media (max-width: 640px) {
  .office-topbar { min-height: 62px; gap: 6px; }
  .topbar-location, .topbar-actions { gap: 4px; }
  .topbar-location strong { overflow-wrap: anywhere; min-width: 0; }
  .office-app .new-order { padding-inline: 8px; }
  .office-app .office-main, .office-app .detail-shell, .office-app .catalogue-shell, .office-app .technician-shell {
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
  }
  .form-shell, .technician-shell { padding-left: max(20px, env(safe-area-inset-left)); padding-right: max(20px, env(safe-area-inset-right)); }
  .office-app .office-records { min-width: 0; display: block; width: 100%; }
  .office-records thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .office-records tbody { display: block; }
  .office-records tr { display: block; padding: 12px; border-bottom: 1px solid var(--office-line); }
  .office-records tr:last-child { border-bottom: 0; }
  .office-app .office-records td { display: grid; grid-template-columns: minmax(80px, .4fr) minmax(0, 1fr); gap: 12px; padding: 6px 0; border: 0; max-width: none; align-items: start; }
  .office-records .mobile-cell-label { display: block; color: var(--office-muted); font-size: 12px; padding-top: 4px; }
  .office-records .status-badge { white-space: normal; }
  .office-app dialog { width: calc(100% - 16px); max-width: calc(100% - 16px); max-height: calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); padding: 16px; }
  .office-app .dialog-heading { gap: 8px; }
  .office-app .form-actions > button { flex: 1 1 110px; }
  .office-app .heading-actions { width: 100%; }
  .office-toolbar > label:not(.search-field) { flex: 1 1 120px; }
  .office-app .office-toolbar > label.confirm-other { flex: 1 0 100%; }
  .office-app .office-toolbar > select { flex: 1 0 100%; width: 100%; max-width: 100%; }
  .office-toolbar .result-count { order: 10; }
  .quote-actions button { flex: 1 1 140px; }
  .technician-page:not(.office-app) .technician-header { display: grid; grid-template-columns: minmax(0, 1fr) 44px; gap: 12px; }
  .technician-page:not(.office-app) .technician-header .brand { grid-area: 1 / 1; }
  .technician-page:not(.office-app) .technician-header .icon-button { grid-area: 1 / 2; }
  .technician-page:not(.office-app) .technician-header > div:not(.brand) { grid-area: 2 / 1 / 3 / -1; }
  .technician-page .technician-header h1 { font-size: 24px; }
  .technician-page h2 { font-size: 26px; overflow-wrap: anywhere; }
}
.field-contact-actions { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.field-contact-actions a { min-height:44px; display:inline-flex; align-items:center; gap:8px; }
.work-instructions p { white-space:pre-wrap; overflow-wrap:anywhere; }
.technician-page [data-labor-id] .line-controls { display:grid; grid-template-columns:minmax(80px, 1fr) 44px 44px; align-items:end; gap:8px; }
.technician-page [data-labor-id] .line-controls button { width:44px; height:44px; padding:10px; }
.technician-page [data-material-id] input[readonly], .technician-page #material-form input[readonly] { border-color:transparent; background:transparent; box-shadow:none; padding-inline:0; }
.technician-page #labor-options, .technician-page #office-references { margin-block:8px; }
.technician-page #labor-options summary, .technician-page #office-references summary, .technician-page [data-labor-id] summary { min-height:44px; padding-block:12px; cursor:pointer; }

input[type=number] { appearance:textfield; -moz-appearance:textfield; }
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
input::placeholder { color:#737780; opacity:1; }
.material-price-summary { display:flex; flex-wrap:wrap; gap:1rem; margin:.75rem 0; }
.material-price-summary dt { font-size:.85rem; color:#555; }
.material-price-summary dd { margin:0; font-weight:600; }
.record-files .file-list { list-style:none; padding:0; display:grid; gap:1rem; }
.record-files li { display:grid; gap:.35rem; overflow-wrap:anywhere; }
.record-files small { display:block; }
.record-files form { display:grid; gap:.75rem; }
.record-files input[type=file] { width:100%; min-width:0; }
.bulk-tools [data-bulk-actions] { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; padding:.75rem 0; }
.bulk-tools [data-bulk-actions][hidden] { display:none; }
.bulk-tools input[type=checkbox], th input[type=checkbox], td input[type=checkbox] { width:1.15rem; height:1.15rem; }
.password-control { display:flex; align-items:center; position:relative; }
.password-control input { padding-right:3rem; width:100%; }
.password-eye { position:absolute; right:.25rem; display:grid; place-items:center; width:44px; height:44px; min-height:44px; padding:.35rem; background:transparent; color:inherit; border:0; }
.record-files .row-actions { display:flex; flex-wrap:wrap; gap:.5rem 1rem; align-items:center; }
.record-files .row-actions a { display:inline-flex; align-items:center; min-height:44px; }

.bulk-visible, .bulk-selection { display:inline-flex; flex-direction:row; align-items:center; gap:.5rem; min-height:44px; }
.bulk-selection { min-width:44px; justify-content:center; }
.office-app .bulk-visible, .office-app .bulk-selection { display:inline-flex; flex-direction:row; align-items:center; }
.dossier-request > summary > .bulk-selection { width:44px; vertical-align:middle; margin-right:.5rem; }

/* Selection stays a separate touch target from opening an item. */
.job-selection-row { display:grid; grid-template-columns:44px minmax(0,1fr); align-items:start; min-width:0; }
.job-selection-row .job-card { width:100%; }
.job-list > .bulk-tools { grid-column:1 / -1; }
.bulk-tools { min-width:0; overflow-wrap:anywhere; }
.bulk-selection input { accent-color:var(--accent, #b81920); }
.quote-line > .bulk-selection, .catalogue-row > .bulk-selection, .dossier-address > .bulk-selection { justify-content:flex-start; }

body .bulk-selection input[type=checkbox], body .bulk-tools input[type=checkbox] { width:20px; height:20px; min-height:20px; max-width:20px; padding:0; flex:0 0 20px; }
#quote-form .bulk-visible, #quote-form .bulk-selection { display:inline-flex; flex-direction:row; align-items:center; gap:.5rem; }
.record-files li > .bulk-selection { justify-self:start; }
.quote-line-head > .bulk-selection, .catalogue-row-heading > .bulk-selection { flex:0 0 44px; }