/* Mobile reading and editing. Desktop tables retain their existing layout. */
@media (max-width: 767px) {
  .main input:not([type=checkbox]):not([type=radio]),
  .main select, .main textarea, .drawer input, .drawer select,
  dialog input:not([type=checkbox]):not([type=radio]), dialog select, dialog textarea {
    min-width: 0;
    max-width: 100%;
    font-size: 16px;
  }
  input[type=file] { width: 100%; min-width: 0; max-width: 100%; }
  .main .button, .drawer .button, dialog .button {
    max-width: 100%;
    min-height: 44px;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .main .text-button, .drawer .text-button, dialog .text-button,
  .row-preview, .file-remove { min-height: 44px; }
  .page-head-row, .dashboard-section-heading, .vault-section-head,
  .official-document { flex-wrap: wrap; gap: 12px; }
  .page-head-row > *, .vault-section-head > *, .official-document > * { min-width: 0; }
  .workspace-panel, .profile-card, .commission-detail,
  .prepared-result, .preview-export, .vault-choice-file > span { overflow-wrap: anywhere; }
  .upload-controls > input[type=file] { flex-basis: 100%; }
  .vault-row-actions { white-space: normal; }
  .vault-row-actions button + button { margin-left: 8px; }
  .vault-table td:first-child { min-width: 0; }
  .vault-badge, .submission-lot-tag { max-width: 100%; white-space: normal; }
  .drawer { padding-bottom: calc(112px + env(safe-area-inset-bottom, 0px)); }
  .toast { bottom: calc(100px + env(safe-area-inset-bottom, 0px)); }
  #submission-choice { overflow: auto; max-height: calc(100dvh - 32px); }
  #submission-choice-lots { min-width: 0; }

  /* Keep each consultation, dossier and submission readable without panning. */
  .market-list .market-table-wrap, #submission-list .market-table-wrap { overflow: visible; }
  .market-list .market-table, #submission-list .market-table,
  .market-list .market-table tbody, #submission-list .market-table tbody,
  .market-list .market-table tr, #submission-list .market-table tr,
  .market-list .market-table td, #submission-list .market-table td {
    display: block; width: 100%; min-width: 0; max-width: 100%;
  }
  .market-list .market-table thead, #submission-list .market-table thead { display: none; }
  .market-list .market-table tr, #submission-list .market-table tr {
    padding: 16px; border-bottom: 1px solid var(--rule);
  }
  .market-list .market-table td, #submission-list .market-table td {
    padding: 8px 0; border: 0; text-align: left; white-space: normal;
    overflow-wrap: anywhere;
  }
  .market-list .market-table td::before, #submission-list .market-table td::before {
    display: block; margin-bottom: 5px; color: var(--text-3); font: var(--t-caption);
  }
  .market-list td:nth-child(2)::before { content: "Acheteur / lieu"; }
  .market-list td:nth-child(3)::before { content: "Date limite"; }
  .market-list td:nth-child(4)::before { content: "Estimation"; }
  .market-list td:nth-child(5)::before { content: "Caution"; }
  .market-list td:nth-child(6)::before { content: "Adéquation"; }
  #submission-list td:nth-child(2)::before { content: "Lots sélectionnés"; }
  #submission-list td:nth-child(3)::before { content: "Date limite"; }
  #submission-list td:nth-child(4)::before { content: "Suivi"; }
  .market-table .row-reference { flex-wrap: wrap; }
  .market-table .row-preview { width: 100%; }
  .market-table .submission-row-action { max-width: 100%; }

  .commission-lot .market-table-wrap, #dashboard-missing .market-table-wrap { overflow: visible; }
  :is(.commission-participants, .dashboard-missing-table),
  :is(.commission-participants, .dashboard-missing-table) :is(tbody, tr, td) {
    display: block; width: 100%; min-width: 0; max-width: 100%;
  }
  :is(.commission-participants, .dashboard-missing-table) thead { display: none; }
  :is(.commission-participants, .dashboard-missing-table) tr {
    padding: 16px; border-bottom: 1px solid var(--rule);
  }
  :is(.commission-participants, .dashboard-missing-table) td {
    padding: 8px 0; border: 0; text-align: left; white-space: normal; overflow-wrap: anywhere;
  }
  :is(.commission-participants, .dashboard-missing-table) td::before {
    display: block; margin-bottom: 5px; color: var(--text-3); font: var(--t-caption);
  }
  .commission-participants td:nth-child(1)::before { content: "Rang"; }
  .commission-participants td:nth-child(2)::before { content: "Entreprise"; }
  .commission-participants td:nth-child(3)::before { content: "Administratif"; }
  .commission-participants td:nth-child(4)::before { content: "Financier"; }
  .commission-participants td:nth-child(5)::before { content: "Offre corrigée"; }
  .commission-participants td:nth-child(6)::before { content: "Écart / référence"; }
  .commission-participants td:nth-child(7)::before { content: "Analyse"; }
  .dashboard-missing-table td:nth-child(1)::before { content: "Pièce demandée"; }
  .dashboard-missing-table td:nth-child(2)::before { content: "Marché"; }
  .dashboard-missing-table td:nth-child(3)::before { content: "Phase"; }
  .dashboard-missing-table td:nth-child(4)::before { content: "Condition"; }

  /* One price line per card: retain the source fields and calculation hooks. */
  .price-table-wrap { max-height: none; overflow: visible; }
  .price-table, .price-table tbody { display: block; width: 100%; min-width: 0; }
  .price-table thead { display: none; }
  .price-table tr {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px; padding: 16px 12px; border-bottom: 1px solid var(--rule);
  }
  .price-table tr:last-child { border-bottom: 0; }
  .price-table td, .price-table td:first-child, .price-table td:nth-child(2),
  .price-table td:nth-child(3), .price-table td:nth-child(4), .price-table td:nth-child(5) {
    display: block; width: auto; min-width: 0; padding: 0; border: 0;
  }
  .price-table td:nth-child(2), .price-table td:nth-child(4),
  .price-table td:nth-child(5), .price-table td:nth-child(6), .price-table td:last-child {
    grid-column: 1 / -1;
  }
  .price-table td:first-child { grid-column: 1; grid-row: 1; }
  .price-table td:nth-child(3) { grid-column: 2; grid-row: 1; }
  .price-table td[data-label]::before {
    content: attr(data-label); display: block; margin-bottom: 6px;
    color: var(--text-3); font: var(--t-caption);
  }
  .price-table input { min-height: 44px !important; font-size: 16px; }
  .price-table td:nth-child(4) > span { display: block; margin: 6px 0; }
  .price-table .row-amount { text-align: left; white-space: normal; overflow-wrap: anywhere; }
  .price-total { flex-direction: column; gap: 6px; align-items: flex-end; overflow-wrap: anywhere; }
  .commission-facts { grid-template-columns: 1fr; }
}

