/* Phone document forms: existing fields and actions, with one usable scroll area. */
@media (max-width: 760px) {
  #app_view .facturier-invoice-compose-backdrop {
    padding: 0 !important; top: var(--bn-phone-top, 0px) !important; bottom: auto !important;
    height: var(--bn-phone-height, 100dvh) !important; align-items: stretch !important;
  }
  #app_view .facturier-invoice-compose-modal { display: flex !important; flex-direction: column !important; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-body { flex: 1 1 auto !important; }
  #app_view .facturier-invoice-compose-modal :is(.facturier-invoice-compose-head, .facturier-invoice-compose-footer) { flex: 0 0 auto !important; }
  #app_view .facturier-invoice-compose-modal {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: var(--bn-phone-height, 100dvh) !important;
    max-height: var(--bn-phone-height, 100dvh) !important;
    min-height: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-height: 64px !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 10px 14px !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-head > div {
    min-width: 0 !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-head h2 {
    font-size: 19px !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-head > div > small,
  #app_view .facturier-invoice-compose-modal .facturier-popup-location {
    display: none !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-body {
    min-width: 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 12px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    scroll-padding-block: 14px;
  }

  #app_view .facturier-invoice-compose-modal :is(.facturier-invoice-compose, .facturier-document-compose, .facturier-invoice-compose-review, .facturier-form-grid, .facturier-document-deposit-panel) {
    grid-template-columns: minmax(0, 1fr) !important;
    min-width: 0 !important;
    gap: 12px !important;
  }

  #app_view .facturier-invoice-compose-modal :is(.facturier-invoice-compose, .facturier-document-compose) > * {
    grid-column: 1 !important;
    min-width: 0 !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-review {
    position: static !important;
  }

  #app_view .facturier-invoice-compose-modal :is(.facturier-invoice-compose-card, .facturier-invoice-compose-conditions, .facturier-invoice-compose-totals) {
    padding: 12px !important;
    min-width: 0 !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-section-head {
    align-items: stretch !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  #app_view .facturier-invoice-compose-modal :is(label, .facturier-invoice-compose-section-head small, .facturier-document-deposit-panel > small) {
    min-width: 0 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    overflow-wrap: anywhere;
  }

  #app_view .facturier-invoice-compose-modal :is(input:not([type="checkbox"]):not([type="hidden"]), select, textarea) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
  }

  #app_view .facturier-invoice-compose-modal :is(.fv-action-btn, .fv-action-link, summary, .facturier-packaging-picker-toggle, .facturier-packaging-picker-option) {
    box-sizing: border-box !important;
    min-width: 44px !important;
    min-height: 44px !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    touch-action: manipulation;
  }

  #app_view .facturier-invoice-compose-modal :is(.facturier-form-table-wrap, .facturier-invoice-compose-table, .facturier-invoice-compose-table tbody) {
    box-sizing: border-box !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody {
    display: grid !important;
    gap: 12px !important;
    padding: 0 !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody tr {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 10px !important;
    margin: 0 !important;
    padding: 12px !important;
    min-width: 0 !important;
    border-radius: 12px !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td {
    display: grid !important;
    grid-column: auto !important;
    gap: 5px !important;
    min-width: 0 !important;
    padding: 0 !important;
    align-content: start !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td:is([data-label="Article"], [data-label="Ligne source"], [data-label="Désignation"], [data-label="Conditionnement"], [data-label="Total HT"], [data-label="Action"]) {
    grid-column: 1 / -1 !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td:is([data-label="Article"], [data-label="Ligne source"]) { order: 0; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="Désignation"] { order: 1; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="Conditionnement"] { order: 2; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="Quantité"] { order: 3; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="Unité"] { order: 4; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="PU HT"] { order: 5; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="TVA"] { order: 6; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="Total HT"] { order: 7; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="Action"] { order: 8; }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label]::before {
    font-size: 12px !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="Action"] {
    position: static !important;
    justify-items: end !important;
    border-top: 1px solid #e4ebf0 !important;
    padding-top: 6px !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="Action"]::before {
    display: none !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-table tbody td[data-label="Total HT"] {
    padding: 10px !important;
    border-radius: 8px !important;
    background: #f0f6e9 !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-line-description-details {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-line-extra[open] {
    padding-bottom: 0 !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-line-extra > summary {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    margin-left: 0 !important;
    padding: 8px 0 !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-line-description textarea {
    min-height: 86px !important;
    height: auto !important;
    resize: vertical !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-packaging-picker-menu {
    box-sizing: border-box !important;
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: 260px !important;
    margin-top: 8px !important;
    box-shadow: none !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-packaging-picker-toggle span {
    white-space: normal !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-footer {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    min-height: 0 !important;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom)) !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-footer > .fv-action-bar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 8px !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-footer > .fv-action-bar:has(> .muted) {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-footer .muted {
    flex: 1 1 160px !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-footer .fv-action-btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 48px !important;
    padding: 10px 8px !important;
    overflow-wrap: anywhere;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-footer > .fv-action-bar:has(> .muted) .fv-action-btn {
    flex: 0 1 auto !important;
    width: auto !important;
  }

  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-footer > .fv-action-bar > .fv-action-btn:only-child {
    grid-column: 1 / -1 !important;
  }
}

/* Candidate only: phone shell refinements. Integrate after visual verification. */
@media (max-width: 760px) {
  /* Keep horizontal filters operable inside the vertically scrolling workspace. */
  #app_view .workspace-main,
  #app_view.workspace.tool-mode .workspace-main,
  #app_view.workspace:not(.tool-mode) .workspace-main,
  body.infos-integrated-mode #app_view .workspace-main {
    touch-action: pan-x pan-y pinch-zoom !important;
  }

  /* On phones the page navigation already supplies the persistent context. */
  #app_view .pa-mobile-flow-switch {
    position: relative !important;
    top: auto !important;
    z-index: auto !important;
  }

  /* Reuse the existing article detail and its Catalogue return action. */
  #app_view .facturier-item-browser:has(.facturier-item-insight.is-selected) .facturier-item-directory,
  #app_view .facturier-item-browser:not(:has(.facturier-item-insight.is-selected)) .facturier-item-cockpit {
    display: none !important;
  }

  #app_view .facturier-item-browser {
    display: block !important;
  }

  /* Let the essential identity remain readable with long business names. */
  #app_view .facturier-customer-list-main strong,
  #app_view .facturier-order-document-link :is(strong, span, small),
  #app_view .facturier-order-follow-up :is(strong, small),
  #app_view .mobile-create-action > span:nth-child(2),
  #app_view .mobile-more-action > span:nth-child(2) {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
  }

  #app_view .facturier-customer-list-value {
    flex-wrap: wrap !important;
  }

  #app_view .facturier-customer-filters select,
  #app_view .facturier-packaging-manager :is(input, select),
  #app_view .facturier-customer-search input {
    font-size: 16px !important;
  }

  #app_view .facturier-customer-back,
  #app_view .facturier-order-more-menu button,
  #app_view .mobile-more-sheet > header button,
  #app_view .mobile-create-sheet > header button {
    min-height: 44px !important;
  }
}

/* These card-specific rules assume the existing <=480px invoice card layout. */
@media (max-width: 480px) {
  #app_view .facturier-invoice-daily-table tbody tr {
    grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) !important;
  }

  #app_view .facturier-invoice-daily-table tbody td {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }

  #app_view .facturier-invoice-daily-table .status-pill {
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    text-align: center !important;
  }

  #app_view .facturier-invoice-daily-table [data-label="Facture et client"] {
    grid-column: 1 / -1 !important;
  }

  #app_view .facturier-invoice-daily-table [data-label="État utile"] {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    margin-left: 30px !important;
  }

  #app_view .facturier-invoice-daily-table [data-label="Dates"],
  #app_view .facturier-invoice-daily-table [data-label="Montants"] {
    grid-row: 3 !important;
  }

  #app_view .facturier-invoice-daily-table [data-label="Suivi"] {
    grid-row: 4 !important;
  }

  #app_view .facturier-invoice-daily-table [data-label="Action quotidienne"] {
    grid-row: 5 !important;
  }
}

