/* All layout changes are restricted to phones. Original table cells remain the data source. */
.mobile-table-steps { display: none; }
@media (max-width: 767px) {
    table.fixedHeader-floating { display: none !important; }
    table.mobile-flow-table, table.mobile-flow-table *, .mobile-table-steps, .mobile-table-steps * { box-sizing: border-box; }
    .mobile-table-steps { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px; background: #fff; border-bottom: 1px solid #e7ebf3; font-family: inherit; }
    .mobile-table-steps button { flex: 1 1 80px; min-height: 44px; padding: 8px; border: 1px solid #e7ebf3; border-radius: 12px; background: #fff; color: #475467; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
    .mobile-table-steps button[aria-pressed="true"] { background: #4f46e5; color: #fff; border-color: #4f46e5; }
    .mobile-table-steps button[hidden] { display: none; }
    .mobile-table-steps[hidden] { display: none; }
    .mobile-table-steps button:focus-visible { outline: 3px solid #c7d2fe; outline-offset: 2px; }
    .mobile-table-status { width: 100%; color: #667085; font-size: 12px; padding: 2px 0; }
    .table-responsive:has(.mobile-flow-table), .sm-table-wrap:has(.mobile-flow-table), #clResultArea:has(.mobile-flow-table) { overflow-x: visible; min-width: 0; max-width: 100%; }
    table.mobile-flow-table { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; table-layout: auto !important; border: 0 !important; margin: 0 !important; }
    table.mobile-flow-table > colgroup { display: none; }
    table.mobile-flow-table > thead { display: block; position: relative; }
    table.mobile-flow-table > thead > tr { display: block; }
    /* Keep real headers available to screen readers and DataTables :visible exports. */
    table.mobile-flow-table > thead > tr > th { display: block !important; position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden; clip-path: inset(50%); }
    table.mobile-flow-table > thead > tr > th[data-mobile-column-hidden], table.mobile-flow-table > tfoot { display: none !important; }
    table.mobile-flow-table > thead > tr > th[data-mobile-select-all]:not([data-mobile-column-hidden]) { display: flex !important; position: static !important; width: auto !important; height: auto !important; margin: 0 !important; overflow: visible; clip-path: none; align-items: center; gap: 10px; padding: 12px !important; }
    table.mobile-flow-table > thead > tr > th[data-mobile-select-all]::after { content: 'Select all'; font-size: 13px; text-transform: none; letter-spacing: 0; }
    table.mobile-flow-table > tbody { display: grid !important; gap: 12px; padding: 12px; width: 100%; }
    table.mobile-flow-table > tbody > tr.mobile-flow-record { display: grid !important; grid-template-columns: 32px minmax(0,1fr); width: 100% !important; border: 1px solid #e7ebf3; border-radius: 16px; background: #fff !important; box-shadow: 0 4px 12px rgba(15,23,42,.03); overflow: hidden; }
    table.mobile-flow-table > tbody > tr.mobile-flow-record > td { display: none !important; grid-column: 1/-1; min-width: 0 !important; max-width: 100% !important; width: auto !important; white-space: normal !important; overflow-wrap: anywhere; padding: 10px 14px !important; border: 0 !important; box-shadow: none !important; background: transparent !important; }
    table.mobile-flow-table > tbody > tr.mobile-flow-record > td::before { content: attr(data-mobile-label); display: block; color: #667085; font-size: 11px; font-weight: 700; letter-spacing: .03em; margin-bottom: 5px; }
    table.mobile-flow-table td[data-mobile-group="identity"]::before, table.mobile-flow-table td[data-mobile-group="selection"]::before { display: none !important; }
    table.mobile-flow-table > tbody > tr.mobile-flow-record > td[data-mobile-group="identity"]:not([data-mobile-column-hidden]),
    table.mobile-flow-table > tbody > tr.mobile-flow-record > td[data-mobile-group="selection"]:not([data-mobile-column-hidden]),
    table.mobile-flow-table[data-mobile-view="overview"] > tbody > tr.mobile-flow-record > td[data-mobile-group="overview"]:not([data-mobile-column-hidden]),
    table.mobile-flow-table[data-mobile-view="details"] > tbody > tr.mobile-flow-record > td[data-mobile-group="details"]:not([data-mobile-column-hidden]),
    table.mobile-flow-table[data-mobile-view="actions"] > tbody > tr.mobile-flow-record > td[data-mobile-group="actions"]:not([data-mobile-column-hidden]) { display: block !important; }
    table.mobile-flow-table td[data-mobile-group="identity"] { font-weight: 700; border-bottom: 1px solid #eef2f6 !important; }
    table.mobile-flow-table > tbody > tr.mobile-flow-record > td[data-mobile-group="selection"] { grid-column: 1; grid-row: 1; align-self: center; padding-right: 0 !important; }
    table.mobile-flow-table > tbody > tr.mobile-flow-record:has(td[data-mobile-group="selection"]) > td[data-mobile-group="identity"] { grid-column: 2; grid-row: 1; }
    table.mobile-flow-table td :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) { width: 100%; max-width: 100%; min-height: 44px; }
    table.mobile-flow-table td :is(button,.btn) { min-height: 44px; max-width: 100%; white-space: normal; }
    table.mobile-flow-table td :is(.people-leads-person,.people-lead-score-reason,.sm-person) { width: auto !important; min-width: 0 !important; max-width: 100% !important; }
    table.mobile-flow-table td :is(.people-leads-person strong,.people-leads-person span) { white-space: normal !important; }
    table.mobile-flow-table td img { max-width: 100%; }
    .people-floating-scroll:has(+ .mobile-flow-table), .people-leads-page:has(table.mobile-flow-table) .people-floating-scroll { display: none !important; }
}
