/* Shared look for the admin list pages (Users, Roles, Modules).

   Global rather than scoped so the three pages share one copy. Every rule is rooted under
   .gm-admin, which goes on the page root, its filter slide-over and its modal panels, so none
   of it reaches other screens that reuse gm-* class names (the dashboard does).

   .gm-admin       tokens, colour and font; safe on any container
   .gm-admin-page  the page's vertical rhythm; only on the page root */

.gm-admin {
    --gm-navy-900: #10233F;
    --gm-navy-700: #284767;
    --gm-teal-700: #0B7D95;
    --gm-teal-600: #0D9F99;
    --gm-teal-500: #14C9B1;
    --gm-text-muted: #6F86A5;
    --gm-border: rgba(97, 139, 162, .2);
    --gm-card: #fff;
    --gm-shadow: 0 10px 30px rgba(28, 75, 98, .07);
    --gm-radius: 16px;

    color: var(--gm-navy-900);
    font-family: Inter, "Plus Jakarta Sans", Poppins, "Segoe UI", system-ui, sans-serif;
}

.gm-admin-page {
    display: grid;
    /* Rows size to their content. Without this the grid stretches them to fill a tall container,
       which blows the filter slide-over apart. */
    align-content: start;
    gap: .75rem;
}
.gm-admin h5,
.gm-admin p,
.gm-admin label,
.gm-admin small,
.gm-admin strong,
.gm-admin span,
.gm-admin input,
.gm-admin textarea,
.gm-admin button,
.gm-admin h1,
.gm-admin h2,
.gm-admin table {
    font-family: inherit;
}

/* --------------------------------------------------------------- page head */
.gm-admin .gm-admin-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

/* One slim row on every page: small title, subtitle after a dot, breadcrumb on the right. */
.gm-admin .gm-admin-head > div {
    display: flex;
    align-items: baseline;
    gap: .6rem;
    min-width: 0;
}

.gm-admin .gm-admin-head h1 {
    flex-shrink: 0;
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -.01em;
}

.gm-admin .gm-admin-head h1:focus {
    /* focused by FocusOnNavigate for screen readers; not tabbable, so no visible ring */
    outline: none;
}

.gm-admin .gm-admin-head p {
    margin: 0;
    overflow: hidden;
    font-size: .72rem;
    color: var(--gm-text-muted);
    white-space: nowrap;
    text-overflow: ellipsis;
}

.gm-admin .gm-admin-head p::before {
    content: "·";
    margin-right: .6rem;
    color: var(--gm-text-muted);
    opacity: .6;
}

.gm-admin .gm-admin-head .gm-crumbs {
    flex-shrink: 0;
    font-size: .7rem;
}

@media (max-width: 767.98px) {
    .gm-admin .gm-admin-head,
    .gm-admin .gm-admin-head > div {
        flex-wrap: wrap;
    }

    .gm-admin .gm-admin-head p {
        white-space: normal;
    }
}

.gm-admin .gm-crumbs {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .74rem;
    color: var(--gm-text-muted);
}

.gm-admin .gm-crumbs i {
    font-size: .9rem;
}

.gm-admin .gm-crumbs .sep {
    opacity: .5;
}

.gm-admin .gm-crumbs .current {
    color: var(--gm-teal-700);
    font-weight: 600;
}

/* ------------------------------------------------------------------- card */
.gm-admin .gm-card {
    background: var(--gm-card);
    border: 1px solid var(--gm-border);
    border-radius: var(--gm-radius);
    box-shadow: var(--gm-shadow);
}

.gm-admin .gm-card-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .7rem .8rem;
    border-bottom: 1px solid var(--gm-border);
}

.gm-admin .gm-card-head h2 {
    margin: 0 auto 0 0;
    font-size: .95rem;
    font-weight: 700;
}

.gm-admin .gm-search {
    position: relative;
    flex: 1 1 240px;
    max-width: 340px;
}

.gm-admin .gm-search i {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--gm-text-muted);
    pointer-events: none;
}

.gm-admin .gm-search input {
    width: 100%;
    height: 34px;
    padding: 0 .6rem 0 2rem;
    border: 1px solid var(--gm-border);
    border-radius: 10px;
    background: #fff;
    font-size: .78rem;
    color: var(--gm-navy-900);
    outline: none;
}

.gm-admin .gm-search input:focus {
    border-color: var(--gm-teal-500);
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .16);
}

.gm-admin .gm-btn {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    height: 34px;
    padding: 0 .75rem;
    border: 1px solid var(--gm-border);
    border-radius: 10px;
    background: #fff;
    color: var(--gm-navy-700);
    font-size: .78rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

/* Plain buttons only. Coloured variants used to inherit this near-white background on hover,
   which left their white text invisible; each variant now has its own hover state below. */
.gm-admin .gm-btn:not(.gm-btn-primary):not(.gm-btn-soft):not(.gm-btn-danger):not(.gm-btn-warn):hover:not(:disabled) {
    border-color: rgba(97, 139, 162, .34);
    background: #F1F8FA;
    color: var(--gm-navy-900);
}

.gm-admin .gm-btn:not(.gm-btn-primary):not(.gm-btn-soft):not(.gm-btn-danger):not(.gm-btn-warn):active:not(:disabled) {
    background: #E6F2F5;
}

.gm-admin .gm-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .3);
}

.gm-admin .gm-btn:disabled {
    opacity: .55;
    cursor: default;
}

.gm-admin .gm-btn-soft {
    border-color: rgba(13, 159, 153, .3);
    background: rgba(20, 201, 177, .1);
    color: var(--gm-teal-700);
}

.gm-admin .gm-btn-primary {
    border: 0;
    background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%);
    color: #fff;
}

