/* V72 — shared small-screen layout for every authenticated account.
   Keep wide data tables inside their own scrolling region; do not clip the page. */
.v72-activity-picker,.v72-calendar-date,.v72-touch-compose-hint,.v72-agenda-list { display:none; }
/* A table's intrinsic width must not become its enclosing grid item's width. */
body[data-portal] .v35-pane>* { min-width:0; max-width:100%; }
/* Conversation previews may be very long, including on a desktop. A grid item
   must shrink before its existing text ellipsis can take effect. */
body[data-portal] .v59-client-conversations,
body[data-portal] .v59-client-conversations>button { min-width:0; max-width:100%; }
body[data-portal] .v59-client-conversations>button>span:first-child {
  min-width:0; overflow-wrap:break-word; overflow-wrap:anywhere;
}

@media (max-width:850px) {
  body[data-portal] :is(.portal,.work-area,.main,.stack,.panel,.fields,.field,
    .form-grid,.v35-pane,#v35-team,#v27-training,#v52-calendar,.v52-calendar-panel,
    .v59-client-inbox,.v59-client-thread,.v70-mailboxes) { min-width:0; max-width:100%; }
  body[data-portal] :is(.main,.panel,.modal-body) :is(h1,h2,h3,h4,p,dd,legend) { overflow-wrap:break-word; overflow-wrap:anywhere; }
  body[data-portal] :is(.field,.form-grid,.fields)>* { min-width:0; }
  body[data-portal] :is(.table-scroll,.v26-calendar-table,.v27-agenda-scroll,
    .v52-calendar-scroll,.v36-chart-scroll) { min-width:0; width:100%; max-width:100%; overflow:auto; }
  body[data-portal] .sidebar { width:min(320px,calc(100vw - 32px)); max-width:calc(100vw - 32px); }
  body[data-portal] .sidebar .navigation { min-height:0; overflow-y:auto; overscroll-behavior:contain; }
  body[data-portal] .sidebar-foot { flex-shrink:0; padding-bottom:max(16px,env(safe-area-inset-bottom)); }
  body[data-portal] .nav-item { min-height:44px; }
  body[data-portal] .nav-item>span { min-width:0; white-space:normal; overflow-wrap:break-word; overflow-wrap:anywhere; }
  body[data-portal] .portal .topbar { height:auto; min-height:76px; }
  /* Intermediate tablets use the same controls, with content-sized wrapping. */
  body[data-portal] .page-heading>.toolbar { min-width:0; max-width:100%; flex-wrap:wrap; }
  body[data-portal] .page-heading>.toolbar>.button {
    flex:0 1 auto; min-width:0; max-width:100%; height:auto; white-space:normal;
    overflow-wrap:break-word; overflow-wrap:anywhere; line-height:1.35;
  }
}

