/*
 * Admin master-list tables: stacked rows + DataLabels on narrow viewports (same pattern as Events list).
 * Scope under .admin-master-list-page so global styles stay predictable.
 */

.admin-master-list-page {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.admin-master-list-page .admin-master-list-table {
    width: 100%;
    max-width: 100%;
}

@media (max-width: 959.98px) {
    .admin-master-list-page .admin-master-list-table .mud-table-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .admin-master-list-page .mud-table-toolbar {
        flex-wrap: wrap;
        gap: 0.5rem;
        align-items: center;
    }

    .admin-master-list-page .mud-table-toolbar-content {
        flex-wrap: wrap;
        gap: 0.5rem;
        max-width: 100%;
    }
}

/*
 * Stacked mode (Breakpoint.Md → mud-md-table below lg).
 * Keep “Actions” label inline with Edit/Delete controls.
 */
@media (max-width: 1279.98px) {
    .admin-master-list-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-cell.admin-master-list-actions-cell {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        column-gap: 0.75rem;
    }

    .admin-master-list-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-cell.admin-master-list-actions-cell::before {
        content: attr(data-label);
        white-space: nowrap !important;
        flex: 0 0 auto !important;
        padding-right: 0 !important;
        padding-inline-end: 0 !important;
    }

    .admin-master-list-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-cell.admin-master-list-actions-cell > .admin-master-list-actions-inner {
        flex: 1 1 auto;
        min-width: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        align-items: center;
        justify-content: flex-start;
    }

    /* e.g. New Profiles: MudStack row with multiple buttons — allow wrap in stacked mode */
    .admin-master-list-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-cell.admin-master-list-actions-cell > .admin-master-list-actions-inner > .mud-stack {
        flex-wrap: wrap !important;
    }
}

/*
 * Admin → New Profiles: smaller action buttons on phones; labels stay on one line (scroll row if needed).
 */
@media (max-width: 600px) {
    /* Match stacked-row specificity so nowrap wins over the generic master-list wrap rule */
    .admin-master-list-page.admin-new-profiles-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-cell.admin-master-list-actions-cell > .admin-master-list-actions-inner > .mud-stack,
    .admin-master-list-page.admin-new-profiles-page .admin-master-list-actions-cell > .admin-master-list-actions-inner > .mud-stack {
        flex-wrap: nowrap !important;
        gap: 0.35rem !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        justify-content: flex-start !important;
        align-items: center !important;
        padding-bottom: 4px;
    }

    .admin-master-list-page.admin-new-profiles-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-cell.admin-master-list-actions-cell .mud-button-root:not(.mud-icon-button),
    .admin-master-list-page.admin-new-profiles-page .admin-master-list-actions-cell .mud-button-root:not(.mud-icon-button) {
        font-size: 0.6875rem !important;
        letter-spacing: 0 !important;
        padding: 4px 7px !important;
        min-height: unset !important;
        height: auto !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    .admin-master-list-page.admin-new-profiles-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-cell.admin-master-list-actions-cell .mud-button-root:not(.mud-icon-button) .mud-button-label,
    .admin-master-list-page.admin-new-profiles-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-cell.admin-master-list-actions-cell .mud-button-root:not(.mud-icon-button) .mud-button-label-text,
    .admin-master-list-page.admin-new-profiles-page .admin-master-list-actions-cell .mud-button-root:not(.mud-icon-button) .mud-button-label,
    .admin-master-list-page.admin-new-profiles-page .admin-master-list-actions-cell .mud-button-root:not(.mud-icon-button) .mud-button-label-text {
        white-space: nowrap !important;
    }

    .admin-master-list-page.admin-new-profiles-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-cell.admin-master-list-actions-cell .mud-button-root:not(.mud-icon-button) .mud-icon-root,
    .admin-master-list-page.admin-new-profiles-page .admin-master-list-actions-cell .mud-button-root:not(.mud-icon-button) .mud-icon-root {
        font-size: 1rem !important;
        margin-right: 2px !important;
        margin-inline-end: 2px !important;
    }

    .admin-master-list-page.admin-new-profiles-page .mud-table-toolbar .mud-button-root:not(.mud-icon-button) {
        font-size: 0.75rem !important;
        padding: 6px 10px !important;
        white-space: nowrap !important;
        min-height: unset !important;
        line-height: 1.25 !important;
    }
}

/*
 * Admin → New Profiles: stacked table rows (“cards”) span the full viewport width on phones/tablets
 * by cancelling MainLayout MudContainer gutters and avoiding MudPaper clipping.
 */
@media (max-width: 959.98px) {
    .admin-panel-shell:has(.admin-new-profiles-page) .admin-panel-paper.mud-paper {
        overflow-x: visible !important;
        overflow-y: visible !important;
        border-radius: 0 !important;
    }

    /* Mud default container gutter is typically 16px below lg */
    .admin-master-list-page.admin-new-profiles-page {
        width: calc(100% + 32px);
        max-width: none;
        margin-left: -16px;
        margin-right: -16px;
        box-sizing: border-box;
    }

    .admin-master-list-page.admin-new-profiles-page .admin-new-profiles-inner.mud-container {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: none !important;
    }

    .admin-master-list-page.admin-new-profiles-page .mud-grid > .mud-grid-item {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .admin-master-list-page.admin-new-profiles-page .admin-master-list-table,
    .admin-master-list-page.admin-new-profiles-page .admin-master-list-table .mud-table-container {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    .admin-master-list-page.admin-new-profiles-page .admin-master-list-table.mud-md-table .mud-table-body .mud-table-row {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border-radius: 0 !important;
        box-sizing: border-box;
    }
}

@media (max-width: 600px) {
    /* Match mobile-global `.mud-main-content .mud-container` 12px gutters */
    .admin-master-list-page.admin-new-profiles-page {
        width: calc(100% + 24px);
        margin-left: -12px;
        margin-right: -12px;
    }
}