/* Phone ergonomics. Above 760px the established desktop layout remains in charge. */
.bn-phone-steps, .bn-phone-step-actions, .bn-phone-form-error, .bn-phone-review-summary { display: none; }
@media (max-width: 760px) {
  #app_view .bn-phone-compose .bn-phone-steps {
    display: block; flex: 0 0 auto; padding: 0 12px 10px;
    background: #fff; border-bottom: 1px solid #dfe7ec;
  }
  #app_view .bn-phone-step-status {
    margin: 0 0 6px; color: #526577; font-size: 12px;
  }
  #app_view .bn-phone-steps > div { display: flex; gap: 6px; }
  #app_view .bn-phone-steps button {
    flex: 1 1 0; min-width: 0; min-height: 44px; padding: 8px 4px;
    border: 1px solid #d9e3e9; border-radius: 10px;
    background: #f6f8fa; color: #35516a; font: inherit; font-size: 12px; font-weight: 700;
  }
  #app_view .bn-phone-steps button[aria-current="step"] {
    background: #edf5e3; color: #30540e; border-color: #79a824;
  }
  #app_view .bn-phone-steps button:focus-visible { outline: 3px solid #0b4b38; outline-offset: 2px; }
  #app_view .bn-phone-compose [data-phone-panel]:not([data-phone-active]) { display: none !important; }
  #app_view .bn-phone-compose .facturier-popup-location { display: none !important; }
  #app_view .bn-phone-compose .facturier-invoice-compose-head > div > small,
  #app_view .bn-phone-compose .facturier-invoice-compose-head .fv-priority-eyebrow { display: none; }
  #app_view .bn-phone-compose .bn-phone-step-actions {
    display: flex; width: 100%; gap: 8px; flex-wrap: wrap;
  }
  #app_view .bn-phone-compose .bn-phone-step-actions button { flex: 1 1 100px; }
  #app_view .bn-phone-compose .bn-phone-step-actions [hidden] { display: none !important; }
  #app_view .bn-phone-compose:not([data-phone-last="true"]) .facturier-invoice-compose-footer > .fv-action-bar:has([data-facturier-save-entity-form]),
  #app_view .bn-phone-compose:not([data-phone-last="true"]) .facturier-invoice-compose-footer > .fv-action-bar:has([data-facturier-save-invoice]) { display: none !important; }
  #app_view .bn-phone-compose[data-phone-last="true"] .bn-phone-step-actions { order: -1; }
  #app_view .bn-phone-compose[data-phone-last="true"] .bn-phone-step-actions button { min-height: 40px !important; }
  #app_view .bn-phone-compose .facturier-invoice-compose-footer :is(.facturier-invoice-compose-footer-note, .muted) { font-size: 12px; line-height: 1.4; }
  #app_view .bn-phone-compose .facturier-invoice-compose-totals { order: -1; }
  #app_view .bn-phone-compose .bn-phone-form-error:not([hidden]) {
    display: block; margin: 0 0 12px; padding: 12px;
    border: 1px solid #d9aa54; border-radius: 10px; background: #fff6df;
    color: #663f0a; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere;
  }
  #app_view .bn-phone-compose .bn-phone-review-summary {
    display: block; order: -2; margin: 0; padding: 12px;
    border: 1px solid #dbe5eb; border-radius: 10px; background: #fff;
    color: #29445a; font-weight: 600; font-size: 14px; overflow-wrap: anywhere;
  }
  /* The header already offers closing; keep the final action large and reachable. */
  #app_view .bn-phone-compose[data-phone-last="true"] .facturier-invoice-compose-footer {
    display: grid !important; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr) !important;
    align-items: stretch !important;
  }
  #app_view .bn-phone-compose[data-phone-last="true"] .bn-phone-step-actions { grid-column: 1; grid-row: 1; }
  #app_view .bn-phone-compose[data-phone-last="true"] .facturier-invoice-compose-footer > .fv-action-bar:has([data-facturier-save-invoice]),
  #app_view .bn-phone-compose[data-phone-last="true"] .facturier-invoice-compose-footer > .fv-action-bar:has([data-facturier-save-entity-form]) {
    grid-column: 2; grid-row: 1; grid-template-columns: minmax(0, 1fr) !important;
  }
  #app_view .bn-phone-compose[data-phone-last="true"] .facturier-invoice-compose-footer :is([data-facturier-close-form], [data-facturier-close-entity-form]) { display: none !important; }
  #app_view .bn-phone-compose[data-phone-last="true"] .facturier-invoice-compose-footer > :is(.facturier-invoice-compose-footer-note, .fv-action-bar:has(> .muted)) { grid-column: 1 / -1; }
  #app_view .bn-phone-compose .facturier-invoice-compose-footer > .fv-action-bar:has(> .muted):not(:has(button)) { display: none !important; }
  #app_view .bn-phone-created .facturier-invoice-compose-head .fv-priority-eyebrow { display: none !important; }
  #app_view .bn-phone-created .facturier-created-preview { padding: 0 !important; gap: 8px !important; border: 0 !important; background: transparent !important; }
  #app_view .bn-phone-created :is(.facturier-created-path, .facturier-created-summary .fv-priority-eyebrow, [data-facturier-pdf-print]) { display: none !important; }
  #app_view .bn-phone-created .facturier-created-summary { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 8px; align-items: center; }
  #app_view .bn-phone-created .facturier-created-summary > div { display: contents; }
  #app_view .bn-phone-created .facturier-created-summary h3 { grid-column: 1; grid-row: 1; margin: 0; font-size: 16px; line-height: 1.3; overflow-wrap: anywhere; }
  #app_view .bn-phone-created .facturier-created-summary > .status-pill { grid-column: 2; grid-row: 1; max-width: 120px; white-space: normal; }
  #app_view .bn-phone-created .facturier-created-summary p:not(.fv-priority-eyebrow) { grid-column: 1 / -1; margin: 0; font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
  #app_view .bn-phone-created .facturier-created-path + div.pa-alert { margin: 0; padding: 8px 10px; font-size: 12px; line-height: 1.4; font-weight: 500; }
  #app_view .bn-phone-created .facturier-created-pdf { border: 0 !important; border-radius: 8px; }
  #app_view .bn-phone-created .facturier-pdf-document-actions { padding: 4px 6px; }
  #app_view .bn-phone-created .facturier-pdf-document-actions a { min-height: 44px; font-size: 13px; padding: 6px 10px; }
  #app_view .bn-phone-created .facturier-invoice-compose-footer [data-facturier-close-form] { display: none !important; }
  #app_view .bn-phone-created .facturier-invoice-compose-footer :is([data-facturier-created-send], [data-facturier-created-validate]) {
    grid-column: 1 / -1 !important; grid-row: 1 !important; min-height: 52px !important;
  }
  #app_view .bn-phone-created .facturier-invoice-compose-footer > .fv-action-bar:not(:has([data-facturier-created-email])) [data-facturier-created-open] { grid-column: 1 / -1 !important; }
  #app_view .facturier-invoice-compose-modal .facturier-invoice-compose-footer { max-height: 45%; overflow-y: auto; overscroll-behavior-y: contain; }
  #app_view .facturier-invoice-compose-modal .fv-action-btn:not(.fv-action-primary):not(.fv-action-danger) {
    background: #fff !important; color: #27465b !important; border: 1px solid #cad8e2 !important;
  }
  #app_view .facturier-invoice-compose-modal .facturier-form-grid > label:has(> :is(#facturier_form_customer, #facturier_doc_customer)) { order: -1; }
  #app_view.bn-phone-short .bn-phone-step-status,
  #app_view.bn-phone-short .bn-phone-compose .facturier-invoice-compose-footer :is(.facturier-invoice-compose-footer-note, .muted) { display: none !important; }
  #app_view.bn-phone-short .bn-phone-compose .facturier-invoice-compose-head { min-height: 48px !important; padding-block: 4px !important; }
}