.gm-admin .gm-btn.gm-btn-primary:hover:not(:disabled) {
    background: linear-gradient(90deg, #0A857F 0%, #12B9AB 100%);
    color: #fff;
    box-shadow: 0 4px 12px rgba(13, 159, 153, .28);
}

.gm-admin .gm-btn.gm-btn-primary:active:not(:disabled) {
    background: linear-gradient(90deg, #097772 0%, #10A699 100%);
    color: #fff;
    box-shadow: none;
}

.gm-admin .gm-btn.gm-btn-soft:hover:not(:disabled) {
    border-color: rgba(13, 159, 153, .45);
    background: rgba(20, 201, 177, .18);
    color: var(--gm-teal-700);
}

.gm-admin .gm-btn.gm-btn-soft:active:not(:disabled) {
    background: rgba(20, 201, 177, .26);
    color: var(--gm-teal-700);
}

/* ---------------------------------------------------------------- bulk bar */
.gm-admin .gm-bulk {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .45rem .8rem;
    border-bottom: 1px solid var(--gm-border);
    font-size: .76rem;
    color: var(--gm-navy-700);
}

.gm-admin .gm-bulk input[type=checkbox] {
    width: 15px;
    height: 15px;
    accent-color: var(--gm-teal-600);
    cursor: pointer;
}

.gm-admin .gm-bulk-count {
    font-weight: 600;
}

/* ------------------------------------------------------------------ table */
.gm-admin .gm-table-wrap {
    overflow-x: auto;
}

.gm-admin .gm-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .76rem;
}

.gm-admin .gm-table th {
    padding: .45rem .6rem;
    border-bottom: 1px solid var(--gm-border);
    background: #F7FBFC;
    font-weight: 600;
    color: var(--gm-text-muted);
    text-align: left;
    white-space: nowrap;
}

.gm-admin .gm-table td {
    padding: .4rem .6rem;
    border-bottom: 1px solid rgba(97, 139, 162, .12);
    white-space: nowrap;
    vertical-align: middle;
}

.gm-admin .gm-table tbody tr:hover {
    background: #FAFDFE;
}

.gm-admin .gm-table tr:last-child td {
    border-bottom: 0;
}

.gm-admin .gm-table input[type=checkbox] {
    width: 15px;
    height: 15px;
    accent-color: var(--gm-teal-600);
    cursor: pointer;
}

.gm-admin .gm-user-cell {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.gm-admin .gm-avatar {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 50%;
    background: var(--gm-avatar-bg, #E4F4F6);
    color: var(--gm-avatar-fg, #0B7D95);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .02em;
}

.gm-admin .gm-user-name {
    font-weight: 600;
}

.gm-admin .gm-pill {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .1rem .45rem;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 600;
}

.gm-admin .gm-pill i {
    font-size: .8rem;
}

.gm-admin .gm-pill.role {
    background: rgba(45, 114, 217, .1);
    color: #2D72D9;
}

.gm-admin .gm-pill.ok {
    background: rgba(11, 165, 143, .14);
    color: #0B8A77;
}

.gm-admin .gm-pill.off {
    background: rgba(228, 98, 111, .16);
    color: #C0384A;
}

.gm-admin .gm-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.gm-admin .gm-when {
    display: grid;
    line-height: 1.25;
}

.gm-admin .gm-when span {
    font-weight: 600;
}

.gm-admin .gm-when small {
    font-size: .66rem;
    color: var(--gm-text-muted);
}

.gm-admin .gm-actions {
    display: flex;
    gap: .25rem;
}

.gm-admin .gm-icon-btn {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border: 0;
    border-radius: 7px;
    background: var(--gm-icon-bg, #EEF3F7);
    color: var(--gm-icon-fg, var(--gm-navy-700));
    font-size: .85rem;
    cursor: pointer;
}

.gm-admin .gm-icon-btn:hover {
    filter: brightness(.95);
}

.gm-admin .gm-icon-view { --gm-icon-bg: #E6F3FB; --gm-icon-fg: #2D72D9; }
.gm-admin .gm-icon-edit { --gm-icon-bg: #E7F5F2; --gm-icon-fg: #0B8A77; }
.gm-admin .gm-icon-key { --gm-icon-bg: #FDF2E2; --gm-icon-fg: #B57611; }
.gm-admin .gm-icon-del { --gm-icon-bg: #FCEBEE; --gm-icon-fg: #C0384A; }
.gm-admin .gm-icon-post { --gm-icon-bg: #E6F6EC; --gm-icon-fg: #1E8E4E; }

.gm-admin .gm-empty {
    padding: 1.6rem 0;
    text-align: center;
    color: var(--gm-text-muted);
}

/* ----------------------------------------------------------------- footer */
.gm-admin .gm-card-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .55rem .8rem;
    border-top: 1px solid var(--gm-border);
    font-size: .75rem;
    color: var(--gm-text-muted);
}

.gm-admin .gm-pager {
    display: flex;
    align-items: center;
    gap: .25rem;
}

.gm-admin .gm-pager button {
    display: grid;
    place-items: center;
    min-width: 28px;
    height: 28px;
    padding: 0 .4rem;
    border: 1px solid var(--gm-border);
    border-radius: 8px;
    background: #fff;
    color: var(--gm-navy-700);
    font-size: .74rem;
    font-weight: 600;
    cursor: pointer;
}

.gm-admin .gm-pager button:disabled {
    opacity: .45;
    cursor: default;
}

.gm-admin .gm-pager button.active {
    border-color: transparent;
    background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%);
    color: #fff;
}

/* ------------------------------------------------------------------ alerts */
.gm-admin .gm-alert-wrap {
    padding: .6rem .8rem 0;
}

.gm-admin .gm-alert {
    margin: 0;
    padding: .5rem .7rem;
    border-radius: 10px;
    border: 1px solid rgba(214, 77, 77, .3);
    background: rgba(250, 226, 226, .8);
    color: #9B2C2C;
    font-size: .76rem;
}

/* ----------------------------------------------------- filter slide-over */
.gm-admin .gm-filters-title {
    font-size: 1rem;
    font-weight: 700;
}

.gm-admin .gm-filters-sub {
    margin: .2rem 0 1rem;
    font-size: .76rem;
    color: var(--gm-text-muted);
}

.gm-admin .gm-filter-group {
    margin-bottom: .9rem;
}

.gm-admin .gm-filter-group > label {
    display: block;
    margin-bottom: .3rem;
    font-size: .78rem;
    font-weight: 600;
}

.gm-admin .gm-filters-actions {
    display: grid;
    gap: .45rem;
    margin-top: 1.2rem;
}

.gm-admin .gm-filters-actions .gm-btn {
    width: 100%;
    justify-content: center;
    height: 38px;
}

/* -------------------------------------------------------------- responsive */
@media (max-width: 991.98px) {
    .gm-admin .gm-card-head h2 {
        width: 100%;
        margin: 0;
    }

    .gm-admin .gm-search {
        max-width: none;
    }
}

@media (max-width: 767.98px) {
    /* keep the essentials on a phone; the rest is reachable from the row actions */
    .gm-admin .gm-table th.gm-opt,
    .gm-admin .gm-table td.gm-opt {
        display: none;
    }
}

/* ------------------------------------------------------------------ modals */
.gm-admin.gm-modal {
    border: 0;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(16, 35, 63, .18);
}

.gm-admin .gm-modal-head {
    position: relative;
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1.05rem 1.2rem 1.45rem;
    background:
        url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 140' preserveAspectRatio='none'%3E%3Cpath d='M0,70 C150,130 310,10 470,58 C610,100 720,48 800,68 L800,140 L0,140 Z' fill='%23ffffff' opacity='0.45'/%3E%3Cpath d='M0,96 C170,142 330,46 510,84 C645,112 730,74 800,92 L800,140 L0,140 Z' fill='%23ffffff' opacity='0.92'/%3E%3C/svg%3E") no-repeat bottom / 100% 80%,
        linear-gradient(115deg, #E1F4F7 0%, #F4FCFD 45%, #DFF5F0 100%);
}

.gm-admin .gm-modal-head.warn {
    background:
        url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 140' preserveAspectRatio='none'%3E%3Cpath d='M0,70 C150,130 310,10 470,58 C610,100 720,48 800,68 L800,140 L0,140 Z' fill='%23ffffff' opacity='0.45'/%3E%3Cpath d='M0,96 C170,142 330,46 510,84 C645,112 730,74 800,92 L800,140 L0,140 Z' fill='%23ffffff' opacity='0.92'/%3E%3C/svg%3E") no-repeat bottom / 100% 80%,
        linear-gradient(115deg, #FBF0DC 0%, #FEFAF2 45%, #FDF3E4 100%);
}

.gm-admin .gm-modal-head.danger {
    background:
        url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 140' preserveAspectRatio='none'%3E%3Cpath d='M0,70 C150,130 310,10 470,58 C610,100 720,48 800,68 L800,140 L0,140 Z' fill='%23ffffff' opacity='0.45'/%3E%3Cpath d='M0,96 C170,142 330,46 510,84 C645,112 730,74 800,92 L800,140 L0,140 Z' fill='%23ffffff' opacity='0.92'/%3E%3C/svg%3E") no-repeat bottom / 100% 80%,
        linear-gradient(115deg, #FBE3E7 0%, #FEF6F7 45%, #FBE7E3 100%);
}

.gm-admin .gm-modal-icon {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .8);
    box-shadow: 0 4px 12px rgba(16, 35, 63, .08);
    color: var(--gm-teal-700);
    font-size: 1.4rem;
}

.gm-admin .gm-modal-head.warn .gm-modal-icon {
    color: #B57611;
}

.gm-admin .gm-modal-head.danger .gm-modal-icon {
    color: #C0384A;
}

.gm-admin .gm-modal-titles {
    min-width: 0;
}

.gm-admin .gm-modal-titles h5 {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -.01em;
}

.gm-admin .gm-modal-titles p {
    margin: .12rem 0 0;
    font-size: .78rem;
    color: var(--gm-text-muted);
}

.gm-admin .gm-modal-close {
    position: absolute;
    top: .8rem;
    right: .9rem;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(97, 139, 162, .18);
    border-radius: 50%;
    background: rgba(255, 255, 255, .9);
    color: var(--gm-navy-700);
    font-size: .95rem;
    cursor: pointer;
}

.gm-admin .gm-modal-close:hover {
    background: #fff;
    color: var(--gm-navy-900);
}

.gm-admin .gm-modal-body {
    padding: 1rem 1.2rem .2rem;
    max-height: 64vh;
    overflow-y: auto;
}

.gm-admin .gm-modal-body > .gm-alert {
    margin-bottom: .8rem;
}

/* ------------------------------------------------------------ modal fields */
.gm-admin .gm-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem .9rem;
}

.gm-admin .gm-form-grid-single {
    grid-template-columns: minmax(0, 1fr);
}

.gm-admin .gm-field-full {
    grid-column: 1 / -1;
}

.gm-admin .gm-field > label {
    display: block;
    margin-bottom: .28rem;
    font-size: .78rem;
    font-weight: 600;
}

.gm-admin .gm-field .req {
    color: #E0475B;
}

.gm-admin .gm-input {
    display: flex;
    align-items: center;
    gap: .5rem;
    height: 40px;
    padding: 0 .65rem;
    border: 1px solid var(--gm-border);
    border-radius: 11px;
    background: #fff;
}

.gm-admin .gm-input:focus-within {
    border-color: var(--gm-teal-500);
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .16);
}

.gm-admin .gm-input > i {
    color: var(--gm-text-muted);
    font-size: 1.05rem;
}

.gm-admin .gm-input input,
.gm-admin .gm-input textarea {
    flex: 1;
    min-width: 0;
    padding: 0;
    border: 0;
    outline: none;
    background: transparent;
    color: var(--gm-navy-900);
    font-size: .82rem;
}

.gm-admin .gm-input input::placeholder,
.gm-admin .gm-input textarea::placeholder {
    color: #9DB1C6;
}

.gm-admin .gm-input-area {
    height: auto;
    align-items: flex-start;
    padding: .6rem .65rem;
}

.gm-admin .gm-input-area > i {
    margin-top: .1rem;
}

.gm-admin .gm-input textarea {
    min-height: 74px;
    line-height: 1.5;
    resize: vertical;
}

.gm-admin .gm-input-action {
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--gm-text-muted);
    font-size: 1.05rem;
    cursor: pointer;
}

.gm-admin .gm-input-action:hover {
    color: var(--gm-navy-700);
}

/* The dropdown is a child component, so its markup never gets this page's scope attribute. */
.gm-admin .gm-select-wrap {
    position: relative;
}

.gm-admin .gm-select-wrap > i {
    position: absolute;
    left: .65rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    color: var(--gm-text-muted);
    font-size: 1.05rem;
    pointer-events: none;
}

.gm-admin .gm-select-wrap .form-select {
    height: 40px;
    padding-left: 2.2rem;
    border: 1px solid var(--gm-border);
    border-radius: 11px;
    color: var(--gm-navy-900);
    font-size: .82rem;
}

.gm-admin .gm-select-wrap .form-select:focus {
    border-color: var(--gm-teal-500);
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .16);
}

/* ----------------------------------------------------------- toggle switch */
.gm-admin .gm-modal-divider {
    height: 1px;
    margin: 1rem 0 .85rem;
    background: var(--gm-border);
}

.gm-admin .gm-toggle {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin: 0;
    cursor: pointer;
}

.gm-admin .gm-toggle input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.gm-admin .gm-toggle-track {
    position: relative;
    display: block;
    flex: 0 0 42px;
    width: 42px;
    height: 23px;
    border-radius: 999px;
    background: #CBD8E4;
    transition: background .18s ease;
}

.gm-admin .gm-toggle-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(16, 35, 63, .28);
    transition: transform .18s ease;
}

.gm-admin .gm-toggle input:checked + .gm-toggle-track {
    background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%);
}

.gm-admin .gm-toggle input:checked + .gm-toggle-track .gm-toggle-thumb {
    transform: translateX(19px);
}

.gm-admin .gm-toggle input:focus-visible + .gm-toggle-track {
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .28);
}

.gm-admin .gm-toggle-text {
    display: grid;
    line-height: 1.3;
}

.gm-admin .gm-toggle-text strong {
    font-size: .84rem;
}

.gm-admin .gm-toggle-text small {
    font-size: .72rem;
    color: var(--gm-text-muted);
}

/* ------------------------------------------------------------ modal footer */
.gm-admin .gm-modal-foot {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    padding: 1rem 1.2rem 1.15rem;
}

.gm-admin .gm-modal-foot .gm-btn {
    height: 40px;
    padding: 0 1.15rem;
    border-radius: 11px;
    font-size: .82rem;
}

.gm-admin .gm-btn-warn {
    border: 0;
    background: linear-gradient(90deg, #C98211 0%, #E8A93B 100%);
    color: #fff;
}

.gm-admin .gm-btn-danger {
    border: 0;
    background: linear-gradient(90deg, #D6384C 0%, #EE6A79 100%);
    color: #fff;
}

.gm-admin .gm-btn.gm-btn-warn:hover:not(:disabled) {
    background: linear-gradient(90deg, #B57611 0%, #D9982C 100%);
    color: #fff;
    box-shadow: 0 4px 12px rgba(181, 118, 17, .28);
}

.gm-admin .gm-btn.gm-btn-danger:hover:not(:disabled) {
    background: linear-gradient(90deg, #C42E41 0%, #E25A6A 100%);
    color: #fff;
    box-shadow: 0 4px 12px rgba(214, 56, 76, .28);
}

.gm-admin .gm-btn.gm-btn-warn:active:not(:disabled),
.gm-admin .gm-btn.gm-btn-danger:active:not(:disabled) {
    color: #fff;
    box-shadow: none;
    filter: brightness(.95);
}

/* -------------------------------------------------------------- view modal */
.gm-admin .gm-view-loading {
    margin: 0;
    padding: 1.2rem 0;
    text-align: center;
    color: var(--gm-text-muted);
    font-size: .8rem;
}

.gm-admin .gm-view-profile {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    padding: .7rem .8rem;
    margin-bottom: .8rem;
    border: 1px solid var(--gm-border);
    border-radius: 14px;
    background: #F8FCFD;
}

.gm-admin .gm-view-avatar {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 50%;
    background: var(--gm-avatar-bg, #E4F4F6);
    color: var(--gm-avatar-fg, #0B7D95);
    font-size: .9rem;
    font-weight: 700;
}

.gm-admin .gm-view-id {
    display: grid;
    gap: .1rem;
    min-width: 0;
    line-height: 1.3;
}

.gm-admin .gm-view-id strong {
    font-size: .9rem;
}

.gm-admin .gm-view-id > span {
    font-size: .74rem;
    color: var(--gm-text-muted);
}

.gm-admin .gm-view-badges {
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
    margin-left: auto;
}

.gm-admin .gm-view-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem .8rem;
}

.gm-admin .gm-view-item {
    display: grid;
    gap: .12rem;
    min-width: 0;
    padding: .5rem .65rem;
    border: 1px solid var(--gm-border);
    border-radius: 11px;
}

.gm-admin .gm-view-item > span {
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--gm-text-muted);
}

.gm-admin .gm-view-item strong {
    font-size: .82rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.gm-admin .gm-view-full {
    grid-column: 1 / -1;
}

/* ------------------------------------------------------- confirmation body */
.gm-admin .gm-confirm {
    display: grid;
    gap: .7rem;
}

.gm-admin .gm-confirm > p {
    margin: 0;
    font-size: .84rem;
    line-height: 1.55;
    color: var(--gm-navy-700);
}

.gm-admin .gm-confirm-name {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .6rem .7rem;
    margin-bottom: .8rem;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
    background: #F8FCFD;
}

.gm-admin .gm-confirm .gm-confirm-name {
    margin-bottom: 0;
}

.gm-admin .gm-confirm-note {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .8rem 0 0;
    padding: .55rem .7rem;
    border-radius: 11px;
    background: rgba(214, 56, 76, .08);
    color: #9B2C2C;
    font-size: .76rem;
    line-height: 1.45;
}

.gm-admin .gm-confirm .gm-confirm-note {
    margin-top: 0;
}

.gm-admin .gm-confirm-note.warn {
    background: rgba(181, 118, 17, .1);
    color: #8A5A0D;
}

.gm-admin .gm-confirm-note i {
    font-size: 1rem;
    line-height: 1.3;
}

@media (max-width: 575.98px) {
    .gm-admin .gm-form-grid,
    .gm-admin .gm-view-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .gm-admin .gm-view-badges {
        margin-left: 0;
    }
}

/* -------------------------------------------------- roles and modules extras */

/* Roles and modules reuse the avatar circle with an icon rather than initials. */
.gm-admin .gm-avatar i {
    font-size: .95rem;
    line-height: 1;
}

.gm-admin .gm-confirm-name .gm-avatar i {
    font-size: 1rem;
}

/* Module codes are what the screens check access against, so they read as code. */
.gm-admin .gm-code,
.gm-admin .gm-view-id > .gm-code {
    display: inline-block;
    justify-self: start;
    padding: .08rem .42rem;
    border-radius: 6px;
    background: #EEF6F8;
    color: var(--gm-teal-700);
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .02em;
}

.gm-admin .gm-input input.gm-mono {
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    letter-spacing: .02em;
}

/* Descriptions are free text; let them wrap instead of stretching the table. */
.gm-admin .gm-table td.gm-wrap {
    min-width: 200px;
    max-width: 420px;
    white-space: normal;
    color: var(--gm-navy-700);
}

.gm-admin .gm-muted {
    color: var(--gm-text-muted);
}

.gm-admin .gm-modal-body > .gm-confirm-note {
    margin-top: .8rem;
}

/* ------------------------------------------------------------- permissions */
.gm-admin .gm-perm-top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .6rem 1rem;
    padding: .7rem .8rem;
    border-bottom: 1px solid var(--gm-border);
}

.gm-admin .gm-perm-pick {
    flex: 0 1 360px;
    min-width: 220px;
}

.gm-admin .gm-perm-pick > label {
    display: block;
    margin-bottom: .25rem;
    font-size: .76rem;
    font-weight: 600;
}

.gm-admin .gm-perm-pick .gm-select-wrap .form-select {
    height: 36px;
}

/* Role Permissions / User Overrides */
.gm-admin .gm-seg {
    display: inline-flex;
    gap: .2rem;
    padding: .2rem;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
    background: #F7FBFC;
}

.gm-admin .gm-seg button {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    height: 32px;
    padding: 0 .85rem;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--gm-navy-700);
    font-size: .78rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

.gm-admin .gm-seg button:hover:not(.active) {
    background: #fff;
}

.gm-admin .gm-seg button.active {
    background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%);
    color: #fff;
    box-shadow: 0 4px 10px rgba(13, 159, 153, .25);
}

.gm-admin .gm-seg i {
    font-size: .95rem;
}

.gm-admin .gm-perm-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .55rem .8rem;
    border-bottom: 1px solid var(--gm-border);
}

.gm-admin .gm-perm-bar .gm-search {
    max-width: 320px;
}

.gm-admin .gm-perm-status {
    display: flex;
    gap: .35rem;
    margin-right: auto;
}

.gm-admin .gm-pill.warn {
    background: rgba(181, 118, 17, .12);
    color: #8A5A0D;
}

.gm-admin .gm-perm-empty {
    display: grid;
    justify-items: center;
    gap: .25rem;
    padding: 2.2rem 1rem;
    text-align: center;
    color: var(--gm-text-muted);
}

.gm-admin .gm-perm-empty i {
    font-size: 1.8rem;
    color: var(--gm-teal-600);
}

.gm-admin .gm-perm-empty strong {
    font-size: .9rem;
    color: var(--gm-navy-900);
}

.gm-admin .gm-perm-empty span {
    font-size: .78rem;
}

/* The matrix scrolls inside the card so Reset and Save stay in reach on a long module list. */
.gm-admin .gm-perm-scroll {
    min-height: 200px;
}

.gm-admin .gm-perm-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: .4rem .5rem;
    font-size: .72rem;
}

.gm-admin .gm-perm-table td {
    padding: .26rem .5rem;
}

.gm-admin .gm-perm-table th i {
    margin-right: .3rem;
    font-size: .9rem;
    vertical-align: -.12em;
    color: var(--gm-teal-600);
}

.gm-admin .gm-perm-table .gm-c {
    text-align: center;
}

.gm-admin .gm-perm-table .gm-avatar {
    width: 26px;
    height: 26px;
    flex-basis: 26px;
}

.gm-admin .gm-perm-mod {
    display: grid;
    min-width: 0;
    line-height: 1.2;
}

.gm-admin .gm-perm-mod strong {
    font-size: .76rem;
    font-weight: 600;
}

.gm-admin .gm-perm-mod small {
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .64rem;
    color: var(--gm-text-muted);
}

/* Unsaved rows get an amber edge, rows queued for removal a red one. */
.gm-admin .gm-perm-table tr.gm-perm-dirty td {
    background: #FFF8EC;
}

.gm-admin .gm-perm-table tr.gm-perm-dirty td:first-child {
    box-shadow: inset 3px 0 0 #E8A93B;
}

.gm-admin .gm-perm-table tr.gm-perm-cleared td {
    background: #FDF1F3;
}

.gm-admin .gm-perm-table tr.gm-perm-cleared td:first-child {
    box-shadow: inset 3px 0 0 #D6384C;
}

.gm-admin .gm-perm-table tr.gm-perm-cleared .gm-perm-mod strong {
    color: #C0384A;
    text-decoration: line-through;
}

/* Role mode: on/off switch with a tick or cross, as in the design. */
.gm-admin .gm-switch {
    position: relative;
    display: inline-flex;
    margin: 0;
    vertical-align: middle;
    cursor: pointer;
}

.gm-admin .gm-switch input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.gm-admin .gm-switch-track {
    position: relative;
    display: block;
    width: 34px;
    height: 19px;
    border-radius: 999px;
    background: #D5DFE8;
    transition: background .15s ease;
}

.gm-admin .gm-switch-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16, 35, 63, .3);
    transition: transform .15s ease;
}

.gm-admin .gm-switch-track i {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: .62rem;
    line-height: 1;
    transition: opacity .15s ease;
}

.gm-admin .gm-switch-on {
    left: 5px;
    color: #fff;
    opacity: 0;
}

.gm-admin .gm-switch-off {
    right: 5px;
    color: #8FA3B8;
}

.gm-admin .gm-switch input:checked + .gm-switch-track {
    background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%);
}

.gm-admin .gm-switch input:checked + .gm-switch-track .gm-switch-thumb {
    transform: translateX(15px);
}

.gm-admin .gm-switch input:checked + .gm-switch-track .gm-switch-on {
    opacity: 1;
}

.gm-admin .gm-switch input:checked + .gm-switch-track .gm-switch-off {
    opacity: 0;
}

.gm-admin .gm-switch input:focus-visible + .gm-switch-track {
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .28);
}

