/* Global responsive tables. On phones, wide list tables (.table-responsive > table.table) stack
   into labeled cards so nothing runs off the side of the screen. Desktop is unchanged: every rule
   lives inside the phone media query. Each body cell's column name is shown from its data-label
   attribute, which responsive-tables.js copies from the table's own <thead>. Diocese portal tables
   (.dp-table) keep their own dedicated card-stack (diocese-portal.css) and are excluded here. Add
   class "rt-no-stack" to any table that should stay a normal scrolling table on phones. */
@media (max-width:575.98px){
.table-responsive > table.table:not(.dp-table):not(.rt-no-stack){display:block; width:100%}
.table-responsive > table.table:not(.dp-table):not(.rt-no-stack) thead{display:none}
.table-responsive > table.table:not(.dp-table):not(.rt-no-stack) tbody, .table-responsive > table.table:not(.dp-table):not(.rt-no-stack) tfoot{display:block; width:100%}
.table-responsive > table.table:not(.dp-table):not(.rt-no-stack) tr{display:block; border:1px solid #DEE2E6; border-radius:.5rem; margin-bottom:.75rem; padding:.65rem .9rem; background:#FFF; box-shadow:0 1px 6px rgba(40,40,40,.05)}
.table-responsive > table.table:not(.dp-table):not(.rt-no-stack) td{display:block; width:100%; border:0 !important; padding:.28rem 0 !important; text-align:left !important; white-space:normal}
.table-responsive > table.table:not(.dp-table):not(.rt-no-stack) td:empty{display:none}
.table-responsive > table.table:not(.dp-table):not(.rt-no-stack) td[data-label]::before{content:attr(data-label); display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.03em; font-weight:700; color:#6C757D; margin-bottom:.05rem}
.table-responsive > table.table:not(.dp-table):not(.rt-no-stack) td .btn{display:block; width:100%; margin-bottom:.2rem}
}