/* Phone navigation and document lists; no rule applies above 760px. */
@media (max-width: 760px) {
  #app_view .facturier-app-topbar {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    min-height: 0 !important;
    padding: 10px !important;
  }
  #app_view .facturier-app-topbar:has([data-facturier-dossier]) .facturier-topbar-identity,
  #app_view #facturier_topbar_new_invoice { display: none !important; }
  #app_view .facturier-topbar-actions {
    display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important;
    order: 0; gap: 8px !important; width: 100%; margin: 0 !important;
  }
  #app_view .facturier-topbar-actions .module-select,
  #app_view .facturier-topbar-actions .module-select select {
    width: 100% !important; min-width: 0 !important; max-width: 100% !important;
  }
  #app_view .facturier-topbar-actions :is(select, button),
  #app_view #facturier_search_input { min-height: 44px !important; font-size: 16px !important; }
  #app_view #facturier_search_input { order: 1; width: 100%; }

  #app_view .facturier-invoice-table-shell,
  #app_view .facturier-order-table-shell {
    width: 100% !important; min-width: 0 !important; max-width: 100% !important;
    overflow: visible !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table),
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) tbody {
    display: block !important; width: 100% !important; min-width: 0 !important;
    max-width: 100% !important; padding: 0 !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) :is(thead, colgroup) { display: none !important; }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) tbody tr {
    box-sizing: border-box !important; position: relative !important;
    display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important; min-width: 0 !important; gap: 10px !important;
    margin: 0 0 10px !important; padding: 14px !important;
    border: 1px solid #dfe7ea !important; border-radius: 12px !important;
    background: #fff !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) tbody td {
    display: block !important; width: auto !important; min-width: 0 !important;
    max-width: 100% !important; padding: 0 !important; border: 0 !important;
    overflow-wrap: anywhere !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) td::before { display: none !important; }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) td[data-label="Sélection"] {
    position: absolute !important; top: 9px !important; left: 9px !important;
    display: grid !important; place-items: center; width: 36px !important; height: 44px !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) td:is([data-label="Document et client"], [data-label="Facture et client"]) {
    grid-column: 1 / -1 !important; grid-row: 1 !important; padding-left: 36px !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) td:is([data-label="Statut"], [data-label="État utile"]) {
    grid-column: 1 / -1 !important; grid-row: 2 !important;
    justify-self: start !important; margin-left: 36px !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) td:is([data-label="Dates"], [data-label="Date"]) {
    grid-column: 1 !important; grid-row: 3 !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) td:is([data-label="Total TTC"], [data-label="Montants"]) {
    grid-column: 2 !important; grid-row: 3 !important;
    justify-self: end !important; text-align: right !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) td[data-label="Suivi"] { grid-column: 1 / -1 !important; grid-row: 4 !important; }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) td[data-label="Action quotidienne"] { grid-column: 1 / -1 !important; grid-row: 5 !important; }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) .facturier-order-document-link {
    min-width: 0 !important; max-width: 100% !important; min-height: 44px !important;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) .status-pill {
    max-width: 100% !important; white-space: normal !important; overflow-wrap: anywhere;
  }
  #app_view :is(.facturier-order-document-table, .facturier-delivery-daily-table, .facturier-invoice-daily-table) .facturier-order-follow-up {
    display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    min-width: 0 !important; gap: 7px !important;
  }
  #app_view .facturier-order-row-actions { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 8px !important; }
  #app_view .facturier-order-more[open] { grid-column: 1 / -1 !important; }
  #app_view .facturier-order-more-menu { position: static !important; width: 100% !important; margin-top: 8px !important; box-shadow: none !important; }
  #app_view :is(.facturier-order-primary-action, .facturier-order-more summary) { min-height: 44px !important; }

  /* Keep the close action visible while the creation choices scroll. */
  #app_view .mobile-create-sheet {
    display: grid !important; grid-template-rows: auto auto minmax(0, 1fr) !important;
    overflow: hidden !important; gap: 10px !important;
  }
  #app_view .mobile-create-actions { min-height: 0 !important; overflow-y: auto !important; padding-bottom: 6px !important; align-content: start; }
  #app_view .mobile-create-sheet > p { margin: 0 !important; }
}