.gm-admin .gm-switch input:disabled + .gm-switch-track {
    opacity: .45;
    cursor: default;
}

/* User-override mode: inherit / allow / deny in one small segmented control. */
.gm-admin .gm-tri {
    display: inline-flex;
    gap: 2px;
    padding: 2px;
    border: 1px solid var(--gm-border);
    border-radius: 8px;
    background: #F7FBFC;
}

.gm-admin .gm-tri button {
    display: grid;
    place-items: center;
    width: 22px;
    height: 20px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #9DB1C6;
    font-size: .72rem;
    cursor: pointer;
}

.gm-admin .gm-tri button:hover:not(:disabled):not(.on) {
    background: #fff;
    color: var(--gm-navy-700);
}

.gm-admin .gm-tri button.on.inherit {
    background: #fff;
    color: var(--gm-navy-700);
    box-shadow: 0 1px 2px rgba(16, 35, 63, .12);
}

.gm-admin .gm-tri button.on.allow {
    background: #0D9F99;
    color: #fff;
}

.gm-admin .gm-tri button.on.deny {
    background: #D6384C;
    color: #fff;
}

.gm-admin .gm-tri button:disabled {
    opacity: .5;
    cursor: default;
}

.gm-admin .gm-perm-note {
    width: 100%;
    min-width: 120px;
    max-width: 220px;
    height: 26px;
    padding: 0 .45rem;
    border: 1px solid var(--gm-border);
    border-radius: 7px;
    background: #FAFCFD;
    color: var(--gm-navy-900);
    font-size: .72rem;
    outline: none;
}

.gm-admin .gm-perm-note:focus {
    border-color: var(--gm-teal-500);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .14);
}

.gm-admin .gm-perm-note:disabled {
    opacity: .6;
}

.gm-admin .gm-perm-clear {
    height: 24px;
    padding: 0 .6rem;
    border: 1px solid rgba(214, 56, 76, .35);
    border-radius: 7px;
    background: #fff;
    color: #C0384A;
    font-size: .68rem;
    font-weight: 600;
    cursor: pointer;
}

.gm-admin .gm-perm-clear:hover {
    background: #FDF1F3;
}

.gm-admin .gm-perm-clear.undo {
    border-color: rgba(181, 118, 17, .4);
    color: #8A5A0D;
}