/* The same record and document patterns, stacked for touch screens. */
@media (max-width: 767px) {
  .main { padding-inline: 16px; }
  .topbar { min-height: 72px; gap: 12px; }
  .topbar-view-name { display: none; }
  .topbar-account { max-width: 44%; }
  .view { padding-top: 24px; }
  .page-head h1, .page-heading h1 { font-size: 40px; line-height: 1.05; }
  .page-head-row > .button { align-self: stretch; }
  .mast-title { font-size: clamp(40px,10vw,56px); }
  .mast { margin-bottom: 24px; padding-inline: 0; }
  .mast-deck { font-size: 15px; }
  .field-block { min-height: 230px; padding: 24px; }
  .field-figure { font-size: 64px; }
  .home-lead { grid-template-columns: minmax(0,1fr); gap: 16px; }
  .field-block, .dashboard-card.decide, .dashboard-card.today { grid-column: auto; }
  .dashboard-card { padding: 20px; }
  .dashboard-work { grid-template-columns: minmax(0,1fr); gap: 0; }
  .figures { margin-top: 24px; }
  .figure { min-height: 100px; padding: 16px 12px; }
  .figure-label { font-size: 12px; }
  .figure-value { font-size: 30px; }
  .workspace-view h1 { font-size: 25px; line-height: 1.3; text-wrap: initial; }
  .workspace-summary { display: grid; gap: 6px; }
  .workspace-summary > span + span::before { content: none; }
  .workspace-facts { grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 20px; }
  .workspace-facts > div { padding: 12px 8px; border-inline-start: 0; }
  .workspace-facts > div:nth-child(odd) { padding-inline-start: 0; }
  .workspace-facts > div:nth-child(n+3) { border-top: 1px solid var(--rule); }
  .workspace-facts dd { font-size: 15px; line-height: 22px; }
  .workspace-facts dt { font-size: 11px; }
  .workspace-panel, .profile-card { padding: 20px; }
  .record-tabs { gap: 22px; margin-bottom: 16px; }
  .record-tabs button { font-size: 13px; min-height: 48px; }
  .workspace-submission-action .button { width: 100%; }
  .revision-panel { padding: 0; }
  .revision-panel .revision-heading { padding: 14px 16px; gap: 12px; flex-direction: row; }
  .revision-heading .pill { font-size: 11px; max-width: 42%; }
  .revision-content { padding: 0 16px 16px; }
  .revision-content .drawer-actions > .button { width: 100%; }
  .revision-panel h3 { font-size: 12px; }
  .preview-heading { flex-direction: row; align-items: flex-start; flex-wrap: wrap; padding-top: 4px; }
  .preview-heading > div > strong { font-size: 19px; }
  .preview-state { font-size: 11px; padding: 5px 8px; }
  .preview-workbench { display: block; margin-top: 16px; }
  .preview-library { border-inline-end: 0; border-bottom: 1px solid var(--rule); padding: 16px 12px; }
  .preview-tabs { grid-template-columns: repeat(2,minmax(0,1fr)); max-height: 240px; overflow-y: auto; }
  .preview-tabs button { padding: 10px 8px; min-height: 64px; gap: 8px; }
  .preview-tabs button strong { font-size: 12px; line-height: 17px; }
  .preview-tabs button small { font-size: 11px; }
  .preview-file-icon { flex-basis: 16px; height: 18px; }
  .preview-document-heading { align-items: stretch; flex-direction: column; gap: 8px; padding: 14px 16px; }
  .preview-document-heading strong { white-space: normal; overflow-wrap: anywhere; line-height: 1.5; }
  .preview-document-heading a { align-self: flex-end; }
  #document-preview-frame { height: 560px; min-height: 420px; }
  .preview-export { align-items: stretch; flex-direction: column; gap: 16px; padding-top: 20px; }
  .preview-export .button { width: 100%; }
  .response-checks { padding: 16px; }
  .commission-workspace { gap: 20px; }
  .commission-choice { padding: 14px; }
  .drawer .fact { grid-template-columns: 110px minmax(0,1fr); }
}
@media (max-width: 359px) {
  .main { padding-inline: 12px; }
  .topbar-account { max-width: 40%; }
  .preview-tabs { grid-template-columns: minmax(0,1fr); max-height: 225px; }
  .workspace-panel, .profile-card { padding: 16px; }
  .revision-panel { padding: 0; }
  .sidebar .nav-link[data-view] { font-size: 9px; }
}
@media (max-width: 767px) {
  .company-layout { display: block; }
  .company-section-nav { position: static; display: flex; gap: 4px; overflow-x: auto; padding-bottom: 16px; margin-bottom: 4px; }
  .company-section-nav .section-kicker { display: none; }
  .company-section-nav button { flex: none; font-size: 12px; padding: 10px; }
  .company-content .form-footer { align-items: stretch; }
  .company-content .form-footer .button { width: 100%; }
  .skeleton-grid { grid-template-columns: minmax(0,1fr); }
  .skeleton { min-height: 180px; }
  .skeleton-title { min-height: 0; }
}

/* Account stays at the end of the bottom rail; company settings live in it. */
@media (max-width: 767px) {
  .sidebar { flex-direction: row; align-items: stretch; gap: 4px; }
  .sidebar nav { flex: 1; width: auto; grid-template-columns: repeat(5,minmax(0,1fr)); grid-auto-rows: auto; gap: 2px; overflow: visible; }
  .sidebar-account { flex: 0 0 48px; width: 48px; margin: 0; padding: 0; border: 0; }
  .sidebar-account .sidebar-bottom { display: none; }
  #account-menu > summary { min-height: 68px; max-width: none; gap: 4px; padding: 6px 2px; }
  .account-avatar { width: 24px; height: 24px; font-size: 10px; }
  .account-trigger-label { font-size: 10px; line-height: 14px; }
  .account-menu-panel { position: fixed; top: auto; left: auto; right: 12px; bottom: calc(92px + env(safe-area-inset-bottom, 0px)); width: min(336px,calc(100vw - 24px)); max-height: calc(100dvh - 112px - env(safe-area-inset-bottom, 0px)); padding: 18px; }
  #account-role { display: inline-flex; }
}