/* Reuse the established phone controls on wider phones and narrow landscape views. */
@media (min-width: 481px) and (max-width: 760px) {
  html:has(#app_view:not(.hidden)), body:has(#app_view:not(.hidden)) {
    height: var(--mobile-visual-height, 100svh) !important; margin: 0 !important;
    overflow: hidden !important;
  }
  #app_view.workspace:not(.hidden) {
    --mobile-primary-height: calc(64px + env(safe-area-inset-bottom));
    display: flex !important; flex-direction: column !important;
    width: 100% !important; height: var(--mobile-visual-height, 100svh) !important;
    min-height: 0 !important; max-height: var(--mobile-visual-height, 100svh) !important;
    padding: 0 !important; overflow: hidden !important;
  }
  #app_view .global-header {
    position: relative !important; display: flex !important; flex: 0 0 52px;
    align-items: center !important; justify-content: space-between !important;
    min-height: 52px !important; height: 52px !important; padding: 6px 12px !important; gap: 8px !important;
  }
  #app_view .workspace-banner, #app_view .global-search, #app_view .internal-context,
  #app_view #refresh_btn, #app_view #registration_issue_btn,
  #app_view #context_help_btn, #app_view #logout_btn { display: none !important; }
  #app_view .logo-mark { font-size: 16px !important; }
  #app_view .header-actions {
    display: flex !important; gap: 8px !important; margin: 0 !important; padding: 0 !important;
    overflow: visible !important; max-width: calc(100% - 100px) !important;
  }
  #app_view .workspace-main, #app_view.workspace.tool-mode .workspace-main, #app_view.workspace:not(.tool-mode) .workspace-main {
    box-sizing: border-box !important; width: 100% !important; min-height: 0 !important;
    height: calc(var(--mobile-visual-height, 100svh) - 52px) !important;
    max-height: calc(var(--mobile-visual-height, 100svh) - 52px) !important;
    margin: 0 !important; padding: 0 0 var(--mobile-primary-height) !important;
    overflow-x: hidden !important; overflow-y: auto !important;
  }
  #app_view .view-panel.hidden { display: none !important; }
  #app_view .view-panel:not(.hidden) { width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; }
  body.facturier-integrated-mode #app_view.workspace.tool-mode #view_app:not(.hidden),
  body.facturier-integrated-mode #app_view.workspace.tool-mode #app_detail,
  #app_view :is(.facturier-app-main, .facturier-app-content, #facturier_section_content, .facturier-order-daily-panel, .facturier-invoice-daily-panel) {
    height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important;
  }
  #app_view .facturier-native { display: block !important; width: 100% !important; min-width: 0 !important; }
  #app_view .facturier-app-content { padding: 0 10px 16px !important; }
  #app_view .mobile-primary-nav {
    position: fixed !important; bottom: var(--mobile-visual-bottom-gap, 0px) !important;
    left: 0 !important; right: 0 !important; z-index: 890 !important;
    display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    height: var(--mobile-primary-height) !important; padding: 4px 6px calc(4px + env(safe-area-inset-bottom)) !important;
    border-top: 1px solid #d8e3ef; background: #fff; box-shadow: 0 -5px 20px rgba(16,41,68,.1);
  }
  #app_view .mobile-primary-action {
    display: flex !important; flex-direction: column; align-items: center; justify-content: center;
    min-width: 0; min-height: 52px; gap: 3px; padding: 4px; border: 0; border-radius: 8px;
    background: transparent; color: #51657a;
  }
  #app_view .mobile-primary-action > span { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 8px; background: #eef3f8; font-size: 16px; font-weight: 800; }
  #app_view .mobile-primary-action > strong { font-size: 12px; line-height: 1.15; }
  #app_view .mobile-primary-action.is-active { color: #17344e; background: #f1f7e8; }
  #app_view .mobile-primary-action.is-prominent > span { color: #fff; background: #173f5d; }
  #app_view .mobile-page-nav:not(.hidden) {
    display: grid !important; position: sticky !important; top: 0 !important; z-index: 840 !important;
    grid-template-columns: auto minmax(0,1fr) auto; align-items: center; min-height: 52px;
    gap: 8px; padding: 4px 8px; background: #fff; border-bottom: 1px solid #dfe7ec;
  }
  #app_view .mobile-page-nav button { min-height: 44px; padding: 6px 10px; background: #f4f7f8; color: #17363d; }
  #app_view .mobile-page-nav strong { min-width: 0; text-align: center; overflow-wrap: anywhere; font-size: 13px; }
  #app_view .facturier-subnav { display: block !important; overflow: visible !important; width: 100% !important; }
  #app_view .facturier-subnav-button { display: none !important; }
  #app_view .facturier-mobile-section-picker { display: grid !important; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 10px; }
  #app_view .facturier-mobile-section-picker select { min-height: 44px; font-size: 16px; }

  #app_view :is(.mobile-more-backdrop, .mobile-create-backdrop, .mobile-dossier-backdrop) {
    position: fixed !important; inset: 52px 0 calc(var(--mobile-visual-bottom-gap,0px) + var(--mobile-primary-height)) !important;
    display: flex !important; align-items: stretch !important; z-index: 920 !important;
    padding: 0 !important; background: #fff !important;
  }
  #app_view :is(.mobile-more-backdrop, .mobile-create-backdrop, .mobile-dossier-backdrop).hidden { display: none !important; }
  #app_view :is(.mobile-more-sheet, .mobile-create-sheet, .mobile-dossier-sheet) {
    box-sizing: border-box; width: 100% !important; height: 100% !important; min-height: 0 !important;
    max-height: none !important; padding: 14px !important; margin: 0 !important; background: #fff;
    border: 0 !important; border-radius: 0 !important; overflow-y: auto;
  }
  #app_view :is(.mobile-more-sheet, .mobile-create-sheet, .mobile-dossier-sheet) > header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
  #app_view :is(.mobile-more-sheet, .mobile-create-sheet, .mobile-dossier-sheet) > header button { min-width: 44px; min-height: 44px; background: #eef3f8; color: #17344e; font-size: 24px; }
  #app_view :is(.mobile-more-sheet, .mobile-create-sheet, .mobile-dossier-sheet) > header h2 { font-size: 21px; }
  #app_view :is(.mobile-more-sheet, .mobile-create-sheet, .mobile-dossier-sheet) > header div > span { display: block; font-size: 11px; color: #64788a; margin-bottom: 3px; }
  #app_view .mobile-more-sheet { display: grid; grid-template-rows: auto minmax(0,1fr) auto; gap: 12px; overflow: hidden; }
  #app_view :is(.mobile-more-actions, .mobile-create-actions) { display: grid !important; grid-template-columns: 1fr !important; gap: 8px; min-height: 0; overflow-y: auto; align-content: start; }
  #app_view :is(.mobile-more-action, .mobile-create-action) {
    display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 10px;
    width: 100%; min-width: 0; min-height: 68px; padding: 10px; border: 1px solid #dce6ef;
    border-radius: 10px; background: #f8fafc; color: #17344e; text-align: left;
  }
  #app_view :is(.mobile-more-action, .mobile-create-action) > span:first-child { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: #173f5d; color: #fff; font-weight: 800; }
  #app_view :is(.mobile-more-action, .mobile-create-action) :is(strong, small) { display: block; }
  #app_view :is(.mobile-more-action, .mobile-create-action) small { margin-top: 3px; color: #64788a; font-size: 12px; }
  #app_view .mobile-more-group-title { font-size: 13px; padding: 8px 0 2px; }
  #app_view .mobile-more-footer { display: block; border-top: 1px solid #dce5e9; padding-top: 10px; }
  #app_view .mobile-more-logout { width: 100%; min-height: 48px; gap: 10px; background: #fff2f0; color: #8b3027; }
  #app_view .mobile-more-logout small { display: block; }
  #app_view .mobile-dossier-sheet { display: grid; grid-template-rows: auto auto minmax(0,1fr) auto; gap: 12px; }
  #app_view .mobile-dossier-select-field { min-height: 0; }
  #app_view #mobile_dossier_select { min-height: 0 !important; height: 100%; font-size: 16px; }
  #app_view #mobile_dossier_search { min-height: 44px; font-size: 16px; }
  #app_view .notification-popover, #app_view .account-popover {
    position: fixed !important; top: 58px !important; right: 8px !important;
    bottom: calc(var(--mobile-primary-height) + 8px) !important; left: 8px !important;
    width: auto !important; max-height: none !important; overflow-y: auto !important; z-index: 930;
  }
}