.gm-admin .gm-perm-clear.undo:hover {
    background: #FFF8EC;
}

.gm-admin .gm-perm-legend {
    display: flex;
    gap: .75rem;
    font-size: .7rem;
}

.gm-admin .gm-perm-legend span {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
}

.gm-admin .gm-perm-legend .allow i {
    color: #0D9F99;
}

.gm-admin .gm-perm-legend .deny i {
    color: #D6384C;
}

@media (max-width: 767.98px) {
    .gm-admin .gm-perm-pick {
        flex-basis: 100%;
    }

    .gm-admin .gm-seg {
        width: 100%;
    }

    .gm-admin .gm-seg button {
        flex: 1;
        justify-content: center;
    }
}

/* ---------------------------------------------------- dense settings forms */

/* Card head with a title and a one-line subtitle; actions sit to the right. */
.gm-admin .gm-card-title {
    min-width: 0;
    margin-right: auto;
}

.gm-admin .gm-card-title h2 {
    margin: 0;
    font-size: .95rem;
    font-weight: 700;
}

.gm-admin .gm-card-title p {
    margin: .05rem 0 0;
    font-size: .72rem;
    color: var(--gm-text-muted);
}

.gm-admin .gm-alert.ok {
    border-color: rgba(11, 165, 143, .3);
    background: rgba(225, 246, 240, .9);
    color: #0B6F60;
}

.gm-admin .gm-section {
    padding: .65rem .8rem .75rem;
}

.gm-admin .gm-section + .gm-section {
    border-top: 1px dashed var(--gm-border);
}

.gm-admin .gm-section-title {
    font-family: inherit;
    display: flex;
    align-items: center;
    gap: .4rem;
    margin: 0 0 .5rem;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--gm-text-muted);
}

.gm-admin .gm-section-title i {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 6px;
    background: rgba(20, 201, 177, .12);
    color: var(--gm-teal-700);
    font-size: .78rem;
}

.gm-admin .gm-section-title small {
    margin-left: .2rem;
    font-size: .68rem;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
}

.gm-admin .gm-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gm-admin .gm-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gm-admin .gm-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gm-admin .gm-span-2 {
    grid-column: span 2;
}

/* .gm-dense shrinks the modal-sized fields to 32px rows so a settings page fits on one screen. */
.gm-admin .gm-dense .gm-form-grid {
    gap: .5rem .7rem;
}

.gm-admin .gm-dense .gm-field > label {
    margin-bottom: .16rem;
    font-size: .7rem;
}

.gm-admin .gm-dense .gm-input {
    height: 32px;
    gap: .4rem;
    padding: 0 .55rem;
    border-radius: 9px;
}

.gm-admin .gm-dense .gm-input > i {
    font-size: .92rem;
}

.gm-admin .gm-dense .gm-input input {
    font-size: .78rem;
}

.gm-admin .gm-dense .gm-input:has(input:disabled) {
    background: #F7FAFC;
}

.gm-admin .gm-dense .gm-select-wrap > i {
    left: .55rem;
    font-size: .92rem;
}

.gm-admin .gm-dense .gm-select-wrap .form-select {
    height: 32px;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 1.95rem;
    border-radius: 9px;
    font-size: .78rem;
}

.gm-admin .gm-field-hint {
    margin: .15rem 0 0;
    font-size: .64rem;
    color: var(--gm-text-muted);
}

/* ------------------------------------------------------- company branding */
.gm-admin .gm-brand-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
}

.gm-admin .gm-brand-tile {
    display: grid;
    gap: .45rem;
    padding: .55rem;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
    background: #FBFDFE;
}

.gm-admin .gm-brand-tile header {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .76rem;
    font-weight: 600;
}

.gm-admin .gm-brand-tile header i {
    font-size: .95rem;
    color: var(--gm-teal-600);
}

.gm-admin .gm-brand-tile header small {
    margin-left: auto;
    font-size: .64rem;
    font-weight: 500;
    color: var(--gm-text-muted);
}

/* Checkerboard so a transparent PNG reads as transparent rather than as white. */
.gm-admin .gm-brand-preview {
    display: grid;
    place-items: center;
    height: 96px;
    overflow: hidden;
    border: 1px dashed rgba(97, 139, 162, .35);
    border-radius: 9px;
    background: #fff repeating-conic-gradient(#F3F7F9 0 25%, #fff 0 50%) 0 0 / 14px 14px;
}

.gm-admin .gm-brand-preview img {
    max-width: 92%;
    max-height: 84px;
    object-fit: contain;
}

.gm-admin .gm-brand-empty {
    display: grid;
    justify-items: center;
    gap: .15rem;
    font-size: .7rem;
    color: var(--gm-text-muted);
}

.gm-admin .gm-brand-empty i {
    font-size: 1.3rem;
    opacity: .7;
}

/* A styled button with the native file input stretched invisibly over it. */
.gm-admin .gm-upload {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .3rem;
    height: 28px;
    overflow: hidden;
    border: 1px solid var(--gm-border);
    border-radius: 8px;
    background: #fff;
    color: var(--gm-navy-700);
    font-size: .72rem;
    font-weight: 600;
    cursor: pointer;
}

.gm-admin .gm-upload:hover {
    background: #F6FBFC;
}

.gm-admin .gm-upload input[type=file] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.gm-admin .gm-upload.disabled {
    opacity: .5;
    pointer-events: none;
}

/* ------------------------------------------------------ inline table edits */
.gm-admin .gm-cell-input {
    width: 92px;
    height: 26px;
    padding: 0 .45rem;
    border: 1px solid var(--gm-border);
    border-radius: 7px;
    background: #FAFCFD;
    color: var(--gm-navy-900);
    font-size: .74rem;
    outline: none;
}

.gm-admin .gm-cell-input:focus {
    border-color: var(--gm-teal-500);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .14);
}

.gm-admin .gm-cell-input.mono {
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    letter-spacing: .02em;
}

.gm-admin .gm-cell-input.num {
    width: 84px;
    text-align: right;
}

.gm-admin .gm-cell-input.invalid {
    border-color: rgba(214, 56, 76, .6);
    background: #FDF1F3;
}

.gm-admin .gm-cell-input:disabled {
    opacity: .6;
}

.gm-admin .gm-table.gm-tight th {
    padding: .38rem .5rem;
    font-size: .72rem;
}

.gm-admin .gm-table.gm-tight td {
    padding: .26rem .5rem;
}

.gm-admin .gm-table.gm-tight .gm-avatar {
    width: 26px;
    height: 26px;
    flex-basis: 26px;
}

.gm-admin .gm-table .gm-c {
    text-align: center;
}

.gm-admin .gm-table tr.gm-row-dirty td {
    background: #FFF8EC;
}

.gm-admin .gm-table tr.gm-row-dirty td:first-child {
    box-shadow: inset 3px 0 0 #E8A93B;
}

.gm-admin .gm-icon-btn:disabled {
    opacity: .35;
    cursor: default;
    filter: none;
}

.gm-admin .gm-next-no {
    display: inline-block;
    padding: .08rem .42rem;
    border-radius: 6px;
    background: #EEF6F8;
    color: var(--gm-teal-700);
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: .7rem;
    font-weight: 600;
}

.gm-admin .gm-next-no.reset {
    background: #FDF2E2;
    color: #8A5A0D;
}

@media (max-width: 1199.98px) {
    .gm-admin .gm-cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .gm-admin .gm-cols-2,
    .gm-admin .gm-cols-3,
    .gm-admin .gm-cols-4,
    .gm-admin .gm-brand-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .gm-admin .gm-span-2 {
        grid-column: auto;
    }
}

/* ------------------------------------------------- fit-to-screen list cards */

/* The card takes the height left under the page head and only its table scrolls, so the page
   itself never does. 238px = the layout's 170px of chrome (the same figure the stock entry pages
   use) plus this page head and the gap below it. A page with a taller head can raise it. */
.gm-admin .gm-fit {
    display: flex;
    flex-direction: column;
    /* Fills the window down to the bottom gutter; js/gm-fit.js measures the offset per card. */
    height: calc(100dvh - var(--gm-fit-offset, 238px));
    min-height: 260px;
}

.gm-admin .gm-fit > * {
    flex-shrink: 0;
}

.gm-admin .gm-fit > .gm-fit-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.gm-admin .gm-fit .gm-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
}

.gm-admin .gm-suffix {
    font-size: .74rem;
    font-weight: 600;
    color: var(--gm-text-muted);
}

.gm-admin .gm-rate {
    display: inline-block;
    min-width: 46px;
    padding: .08rem .45rem;
    border-radius: 6px;
    background: rgba(45, 114, 217, .1);
    color: #2D72D9;
    font-size: .72rem;
    font-weight: 700;
    text-align: center;
}

/* A stock quantity in the item's unit ("136.33 DOZ") with its base quantity ("(1,636 PCS)") under it. */
.gm-admin .gm-qty {
    white-space: nowrap;
}

.gm-admin .gm-qty-base {
    display: block;
    font-size: .68rem;
    line-height: 1.2;
    white-space: nowrap;
    color: var(--gm-text-muted);
}

.gm-admin .gm-qty-base.warn {
    color: #B57611;
    font-weight: 600;
}

/* A quantity typed in the item's unit: the input with the unit name beside it. */
.gm-admin .gm-qty-entry {
    display: flex;
    align-items: center;
    gap: .3rem;
}

.gm-admin .gm-qty-entry .form-control {
    min-width: 0;
}

.gm-admin .gm-qty-entry-unit {
    flex: none;
    font-size: .7rem;
    font-weight: 600;
    white-space: nowrap;
    color: var(--gm-text-muted);
}

.gm-admin .gm-qty-entry + .gm-qty-base {
    margin-top: .15rem;
    text-align: right;
}

.gm-admin .gm-num {
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: .74rem;
    text-align: right;
}

.gm-admin .gm-pill.live {
    background: rgba(20, 201, 177, .14);
    color: var(--gm-teal-700);
}

@media (max-width: 767.98px) {
    .gm-admin .gm-fit {
        height: auto;
    }

    .gm-admin .gm-fit > .gm-fit-body {
        overflow-x: auto;
        overflow-y: visible;
    }
}

/* ------------------------------------------------------ item master pages */
.gm-admin .gm-foot-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem;
}

/* Rows-per-page picker in the card footer. */
.gm-admin .gm-rows {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

.gm-admin .gm-rows .form-select {
    height: 28px;
    min-width: 64px;
    padding: 0 1.8rem 0 .55rem;
    border: 1px solid var(--gm-border);
    border-radius: 8px;
    font-size: .74rem;
}

/* Colour picker sitting inside a .gm-input next to the hex field. */
.gm-admin .gm-input input.gm-swatch {
    flex: 0 0 26px;
    width: 26px;
    height: 22px;
    padding: 0;
    border: 1px solid var(--gm-border);
    border-radius: 6px;
    background: none;
    cursor: pointer;
}

.gm-admin .gm-input input.gm-swatch::-webkit-color-swatch-wrapper {
    padding: 2px;
}

.gm-admin .gm-input input.gm-swatch::-webkit-color-swatch {
    border: 0;
    border-radius: 4px;
}

/* Several switches in one dialog sit two to a row. */
.gm-admin .gm-toggle-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem .9rem;
}