@media (max-width:700px) {
  /* Content decides when actions wrap: long labels never share a squeezed row. */
  body[data-portal] :is(.toolbar,.form-actions,.v35-actions,.v54-control-actions,
    .v70-mail-toolbar,.v70-mail-row-actions,.v59-client-thread-tools,
    .v59-client-pagination,.v59-conversation-actions,.v60-message-tools,.v28-doc-toolbar) {
    min-width:0; max-width:100%; flex-wrap:wrap; gap:10px;
  }
  body[data-portal] :is(.toolbar,.form-actions,.v35-actions,.v54-control-actions,
    .v70-mail-toolbar,.v70-mail-row-actions,.v59-client-thread-tools,
    .v59-client-pagination,.v59-conversation-actions,.v60-message-tools,.v28-doc-toolbar) .button {
    flex:0 1 auto; min-width:0; max-width:100%; height:auto; min-height:44px;
    white-space:normal; overflow-wrap:break-word; overflow-wrap:anywhere; word-break:normal; line-height:1.35;
  }
  body[data-portal] .button :is(.icon,svg) { flex-shrink:0; }
  body[data-portal] :is(.page-heading,.v35-section-head,.v52-calendar-heading,
    .v54-control-heading) { flex-direction:column; align-items:stretch; gap:16px; }
  body[data-portal] :is(.page-heading,.v35-section-head)>.toolbar {
    display:grid; grid-template-columns:minmax(0,1fr); width:100%; gap:10px;
  }
  body[data-portal] :is(.page-heading,.v35-section-head)>.toolbar>.button {
    width:100%; flex:none; justify-content:center; padding:12px 16px;
  }
  body[data-portal] .panel-header { flex-wrap:wrap; gap:12px; }
  body[data-portal] .panel-header>div { min-width:0; }
  body[data-portal] .client-pagination { width:100%; min-width:0; }
  body[data-portal] .client-pagination .cell-actions {
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; min-width:0;
    max-width:100%; gap:8px; overflow:visible; padding:0;
  }
  body[data-portal] .client-pagination .cell-actions .button {
    width:100%; min-width:0; height:auto; min-height:44px; padding:10px;
    white-space:normal; overflow-wrap:break-word; overflow-wrap:anywhere; line-height:1.35;
  }
  body[data-portal] :is(.row,.form-actions) { flex-wrap:wrap; }
  body[data-portal] :is(.row,.form-actions)>.field { min-width:0; flex:1 1 180px; }
  body[data-portal] :is(.form-grid,.branding-grid,.client-profile-data,
    .v37-contact-fields,.v26-calendar-detail) { grid-template-columns:minmax(0,1fr); }
  body[data-portal] .form-grid>.span-2 { grid-column:1/-1; }
  body[data-portal] :is(input,select,textarea) { max-width:100%; }
  body[data-portal] :is(.field,.v38-wf-filters) :is(input,select,textarea) {
    min-width:0; font-size:16px;
  }
  body[data-portal] :is(.readonly,.notice-card,.hint,.pill) { overflow-wrap:break-word; overflow-wrap:anywhere; }
  body[data-portal] .v54-analysis { width:100%; min-width:0; }
  body[data-portal] .v54-analysis-filters { grid-template-columns:minmax(0,1fr); }
  body[data-portal] .v54-analysis-filters>label { min-width:0; }
  body[data-portal] .v54-analysis-filters :is(input,select) { width:100%; min-width:0; font-size:16px; }
  body[data-portal] .v54-analysis-metrics article { min-width:0; padding:16px 12px; }
  body[data-portal] .v54-analysis-metrics article>* { min-width:0; overflow-wrap:break-word; overflow-wrap:anywhere; }

  /* One labelled native selector replaces the six-row sticky activity menu.
     It uses the same role-filtered sections and the same changeTab handler. */
  body[data-portal] #v35-team>.v72-activity-picker {
    display:grid; gap:7px; padding:14px; margin:0 0 20px;
    background:#e1e8ee; border:1px solid #c5d5dd; border-radius:14px;
  }
  body[data-portal] .v72-activity-picker label { margin:0; font-size:14px; font-weight:700; color:#34515b; }
  body[data-portal] #v35-team .v72-activity-picker select {
    width:100%; min-width:0; max-width:100%; min-height:48px; padding:10px 34px 10px 12px;
    background-color:#fff; border:1px solid #9eb8c5; border-radius:10px; color:#244c42; font-family:inherit; font-size:16px; font-weight:600; line-height:1.4;
  }
  body[data-portal] #v35-team>.v35-tabs { display:none; }
  body[data-portal] #v35-team>.v54-future-row { position:static; flex-wrap:wrap; }

  /* Mailbox search and conversations stay above the selected discussion.
     Only the history scrolls; the composer no longer requires a 600px panel. */
  body[data-portal] .v36-mailbox.v37-whatsapp {
    display:flex; flex-direction:column; width:100%; max-width:100%; min-width:0;
    height:auto; min-height:0; border-radius:14px;
  }
  body[data-portal] .v37-whatsapp .v36-conversations {
    width:100%; min-width:0; max-width:100%; max-height:none; flex:none;
    border-right:0; border-bottom:1px solid #c9d7ce;
  }
  body[data-portal] .v37-whatsapp .v37-conversation-list {
    display:flex; flex-direction:row; width:100%; min-width:0; max-width:100%;
    gap:8px; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain;
    padding:0 10px 10px; box-sizing:border-box; scroll-snap-type:x proximity;
  }
  body[data-portal] .v37-whatsapp .v36-conversation {
    width:250px; min-width:0; max-width:calc(100vw - 70px); flex:0 0 250px;
    min-height:100px; padding:10px; scroll-snap-align:start;
  }
  body[data-portal] .v37-whatsapp .v36-conversation .v35-avatar {
    width:42px; min-width:42px; height:42px; flex-basis:42px;
  }
  body[data-portal] .v37-whatsapp .v37-conversation-name strong { font-size:16px; }
  body[data-portal] .v37-whatsapp .v36-thread {
    width:100%; min-width:0; height:auto; min-height:0; max-height:none;
  }
  body[data-portal] .v37-whatsapp .v36-thread-heading { flex-wrap:wrap; padding:14px 12px; gap:10px; }
  body[data-portal] .v37-whatsapp .v37-thread-contact { flex:1 1 160px; min-width:0; }
  body[data-portal] .v37-whatsapp .v36-thread-heading h3 { font-size:19px; overflow-wrap:break-word; overflow-wrap:anywhere; }
  body[data-portal] .v37-whatsapp .v36-thread-heading .v35-avatar {
    width:44px; min-width:44px; height:44px; flex-basis:44px;
  }
  body[data-portal] .v37-whatsapp .v59-conversation-actions { width:100%; margin:0; justify-content:flex-start; }
  body[data-portal] .v37-whatsapp .v59-conversation-actions .button { flex:1 1 140px; }
  body[data-portal] .v37-whatsapp .v36-thread-messages {
    flex:0 1 auto; height:auto; min-height:140px; max-height:55vh; max-height:55svh; overflow-y:auto;
    overscroll-behavior-y:contain; padding:16px 12px;
  }
  body[data-portal] .v37-whatsapp .v36-thread-messages .v35-message {
    min-width:0; max-width:94%; padding:12px 48px 12px 12px; overflow-wrap:break-word; overflow-wrap:anywhere;
  }
  body[data-portal] .v37-whatsapp .v36-thread-messages .v35-message p { font-size:16px; line-height:1.55; }
  body[data-portal] .v37-whatsapp .v35-message-compose {
    min-width:0; max-width:100%; padding:12px; gap:10px; flex:none;
  }
  body[data-portal] .v37-whatsapp .v37-composer-client .field {
    display:grid; grid-template-columns:minmax(0,1fr); gap:6px;
  }
  body[data-portal] .v37-whatsapp .v37-composer-client label { white-space:normal; font-size:13px; }
  body[data-portal] .v37-whatsapp .v37-composer-client select { min-height:44px!important; height:auto!important; font-size:16px!important; }
  body[data-portal] .v37-whatsapp .v37-composer-row { align-items:flex-end; min-width:0; gap:8px; }
  body[data-portal] .v37-whatsapp .v37-composer-row>textarea {
    flex:1 1 0; width:0; min-width:0; min-height:48px!important; max-height:140px; font-size:16px!important;
  }
  body[data-portal] .v37-whatsapp .v36-send { min-width:48px; width:48px; height:48px; flex:0 0 48px; padding:10px!important; }
  body[data-portal] .v37-whatsapp .v36-send span { display:none; }
  body[data-portal] .v37-whatsapp .v38-attach-row { flex-wrap:wrap; gap:8px; }
  body[data-portal] .v37-whatsapp .v38-attach-button { min-height:44px; font-size:14px; }
  body[data-portal] .v37-composer-hint { font-size:12px; text-align:left; }
  body[data-portal] .v72-keyboard-compose-hint { display:none; }
  body[data-portal] .v72-touch-compose-hint { display:inline; }
  body[data-portal] .v59-client-thread { min-width:0; }
  body[data-portal] .v59-client-message,
  body[data-portal] .v59-client-message.is-own { margin:10px 0; padding:14px; min-width:0; }
  body[data-portal] .v59-client-conversations>button { min-width:0; flex-wrap:wrap; gap:10px; }
  body[data-portal] .v59-client-thread-tools>.button { flex:1 1 180px; }

  /* Mission calendar becomes a dated agenda: every event and action is kept. */
  body[data-portal] .v52-calendar-period { display:grid; grid-template-columns:44px minmax(0,1fr) 44px; width:100%; gap:8px; }
  body[data-portal] .v52-calendar-period h3 { min-width:0; font-size:18px; }
  body[data-portal] .v52-calendar-period>.button { width:100%; min-width:0; padding:10px; min-height:44px; }
  body[data-portal] .v52-calendar-period [data-action="v52-calendar-today"] { grid-column:1/-1; }
  body[data-portal] .v52-calendar-toolbar .field { width:100%; min-width:0; }
  body[data-portal] .v52-calendar-toolbar::after { content:none; }
  body[data-portal] .v52-calendar-grid { min-width:0; width:100%; }
  body[data-portal] .v52-calendar-weekdays { display:none; }
  body[data-portal] .v52-calendar-days { display:grid; grid-template-columns:minmax(0,1fr); }
  body[data-portal] .v52-calendar-day { min-height:0; border-right:0; padding:0 10px 8px; }
  body[data-portal] .v52-calendar-day>header { padding:10px 0; flex-wrap:wrap; }
  body[data-portal] .v52-calendar-day>header>strong { display:none; }
  body[data-portal] .v52-calendar-date { display:inline; font-weight:700; font-size:15px; }
  body[data-portal] .v52-calendar-event button,
  body[data-portal] .v52-calendar-absence { font-size:14px; min-height:44px; }
  body[data-portal] .v52-calendar-event strong { font-size:16px; }
  body[data-portal] .v52-calendar-event small { font-size:12px; }
  body[data-portal] .v52-calendar-event .v55-calendar-contacts>button,
  body[data-portal] .v52-calendar-event .v54-calendar-report,
  body[data-portal] .v52-calendar-event .v52-calendar-options { font-size:13px; min-height:44px; }
  /* Boutique bookings can span several desktop columns. Their phone view is
     a dated list built from the same bookings, slots and detail actions. */
  body[data-portal] #v27-training .v27-agenda-scroll { display:none; }
  body[data-portal] .v72-agenda-list { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
  body[data-portal] .v72-agenda-day { min-width:0; border:1px solid #b4c6d4; border-radius:12px; padding:12px; background:#f8fafb; }
  body[data-portal] .v72-agenda-day.today { border-color:#438b68; box-shadow:inset 0 0 0 1px #438b68; }
  body[data-portal] .v72-agenda-day h3 { margin:0 0 12px; font-size:16px; line-height:1.4; }
  body[data-portal] .v72-agenda-day :is(.v28-booking-span,.v27-agenda-booking) {
    display:block; width:100%; max-width:100%; min-width:0; min-height:44px;
    margin:0 0 10px; padding:12px; font-size:14px;
  }
  body[data-portal] .v72-agenda-day>button:last-child { margin-bottom:0; }
  body[data-portal] .v72-agenda-day :is(.v28-booking-span,.v27-agenda-booking) :is(strong,span,small) {
    white-space:normal; overflow:visible; overflow-wrap:break-word; overflow-wrap:anywhere; text-overflow:clip;
  }
  body[data-portal] .v72-agenda-day :is(.v31-booking-client,.v27-agenda-booking strong) { font-size:16px; }
  body[data-portal] .v72-agenda-day :is(small,.v31-booking-formula,.v27-agenda-booking span) { font-size:13px; }
  body[data-portal] .v27-agenda-toolbar { display:grid; grid-template-columns:44px minmax(0,1fr) 44px; gap:10px; }
  body[data-portal] .v27-agenda-toolbar h2 { min-width:0; font-size:18px; }
  body[data-portal] .v27-agenda-toolbar>.button { min-width:0; min-height:44px; padding:10px; white-space:normal; }
  body[data-portal] .v27-agenda-toolbar :is([data-action="v27-training-today"],[data-action="v27-training-nearest"],.hint) { grid-column:1/-1; width:100%; margin:0; }
  body[data-portal] :is(.v27-training-tabs,.v52-planning-tabs,.v27-finance-tabs,.v28-doc-tabs) { width:100%; max-width:100%; }
  body[data-portal] :is(.v27-training-tabs,.v52-planning-tabs,.v27-finance-tabs,.v28-doc-tabs) button { min-width:0; white-space:normal; overflow-wrap:break-word; overflow-wrap:anywhere; min-height:44px; }
  body[data-portal] .v28-doc-filters label,
  body[data-portal] .v28-doc-filters label:first-child { min-width:0; width:100%; flex:1 1 100%; }
  body[data-portal] .v26-calendar-toolbar .field { flex:1 1 100%; min-width:0; }
  body[data-portal] .v27-agenda-toolbar h2 { min-width:0; }
  body[data-portal] .v26-calendar-period .hint { white-space:normal; }
  body[data-portal] .v27-time-range { flex-wrap:wrap; }
  body[data-portal] .v27-time-range label { flex:1 1 100px; }

  /* Native dialogs keep their scrollable body and visible close/save actions. */
  body[data-portal] #modal { width:calc(100vw - 16px); max-width:calc(100vw - 16px); margin:auto; max-height:calc(100vh - 16px); max-height:calc(100dvh - 16px); }
  body[data-portal] #modal .modal-inner { max-width:100%; max-height:calc(100vh - 18px); max-height:calc(100dvh - 18px); }
  body[data-portal] #modal .modal-header { padding:14px; gap:10px; align-items:flex-start; }
  body[data-portal] #modal .modal-header h2 { font-size:21px; line-height:1.3; }
  body[data-portal] #modal .modal-header>div { min-width:0; flex:1; }
  body[data-portal] #modal .modal-header .close-button { min-height:44px; padding:10px; }
  body[data-portal] #modal .modal-body { min-width:0; padding:16px; scrollbar-gutter:auto; }
  body[data-portal] #modal :is(.form-actions,.modal-form-footer,.v37-profile-footer,.v53-expense-footer) {
    display:flex; flex-wrap:wrap; gap:8px; padding:12px 14px max(12px,env(safe-area-inset-bottom));
  }
  body[data-portal] #modal :is(.form-actions,.modal-form-footer,.v37-profile-footer,.v53-expense-footer)>.button {
    flex:1 1 160px; min-width:0; max-width:100%; white-space:normal; overflow-wrap:break-word; overflow-wrap:anywhere;
    height:auto; min-height:44px; line-height:1.35;
  }
  body[data-portal] #modal :is(fieldset,legend,.field,.row,.v70-mail-modal) { min-width:0; max-width:100%; }
  body[data-portal] #modal .v70-mail-connection-row dd { flex-wrap:wrap; }
  body[data-portal] #modal .v70-mail-connection-row dd>span { flex:1 1 160px; }
  body[data-portal] #modal .v70-mail-connection-row .button { min-height:44px; }

  /* These document/signature/contact windows are native dialogs outside #modal. */
  body[data-portal] :is(#v26-export-dialog,#v29-document-preview,#v32-signature-dialog,
    .v30-billing-dialog,.v54-contact-dialog,.v55-trainer-dialog,#device-presets-dialog) {
    width:calc(100vw - 16px); max-width:calc(100vw - 16px); min-width:0;
    max-height:calc(100vh - 16px); max-height:calc(100dvh - 16px); box-sizing:border-box;
  }
  body[data-portal] :is(.v29-preview-header,.v32-signature-header,.v54-contact-dialog header,.v55-trainer-dialog>header) {
    gap:10px; padding:14px; align-items:flex-start;
  }
  body[data-portal] :is(.v29-preview-header,.v32-signature-header,.v54-contact-dialog header,.v55-trainer-dialog>header)>div {
    min-width:0; flex:1;
  }
  body[data-portal] :is(.v29-preview-header,.v32-signature-header,.v54-contact-dialog header,.v55-trainer-dialog>header) h2 {
    font-size:20px; overflow-wrap:break-word; overflow-wrap:anywhere; line-height:1.35;
  }
  body[data-portal] .v54-contact-dialog header .button { padding:10px; flex:none; }
  body[data-portal] .v54-contact-body { min-width:0; padding:14px; }
  body[data-portal] .v54-contact-body article { min-width:0; padding:14px; }
  body[data-portal] dialog .button { max-width:100%; min-width:0; min-height:44px; white-space:normal; overflow-wrap:break-word; overflow-wrap:anywhere; }
  body[data-portal] .v55-trainer-identity { flex-wrap:wrap; gap:12px; }
  body[data-portal] .v55-trainer-identity>div { min-width:0; }
  body[data-portal] .v55-trainer-body :is(h3,p) { overflow-wrap:break-word; overflow-wrap:anywhere; }
  body[data-portal] .v55-trainer-body dl { grid-template-columns:minmax(0,1fr); }
  body[data-portal] .v32-signature-details { grid-template-columns:minmax(0,1fr); }
  body[data-portal] .v32-signature-period { flex-direction:column; align-items:stretch; gap:8px; }
  body[data-portal] .v32-signature-period select { width:100%; min-width:0; font-size:16px; }
}

@media (max-width:380px) {
  body[data-portal] .portal .topbar { gap:8px; padding-inline:12px; }
  body[data-portal] .portal .topbar .portal-logout { padding-inline:10px; font-size:13px; }
  body[data-portal] .portal .topbar .identity .avatar { width:34px; height:34px; }
  body[data-portal] .main { padding-inline:12px; }
  body[data-portal] .panel { padding-inline:14px; }
}

@media (orientation: landscape) and (max-height:550px) {
  body[data-portal] #v35-team > .v35-tabs { position:static; }
}