﻿/* MASTER LIST — requires master-theme.css. Opt in with .master-page.master-list.
   Apply master-list-grid to MudDataGrid/XSDataGrid; keep all server callbacks.
   Place master-list-toolbar inside ToolBarContent. */
.master-list {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

    .master-list .master-list-grid {
        border: 1px solid var(--master-border);
        border-radius: var(--master-radius);
        background: #ffffffeb;
        box-shadow: 0 10px 30px #244c7d07;
        overflow: hidden;
    }

.master-list-grid .mud-table-toolbar {
    height: auto;
    min-height: 72px;
    padding: 16px;
}

.master-list-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    width: 100%;
    min-width: 0;
}

.master-list-search {
    width: clamp(220px, 25vw, 340px);
    max-width: 100%;
    margin-left: auto;
}

    .master-list-search .mud-input-control {
        margin: 0;
    }

    .master-list-search .mud-input-outlined {
        border-radius: 10px;
        font-family: inherit;
        font-size: .86rem;
        background: #fbfdff;
    }

    .master-list-search .mud-input-outlined-border {
        border-color: #ccdbec;
    }

    .master-list-search .mud-input-adornment {
        color: #6a8ab0;
    }
/* Table scrolls horizontally on small screens; columns are never hidden. */
.master-list-grid .mud-table-container {
    overflow-x: auto;
}

.master-list-grid .mud-table-root {
    font-family: inherit;
}

.master-list-grid .mud-table-head .mud-table-cell {
    background: #eef5ff;
    color: #285898;
    font-size: .79rem;
    font-weight: 700;
    padding: 14px 16px;
    border-bottom: 1px solid #d8e4f0;
    white-space: nowrap;
}

.master-list-grid .mud-table-body .mud-table-cell {
    color: #3d5670;
    font-size: .85rem;
    padding: 13px 16px;
    border-color: #e6edf5;
}

.master-list-grid .mud-table-body .mud-table-row:nth-child(even) {
    background: #f9fbff;
}

.master-list-grid .mud-table-body .mud-table-row:hover {
    background: #edf5ff;
}

.master-list-grid .mud-table-pagination {
    border-top: 1px solid #e0e9f3;
    color: #58728e;
    font-size: .8rem;
    padding: 8px 12px;
}
/* Row action buttons: readable view/edit/delete colours, retained tooltips. */
.master-list .master-row-actions {
    white-space: nowrap;
    width: 1%;
}

.master-list .master-row-button {
    min-width: 32px;
    width: 32px;
    height: 32px;
    border-radius: 50% !important;
    margin: 2px 3px;
    box-shadow: none;
}

.master-list .master-row-view {
    background: #e2edff;
    color: #245ed3;
}

.master-list .master-row-edit {
    background: #fff1ca;
    color: #936000;
}

.master-list .master-row-delete {
    background: #ffe5e9;
    color: #bd304a;
}

.master-list .master-row-view:hover {
    background: #cfe1ff;
}

.master-list .master-row-edit:hover {
    background: #ffe8a7;
}

.master-list .master-row-delete:hover {
    background: #ffd0d9;
}

.master-list .master-row-button .mud-icon-root {
    color: inherit;
}

.master-list-empty {
    padding: 40px 20px;
    text-align: center;
    color: var(--master-muted);
}

@media (max-width: 600px) {
    .master-list-grid .mud-table-toolbar {
        padding: 14px 12px;
    }

    .master-list-toolbar {
        gap: 14px;
    }

    .master-list-search {
        width: 100%;
        margin-left: 0;
    }

    .master-list-toolbar > .master-action-group {
        width: 100%;
    }

    .master-list-toolbar .master-button {
        flex: 1;
    }

    .master-list-grid .mud-table-pagination {
        flex-wrap: wrap;
        justify-content: center;
    }
}