@media (max-width: 575.98px) {
    .gm-admin .gm-toggle-list {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ------------------------------------------------------------- items page */
.gm-admin .gm-section-gap {
    margin-top: .9rem;
}

.gm-admin .gm-dense .gm-input textarea {
    min-height: 44px;
}

/* A dropdown with a square "+" button beside it for adding a missing master. */
.gm-admin .gm-select-add {
    display: flex;
    gap: .35rem;
}

.gm-admin .gm-select-add > .gm-select-wrap {
    flex: 1 1 auto;
    min-width: 0;
}

.gm-admin .gm-add-btn {
    display: grid;
    place-items: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid rgba(13, 159, 153, .3);
    border-radius: 9px;
    background: rgba(20, 201, 177, .1);
    color: var(--gm-teal-700);
    font-size: .9rem;
    cursor: pointer;
}

.gm-admin .gm-add-btn:hover {
    background: rgba(20, 201, 177, .18);
}

/* Import / export dialog */
.gm-admin .gm-io-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gm-admin .gm-io-text {
    margin: 0;
    font-size: .74rem;
    color: var(--gm-text-muted);
}

.gm-admin .gm-io-result {
    margin-top: .8rem;
    padding: .6rem .7rem;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
}

.gm-admin .gm-io-counts {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
    font-size: .78rem;
}

.gm-admin .gm-io-counts strong {
    margin-right: .25rem;
}

.gm-admin .gm-io-errors {
    display: grid;
    gap: .25rem;
    max-height: 200px;
    margin: .55rem 0 0;
    padding: 0;
    overflow-y: auto;
    list-style: none;
    font-size: .74rem;
    color: #9B2C2C;
}

.gm-admin .gm-io-errors .gm-code {
    margin-right: .35rem;
    background: #FCEBEE;
    color: #C0384A;
}

/* Item images dialog */
.gm-admin .gm-img-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: .75rem;
}

.gm-admin .gm-img-actions .gm-upload {
    padding: 0 .75rem;
}

.gm-admin .gm-img-actions .gm-muted {
    margin-left: auto;
    font-size: .74rem;
}

.gm-admin .gm-img-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: .6rem;
}

.gm-admin .gm-img-tile {
    overflow: hidden;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
    background: #fff;
}

.gm-admin .gm-img-tile img {
    display: block;
    width: 100%;
    height: 120px;
    object-fit: cover;
    background: #F3F7F9;
}

.gm-admin .gm-img-foot {
    display: flex;
    align-items: center;
    gap: .3rem;
    padding: .35rem .45rem;
    font-size: .72rem;
}

.gm-admin .gm-img-foot .gm-muted {
    margin-right: auto;
}

.gm-admin .gm-upload.gm-upload-sm {
    width: 26px;
    height: 26px;
    border-radius: 7px;
    font-size: .85rem;
}