/* Read the full purpose of each home shortcut on a phone. */
@media (max-width: 760px) {
  #view_home .essential-metric { grid-template-columns: minmax(0, 1fr) !important; text-align: left !important; }
  #view_home .essential-metric-mark { display: none !important; }
  #view_home .essential-metric > div { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 6px !important; }
  #view_home .essential-metric > div > span { white-space: normal !important; overflow: visible !important; font-size: 12px !important; line-height: 1.35 !important; }
  #view_home .essential-metric strong { font-size: 24px !important; }
}

/* A horizontal flex-basis from the desktop search must not become phone height. */
@media (max-width: 760px) {
  #app_view #facturier_search_input { flex: 0 0 44px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; min-width: 0 !important; }
  #app_view .facturier-topbar-actions { flex: 0 0 auto !important; }
  #app_view .facturier-topbar-actions :is(select, button) { height: 44px !important; min-height: 44px !important; }
}

/* Keep the existing appointment dialog above both phone navigation bars. */
@media (max-width: 760px) {
  #app_view .calendar-event-modal { z-index: 2450 !important; }
  #app_view .calendar-event-modal-card { max-width: 100% !important; box-sizing: border-box !important; }
  #app_view .calendar-event-modal-head button { min-width: 44px !important; min-height: 44px !important; }
  #app_view .calendar-event-form :is(input, select, textarea) { min-height: 44px !important; font-size: 16px !important; }
}
@media (min-width: 481px) and (max-width: 760px) {
  #app_view .calendar-event-modal { padding: 10px !important; }
}