@media (max-width: 767.98px) {
    .gm-admin .gm-io-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ------------------------------------------------ compact (no-scroll) dialog */

/* Tighter head and foot, and a body allowed the full screen height rather than 64vh. */
.gm-admin.gm-modal.gm-modal-compact .gm-modal-head {
    padding: .7rem 1.1rem 1rem;
}

.gm-admin.gm-modal.gm-modal-compact .gm-modal-icon {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    font-size: 1.15rem;
}

.gm-admin.gm-modal.gm-modal-compact .gm-modal-titles h5 {
    font-size: 1.02rem;
}

.gm-admin.gm-modal.gm-modal-compact .gm-modal-body {
    max-height: calc(100dvh - 175px);
    padding-top: .75rem;
}

.gm-admin.gm-modal.gm-modal-compact .gm-modal-foot {
    padding: .65rem 1.1rem .85rem;
}

.gm-admin .gm-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

/* Placeholder text in a narrow dropdown is cut with an ellipsis instead of running under the chevron. */
.gm-admin .gm-select-wrap .form-select {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* A switch standing in a form grid cell: same label line, then a 32px row like the inputs. */
.gm-admin .gm-field-label {
    display: block;
    margin-bottom: .16rem;
    font-size: .7rem;
    font-weight: 600;
}

/* The cell's switch is a <label> inside .gm-field, so it must beat ".gm-field > label"
   (display:block), or the track span collapses and only the thumb shows. */
.gm-admin .gm-field > label.gm-toggle.gm-toggle-cell {
    display: flex;
    align-items: center;
    height: 32px;
    gap: .5rem;
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
}

.gm-admin .gm-toggle.gm-toggle-cell .gm-toggle-text small {
    font-size: .68rem;
}

.gm-admin .gm-label-info {
    font-size: .75rem;
    vertical-align: -.1em;
    color: var(--gm-text-muted);
    cursor: help;
}

@media (max-width: 1199.98px) {
    .gm-admin .gm-cols-6 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .gm-admin .gm-cols-6 {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* --------------------------------------------- dialog sections (item form) */
.gm-admin .gm-form-section {
    padding: .55rem .7rem .7rem;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
    background: #FBFDFE;
}

.gm-admin .gm-form-section + .gm-form-section {
    margin-top: .6rem;
}

.gm-admin .gm-form-section > .gm-section-title {
    margin-bottom: .45rem;
}

/* The fixed 32px row of .gm-dense must not clamp a multi-line field; the textarea overflowed
   its frame by 9px and that alone gave the dialog a scrollbar. */
.gm-admin .gm-dense .gm-input.gm-input-area {
    height: auto;
}

.gm-admin .gm-span-4 {
    grid-column: span 4;
}

.gm-admin .gm-toggle-stack {
    display: grid;
    gap: .55rem;
    padding-top: .15rem;
}

@media (max-width: 1199.98px) {
    .gm-admin .gm-cols-6 > .gm-span-4 {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .gm-admin .gm-span-4 {
        grid-column: auto;
    }
}

/* ------------------------------------------------------------ price lists */
.gm-admin .gm-pl-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .4rem;
    margin-bottom: .75rem;
    font-size: .72rem;
}

/* Resolve Effective Price: inputs on the left, results on the right. */
.gm-admin .gm-ep-layout {
    display: grid;
    grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
    gap: .9rem;
    align-items: start;
}

.gm-admin .gm-ep-inputs {
    display: grid;
    gap: .6rem;
}

.gm-admin .gm-ep-items {
    display: grid;
    max-height: 230px;
    overflow-y: auto;
    padding: .3rem;
    border: 1px solid var(--gm-border);
    border-radius: 9px;
    background: #fff;
}

.gm-admin .gm-ep-item {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: 0;
    padding: .22rem .35rem;
    border-radius: 6px;
    font-size: .74rem;
    cursor: pointer;
}

.gm-admin .gm-ep-item:hover {
    background: #F3F9FA;
}

.gm-admin .gm-ep-item input {
    width: 14px;
    height: 14px;
    accent-color: var(--gm-teal-600);
}

.gm-admin .gm-ep-run {
    justify-content: center;
}

.gm-admin .gm-ep-results {
    max-height: 360px;
    overflow: auto;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
}

.gm-admin .gm-ep-results .gm-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
}

@media (max-width: 991.98px) {
    .gm-admin .gm-ep-layout {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ------------------------------------------------------------ hover states */
.gm-admin .gm-pager button:not(.active):hover:not(:disabled) {
    border-color: rgba(13, 159, 153, .4);
    background: #F1F8FA;
    color: var(--gm-teal-700);
}

.gm-admin .gm-pager button.active:hover {
    color: #fff;
}

.gm-admin .gm-upload:hover {
    border-color: rgba(97, 139, 162, .34);
    background: #F1F8FA;
    color: var(--gm-navy-900);
}

/* ----------------------------------------------------------- stock pages */

/* Totals strip inside a fit card, between the toolbar and the table. */
.gm-admin .gm-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: .5rem;
    padding: .55rem .8rem;
    border-bottom: 1px solid var(--gm-border);
}

.gm-admin .gm-stat {
    padding: .35rem .6rem;
    border: 1px solid var(--gm-border);
    border-radius: 10px;
    background: #FBFDFE;
}

.gm-admin .gm-stat span {
    display: block;
    font-size: .64rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--gm-text-muted);
}

.gm-admin .gm-stat strong {
    font-size: .95rem;
    font-variant-numeric: tabular-nums;
}

/* Nothing (or less than nothing) available reads red. */
.gm-admin .gm-num.neg,
.gm-admin .gm-stat strong.neg {
    color: #C0384A;
    font-weight: 700;
}

.gm-admin .gm-num.gm-in {
    color: #1E8E4E;
}

.gm-admin .gm-num.gm-out {
    color: #C0384A;
}

/* A document number that opens the document. */
.gm-admin .gm-link-btn {
    padding: 0;
    border: 0;
    background: none;
    color: var(--gm-teal-700);
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: .72rem;
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: rgba(11, 125, 149, .35);
    text-underline-offset: 2px;
    cursor: pointer;
}

.gm-admin .gm-link-btn:hover {
    color: var(--gm-navy-900);
}

/* ------------------------------------------------------ document entries */

/* No page scroll: the shell is exactly the window height under the page head and card head
   (js/gm-fit.js measures it). The fields and footer keep their size and the line grid takes the
   rest, scrolling inside itself; its dropdowns open with Popper's fixed strategy
   (ui-helpers.js configureDropdownPositioning), so the scroller doesn't clip them. */
.gm-admin .gm-entry .stock-entry-shell {
    height: calc(100dvh - var(--gm-fit-offset, 230px));
    min-height: 380px;
    padding: .65rem .8rem .7rem;
}

.gm-admin .gm-entry .stock-entry-shell > * {
    flex-shrink: 0;
}

.gm-admin .gm-entry .stock-entry-shell > .stock-entry-main {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.gm-admin .gm-entry .stock-entry-main > * {
    flex-shrink: 0;
}

.gm-admin .gm-entry .stock-entry-main > .stock-entry-lines-scroll.stock-line-table-wrap {
    flex: 1 1 auto;
    min-height: 140px;
    overflow: auto;
}

.gm-admin .gm-entry-alert {
    margin-bottom: .6rem;
}

.gm-admin .gm-lines-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: .85rem 0 .4rem;
}

.gm-admin .gm-lines-head .gm-section-title {
    margin: 0;
}

.gm-admin .gm-btn.gm-btn-sm {
    height: 28px;
    padding: 0 .6rem;
    border-radius: 8px;
    font-size: .72rem;
}

.gm-admin .gm-entry .stock-entry-lines-scroll {
    border: 1px solid var(--gm-border);
    border-radius: 12px;
}

.gm-admin .gm-lines thead th {
    padding: .35rem .5rem;
    border-bottom: 1px solid var(--gm-border);
    background: #F7FBFC;
    color: var(--gm-text-muted);
    font-size: .7rem;
    font-weight: 600;
    white-space: nowrap;
}

.gm-admin .gm-lines td {
    padding: .22rem .5rem;
    border-color: rgba(97, 139, 162, .12);
    font-size: .76rem;
}

.gm-admin .gm-lines tbody tr:hover td {
    background: #FAFDFE;
}

.gm-admin .gm-lines .form-control-sm,
.gm-admin .gm-lines .form-select-sm {
    height: 28px;
    min-height: 28px;
    padding-top: 0;
    padding-bottom: 0;
    border-color: var(--gm-border);
    border-radius: 7px;
    font-size: .74rem;
}

.gm-admin .gm-lines .form-control-sm:focus,
.gm-admin .gm-lines .form-select-sm:focus {
    border-color: var(--gm-teal-500);
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .14);
}

.gm-admin .gm-lines .gm-num-input {
    text-align: right;
}

.gm-admin .gm-lines .line-action-cell .gm-icon-btn {
    margin: 0 auto;
}

.gm-admin .gm-entry .stock-entry-footer.gm-entry-foot {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    margin-top: .7rem;
    padding-top: .6rem;
    border-top: 1px solid var(--gm-border);
    background: #fff;
    position: static;
}

@media (max-width: 991.98px) {
    .gm-admin .gm-entry .stock-entry-shell {
        height: auto;
    }

    .gm-admin .gm-entry .stock-entry-shell > .stock-entry-main {
        overflow: visible;
    }
}

/* ------------------------------------------------- document list extras */

/* Status helpers still emit Bootstrap "badge bg-*-subtle" markup (Purchase, Sales...). Inside the
   gm-admin pages they take the pill look; the utilities use !important, so these must too. */
.gm-admin .gm-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .25rem;
}

.gm-admin .badge {
    display: inline-flex;
    align-items: center;
    padding: .1rem .45rem;
    border-radius: 999px;
    font-size: .64rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.4;
}

.gm-admin .badge.bg-success-subtle { background-color: rgba(11, 165, 143, .14) !important; color: #0B8A77 !important; }
.gm-admin .badge.bg-danger-subtle { background-color: rgba(228, 98, 111, .16) !important; color: #C0384A !important; }
.gm-admin .badge.bg-warning-subtle { background-color: rgba(181, 118, 17, .12) !important; color: #8A5A0D !important; }
.gm-admin .badge.bg-info-subtle { background-color: rgba(20, 201, 177, .14) !important; color: var(--gm-teal-700) !important; }
.gm-admin .badge.bg-primary-subtle { background-color: rgba(45, 114, 217, .1) !important; color: #2D72D9 !important; }
.gm-admin .badge.bg-secondary-subtle,
.gm-admin .badge.bg-light { background-color: #EEF3F7 !important; color: var(--gm-navy-700) !important; }

.gm-admin .gm-avail {
    font-size: .64rem;
    white-space: nowrap;
}

/* Converted dialogs keep their Bootstrap inputs; size them like the gm fields. */
.gm-admin.gm-modal .gm-modal-field + .gm-modal-field {
    margin-top: .6rem;
}

.gm-admin.gm-modal .gm-modal-body > label,
.gm-admin.gm-modal .gm-modal-field > label {
    display: block;
    margin-bottom: .2rem;
    font-size: .72rem;
    font-weight: 600;
}

.gm-admin.gm-modal .form-control,
.gm-admin.gm-modal .form-select {
    min-height: 32px;
    border-color: var(--gm-border);
    border-radius: 9px;
    color: var(--gm-navy-900);
    font-size: .78rem;
}

.gm-admin.gm-modal .form-control:focus,
.gm-admin.gm-modal .form-select:focus {
    border-color: var(--gm-teal-500);
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .16);
}

.gm-admin.gm-modal .form-control[readonly] {
    background: #F7FAFC;
    font-weight: 600;
}


/* ------------------------------------------------- purchase entry screens */

/* The Purchase entry pages keep their markup (keyboard navigation hangs off it) and take the
   gm look from these rules: compact 32px fields, the line grid styled like .gm-lines, and the
   footer buttons as gm buttons. Scoped to .gm-doc so nothing else using these classes changes. */
.gm-admin.gm-doc .purchase-entry-card {
    border-radius: var(--gm-radius);
}

.gm-admin.gm-doc .purchase-entry-card .card-body.stock-entry-shell {
    min-height: calc(100dvh - var(--gm-fit-offset, 238px));
    padding: .75rem .85rem .7rem;
}

.gm-admin.gm-doc .purchase-entry-form {
    --bs-gutter-x: .75rem;
    --bs-gutter-y: .55rem;
    margin-bottom: .9rem !important;
}

.gm-admin.gm-doc .form-label {
    margin-bottom: .2rem;
    color: var(--gm-navy-900);
    font-size: .72rem;
    font-weight: 600;
}

.gm-admin.gm-doc .text-danger {
    color: #E0475B !important;
}

.gm-admin.gm-doc .purchase-entry-form .form-control,
.gm-admin.gm-doc .purchase-entry-form .form-select {
    height: 32px;
    min-height: 32px;
    padding-top: 0;
    padding-bottom: 0;
    border-color: var(--gm-border);
    border-radius: 9px;
    color: var(--gm-navy-900);
    font-size: .78rem;
}

.gm-admin.gm-doc .form-control:focus,
.gm-admin.gm-doc .form-select:focus {
    border-color: var(--gm-teal-500);
    box-shadow: 0 0 0 3px rgba(20, 201, 177, .16);
}

.gm-admin.gm-doc .purchase-entry-form .form-control[readonly],
.gm-admin.gm-doc .purchase-entry-form .form-control:disabled,
.gm-admin.gm-doc .purchase-entry-form .form-select:disabled {
    background-color: #F7FAFC;
}

.gm-admin.gm-doc .purchase-entry-form .form-control[readonly] {
    font-weight: 600;
}

/* line toolbar: section title on the left, tax type and Add Line on the right */
.gm-admin.gm-doc .document-line-toolbar {
    margin-bottom: .4rem !important;
}

.gm-admin.gm-doc .purchase-line-heading {
    display: flex;
    align-items: center;
    gap: .4rem;
    color: var(--gm-navy-900);
    font-size: .82rem;
    font-weight: 700;
}

.gm-admin.gm-doc .document-line-toolbar .purchase-line-heading::before {
    content: "";
    width: 4px;
    height: 14px;
    border-radius: 2px;
    background: linear-gradient(180deg, #0C958E 0%, #15CFC0 100%);
}

.gm-admin.gm-doc .document-tax-control .form-label {
    margin: 0;
    color: var(--gm-text-muted);
}

.gm-admin.gm-doc .document-tax-control .form-select-sm {
    height: 28px;
    min-height: 28px;
    padding-top: 0;
    padding-bottom: 0;
    border-color: var(--gm-border);
    border-radius: 8px;
    font-size: .74rem;
}

/* line grid, journal trace and journal detail tables */
.gm-admin.gm-doc .stock-entry-lines-scroll {
    border: 1px solid var(--gm-border);
    border-radius: 12px;
}

.gm-admin.gm-doc .purchase-line-table thead th {
    padding: .35rem .5rem;
    border-bottom: 1px solid var(--gm-border);
    background: #F7FBFC;
    color: var(--gm-text-muted);
    font-size: .7rem;
    font-weight: 600;
    white-space: nowrap;
}

.gm-admin.gm-doc .purchase-line-table td {
    padding: .22rem .5rem;
    border-color: rgba(97, 139, 162, .12);
    color: var(--gm-navy-900);
    font-size: .76rem;
}

.gm-admin.gm-doc .purchase-line-table tbody tr:hover td {
    background: #FAFDFE;
}

.gm-admin.gm-doc .purchase-line-table .form-control-sm,
.gm-admin.gm-doc .purchase-line-table .form-select-sm {
    height: 28px;
    min-height: 28px;
    padding-top: 0;
    padding-bottom: 0;
    border-color: var(--gm-border);
    border-radius: 7px;
    font-size: .74rem;
}

.gm-admin.gm-doc .purchase-line-table input[type=number] {
    text-align: right;
}

.gm-admin.gm-doc .purchase-line-text {
    min-height: 0;
    padding-top: 0;
}

/* row buttons (remove line, open journal) as the gm round icon buttons */
.gm-admin.gm-doc .purchase-line-table .line-action-cell .btn {
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    font-size: .85rem;
}

.gm-admin.gm-doc .purchase-line-table .btn-subtle-danger {
    background: #FCEBEE;
    color: #C0384A;
}

.gm-admin.gm-doc .purchase-line-table .btn-subtle-danger:hover {
    background: #C0384A;
    color: #fff;
}

.gm-admin.gm-doc .purchase-line-table .btn-subtle-secondary {
    background: #E6F3FB;
    color: #2D72D9;
}

.gm-admin.gm-doc .purchase-line-table .btn-subtle-secondary:hover {
    background: #2D72D9;
    color: #fff;
}

/* small buttons outside the grid: Add Line, Refresh, dialog close */
.gm-admin.gm-doc .document-line-toolbar .btn-sm,
.gm-admin.gm-doc .journal-trace-header .btn-sm,
.gm-admin.gm-doc .journal-detail-header .btn-sm {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    height: 28px;
    padding: 0 .6rem;
    border-radius: 8px;
    font-size: .72rem;
    font-weight: 600;
}

.gm-admin.gm-doc .btn-subtle-primary {
    border: 1px solid rgba(13, 159, 153, .3);
    background: rgba(20, 201, 177, .1);
    color: var(--gm-teal-700);
}

.gm-admin.gm-doc .btn-subtle-primary:hover,
.gm-admin.gm-doc .btn-subtle-primary:focus-visible {
    border-color: rgba(13, 159, 153, .45);
    background: rgba(20, 201, 177, .18);
    color: var(--gm-teal-700);
}

.gm-admin.gm-doc .btn-outline-secondary {
    border: 1px solid var(--gm-border);
    background: #fff;
    color: var(--gm-navy-700);
}

.gm-admin.gm-doc .btn-outline-secondary:hover:not(:disabled),
.gm-admin.gm-doc .btn-outline-secondary:focus-visible {
    border-color: rgba(97, 139, 162, .34);
    background: #F1F8FA;
    color: var(--gm-navy-900);
}

/* tabs (Lines / Settlement / Journal) */
.gm-admin.gm-doc .document-tab-switch {
    padding: .18rem;
    border-color: var(--gm-border);
    background: #F3F8FA;
}

.gm-admin.gm-doc .document-tab-button {
    min-height: 28px;
    padding: .2rem .85rem;
    color: var(--gm-navy-700);
    font-size: .76rem;
}

.gm-admin.gm-doc .document-tab-button.active {
    background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%);
    color: #fff;
}

/* journal trace card */
.gm-admin.gm-doc .journal-trace-card {
    padding: .7rem .8rem;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
    background: #FBFDFE;
}

.gm-admin.gm-doc .journal-trace-header {
    margin-bottom: .55rem;
}

.gm-admin.gm-doc .journal-trace-header p {
    color: var(--gm-text-muted);
    font-size: .72rem;
}

.gm-admin.gm-doc .journal-empty-state {
    min-height: 120px;
    border-color: var(--gm-border);
    border-radius: 10px;
    background: #F7FBFC;
    color: var(--gm-text-muted);
    font-size: .76rem;
}

/* footer: Cancel left, totals, then Print / PDF / Save / Confirm */
.gm-admin.gm-doc .purchase-entry-footer {
    gap: .5rem;
    margin-top: .7rem !important;
    padding: .6rem 0 0;
    border-top: 1px solid var(--gm-border);
    background: #fff;
}

.gm-admin.gm-doc .purchase-footer-totals {
    gap: .4rem;
}

.gm-admin.gm-doc .purchase-total-item {
    min-width: 6.5rem;
    padding: .3rem .65rem;
    border: 1px solid var(--gm-border);
    border-radius: 10px;
    background: #F7FBFC;
}

.gm-admin.gm-doc .purchase-total-item span {
    margin-bottom: .05rem;
    color: var(--gm-text-muted);
    font-size: .62rem;
    font-weight: 600;
    letter-spacing: .03em;
}

.gm-admin.gm-doc .purchase-total-item strong {
    color: var(--gm-navy-900);
    font-size: .86rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.gm-admin.gm-doc .purchase-total-discount strong {
    color: #C0384A;
}

.gm-admin.gm-doc .purchase-total-grand {
    border-color: rgba(13, 159, 153, .3);
    background: rgba(20, 201, 177, .1);
}

.gm-admin.gm-doc .purchase-total-grand strong {
    color: var(--gm-teal-700);
}

.gm-admin.gm-doc .purchase-footer-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .3rem;
    min-width: 5.5rem;
    height: 34px;
    padding: 0 .8rem;
    border-radius: 10px;
    font-size: .78rem;
    font-weight: 600;
}

.gm-admin.gm-doc .purchase-footer-pill i {
    margin: 0 !important;
}

.gm-admin.gm-doc .purchase-footer-pill.btn-primary {
    border: 0;
    background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%);
    color: #fff;
}

.gm-admin.gm-doc .purchase-footer-pill.btn-primary:hover:not(:disabled),
.gm-admin.gm-doc .purchase-footer-pill.btn-primary:focus-visible {
    background: linear-gradient(90deg, #0A857F 0%, #12B9AB 100%);
    color: #fff;
    box-shadow: 0 4px 12px rgba(13, 159, 153, .28);
}

.gm-admin.gm-doc .purchase-footer-pill.btn-info {
    border: 0;
    background: linear-gradient(90deg, #1E5FC0 0%, #3B8EF0 100%);
    color: #fff;
}

.gm-admin.gm-doc .purchase-footer-pill.btn-info:hover:not(:disabled),
.gm-admin.gm-doc .purchase-footer-pill.btn-info:focus-visible {
    background: linear-gradient(90deg, #19529F 0%, #2F7DDA 100%);
    color: #fff;
    box-shadow: 0 4px 12px rgba(45, 114, 217, .28);
}

.gm-admin.gm-doc .purchase-footer-pill:disabled {
    opacity: .55;
}

/* journal detail dialog */
.gm-admin.gm-doc .journal-detail-backdrop {
    background: rgba(16, 35, 63, .4);
}

.gm-admin.gm-doc .journal-detail-card {
    border-color: var(--gm-border);
    border-radius: var(--gm-radius);
    background: #fff;
    box-shadow: 0 24px 60px rgba(16, 35, 63, .22);
}

.gm-admin.gm-doc .journal-detail-header {
    padding: .8rem 1rem .7rem;
    border-bottom-color: var(--gm-border);
}

.gm-admin.gm-doc .journal-detail-header h5 {
    font-size: .95rem;
    font-weight: 700;
}

.gm-admin.gm-doc .journal-detail-summary {
    padding: .7rem 1rem;
}

.gm-admin.gm-doc .journal-detail-summary span {
    color: var(--gm-text-muted);
    font-size: .62rem;
    font-weight: 600;
}

.gm-admin.gm-doc .journal-detail-summary strong {
    font-size: .8rem;
}

.gm-admin.gm-doc .alert {
    padding: .5rem .75rem;
    border-radius: 10px;
    font-size: .78rem;
}

@media (max-width: 991.98px) {
    .gm-admin.gm-doc .purchase-entry-card .card-body.stock-entry-shell {
        min-height: auto;
    }
}

/* Dropdown buttons keep one line: a long unit such as "PCS/DOZ (12)" used to wrap and spill out
   of the 28px grid cell. Text is cut with an ellipsis instead. */
.gm-admin.gm-doc .filter-dropdown > .form-select {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.gm-admin.gm-doc .purchase-line-table .filter-dropdown > .form-select-sm {
    padding-left: .5rem;
    padding-right: 1.6rem;
    background-position: right .45rem center;
    line-height: 26px;
}

/* Line Total is the last value column; align it with the other amounts. */
.gm-admin.gm-doc .purchase-line-table:not(.journal-trace-table) th:nth-last-child(2),
.gm-admin.gm-doc .purchase-line-table:not(.journal-trace-table) td:nth-last-child(2) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Entry pages: no page scroll. The card is exactly the window height below the head; the header
   fields and footer keep their size and the line grid takes the rest, scrolling inside itself. Dropdowns inside that scroller are opened with
   Popper's fixed strategy (ui-helpers.js configureDropdownPositioning), so they are not clipped. */
.gm-admin.gm-doc {
    gap: .5rem;
}

.gm-admin.gm-doc .purchase-entry-card .card-body.stock-entry-shell {
    height: calc(100dvh - var(--gm-fit-offset, 150px));
    min-height: 420px;
}

.gm-admin.gm-doc .stock-entry-shell > .stock-entry-main {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow-y: auto;
}

.gm-admin.gm-doc .stock-entry-main > * {
    flex-shrink: 0;
}

.gm-admin.gm-doc .stock-entry-main > .stock-entry-lines-scroll.stock-line-table-wrap {
    flex: 1 1 auto;
    min-height: 140px;
    overflow: auto;
}

.gm-admin.gm-doc .stock-entry-shell > .purchase-entry-footer {
    position: static;
    flex-shrink: 0;
}

@media (max-width: 991.98px) {
    .gm-admin.gm-doc .purchase-entry-card .card-body.stock-entry-shell {
        height: auto;
    }

    .gm-admin.gm-doc .stock-entry-shell > .stock-entry-main {
        overflow: visible;
    }
}

/* ------------------------------------------------------------ payroll pages */

/* Dialogs shown from component state (@if) rather than through Bootstrap's JS: they draw their own
   dimmed backdrop and scroll on their own if taller than the window. */
.modal.gm-state-modal {
    overflow-y: auto;
    background: rgba(16, 35, 63, .4);
}

/* Status shown as a pill in a header field slot, lined up with the 32px inputs beside it. */
.gm-admin.gm-doc .gm-doc-status {
    display: flex;
    align-items: center;
    height: 32px;
}

/* A destructive footer action (Cancel Payroll): outlined, red on hover. */
.gm-admin.gm-doc .purchase-footer-pill.gm-doc-danger {
    border-color: rgba(192, 56, 74, .35);
    color: #C0384A;
}

.gm-admin.gm-doc .purchase-footer-pill.gm-doc-danger:hover:not(:disabled),
.gm-admin.gm-doc .purchase-footer-pill.gm-doc-danger:focus-visible {
    border-color: #C0384A;
    background: #FCEBEE;
    color: #A52F3F;
}

.gm-admin.gm-doc .purchase-line-table .btn-subtle-success {
    background: #E6F6EC;
    color: #1E8E4E;
}

.gm-admin.gm-doc .purchase-line-table .btn-subtle-success:hover {
    background: #1E8E4E;
    color: #fff;
}

/* ---------------------------------------------------------- accounts pages */
/* Group A (Accounts / AccountEntry / ExpenseCategories) - proposed additions to gm-admin.css */

/* A toggle whose checkbox is disabled (AccountEntry: Active on a system account) should look locked. */
.gm-admin .gm-toggle:has(input:disabled) {
    cursor: not-allowed;
    opacity: .6;
}

/* Read-only text field (AccountEntry: Code on a system account) matches the disabled-field tint. */
.gm-admin .gm-dense .gm-input:has(input[readonly]) {
    background: #F7FAFC;
}

/* Accounts group D (Ledgers.razor): a totals row in a gm-table footer.
   gm-admin.css has no tfoot rule; this keeps the Total row readable and pinned to the bottom
   of the scrolling .gm-fit table, the way thead is pinned to the top. */
.gm-admin .gm-table tfoot td {
    border-top: 1px solid var(--gm-border);
    border-bottom: 0;
    background: #F7FBFC;
    color: var(--gm-navy-900);
    font-weight: 700;
}

.gm-admin .gm-fit .gm-table tfoot td {
    position: sticky;
    bottom: 0;
    z-index: 2;
}

/* ---------------------------------------------------------------- reports */

/* Segmented buttons: report sections, transaction views, salesman months. */
.gm-admin .gm-seg {
    display: inline-flex;
    flex-wrap: wrap;
    gap: .2rem;
    padding: .18rem;
    border: 1px solid var(--gm-border);
    border-radius: 10px;
    background: #F3F8FA;
}

.gm-admin .gm-seg-btn {
    height: 26px;
    padding: 0 .7rem;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--gm-navy-700);
    font-size: .74rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

.gm-admin .gm-seg-btn:hover {
    background: #fff;
    color: var(--gm-navy-900);
}

.gm-admin .gm-seg-btn.active {
    background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%);
    color: #fff;
}

/* A segmented switch used as a report filter: one line, sized to its buttons. */
.gm-admin .gm-rf-seg { width: auto; flex: 0 0 auto; }
.gm-admin .gm-rf-seg .gm-seg { flex-wrap: nowrap; }

/* "?" button in the report action bar that shows/hides the report's explanation note. */
.gm-admin .report-help-btn {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gm-border);
    border-radius: 50%;
    background: #fff;
    color: var(--gm-navy-700);
    font-size: .95rem;
    cursor: pointer;
}
.gm-admin .report-help-btn:hover,
.gm-admin .report-help-btn.active { background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%); border-color: transparent; color: #fff; }

/* catalog */
.gm-admin .gm-report-toolbar {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.gm-admin .gm-report-toolbar .gm-search {
    width: min(360px, 100%);
}

.gm-admin .gm-report-toolbar .gm-muted {
    font-size: .74rem;
}

.gm-admin .gm-report-catalog {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    align-items: start;
    gap: .75rem;
}

.gm-admin .gm-report-section-head {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .6rem .8rem;
    border-bottom: 1px solid var(--gm-border);
}

.gm-admin .gm-report-section-head h2 {
    margin: 0;
    font-size: .86rem;
    font-weight: 700;
}

.gm-admin .gm-report-section-head p {
    margin: 0;
    color: var(--gm-text-muted);
    font-size: .68rem;
}

.gm-admin .gm-report-section-icon {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: rgba(20, 201, 177, .12);
    color: var(--gm-teal-700);
    font-size: 1rem;
}

.gm-admin .gm-report-list {
    display: grid;
    padding: .25rem;
}

.gm-admin .gm-report-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    width: 100%;
    padding: .4rem .55rem;
    border: 0;
    border-radius: 9px;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.gm-admin .gm-report-row:hover,
.gm-admin .gm-report-row:focus-visible {
    outline: none;
    background: #F1F8FA;
}

.gm-admin .gm-report-row-text strong {
    display: block;
    color: var(--gm-navy-900);
    font-size: .78rem;
    font-weight: 600;
}

.gm-admin .gm-report-row-text small {
    color: var(--gm-text-muted);
    font-size: .66rem;
}

.gm-admin .gm-report-go {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    flex-shrink: 0;
    height: 24px;
    padding: 0 .55rem;
    border-radius: 7px;
    background: rgba(20, 201, 177, .1);
    color: var(--gm-teal-700);
    font-size: .68rem;
    font-weight: 600;
    opacity: .75;
}

.gm-admin .gm-report-row:hover .gm-report-go {
    background: linear-gradient(90deg, #0C958E 0%, #15CFC0 100%);
    color: #fff;
    opacity: 1;
}

.gm-admin .gm-report-none {
    grid-column: 1 / -1;
}

/* run page: filter card */
.gm-admin .gm-report-filters {
    padding: .6rem .8rem;
}

.gm-admin .gm-report-picker {
    margin-bottom: .55rem;
}

.gm-admin .gm-report-fields {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: .55rem .6rem;
}

.gm-admin .gm-report-fields .gm-field > label {
    margin-bottom: .2rem;
    font-size: .7rem;
}

.gm-admin .gm-rf { width: 150px; }
.gm-admin .gm-rf-sm { width: 130px; }
.gm-admin .gm-rf-wide { width: 230px; }

.gm-admin .gm-report-check {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    height: 32px;
    margin: 0;
    color: var(--gm-navy-700);
    font-size: .74rem;
    font-weight: 600;
    cursor: pointer;
}

.gm-admin .gm-report-check input {
    width: 15px;
    height: 15px;
    accent-color: var(--gm-teal-600);
}

.gm-admin .gm-report-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-left: auto;
}

.gm-admin .gm-report-actions .gm-btn {
    height: 32px;
}

/* The page grid's one column must not grow to a wide table's full width (1fr = minmax(auto, 1fr));
   capped at the page width, the table scrolls sideways inside its own box instead of the page. */
.gm-admin-page.gm-reports {
    grid-template-columns: minmax(0, 1fr);
}

/* run page: result card fills the rest of the window; a single result table scrolls inside
   itself (header and totals pinned), multi-part results scroll the card body. */
.gm-admin .gm-report-result > .gm-report-body {
    display: flex;
    flex-direction: column;
    gap: .6rem;
    padding: .65rem .8rem;
}

.gm-admin .gm-report-body > * {
    flex-shrink: 0;
}

.gm-admin .gm-report-body > .report-table-wrap:last-child {
    flex: 1 1 auto;
    min-height: 160px;
}

.gm-admin .gm-report-stats {
    padding: 0;
    border-bottom: 0;
}

.gm-admin .gm-report-view {
    align-self: flex-start;
}

.gm-admin .report-table-wrap {
    overflow: auto;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
}

.gm-admin .report-table {
    width: 100%;
    margin: 0;
}

.gm-admin .report-table th,
.gm-admin .report-table td {
    white-space: nowrap;
}

.gm-admin .report-table td.text-end,
.gm-admin .report-table th.text-end {
    font-variant-numeric: tabular-nums;
}

/* every report table pins its header and totals row to its own scroller */
.gm-admin .report-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
}

.gm-admin .report-table tfoot td {
    position: sticky;
    bottom: 0;
    z-index: 2;
    border-top: 1px solid var(--gm-border);
    background: #F7FBFC;
    color: var(--gm-navy-900);
    font-weight: 700;
}

.gm-admin .report-empty {
    display: grid;
    place-items: center;
    align-content: center;
    gap: .4rem;
    flex: 1 1 auto;
    min-height: 220px;
    border: 1px dashed var(--gm-border);
    border-radius: 12px;
    background: #FBFDFE;
    color: var(--gm-text-muted);
    font-size: .8rem;
    text-align: center;
}

.gm-admin .report-empty > i {
    color: var(--gm-teal-600);
    font-size: 1.8rem;
    opacity: .7;
}

.gm-admin .report-detail-panel {
    display: flex;
    flex-direction: column;
    gap: .55rem;
    padding-top: .6rem;
    border-top: 1px solid var(--gm-border);
}

.gm-admin .report-detail-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
}

.gm-admin .report-detail-head strong {
    display: block;
    font-size: .86rem;
}

.gm-admin .report-detail-head small {
    color: var(--gm-text-muted);
    font-size: .7rem;
}

/* Location Wise Sales, detailed view: location band, customer heading, closing lines */
.gm-admin .report-loc-table tr.loc-band td {
    background: #E3F1F4;
    color: var(--gm-navy-900);
    font-weight: 700;
    border-top: 2px solid var(--gm-teal-600);
}

.gm-admin .report-loc-table tr.loc-cust td {
    background: #F7FBFC;
    color: var(--gm-navy-900);
    font-weight: 600;
}

.gm-admin .report-loc-table tr.loc-cust small {
    margin-left: .5rem;
    color: var(--gm-text-muted);
    font-weight: 500;
}

.gm-admin .report-loc-table tr.loc-close td {
    font-weight: 600;
    border-bottom: 1px solid var(--gm-border);
}

.gm-admin .report-loc-table tr.loc-total td {
    background: #EEF6F8;
    font-weight: 700;
}

.gm-admin .report-loc-table .loc-indent {
    padding-left: 1.4rem;
}

/* salesman monthly */
.gm-admin .report-month-tabs {
    align-self: flex-start;
    max-width: 100%;
    margin: .55rem 0;
}

.gm-admin .report-month-section {
    display: grid;
    gap: .6rem;
    min-width: 0;
}

.gm-admin .report-subsection {
    display: grid;
    gap: .3rem;
}

.gm-admin .report-subsection-title {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .8rem;
    font-weight: 700;
}

.gm-admin .report-subsection-title i {
    color: var(--gm-teal-600);
}

/* customer / supplier outstanding aging */
.gm-admin .report-outstanding-wrap {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.gm-admin .report-outstanding-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .75rem;
    padding: .7rem .85rem;
    border: 1px solid var(--gm-border);
    border-radius: 12px;
    background: #FBFDFE;
}

.gm-admin .report-outstanding-party {
    display: grid;
    gap: .12rem;
}

.gm-admin .report-outstanding-title {
    font-size: 1rem;
    font-weight: 700;
}

.gm-admin .report-outstanding-subtitle,
.gm-admin .report-outstanding-party-line {
    color: var(--gm-text-muted);
    font-size: .74rem;
}

.gm-admin .report-outstanding-party-name {
    margin-top: .2rem;
    font-size: .9rem;
    font-weight: 700;
}

.gm-admin .report-outstanding-total {
    display: grid;
    align-content: start;
    gap: .15rem;
    min-width: 220px;
    padding: .6rem .8rem;
    border: 1px solid rgba(13, 159, 153, .3);
    border-radius: 10px;
    background: rgba(20, 201, 177, .08);
}

.gm-admin .report-outstanding-total-label {
    color: var(--gm-text-muted);
    font-size: .64rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.gm-admin .report-outstanding-total-value {
    color: var(--gm-teal-700);
    font-size: 1.25rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.gm-admin .report-outstanding-words {
    padding: .5rem .8rem;
    border: 1px solid var(--gm-border);
    border-radius: 10px;
    background: #fff;
    color: var(--gm-navy-700);
    font-size: .78rem;
    font-weight: 600;
}

.gm-admin .report-ageing-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--gm-border);
    border-radius: 10px;
}

.gm-admin .report-ageing-cell {
    padding: .45rem .55rem;
    border-right: 1px solid var(--gm-border);
    font-size: .76rem;
}

.gm-admin .report-ageing-cell:nth-child(7n) {
    border-right: 0;
}

.gm-admin .report-ageing-head {
    background: #F7FBFC;
    color: var(--gm-text-muted);
    font-size: .68rem;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}

.gm-admin .report-ageing-value {
    border-top: 1px solid var(--gm-border);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

@media (max-width: 991.98px) {
    .gm-admin .gm-report-actions {
        margin-left: 0;
    }

    .gm-admin .gm-rf,
    .gm-admin .gm-rf-sm,
    .gm-admin .gm-rf-wide {
        width: calc(50% - .3rem);
    }

    .gm-admin .report-outstanding-head {
        grid-template-columns: 1fr;
    }

    .gm-admin .report-ageing-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* "No data" inside a table frame: the frame already draws the border. */
.gm-admin .report-table-wrap > .report-empty {
    height: 100%;
    border: 0;
    border-radius: 0;
}

/* Return settlement panels (applied credits / refunds) sit in half-width columns: let their small
   tables fit the column instead of the 1080px minimum the document line grids use. */
.gm-admin .stock-line-table.settlement-table {
    min-width: 0;
    width: 100%;
    table-layout: auto;
}

/* ----------------------------------------------------- VAT reports (Reports > VAT) */
.gm-admin .vat-period { flex-wrap: wrap; }
.gm-admin .vat-report { display: grid; gap: .75rem; }
.gm-admin .vat-boxes .vat-section td {
    background: rgba(13, 159, 153, .08);
    color: var(--gm-teal-700);
    font-weight: 700;
    text-transform: uppercase;
    font-size: .72rem;
    letter-spacing: .03em;
}
.gm-admin .vat-boxes td:nth-child(2) { white-space: normal; }
.gm-admin .vat-boxes .vat-total td { font-weight: 700; background: rgba(16, 35, 63, .04); }
.gm-admin .vat-boxes .vat-warning td { background: rgba(250, 226, 226, .6); color: #9B2C2C; }
.gm-admin .vat-warnings { display: grid; gap: .4rem; }
.gm-admin .gm-alert.vat-warn {
    border-color: rgba(181, 118, 17, .35);
    background: rgba(253, 242, 226, .9);
    color: #7A4F0B;
}
.gm-admin .vat-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.gm-admin .vat-side .report-table td:first-child { white-space: normal; }
.gm-admin .vat-register .vat-sub { display: block; color: var(--gm-text-muted); font-size: .68rem; }
.gm-admin .vat-register .vat-neg { color: #B23A48; }
.gm-admin .vat-register .vat-unset { color: #9B2C2C; font-weight: 600; }
.gm-admin .vat-diff td { color: #9B2C2C; font-weight: 600; }
.gm-admin .gm-report-stats .gm-stat small { display: block; font-size: .66rem; }
@media (max-width: 900px) {
    .gm-admin .vat-side { grid-template-columns: minmax(0, 1fr); }
}