/* ========== Financial Module Styles ========== */
.page-title {
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    color: #0F172A;
}

.stat-card {
    border-radius: 14px !important;
    border: 1px solid #E2E8F0 !important;
    background: #fff !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
    border-left: 4px solid transparent !important;
    box-shadow: none !important;
}

.stat-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08) !important;
    border-color: #CBD5E1 !important;
}

.stat-card--primary { border-left-color: #0D9488 !important; }
.stat-card--success { border-left-color: #047857 !important; }
.stat-card--warning { border-left-color: #B45309 !important; }
.stat-card--info { border-left-color: #0369A1 !important; }
.stat-card--secondary { border-left-color: #475569 !important; }
.stat-card--error { border-left-color: #B91C1C !important; }

.stat-card__label {
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    color: #64748B !important;
    opacity: 1;
}

.stat-card__value {
    font-weight: 700 !important;
    color: #0F172A !important;
    letter-spacing: -0.02em;
}

.stat-card__hint {
    color: #64748B !important;
    opacity: 1;
}

.report-container {
    border-radius: 12px;
}

.section-title {
    color: var(--primary-color);
    font-weight: 600 !important;
    border-bottom: 2px solid var(--primary-color);
    padding-bottom: 4px;
    display: inline-block;
}

/* ========== Trial balance (T-format) ========== */
.tb-report {
    --tb-ink: #0B1F33;
    --tb-muted: #64748B;
    --tb-line: #E2E8F0;
    --tb-debit: #0F766E;
    --tb-credit: #1D4ED8;
    --tb-soft-debit: #F0FDFA;
    --tb-soft-credit: #EFF6FF;
    background:
        radial-gradient(1200px 420px at 8% -10%, rgba(15, 118, 110, 0.08), transparent 55%),
        radial-gradient(900px 360px at 92% 0%, rgba(29, 78, 216, 0.08), transparent 50%),
        #FFFFFF;
    border: 1px solid var(--tb-line);
    border-radius: 18px;
    box-shadow: var(--shadow-md);
    overflow: hidden;
}

.tb-report__masthead {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    padding: 1.5rem 1.75rem 1.25rem;
    border-bottom: 1px solid var(--tb-line);
}

.tb-report__eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--tb-muted);
}

.tb-report__title {
    margin: 0;
    font-size: 1.55rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--tb-ink);
}

.tb-report__asof {
    margin: 0.35rem 0 0;
    color: var(--tb-muted);
    font-size: 0.95rem;
}

.tb-report__masthead-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.55rem;
}

.tb-report__generated {
    font-size: 0.8rem;
    color: var(--tb-muted);
}

.tb-report__status {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.tb-report__status--ok {
    background: #ECFDF5;
    color: #047857;
    border: 1px solid #A7F3D0;
}

.tb-report__status--warn {
    background: #FFFBEB;
    color: #B45309;
    border: 1px solid #FDE68A;
}

.tb-report__columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    min-height: 280px;
}

.tb-report__side {
    --tb-code-width: 9.75rem;
    --tb-amt-width: 7.75rem;
    padding: 1.1rem 1.25rem 1.35rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.tb-report__side--debit {
    background: linear-gradient(180deg, var(--tb-soft-debit) 0%, #FFFFFF 42%);
    border-right: 1px solid var(--tb-line);
}

.tb-report__side--credit {
    background: linear-gradient(180deg, var(--tb-soft-credit) 0%, #FFFFFF 42%);
}

.tb-report__side-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    padding-bottom: 0.65rem;
    border-bottom: 2px solid currentColor;
}

.tb-report__side--debit .tb-report__side-head {
    color: var(--tb-debit);
}

.tb-report__side--credit .tb-report__side-head {
    color: var(--tb-credit);
}

.tb-report__side-label {
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.tb-report__side-hint {
    font-size: 0.75rem;
    font-weight: 600;
    opacity: 0.8;
}

.tb-report__empty {
    margin: 1.25rem 1.5rem;
    color: var(--tb-muted);
    font-size: 0.9rem;
    font-style: italic;
}

.tb-section__head h3 {
    margin: 0 0 0.55rem;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--tb-ink);
}

.tb-side-grid {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.tb-side-grid__head {
    display: grid;
    grid-template-columns: var(--tb-code-width) minmax(0, 1fr) var(--tb-amt-width);
    gap: 0.5rem;
    align-items: end;
    padding: 0 0.4rem 0.5rem;
    border-bottom: 1px solid var(--tb-line);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--tb-muted);
}

.tb-side-grid__head .tb-col-amt {
    text-align: right;
}

.tb-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.tb-table col.tb-col-code {
    width: var(--tb-code-width);
}

.tb-table col.tb-col-name {
    width: auto;
}

.tb-table col.tb-col-amt {
    width: var(--tb-amt-width);
}

.tb-table tbody td {
    padding: 0.48rem 0.4rem;
    border-bottom: 1px solid #F1F5F9;
    color: var(--tb-ink);
    vertical-align: top;
}

.tb-table tbody tr:hover td {
    background: rgba(15, 23, 42, 0.025);
}

.tb-table tfoot td {
    padding: 0.55rem 0.4rem 0.2rem;
    font-weight: 700;
    color: var(--tb-ink);
    border-top: 1px solid var(--tb-line);
}

.tb-col-code {
    font-variant-numeric: tabular-nums;
    font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
    font-size: 0.78rem;
    color: var(--tb-muted) !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal;
}

.tb-col-name {
    text-align: left;
    overflow-wrap: anywhere;
}

.tb-col-amt {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    white-space: nowrap;
}

.tb-report__side-total {
    margin-top: auto;
    display: grid;
    grid-template-columns: var(--tb-code-width, 9.75rem) minmax(0, 1fr) var(--tb-amt-width, 7.75rem);
    gap: 0.5rem;
    align-items: baseline;
    padding: 0.85rem 0.9rem;
    border-radius: 12px;
    font-size: 0.9rem;
    font-weight: 700;
}

.tb-report__side-total span:first-child {
    grid-column: 1 / 3;
}

.tb-report__side-total strong {
    grid-column: 3;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-size: 1.05rem;
}

.tb-report__side--debit .tb-report__side-total {
    background: rgba(15, 118, 110, 0.1);
    color: var(--tb-debit);
}

.tb-report__side--credit .tb-report__side-total {
    background: rgba(29, 78, 216, 0.1);
    color: var(--tb-credit);
}

.tb-report__proof {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 1rem 1.25rem 1.25rem;
    border-top: 1px solid var(--tb-line);
    background: #F8FAFC;
}

.tb-report__proof-row {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.75rem 0.9rem;
    border-radius: 12px;
    background: #FFFFFF;
    border: 1px solid var(--tb-line);
}

.tb-report__proof-row span {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--tb-muted);
}

.tb-report__proof-row strong {
    font-size: 1.1rem;
    font-variant-numeric: tabular-nums;
    color: var(--tb-ink);
}

.tb-ok { color: #047857 !important; }
.tb-warn { color: #B45309 !important; }

@media (max-width: 960px) {
    .tb-report__columns {
        grid-template-columns: 1fr;
    }

    .tb-report__side--debit {
        border-right: 0;
        border-bottom: 1px solid var(--tb-line);
    }

    .tb-report__masthead-meta {
        align-items: flex-start;
    }

    .tb-report__proof {
        grid-template-columns: 1fr;
    }
}

.form-section {
    border-radius: 12px;
}

.line-item-card {
    border-radius: 8px;
    border: 1px solid var(--border-color);
}

.font-weight-bold {
    font-weight: 600 !important;
}

.budget-card {
    border-radius: 12px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.budget-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

/* ========== Shared Confirm Dialog ========== */
.confirm-dialog .mud-dialog-content {
    padding: 0 !important;
    overflow: hidden;
    border-radius: 16px;
}

.confirm-dialog__content {
    overflow: hidden;
}

.confirm-dialog__body {
    padding: 2rem 2rem 1.25rem;
    text-align: center;
}

.confirm-dialog__icon-wrap {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
}

.confirm-dialog__icon-wrap--delete {
    background: linear-gradient(135deg, #ffebee 0%, #ffcdd2 100%);
    color: #c62828;
    box-shadow: 0 8px 24px rgba(198, 40, 40, 0.18);
}

.confirm-dialog__icon-wrap--warning {
    background: linear-gradient(135deg, #fff8e1 0%, #ffecb3 100%);
    color: #ef6c00;
    box-shadow: 0 8px 24px rgba(239, 108, 0, 0.15);
}

.confirm-dialog__icon-wrap--info {
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
    color: #1565c0;
    box-shadow: 0 8px 24px rgba(21, 101, 192, 0.15);
}

.confirm-dialog__icon-wrap--success {
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    color: #2e7d32;
    box-shadow: 0 8px 24px rgba(46, 125, 50, 0.15);
}

.confirm-dialog__icon-wrap--default {
    background: linear-gradient(135deg, #e8eaf6 0%, #c5cae9 100%);
    color: #3949ab;
    box-shadow: 0 8px 24px rgba(57, 73, 171, 0.15);
}

.confirm-dialog__icon-wrap--post {
    background: linear-gradient(135deg, #e0f2f1 0%, #b2dfdb 100%);
    color: #00695c;
    box-shadow: 0 8px 24px rgba(0, 105, 92, 0.16);
}

.confirm-dialog__icon-wrap--reverse {
    background: linear-gradient(135deg, #fff3e0 0%, #ffe0b2 100%);
    color: #e65100;
    box-shadow: 0 8px 24px rgba(230, 81, 0, 0.16);
}

.confirm-dialog__eyebrow {
    display: block;
    letter-spacing: 0.12em;
    font-weight: 700 !important;
    color: #64748b;
    margin-bottom: 0.35rem !important;
}

.confirm-dialog__icon {
    font-size: 2rem !important;
}

.confirm-dialog__title {
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    margin-bottom: 0.5rem !important;
}

.confirm-dialog__message {
    line-height: 1.6;
    max-width: 320px;
    margin: 0 auto;
}

.confirm-dialog__item {
    background: var(--light-color) !important;
    border: 1px solid var(--border-color);
    border-radius: 10px !important;
    text-align: left;
}

.confirm-dialog__item-name {
    font-weight: 600 !important;
    word-break: break-word;
}

.confirm-dialog__hint {
    text-align: left;
    border-radius: 8px;
}

.confirm-dialog__divider {
    opacity: 0.6;
}

.confirm-dialog__actions {
    background: #fafbfc;
}

.confirm-dialog__btn-cancel {
    min-width: 100px;
    text-transform: none;
    font-weight: 500;
}

.confirm-dialog__btn-confirm {
    min-width: 110px;
    text-transform: none;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.page-subtitle {
    color: #64748b !important;
}

.users-stat-card {
    border-radius: 12px;
    border: 1px solid #e2e8f0;
}

.users-stat-label {
    color: #64748b;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.users-table-card {
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    overflow: hidden;
}

.users-muted-text {
    color: #64748b;
}

/* Standalone signed-out page (served outside Blazor) */
.signed-out-container {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: linear-gradient(135deg, #594ae2 0%, #4539b8 100%);
}

.signed-out-card {
    width: 100%;
    max-width: 440px;
    border-radius: 1rem;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.18);
}

.signed-out-card-header {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: #fff;
    text-align: center;
    padding: 2rem 1.75rem 1.5rem;
}

.signed-out-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 1rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
}

.signed-out-card-header h1 {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0.35rem;
    color: #fff;
}

.signed-out-lead {
    margin: 0;
    opacity: 0.92;
    font-size: 0.9rem;
}

.signed-out-card-body {
    padding: 1.75rem;
    text-align: center;
}

.signed-out-message {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    background: #f1f5f9;
    border-radius: 0.75rem;
    padding: 0.875rem 1rem;
    font-size: 0.925rem;
    color: #334155;
    margin-bottom: 1rem;
}

.signed-out-hint {
    color: #64748b;
    font-size: 0.875rem;
    margin-bottom: 1.25rem;
}

.signed-out-btn {
    padding: 0.65rem 1rem;
    font-weight: 600;
    border: none;
    background: linear-gradient(135deg, #594ae2 0%, #4539b8 100%);
}

.signed-out-btn:hover {
    background: linear-gradient(135deg, #4a3dc4 0%, #3a2fa0 100%);
    color: #fff;
}

.signed-out-footer {
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.875rem;
    margin-top: 1.25rem;
    margin-bottom: 0;
}

/* ========== Category Image Upload ========== */
.category-image-preview {
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
}

.category-image-preview__img {
    max-width: 100%;
    max-height: 220px;
    object-fit: contain;
    border-radius: 4px;
}

.category-image-preview__thumb {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 4px;
}

.variant-image-gallery__card {
    height: 100%;
}

.variant-image-gallery__frame {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    background: #f1f5f9;
    border-radius: 4px;
    overflow: hidden;
}

.variant-image-gallery__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    background: #e2e8f0;
}

.variant-image-gallery__img--broken {
    object-fit: contain;
    padding: 1rem;
    opacity: 0.35;
}

.variant-image-gallery__badge {
    position: absolute;
    top: 6px;
    left: 6px;
    z-index: 1;
}

.entity-image-carousel__empty,
.entity-image-carousel__single {
    border-radius: 12px;
    overflow: hidden;
    background: var(--mud-palette-background-grey);
}

.entity-image-carousel__carousel {
    border-radius: 12px;
    overflow: hidden;
}

.entity-image-carousel__slide {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 160px;
    background: var(--mud-palette-background-grey);
}

.entity-image-carousel__main-img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

.entity-image-carousel__single {
    min-height: 160px;
}

.entity-image-carousel__single .entity-image-carousel__main-img {
    width: 100%;
    max-height: 320px;
    object-fit: contain;
}

.entity-image-carousel__primary-badge {
    position: absolute;
    top: 8px;
    left: 8px;
}

.entity-image-carousel__thumbs {
    justify-content: center;
}

.entity-image-carousel__thumb {
    border: 2px solid transparent;
    border-radius: 8px;
    padding: 0;
    width: 56px;
    height: 56px;
    overflow: hidden;
    background: transparent;
    cursor: pointer;
}

.entity-image-carousel__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.entity-image-carousel__thumb--active {
    border-color: var(--mud-palette-primary);
}

.category-tree-page .category-tree-panel {
    background: #fafbfc;
}

.category-tree-node__children {
    margin-left: 1.25rem;
    padding-left: 0.75rem;
    border-left: 2px solid rgba(0, 0, 0, 0.08);
}

.category-tree-node__row {
    background: #fff;
}

.category-tree-node__title {
    font-weight: 600;
}

.category-tree-node__spacer {
    display: inline-block;
    width: 32px;
    flex-shrink: 0;
}

.category-tree-node__avatar img {
    object-fit: cover;
}

.gl-account-preview {
    background: #f8f9fa;
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 6px;
}

/* ========== Category Form ========== */
.category-form-page {
    padding-bottom: 2rem;
}

.category-form-skeleton,
.category-section,
.category-preview-card,
.category-action-bar {
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 14px;
    background: #fff;
}

.category-section {
    padding: 1.25rem 1.5rem 1.5rem;
}

.category-section__header {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}

.category-section__title {
    font-weight: 600 !important;
    line-height: 1.2;
}

.category-toggle-card {
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 10px;
    background: #fafbfc;
    height: 100%;
}

.category-upload-zone {
    border: 1px dashed #c5cae9;
    border-radius: 12px;
    background: linear-gradient(180deg, #fafbff 0%, #f5f7ff 100%);
}

.category-preview-panel {
    position: sticky;
    top: 1rem;
}

.category-preview-card {
    overflow: hidden;
}

.category-preview-card__hero {
    position: relative;
    min-height: 180px;
    background: linear-gradient(135deg, #594ae2 0%, #4539b8 100%);
}

.category-preview-card__image {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}

.category-preview-card__placeholder {
    min-height: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.85);
}

.category-preview-card__badges {
    position: absolute;
    left: 0.75rem;
    bottom: 0.75rem;
    display: flex;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.category-preview-card__title {
    font-weight: 700 !important;
    line-height: 1.25;
}

.category-preview-card__description {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #5f6368;
}

.category-action-bar {
    box-shadow: var(--shadow-sm);
}

@media (max-width: 1280px) {
    .category-preview-panel {
        position: static;
    }
}

/* ========== Detail Pages (Category, Product, etc.) ========== */
.detail-page {
    padding-bottom: 2rem;
}

.detail-section {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
    padding: 1.25rem 1.5rem 1.5rem;
    margin-bottom: 0;
}

.detail-section__header {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    margin-bottom: 0.25rem;
}

.detail-section__title {
    font-weight: 600 !important;
    color: #1e293b;
}

.detail-field-label {
    display: block;
    color: #64748b;
    font-weight: 600;
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.35rem;
}

.detail-field-value {
    color: #334155;
}

.detail-field-value--strong {
    font-weight: 600;
    color: #1e293b;
}

.gl-account-card {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
    height: 100%;
}

.detail-preview-card {
    overflow: hidden;
    padding: 0 !important;
}

.detail-preview-card__image {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
}

.detail-preview-card__placeholder {
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
}

/* ========== Product Form ========== */
.product-form-page {
    padding-bottom: 6rem;
    background: linear-gradient(180deg, #f4f6f9 0%, #f8fafc 120px, transparent 120px);
}

.product-wizard {
    display: flex;
    align-items: flex-start;
    gap: 0;
}

.product-wizard__step {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

.product-wizard__indicator {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    font-weight: 600;
    flex-shrink: 0;
    border: 2px solid #cbd5e1;
    color: #64748b;
    background: #fff;
}

.product-wizard__step--active .product-wizard__indicator {
    border-color: var(--mud-palette-primary, #594ae2);
    background: var(--mud-palette-primary, #594ae2);
    color: #fff;
}

.product-wizard__step--complete .product-wizard__indicator {
    border-color: #2e7d32;
    background: #2e7d32;
    color: #fff;
}

.product-wizard__step--clickable {
    cursor: pointer;
}

.product-wizard__step--clickable:hover .product-wizard__title {
    color: var(--mud-palette-primary, #594ae2);
}

.product-wizard__step--active .product-wizard__title {
    color: var(--mud-palette-primary, #594ae2);
    font-weight: 600 !important;
}

.product-wizard__desc {
    color: #64748b !important;
    line-height: 1.3;
}

.product-wizard__connector {
    flex: 0 0 2rem;
    height: 2px;
    background: #e2e8f0;
    margin-top: 1rem;
}

.product-wizard__connector--complete {
    background: #2e7d32;
}

.product-context-bar {
    border-left: 4px solid var(--mud-palette-primary, #594ae2);
}

.variant-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.variant-toolbar__label {
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.variant-toolbar__chip {
    min-width: auto !important;
    padding: 0 0.75rem !important;
    border: 1px solid #e2e8f0;
    border-radius: 999px !important;
    background: #fff !important;
}

.variant-accordion .mud-expand-panel {
    border: 1px solid #e2e8f0;
    border-radius: 12px !important;
    margin-bottom: 0.75rem;
    overflow: hidden;
}

.variant-section-accordion {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.variant-section-accordion .mud-expand-panel {
    border: 1px solid #e2e8f0;
    border-radius: 12px !important;
    margin: 0 !important;
    overflow: hidden;
    background: #fff;
}

.variant-section-accordion .mud-expand-panel .mud-expand-panel-header {
    padding: 0.75rem 1rem;
    min-height: 0;
}

.variant-section-accordion .mud-expand-panel .mud-expand-panel-content {
    padding: 0 1rem 1rem;
}

.variant-section-title {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 0.25rem;
    padding-right: 0.25rem;
}

.variant-rail {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    padding: 0.15rem 0;
}

.variant-rail__item {
    display: inline-flex;
    align-items: center;
    gap: 0.1rem;
    padding: 0.2rem 0.28rem 0.2rem 0.22rem;
    border: 1px solid transparent;
    border-radius: 999px;
    color: #fff;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
}

.variant-rail__main {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.42rem 0.55rem 0.42rem 0.7rem;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font: inherit;
    border-radius: 999px;
}

.variant-rail__item:hover {
    transform: translateY(-1px);
    filter: brightness(1.04);
}

.variant-rail__item--ready {
    background: linear-gradient(135deg, #16a34a 0%, #15803d 55%, #166534 100%);
    box-shadow: 0 8px 18px rgba(22, 163, 74, 0.28);
}

.variant-rail__item--incomplete {
    background: linear-gradient(135deg, #fb7185 0%, #e11d48 52%, #be123c 100%);
    box-shadow: 0 8px 18px rgba(225, 29, 72, 0.28);
}

.variant-rail__item--selected {
    transform: translateY(-1px) scale(1.02);
    box-shadow:
        0 0 0 2px #fff,
        0 0 0 4px rgba(15, 23, 42, 0.18),
        0 12px 24px rgba(15, 23, 42, 0.16);
}

.variant-rail__item--ready.variant-rail__item--selected {
    box-shadow:
        0 0 0 2px #fff,
        0 0 0 4px rgba(22, 163, 74, 0.55),
        0 12px 26px rgba(22, 163, 74, 0.35);
}

.variant-rail__item--incomplete.variant-rail__item--selected {
    box-shadow:
        0 0 0 2px #fff,
        0 0 0 4px rgba(225, 29, 72, 0.5),
        0 12px 26px rgba(225, 29, 72, 0.35);
}

.variant-rail__item--selected .variant-rail__label {
    font-weight: 700;
}

.variant-rail__index {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    opacity: 0.82;
    color: inherit;
}

.variant-rail__label {
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: inherit;
}

.variant-rail__price {
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    backdrop-filter: blur(4px);
}

.variant-rail__status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    opacity: 0.95;
}

.variant-rail__status .mud-icon-root {
    font-size: 1rem !important;
    width: 1rem;
    height: 1rem;
}

.variant-rail__dup {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.85rem;
    height: 1.85rem;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    cursor: pointer;
    padding: 0;
    transition: background 0.15s ease;
}

.variant-rail__dup:hover {
    background: rgba(255, 255, 255, 0.3);
    color: #fff;
}

.variant-editor-shell {
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1.05rem 1.15rem 1.2rem;
    background: linear-gradient(180deg, #fbfcff 0%, #fff 48%);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
}

.variant-editor-shell__header {
    margin-bottom: 0.35rem;
}

.variant-branch-editor--compact .mud-table {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
}

.branch-commerce-card {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 0.85rem 1rem 1rem;
    background: #fff;
}

.branch-commerce-card--on {
    border-color: #c7d7c4;
    box-shadow: 0 8px 22px rgba(46, 92, 58, 0.06);
}

.branch-commerce-card--off {
    background: #f8faf8;
    opacity: 0.92;
}

.branch-commerce-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.finance-analytics {
    overflow: hidden;
}

.finance-kpi {
    height: 100%;
    border-radius: 14px;
    padding: 0.9rem 1rem 1rem;
    border: 1px solid #e2e8f0;
    background: linear-gradient(180deg, #fbfcff 0%, #fff 70%);
}

.finance-kpi .mud-icon-root {
    margin-bottom: 0.35rem;
}

.finance-kpi__label {
    display: block;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 0.15rem;
}

.finance-kpi--stock { border-top: 3px solid #2f6f4e; }
.finance-kpi--cogs { border-top: 3px solid #c27a2d; }
.finance-kpi--revenue { border-top: 3px solid #2b6cb0; }
.finance-kpi--margin { border-top: 3px solid #7c3aed; }

.finance-analytics__meta {
    align-items: center;
}

.variant-panel--valid .mud-expand-panel-header {
    background: linear-gradient(90deg, #f1f8f1 0%, #fff 100%);
}

.variant-panel--incomplete .mud-expand-panel-header {
    background: linear-gradient(90deg, #fff8f0 0%, #fff 100%);
}

.variant-panel__price {
    margin-left: auto;
    font-weight: 600;
    color: var(--mud-palette-primary, #594ae2);
}

.variant-sku-mono .mud-input-slot {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.8125rem;
}

.product-preview-card__label-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem 0;
}

.product-preview-card__body {
    padding: 1rem 1.25rem 1.25rem;
}

.product-preview-card__title {
    font-weight: 600 !important;
    margin-bottom: 0.25rem;
}

.product-preview-card__metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-top: 0.5rem;
}

.product-preview-card__metric {
    padding: 0.5rem 0.75rem;
    border-radius: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.product-preview-card__variant-list {
    max-height: 220px;
    overflow-y: auto;
}

.product-preview-card__variant-item--selected {
    background: rgba(25, 118, 210, 0.08);
    border-radius: 8px;
}

.product-preview-card__variant-line {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.product-preview-card--hint {
    background: #f0f7ff !important;
    border-color: #bbdefb !important;
}

.product-action-bar--sticky {
    position: sticky;
    bottom: 0;
    z-index: 10;
    box-shadow: 0 -4px 24px rgba(15, 23, 42, 0.08);
    backdrop-filter: blur(8px);
    background: rgba(255, 255, 255, 0.96) !important;
}

@media (max-width: 768px) {
    .product-wizard {
        flex-direction: column;
        gap: 1rem;
    }

    .product-wizard__connector {
        display: none;
    }

    .product-preview-card__metrics {
        grid-template-columns: repeat(2, 1fr);
    }
}

.product-form-skeleton,
.product-section,
.product-stepper,
.product-preview-card,
.product-action-bar {
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 14px;
    background: #fff;
}

.product-section {
    padding: 1.25rem 1.5rem 1.5rem;
}

.product-section__header {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}

.product-section__title {
    font-weight: 600 !important;
    line-height: 1.2;
}

.product-preview-panel {
    position: sticky;
    top: 1rem;
    z-index: 2;
}

.product-form-layout__aside {
    min-width: 0;
}

@media (min-width: 960px) {
    .product-form-layout__aside {
        position: relative;
    }

    .product-form-layout__aside .product-preview-panel {
        max-height: calc(100vh - 2rem);
        overflow-y: auto;
        padding-bottom: 1rem;
    }
}

.product-preview-card {
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.product-preview-card__hero {
    position: relative;
    min-height: 140px;
    background: linear-gradient(135deg, #594ae2 0%, #4539b8 100%);
}

.product-preview-card__image {
    width: 100%;
    height: 160px;
    object-fit: cover;
    display: block;
}

.product-preview-card__placeholder {
    min-height: 160px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.9);
}

.variant-card {
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 12px;
    padding: 1rem 1.25rem 1.25rem;
    background: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.variant-card__body {
    padding: 0.25rem 0.5rem 0.5rem;
}

.variant-card--valid {
    border-color: #c8e6c9;
    background: linear-gradient(180deg, #fafdfa 0%, #fff 100%);
}

.variant-card--incomplete {
    border-color: #ffe0b2;
    background: linear-gradient(180deg, #fffaf5 0%, #fff 100%);
}

.variant-card__header {
    margin-bottom: 0.75rem;
}

.variant-card__label {
    display: block;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.variant-edit-context {
    border: 1px solid #c5cae9;
    border-radius: 12px;
    padding: 0.875rem 1.25rem;
    background: linear-gradient(135deg, #f8f9ff 0%, #fff 100%);
}

.variant-parent-card {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1rem 1.25rem;
    background: #f8fafc;
}

.variant-row-advanced {
    border: 1px dashed #e2e8f0;
    border-radius: 10px;
    margin-top: 0.5rem;
}

.product-preview-card__variant-thumb {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
}

.variant-empty-state {
    border: 1px dashed #c5cae9;
    border-radius: 12px;
    background: linear-gradient(180deg, #fafbff 0%, #f5f7ff 100%);
}

.required-mark {
    color: #d32f2f;
    font-weight: 700;
}

.validation-summary__list {
    padding-left: 1.25rem;
    margin: 0;
}

.validation-summary__list li {
    margin-bottom: 0.25rem;
}

.variant-detail-table__thumb {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    object-fit: cover;
    display: block;
    border: 1px solid #e2e8f0;
}

.variant-detail-table__thumb--empty {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8fafc;
    color: #94a3b8;
}

.product-detail-metric {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
}

.settings-nav-card--primary { border-left: 4px solid var(--mud-palette-primary); }
.settings-nav-card--secondary { border-left: 4px solid var(--mud-palette-secondary); }
.settings-nav-card--info { border-left: 4px solid var(--mud-palette-info); }
.settings-nav-card--tertiary { border-left: 4px solid var(--mud-palette-tertiary); }
.settings-nav-card--warning { border-left: 4px solid var(--mud-palette-warning); }
.settings-nav-card--success { border-left: 4px solid var(--mud-palette-success); }

.settings-nav-card__title {
    font-weight: 600;
    color: #1e293b;
}

.settings-nav-card__desc {
    color: #64748b;
    line-height: 1.4;
}

.settings-nav-card__chevron {
    color: #94a3b8;
    flex-shrink: 0;
}

.settings-nav-card__avatar {
    flex-shrink: 0;
}

.settings-stat-card {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #f8fafc;
    height: 100%;
}

.settings-stat-card--highlight {
    border-color: #99F6E4;
    background: linear-gradient(135deg, #F0FDFA 0%, #ffffff 100%);
}






.public-status-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: var(--iph-space-6);
    background:
        radial-gradient(circle at 20% 10%, rgba(13, 148, 136, 0.2), transparent 35%),
        linear-gradient(145deg, #0b1f33, #123047);
}

.public-status-card {
    width: min(100%, 34rem);
    padding: var(--iph-space-10);
    border-radius: var(--iph-radius-xl);
    text-align: center;
    background: var(--iph-consumer-surface);
    box-shadow: var(--shadow-lg);
}

.public-status-reference {
    display: inline-block;
    padding: var(--iph-space-2) var(--iph-space-3);
    border-radius: var(--iph-radius-sm);
    background: var(--iph-consumer-secondary-soft);
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}



/* ========== Journal entry detail ========== */
.je-detail {
    padding-bottom: 1.5rem;
}

.je-detail__header .admin-page-title {
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.03em;
}

.je-detail__kpis {
    margin-bottom: 1.15rem;
}

.je-stat-card {
    border: 1px solid color-mix(in srgb, var(--admin-border) 88%, transparent);
    border-radius: 16px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), #fff),
        var(--admin-surface);
    padding: 1.15rem 1.3rem 1.2rem;
    height: 100%;
    position: relative;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03), 0 10px 28px rgba(15, 23, 42, 0.04);
}

.je-stat-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: #94a3b8;
}

.je-stat-card--debit {
    background:
        linear-gradient(135deg, rgba(15, 118, 110, 0.07), transparent 48%),
        #fff;
}

.je-stat-card--credit {
    background:
        linear-gradient(135deg, rgba(29, 78, 216, 0.07), transparent 48%),
        #fff;
}

.je-stat-card--balanced {
    background:
        linear-gradient(135deg, rgba(21, 128, 61, 0.08), transparent 48%),
        #fff;
}

.je-stat-card--unbalanced {
    background:
        linear-gradient(135deg, rgba(180, 83, 9, 0.1), transparent 48%),
        #fff;
}

.je-stat-card--debit::before {
    background: linear-gradient(180deg, #0f766e, #14b8a6);
}

.je-stat-card--credit::before {
    background: linear-gradient(180deg, #1d4ed8, #60a5fa);
}

.je-stat-card--balanced::before {
    background: linear-gradient(180deg, #15803d, #4ade80);
}

.je-stat-card--unbalanced::before {
    background: linear-gradient(180deg, #b45309, #f59e0b);
}

.je-stat-card__top {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.je-stat-card__glyph {
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 0.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.04);
    color: #475569;
}

.je-stat-card--debit .je-stat-card__glyph {
    background: rgba(15, 118, 110, 0.12);
    color: #0f766e;
}

.je-stat-card--credit .je-stat-card__glyph {
    background: rgba(29, 78, 216, 0.12);
    color: #1d4ed8;
}

.je-stat-card--balanced .je-stat-card__glyph {
    background: rgba(21, 128, 61, 0.12);
    color: #15803d;
}

.je-stat-card--unbalanced .je-stat-card__glyph {
    background: rgba(180, 83, 9, 0.14);
    color: #b45309;
}

.je-stat-card__label {
    display: block;
    color: #64748b;
    font-weight: 650;
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.je-stat-card__value {
    margin-top: 0.55rem !important;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.03em;
    font-weight: 750 !important;
    color: #0f172a;
}

.je-stat-card__value--sm {
    font-size: 1.25rem !important;
    line-height: 1.25 !important;
}

.je-stat-card__hint {
    display: block;
    margin-top: 0.3rem;
    color: #94a3b8;
}

.je-stat-card--balanced .je-stat-card__value {
    color: #15803d;
}

.je-stat-card--unbalanced .je-stat-card__value {
    color: #b45309;
}

.je-notice {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1.15rem;
    padding: 0.85rem 1.05rem;
    border-radius: 14px;
    border: 1px solid transparent;
}

.je-notice--info {
    background: linear-gradient(180deg, rgba(13, 148, 136, 0.07), rgba(13, 148, 136, 0.03));
    border-color: color-mix(in srgb, var(--admin-primary) 28%, var(--admin-border));
}

.je-notice--warning {
    background: linear-gradient(180deg, rgba(180, 83, 9, 0.08), rgba(180, 83, 9, 0.03));
    border-color: rgba(180, 83, 9, 0.22);
}

.je-notice__icon {
    margin-top: 0.1rem;
    color: var(--admin-primary-dark);
    flex-shrink: 0;
}

.je-notice--warning .je-notice__icon {
    color: #b45309;
}

.je-notice__copy {
    margin: 0;
    color: #334155;
    line-height: 1.5;
    font-size: 0.9rem;
}

.je-notice__link {
    font-weight: 700 !important;
}

.je-lines-card .admin-section-card__body,
.je-meta-card .admin-section-card__body {
    padding-top: 0.35rem;
}

.je-lines-wrap {
    overflow: hidden;
}

.je-lines-table .mud-table-head .mud-table-cell {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
    background: #f8fafc;
}

.je-lines-table .mud-table-cell {
    vertical-align: middle;
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

.je-col-index {
    width: 3.25rem;
}

.je-line-index {
    display: inline-flex;
    min-width: 1.5rem;
    justify-content: center;
    color: #94a3b8;
    font-variant-numeric: tabular-nums;
    font-weight: 650;
}

.je-col-debit {
    background: rgba(15, 118, 110, 0.035);
}

.je-col-credit {
    background: rgba(29, 78, 216, 0.035);
}

.je-row--debit td:first-child {
    box-shadow: inset 3px 0 0 #0f766e;
}

.je-row--credit td:first-child {
    box-shadow: inset 3px 0 0 #2563eb;
}

.je-account-link {
    text-decoration: none !important;
    display: inline-flex;
    flex-direction: column;
    gap: 0.12rem;
}

.je-account-link:hover .je-account-name {
    text-decoration: underline;
}

.je-account-code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.8125rem;
    font-weight: 650;
    color: #0f172a;
    letter-spacing: 0.01em;
}

.je-account-name {
    color: #64748b;
    font-size: 0.8125rem;
}

.je-line-desc {
    color: #475569;
    max-width: none;
}

.je-amount {
    font-variant-numeric: tabular-nums;
    font-weight: 650;
    letter-spacing: -0.015em;
}

.je-amount--debit {
    color: #0f766e;
}

.je-amount--credit {
    color: #1d4ed8;
}

.je-amount--empty {
    color: #cbd5e1;
    font-weight: 500;
}

.je-amount--total {
    font-size: 0.95rem;
    font-weight: 750;
}

.je-lines-table .mud-table-foot .mud-table-cell {
    background: #f1f5f9;
    border-top: 1px solid #e2e8f0;
    padding-top: 0.95rem;
    padding-bottom: 0.95rem;
}

.je-totals-label {
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #475569;
}

.je-meta {
    margin: 0;
    display: grid;
    gap: 0.85rem;
}

.je-meta__row {
    display: grid;
    grid-template-columns: 8.5rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
}

.je-meta__row--block {
    grid-template-columns: 1fr;
    gap: 0.3rem;
}

.je-meta dt {
    margin: 0;
    color: #64748b;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.je-meta dd {
    margin: 0;
    color: #0f172a;
    font-weight: 600;
    line-height: 1.4;
    word-break: break-word;
}

.je-type-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    font-size: 0.75rem;
    font-weight: 650;
    color: #334155;
}

.je-meta__source-type {
    display: block;
    color: #0f172a;
}

.je-meta__source-link,
.je-meta__source-id {
    display: inline-block;
    margin-top: 0.2rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.8rem;
    font-weight: 650;
}

.je-audit {
    margin-top: 1.25rem;
    padding-top: 1.1rem;
    border-top: 1px dashed #e2e8f0;
}

.je-audit__title {
    margin: 0 0 0.75rem;
    font-size: 0.6875rem;
    font-weight: 750;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #64748b;
}

.je-audit__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.85rem;
}

.je-audit__step {
    display: grid;
    grid-template-columns: 0.75rem minmax(0, 1fr);
    gap: 0.7rem;
    position: relative;
}

.je-audit__step:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 0.3rem;
    top: 1rem;
    bottom: -0.85rem;
    width: 1px;
    background: #e2e8f0;
}

.je-audit__dot {
    width: 0.7rem;
    height: 0.7rem;
    margin-top: 0.2rem;
    border-radius: 50%;
    background: #cbd5e1;
    box-shadow: 0 0 0 3px #f1f5f9;
}

.je-audit__step--done .je-audit__dot {
    background: #0f766e;
    box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.14);
}

.je-audit__step strong {
    display: block;
    font-size: 0.85rem;
    color: #0f172a;
}

.je-audit__step span {
    display: block;
    margin-top: 0.15rem;
    color: #64748b;
    font-size: 0.8rem;
}

.je-audit__step--pending span {
    color: #94a3b8;
}



/* ========== Branch Settings ========== */
.branch-settings-page {
    padding-bottom: 6rem;
}

.branch-settings-breadcrumb {
    margin-bottom: 0.5rem;
}

.branch-settings-breadcrumb .mud-breadcrumb-item {
    font-size: 0.875rem;
}

.branch-settings-skeleton,
.branch-settings-tabs-shell,
.branch-settings-action-bar {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
}

.branch-settings-tabs-shell {
    /* Do not use overflow:hidden here - it breaks MudTabs scroll hit-testing after arrow scrolling. */
    overflow: visible;
}

.branch-settings-tabs {
    overflow: visible;
}

.branch-settings-tabs .mud-tabs-toolbar,
.branch-settings-tabs .mud-tabs-tabbar {
    position: relative;
    z-index: 5;
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
    border-bottom: 1px solid #e2e8f0;
    padding: 0.35rem 0.75rem 0;
    min-height: 52px;
    pointer-events: auto;
}

.branch-settings-tabs .mud-tabs-scroll-button,
.branch-settings-tabs .mud-button-root.mud-tabs-scroll-button {
    position: relative;
    z-index: 6;
    pointer-events: auto;
}

.branch-settings-tabs .mud-tabs-panels,
.branch-settings-tabs .mud-tab-panel {
    position: relative;
    z-index: 1;
}

.branch-settings-tabs .mud-tab-panel {
    padding: var(--iph-space-5) 0;
}

.branch-settings-tabs .mud-tab {
    text-transform: none;
    font-weight: 500;
    letter-spacing: 0;
    min-height: 44px;
    border-radius: 8px 8px 0 0;
    margin-right: 2px;
    opacity: 0.75;
    transition: opacity 0.15s ease, background 0.15s ease;
    pointer-events: auto;
    cursor: pointer;
}

.branch-settings-tabs .mud-tab:hover {
    opacity: 1;
    background: rgba(37, 99, 235, 0.06);
}

.branch-settings-tabs .mud-tab.mud-tab-active {
    opacity: 1;
    font-weight: 600;
    background: #fff;
}

.branch-settings-tabs .mud-tabs-slider {
    height: 3px;
    border-radius: 3px 3px 0 0;
}

.branch-settings-tab-panel {
    padding: 1.5rem !important;
    background: #fafbfc;
}

.branch-settings-section {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.25rem 1.5rem 1.5rem;
    background: #fff;
}

.branch-settings-section__header {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}

.branch-settings-section__title {
    font-weight: 600 !important;
    line-height: 1.2;
    color: #1e293b;
}

.branch-settings-section__body {
    margin-top: 1rem;
}

.branch-settings-toggle {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fafbfc;
    height: 100%;
}

.branch-notif-hero {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 1.25rem 1.4rem;
    background:
        linear-gradient(135deg, rgba(15, 118, 110, 0.06), transparent 42%),
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.branch-notif-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(16rem, 1fr);
    gap: 1.25rem;
    align-items: center;
}

.branch-notif-hero__eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #0f766e;
}

.branch-notif-hero__title {
    margin: 0 !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    color: #0f172a;
}

.branch-notif-hero__body {
    margin-top: 0.4rem !important;
    max-width: 40rem;
    color: #64748b !important;
    line-height: 1.45;
}

.branch-notif-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
}

.branch-notif-stat {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.75rem 0.65rem;
    background: #fff;
    text-align: center;
}

.branch-notif-stat--live {
    border-color: #99f6e4;
    background: #f0fdfa;
}

.branch-notif-stat__value {
    display: block;
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
}

.branch-notif-stat__label {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
}

.branch-notif-toggle {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.95rem 1rem !important;
    background: #fff;
    height: 100%;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.branch-notif-toggle:hover {
    border-color: #cbd5e1;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.branch-notif-toggle--on {
    border-color: #99f6e4;
    background: linear-gradient(180deg, #f0fdfa 0%, #ffffff 70%);
}

.branch-notif-toggle--gated {
    border-style: dashed;
}

.branch-notif-toggle--disabled {
    opacity: 0.72;
}

.branch-notif-toggle__title {
    font-weight: 650 !important;
    color: #0f172a;
}

.branch-notif-toggle__desc {
    color: #64748b !important;
    line-height: 1.4;
}

.branch-notif-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1.3;
}

.branch-notif-pill--channel {
    background: #eff6ff;
    color: #1d4ed8;
}

.branch-notif-pill--on {
    background: #ccfbf1;
    color: #0f766e;
}

.branch-notif-pill--soon {
    background: #f1f5f9;
    color: #64748b;
}

.branch-notif-pill--gated {
    background: #fff7ed;
    color: #c2410c;
}

@media (max-width: 900px) {
    .branch-notif-hero__grid {
        grid-template-columns: 1fr;
    }
}

.branch-settings-inline-form {
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    background: #f8fafc;
}

.branch-settings-list-editor__label {
    font-weight: 600;
    color: #334155;
}

.branch-settings-action-bar {
    position: sticky;
    bottom: 0;
    z-index: 10;
    box-shadow: 0 -4px 24px rgba(15, 23, 42, 0.08);
    backdrop-filter: blur(8px);
    background: rgba(255, 255, 255, 0.96) !important;
}

@media (max-width: 768px) {
    .branch-settings-tab-panel {
        padding: 1rem !important;
    }

    .branch-settings-section {
        padding: 1rem 1.125rem 1.125rem;
    }

    .branch-settings-tabs .mud-tab {
        font-size: 0.8125rem;
        min-width: auto;
        padding-left: 0.65rem;
        padding-right: 0.65rem;
    }
}

/* -- Package variant picker dialog -- */
.variant-picker-dialog .mud-dialog-title {
    padding: 1.25rem 1.5rem 0.75rem !important;
    border-bottom: 1px solid #e2e8f0;
}

.variant-picker-dialog .mud-dialog-content {
    padding: 1rem 1.5rem 0.5rem !important;
}

.variant-picker-dialog .mud-dialog-actions {
    padding: 0 !important;
    border-top: 1px solid #e2e8f0;
}

.variant-picker-dialog__header {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}

.variant-picker-dialog__header-icon {
    flex-shrink: 0;
    box-shadow: 0 4px 14px rgba(89, 74, 226, 0.22);
}

.variant-picker-dialog__title {
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    line-height: 1.25;
    color: #1e293b;
    margin: 0 !important;
}

.variant-picker-dialog__subtitle {
    line-height: 1.4;
    margin-top: 0.15rem !important;
}

.variant-picker-dialog__body {
    min-height: 120px;
}

.variant-picker-dialog__search .mud-input-outlined .mud-input-outlined-border {
    border-radius: 10px;
}

.variant-picker-dialog__list {
    max-height: 380px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.125rem 0.125rem 0.75rem;
    margin: 0 -0.125rem;
}

.variant-picker-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    text-align: left;
    padding: 0.75rem 0.875rem;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, transform 0.12s ease;
    font: inherit;
    color: inherit;
}

.variant-picker-row:hover {
    border-color: #c5cae9;
    background: linear-gradient(180deg, #fafbff 0%, #f5f7ff 100%);
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.07);
    transform: translateY(-1px);
}

.variant-picker-row--selected {
    border-color: var(--mud-palette-primary);
    background: linear-gradient(180deg, #eef2ff 0%, #e8ecff 100%);
    box-shadow: 0 0 0 2px rgba(63, 81, 181, 0.18);
}

.variant-picker-row--selected .variant-picker-row__add-icon {
    opacity: 1;
}

.variant-picker-row:hover .variant-picker-row__add-icon {
    opacity: 1;
}

.variant-picker-row:focus-visible {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
}

.variant-picker-row:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.variant-picker-row__thumb {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.variant-picker-row__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.variant-picker-row__placeholder-icon {
    color: #94a3b8;
    font-size: 1.35rem !important;
}

.variant-picker-row__meta {
    flex: 1;
    min-width: 0;
}

.variant-picker-row__name {
    font-weight: 600 !important;
    color: #1e293b;
    line-height: 1.3;
    margin: 0 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.variant-picker-row__details {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.375rem 0.5rem;
    margin-top: 0.25rem;
}

.variant-picker-row__sku {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 0.5rem;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    background: #f8fafc;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #475569;
    white-space: nowrap;
}

.variant-picker-row__category {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
}

.variant-picker-row__price {
    flex-shrink: 0;
    font-weight: 700 !important;
    color: #334155;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.variant-picker-row__add-icon {
    flex-shrink: 0;
    opacity: 0.35;
    transition: opacity 0.15s ease;
}

.variant-picker-dialog__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 2.5rem 1.5rem;
    border: 1px dashed #c5cae9;
    border-radius: 12px;
    background: linear-gradient(180deg, #fafbff 0%, #f5f7ff 100%);
    text-align: center;
}

.variant-picker-dialog__empty-icon {
    font-size: 2rem !important;
    color: #94a3b8;
    margin-bottom: 0.35rem;
}

.variant-picker-dialog__empty-title {
    font-weight: 600 !important;
    color: #334155;
}

.variant-picker-dialog__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    padding: 0.875rem 1.5rem;
    background: #fafbfc;
}

.variant-picker-dialog__hint {
    flex: 1;
}

.variant-picker-dialog__cancel {
    min-width: 100px;
    text-transform: none;
    font-weight: 500;
}

@media (max-width: 600px) {
    .variant-picker-row__category {
        max-width: 100px;
    }

    .variant-picker-dialog__footer {
        flex-wrap: wrap;
    }
}

/* -- Manage access / operator permissions dialog -- */
.access-dialog .mud-dialog-title {
    padding: 1.15rem 1.5rem 1rem !important;
    border-bottom: 1px solid #e2e8f0;
    background:
        linear-gradient(135deg, rgba(13, 148, 136, 0.08) 0%, transparent 48%),
        linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}

.access-dialog .mud-dialog-content {
    padding: 1rem 1.5rem 0.75rem !important;
}

.access-dialog .mud-dialog-actions {
    padding: 0 !important;
    border-top: 1px solid #e2e8f0;
}

.access-dialog__header {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
}

.access-dialog__header-icon {
    flex-shrink: 0;
    background: linear-gradient(145deg, #0B1F33 0%, #0F3D4C 100%) !important;
    box-shadow: 0 6px 18px rgba(11, 31, 51, 0.28);
}

.access-dialog__header-copy {
    min-width: 0;
    flex: 1;
}

.access-dialog__eyebrow {
    color: #0f766e !important;
    letter-spacing: 0.12em;
    font-weight: 700 !important;
    margin: 0 !important;
}

.access-dialog__title {
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    line-height: 1.25;
    color: #0f172a;
    margin: 0.1rem 0 0 !important;
}

.access-dialog__email {
    color: #64748b !important;
    margin-top: 0.1rem !important;
    word-break: break-word;
}

.access-dialog__role-chip {
    background: rgba(13, 148, 136, 0.14) !important;
    color: #0f766e !important;
    border: 1px solid rgba(13, 148, 136, 0.28);
    font-weight: 600;
}

.access-dialog__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    padding: 0.875rem 1.5rem;
    background: #fafbfc;
}

.access-dialog__footer-hint {
    flex: 1;
}

.access-dialog__cancel,
.access-dialog__save {
    text-transform: none;
    font-weight: 600;
}

.access-dialog__save.mud-button-filled {
    background: #0D9488 !important;
    box-shadow: 0 4px 14px rgba(13, 148, 136, 0.28);
}

.access-dialog__save.mud-button-filled:hover {
    background: #0F766E !important;
}

.access-editor {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.access-editor__section {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.9rem 1rem 1rem;
    background: #fff;
}

.access-editor__section--permissions {
    background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
}

.access-editor__presets {
    margin-top: 0.85rem;
}

.access-editor__presets-label {
    margin-bottom: 0.45rem !important;
}

.access-editor__preset-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.access-preset {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
    padding: 0.55rem 0.85rem;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    color: #334155;
    cursor: pointer;
    font: inherit;
    text-align: left;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.access-preset:hover {
    border-color: #99f6e4;
    background: #f0fdfa;
}

.access-preset--active {
    border-color: #0d9488;
    background: linear-gradient(180deg, #f0fdfa 0%, #ccfbf1 100%);
    color: #134e4a;
    box-shadow: 0 2px 8px rgba(13, 148, 136, 0.12);
}

.access-preset__copy {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    line-height: 1.2;
}

.access-preset__name {
    font-size: 0.875rem;
    font-weight: 700;
}

.access-preset__hint {
    font-size: 0.75rem;
    color: #64748b;
}

.access-preset--active .access-preset__hint {
    color: #0f766e;
}

.access-editor__section-title {
    font-weight: 700 !important;
    color: #0f172a;
    margin: 0 !important;
}

.access-editor__section-desc {
    color: #64748b !important;
    margin: 0.15rem 0 0 !important;
}

.access-editor__branches {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.access-branch-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    max-width: 100%;
    padding: 0.4rem 0.65rem 0.4rem 0.45rem;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    background: #fff;
    color: #334155;
    cursor: pointer;
    font: inherit;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}

.access-branch-chip:hover {
    border-color: #99f6e4;
    background: #f0fdfa;
}

.access-branch-chip--selected {
    border-color: #0d9488;
    background: linear-gradient(180deg, #f0fdfa 0%, #ccfbf1 100%);
    color: #134e4a;
    box-shadow: 0 2px 8px rgba(13, 148, 136, 0.12);
}

.access-branch-chip--primary {
    border-color: #0f766e;
}

.access-branch-chip__check {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: #f1f5f9;
    color: #94a3b8;
    border: 1px solid #e2e8f0;
}

.access-branch-chip--selected .access-branch-chip__check {
    background: #0d9488;
    border-color: #0d9488;
    color: #fff;
}

.access-branch-chip__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    line-height: 1.15;
}

.access-branch-chip__name {
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
}

.access-branch-chip__code {
    font-size: 0.6875rem;
    color: #64748b;
    letter-spacing: 0.02em;
}

.access-branch-chip__primary {
    margin-left: 0.15rem;
    padding: 0.1rem 0.4rem;
    border-radius: 999px;
    background: #0B1F33;
    color: #99f6e4;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.access-editor__primary-select {
    max-width: 320px;
}

.access-editor__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.75rem;
}

.access-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    background: #fff;
    color: #475569;
    cursor: pointer;
    font: inherit;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.access-pill:hover {
    border-color: #99f6e4;
    color: #0f766e;
}

.access-pill--active {
    background: linear-gradient(145deg, #0B1F33 0%, #0F3D4C 100%);
    border-color: #0B1F33;
    color: #fff;
    box-shadow: 0 4px 12px rgba(11, 31, 51, 0.22);
}

.access-pill__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    padding: 0.05rem 0.35rem;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
    font-size: 0.6875rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.access-pill--active .access-pill__count {
    background: rgba(13, 148, 136, 0.35);
    color: #ecfeff;
}

.access-pill--partial:not(.access-pill--active) .access-pill__count {
    background: #ccfbf1;
    color: #0f766e;
}

.access-pill--complete:not(.access-pill--active) {
    border-color: #5eead4;
}

.access-pill--complete:not(.access-pill--active) .access-pill__count {
    background: #0d9488;
    color: #fff;
}

.access-editor__category-bar {
    margin-top: 0.75rem;
}

.access-editor__select-all {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.65rem 0.85rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
}

.access-editor__select-all-title {
    font-weight: 600 !important;
    color: #1e293b;
    margin: 0 !important;
}

.access-editor__perms {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin-top: 0.65rem;
    max-height: min(320px, 42vh);
    overflow-y: auto;
    padding: 0.1rem 0.15rem 0.25rem;
    margin-right: -0.15rem;
}

.access-perm-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.8rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.access-perm-row:hover {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
}

.access-perm-row--on {
    border-color: #99f6e4;
    background: linear-gradient(180deg, #f0fdfa 0%, #ffffff 100%);
}

.access-perm-row__copy {
    min-width: 0;
    flex: 1;
}

.access-perm-row__title {
    font-weight: 600 !important;
    color: #0f172a;
    margin: 0 !important;
    line-height: 1.3;
}

.access-perm-row__desc {
    color: #64748b !important;
    margin: 0.15rem 0 0 !important;
    line-height: 1.35;
}

.access-perm-row__switch {
    flex-shrink: 0;
}

@media (max-width: 600px) {
    .access-dialog__footer {
        flex-wrap: wrap;
    }

    .access-branch-chip__name {
        max-width: 120px;
    }

    .access-editor__perms {
        max-height: min(280px, 38vh);
    }
}

/* -- New account reminder dialog -- */
.reminder-dialog .mud-dialog-title {
    padding: 1.15rem 1.5rem 1rem !important;
    border-bottom: 1px solid #e2e8f0;
    background:
        linear-gradient(135deg, rgba(13, 148, 136, 0.08) 0%, transparent 48%),
        linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}

.reminder-dialog .mud-dialog-content {
    padding: 1rem 1.5rem 0.75rem !important;
}

.reminder-dialog .mud-dialog-actions {
    padding: 0 !important;
    border-top: 1px solid #e2e8f0;
}

.reminder-dialog__header {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
}

.reminder-dialog__header-icon {
    flex-shrink: 0;
    background: linear-gradient(145deg, #0B1F33 0%, #0F3D4C 100%) !important;
    box-shadow: 0 6px 18px rgba(11, 31, 51, 0.28);
}

.reminder-dialog__header-copy {
    min-width: 0;
    flex: 1;
}

.reminder-dialog__eyebrow {
    color: #0f766e !important;
    letter-spacing: 0.12em;
    font-weight: 700 !important;
    margin: 0 !important;
}

.reminder-dialog__title {
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    line-height: 1.25;
    color: #0f172a;
    margin: 0.1rem 0 0 !important;
}

.reminder-dialog__subtitle {
    color: #64748b !important;
    margin-top: 0.1rem !important;
}

.reminder-dialog__muted {
    color: #64748b !important;
}

.reminder-dialog__type-chip {
    font-weight: 600;
}

.reminder-dialog__link {
    text-transform: none;
    font-weight: 600;
    color: #0f766e !important;
}

.reminder-dialog__balance-card {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.reminder-dialog__balance {
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    color: #0f172a;
    margin: 0.15rem 0 0 !important;
}

.reminder-dialog__currency {
    font-size: 0.85rem;
    font-weight: 500;
    color: #64748b;
    margin-left: 0.25rem;
}

.reminder-dialog__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    padding: 0.875rem 1.5rem;
    background: #fafbfc;
}

.reminder-dialog__footer-hint {
    flex: 1;
}

.reminder-dialog__cancel,
.reminder-dialog__save {
    text-transform: none;
    font-weight: 600;
}

.reminder-dialog__save.mud-button-filled {
    background: #0D9488 !important;
    box-shadow: 0 4px 14px rgba(13, 148, 136, 0.28);
}

.reminder-dialog__save.mud-button-filled:hover {
    background: #0F766E !important;
}

@media (max-width: 600px) {
    .reminder-dialog__footer {
        flex-wrap: wrap;
    }
}

/* ========== Public landing (anonymous) ========== */
.public-shell {
    min-height: 100vh;
    background: #0B1F33;
}

.public-shell--auth-gate {
    background:
        radial-gradient(ellipse 70% 50% at 15% 0%, rgba(13, 148, 136, 0.22), transparent 55%),
        #0B1F33;
    color: #f8fafc;
}

.public-auth-title {
    font-family: "Segoe UI Variable Display", "Segoe UI Variable", "Segoe UI", sans-serif;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.landing {
    --landing-ink: #0B1F33;
    --landing-ink-soft: #123047;
    --landing-teal: #0D9488;
    --landing-teal-deep: #0F766E;
    --landing-mist: #e2e8f0;
    --landing-paper: #f8fafc;
    --landing-display: "Segoe UI Variable Display", "Segoe UI Variable", "Segoe UI", sans-serif;
    --landing-body: "Segoe UI Variable", "Segoe UI", sans-serif;
    color: var(--landing-ink);
    font-family: var(--landing-body);
    background: var(--landing-paper);
}

.landing-top {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem clamp(1.25rem, 4vw, 3rem);
    color: #fff;
}

.landing-top__brand {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    color: inherit;
    text-decoration: none;
}

.landing-top__mark {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    background: var(--landing-teal);
    box-shadow: 0 0 0 4px rgba(13, 148, 136, 0.28);
}

.landing-top__name {
    font-family: var(--landing-display);
    font-weight: 700;
    font-size: 1.15rem;
    letter-spacing: -0.02em;
}

.landing-top__nav {
    display: flex;
    align-items: center;
    gap: 1.25rem;
}

.landing-top__nav a {
    color: rgba(255, 255, 255, 0.88);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.landing-top__nav a:hover {
    color: #fff;
}

.landing-top__cta {
    padding: 0.45rem 0.95rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(8px);
}

.landing-hero {
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    color: #fff;
}

.landing-hero__media {
    position: absolute;
    inset: 0;
    background:
        url("/images/landing/hero.jpg") center / cover no-repeat;
    transform: scale(1.04);
    animation: landing-hero-drift 18s ease-in-out infinite alternate;
}

.landing-hero__veil {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(105deg, rgba(11, 31, 51, 0.88) 0%, rgba(11, 31, 51, 0.55) 42%, rgba(11, 31, 51, 0.28) 100%),
        linear-gradient(to top, rgba(11, 31, 51, 0.75) 0%, transparent 42%);
}

.landing-hero__content {
    position: relative;
    z-index: 1;
    width: min(40rem, 92vw);
    padding: 0 clamp(1.25rem, 4vw, 3rem) clamp(3.5rem, 10vh, 6rem);
    animation: landing-rise 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.landing-hero__brand {
    margin: 0 0 0.85rem;
    font-family: var(--landing-display);
    font-size: clamp(2.4rem, 6vw, 3.75rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
    color: #fff;
}

.landing-hero__title {
    margin: 0 0 1rem;
    font-family: var(--landing-display);
    font-size: clamp(1.55rem, 3.4vw, 2.15rem);
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.2;
    max-width: 18ch;
    color: rgba(248, 250, 252, 0.96);
}

.landing-hero__lead {
    margin: 0 0 1.75rem;
    font-size: 1.05rem;
    line-height: 1.55;
    color: rgba(226, 232, 240, 0.9);
    max-width: 34rem;
}

.landing-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.landing-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 1.35rem;
    border-radius: 0.7rem;
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.landing-btn:hover {
    transform: translateY(-1px);
}

.landing-btn--primary {
    background: var(--landing-teal);
    color: #fff;
    box-shadow: 0 10px 28px rgba(13, 148, 136, 0.35);
}

.landing-btn--primary:hover {
    background: var(--landing-teal-deep);
    color: #fff;
}

.landing-btn--ghost {
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: transparent;
}

.landing-btn--ghost:hover {
    border-color: #fff;
    color: #fff;
}

.landing-section {
    padding: clamp(3.5rem, 9vw, 6.5rem) clamp(1.25rem, 4vw, 3rem);
}

.landing-section__inner {
    width: min(68rem, 100%);
    margin: 0 auto;
}

.landing-kicker {
    margin: 0 0 0.65rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--landing-teal-deep);
}

.landing-heading {
    margin: 0 0 0.85rem;
    font-family: var(--landing-display);
    font-size: clamp(1.75rem, 3.5vw, 2.45rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.15;
    max-width: 18ch;
}

.landing-heading--light {
    color: #f8fafc;
    max-width: 22ch;
}

.landing-sub {
    margin: 0 0 2.75rem;
    font-size: 1.05rem;
    line-height: 1.55;
    color: #475569;
    max-width: 36rem;
}

.landing-ops {
    background: var(--landing-paper);
}

.landing-ops__grid {
    display: flex;
    flex-direction: column;
    gap: clamp(2.5rem, 6vw, 4rem);
}

.landing-ops__item {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: center;
}

.landing-ops__item--reverse {
    grid-template-columns: 1fr 1.15fr;
}

.landing-ops__item--reverse img {
    order: 2;
}

.landing-ops__item--reverse .landing-ops__copy {
    order: 1;
}

.landing-ops__item img {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 0;
    display: block;
    filter: saturate(0.95) contrast(1.02);
}

.landing-ops__copy h3 {
    margin: 0 0 0.65rem;
    font-family: var(--landing-display);
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.landing-ops__copy p {
    margin: 0;
    color: #475569;
    line-height: 1.6;
    font-size: 1.02rem;
}

.landing-trust {
    background:
        radial-gradient(ellipse 60% 70% at 80% 20%, rgba(13, 148, 136, 0.22), transparent 55%),
        linear-gradient(160deg, var(--landing-ink) 0%, var(--landing-ink-soft) 100%);
    color: #e2e8f0;
}

.landing-trust .landing-kicker {
    color: #5eead4;
}

.landing-trust__list {
    list-style: none;
    margin: 2.5rem 0 0;
    padding: 0;
    display: grid;
    gap: 1.75rem;
    max-width: 40rem;
}

.landing-trust__list li {
    display: grid;
    gap: 0.35rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(148, 163, 184, 0.28);
    animation: landing-rise 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.landing-trust__list li:nth-child(2) { animation-delay: 0.08s; }
.landing-trust__list li:nth-child(3) { animation-delay: 0.16s; }

.landing-trust__list strong {
    font-family: var(--landing-display);
    font-size: 1.15rem;
    color: #f8fafc;
}

.landing-trust__list span {
    color: rgba(226, 232, 240, 0.82);
    line-height: 1.55;
}

.landing-close {
    background: #fff;
    text-align: center;
}

.landing-close__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.landing-close .landing-heading {
    max-width: none;
}

.landing-close .landing-sub {
    text-align: center;
}

.landing-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 1.5rem clamp(1.25rem, 4vw, 3rem) 2rem;
    background: #fff;
    border-top: 1px solid #e2e8f0;
    color: #64748b;
    font-size: 0.875rem;
}

.landing-footer__brand {
    font-weight: 600;
    color: var(--landing-ink);
}

@keyframes landing-rise {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes landing-hero-drift {
    from { transform: scale(1.04) translate3d(0, 0, 0); }
    to { transform: scale(1.08) translate3d(-1.2%, -0.8%, 0); }
}

@media (max-width: 900px) {
    .landing-ops__item,
    .landing-ops__item--reverse {
        grid-template-columns: 1fr;
    }

    .landing-ops__item--reverse img,
    .landing-ops__item--reverse .landing-ops__copy {
        order: unset;
    }

    .landing-top__nav a:not(.landing-top__cta) {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .landing-hero__media,
    .landing-hero__content,
    .landing-trust__list li {
        animation: none;
    }
}


/* ========== Day-end / trading session report ========== */
.day-end-report {
    padding-bottom: 2.5rem;
}

.day-end-hero {
    position: relative;
    overflow: hidden;
}

.day-end-hero::after {
    content: "";
    position: absolute;
    right: -8%;
    top: -40%;
    width: 42%;
    height: 180%;
    background: radial-gradient(ellipse at center, rgba(13, 148, 136, 0.12), transparent 68%);
    pointer-events: none;
}

.day-end-hero__crumbs {
    margin-bottom: 0.25rem !important;
}

.day-end-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    margin-top: 0.35rem;
}

.day-end-meta__item {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 7rem;
}

/* Dark hero: labels/values must not use light-surface slate colors */
.day-end-meta__label {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #CBD5E1;
}

.day-end-meta__value {
    font-size: 0.95rem;
    font-weight: 600;
    color: #FFFFFF;
}

.day-end-report .mud-text-secondary {
    color: #475569 !important;
}

.day-end-report .admin-section-heading {
    color: #334155 !important;
}

.day-end-kpi {
    cursor: default;
}

.day-end-kpi:hover {
    transform: none;
}

.day-end-kpi--refund::before {
    background: #DC2626;
}

.day-end-kpi--discount::before {
    background: #9333EA;
}

.day-end-section {
    height: 100%;
}

.day-end-search {
    min-width: 220px;
    max-width: 280px;
}

.day-end-tender-table th,
.day-end-tender-table td {
    padding: 0.65rem 0.5rem !important;
}

.day-end-tender-table thead th {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #475569;
    border-bottom: 1px solid #E2E8F0;
}

.day-end-tender-total td {
    font-weight: 700 !important;
    border-top: 1px solid #E2E8F0;
    padding-top: 0.85rem !important;
}

.day-end-tender-dot {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.day-end-share {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.day-end-share__track {
    width: 64px;
    height: 6px;
    border-radius: 999px;
    background: #E2E8F0;
    overflow: hidden;
}

.day-end-share__fill {
    height: 100%;
    border-radius: 999px;
    min-width: 0;
}

.day-end-waterfall {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.day-end-waterfall__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.55rem 0.75rem;
    border-radius: 10px;
    background: #F8FAFC;
}

.day-end-waterfall__label {
    color: #334155;
    font-size: 0.875rem;
}

.day-end-waterfall__value {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: #0F172A;
}

.day-end-waterfall__row--neg .day-end-waterfall__value {
    color: #B45309;
}

.day-end-waterfall__row--emph {
    background: rgba(13, 148, 136, 0.08);
}

.day-end-waterfall__row--emph .day-end-waterfall__value {
    color: #0F766E;
}

.day-end-waterfall__row--total {
    background: #0F172A;
}

.day-end-waterfall__row--total .day-end-waterfall__label,
.day-end-waterfall__row--total .day-end-waterfall__value {
    color: #F8FAFC;
    font-weight: 700;
}

.day-end-mini-table .mud-table-root,
.day-end-data-table .mud-table-root {
    background: transparent;
}

.day-end-order-row {
    cursor: pointer;
}

.day-end-platform-card {
    border: 1px solid #E2E8F0;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(13, 148, 136, 0.06), #fff 42%);
    padding: 1.25rem 1.5rem;
    position: relative;
    overflow: hidden;
}

.day-end-platform-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: #0D9488;
}

.day-end-platform-card__amount {
    font-weight: 700 !important;
    color: #0F766E !important;
    font-variant-numeric: tabular-nums;
    margin: 0.15rem 0 !important;
}

@media (max-width: 600px) {
    .day-end-search {
        min-width: 100%;
        max-width: 100%;
    }

    .day-end-meta__item {
        min-width: calc(50% - 0.75rem);
    }
}

/* ============================================
   Stock alerts - nav badge & page
   ============================================ */

/* Nav link: title left, health badge right */
.nav-stock-alert-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
}

.nav-stock-alert-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 19px;
    padding: 0 7px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1;
    color: #fff;
}

.nav-stock-alert-badge--pending {
    background: #94A3B8;
}

.nav-stock-alert-badge--ok {
    background: #059669;
}

.nav-stock-alert-badge--warning {
    background: #DB2777;
    animation: stock-alert-pulse 2.4s ease-in-out infinite;
}

.nav-stock-alert-badge--critical {
    background: #DC2626;
    animation: stock-alert-pulse 1.6s ease-in-out infinite;
}

@keyframes stock-alert-pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.45);
    }
    50% {
        box-shadow: 0 0 0 5px rgba(220, 38, 38, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .nav-stock-alert-badge--warning,
    .nav-stock-alert-badge--critical {
        animation: none;
    }
}

/* Summary metric cards */
.stock-alert-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.stock-metric-card {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 1.1rem 1.3rem;
    border: 1px solid var(--border-color);
    border-bottom-width: 4px;
    border-radius: 14px;
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.stock-metric-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    flex-shrink: 0;
}

.stock-metric-card__value {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}

.stock-metric-card__label {
    font-size: 0.8rem;
    font-weight: 600;
    color: #64748B;
}

.stock-metric-card--danger {
    border-bottom-color: #FCA5A5;
}

.stock-metric-card--danger .stock-metric-card__icon {
    background: #FEF2F2;
    color: #DC2626;
}

.stock-metric-card--danger .stock-metric-card__value {
    color: #B91C1C;
}

.stock-metric-card--warning {
    border-bottom-color: #FCD34D;
}

.stock-metric-card--warning .stock-metric-card__icon {
    background: #FFFBEB;
    color: #D97706;
}

.stock-metric-card--warning .stock-metric-card__value {
    color: #B45309;
}

.stock-metric-card--info {
    border-bottom-color: #BFDBFE;
}

.stock-metric-card--info .stock-metric-card__icon {
    background: #EFF6FF;
    color: #2563EB;
}

.stock-metric-card--info .stock-metric-card__value {
    color: #1D4ED8;
}

@media (max-width: 900px) {
    .stock-alert-metrics {
        grid-template-columns: 1fr;
    }
}

/* Severity chips + quantity emphasis */
.stock-filter-chip {
    border-radius: 999px !important;
    text-transform: none !important;
}

.stock-qty {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.stock-qty--danger {
    color: #B91C1C;
}

.stock-qty--warning {
    color: #B45309;
}

/* All-clear empty state */
.stock-alert-allclear {
    text-align: center;
}

.stock-alert-allclear__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #ECFDF5;
    color: #059669;
}

.stock-alert-allclear__icon .mud-icon-root {
    font-size: 2.2rem;
    width: 2.2rem;
    height: 2.2rem;
}


/* Branch security code */
.branch-security-code-card {
    padding: 1.15rem;
    border: 1px solid var(--color-border, #d8e1ec);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(248, 250, 252, .96), rgba(240, 249, 255, .72));
}

.branch-security-code-card__header {
    gap: 1rem;
    margin-bottom: .5rem;
}

/* ========== Medical pharmacy variant form ========== */
.medical-pharmacy-section {
    border: 1px solid rgba(13, 148, 136, 0.22);
    border-radius: 14px;
    background: #fff;
}

.medical-pharmacy-panel {
    display: grid;
    grid-template-columns: 6px 1fr;
    min-height: 100%;
}

.medical-pharmacy-panel__rail {
    background: linear-gradient(180deg, #0f766e 0%, #0d9488 55%, #14b8a6 100%);
    border-radius: 14px 0 0 14px;
}

.medical-pharmacy-panel__body {
    padding: 1.25rem 1.5rem 1.5rem;
}

.medical-pharmacy-panel__avatar {
    background: #0f766e !important;
}

.medical-pharmacy-panel__block {
    margin-top: 1.1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.medical-pharmacy-panel__block:first-of-type {
    margin-top: 0.35rem;
    padding-top: 0;
    border-top: none;
}

.medical-pharmacy-panel__block-label {
    letter-spacing: 0.08em;
    color: #0f766e !important;
    margin-bottom: 0.65rem !important;
    font-weight: 700 !important;
}

.medical-pharmacy-panel__switches {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
    padding: 0.75rem 1rem;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(15, 118, 110, 0.06), rgba(20, 184, 166, 0.08));
}

.medical-pharmacy-panel__dosage-summary {
    border-color: rgba(13, 148, 136, 0.35) !important;
}

.medical-variant-preview__hero {
    background: linear-gradient(135deg, #0f766e 0%, #115e59 100%) !important;
}

.medical-variant-preview__label {
    background: rgba(15, 118, 110, 0.06);
}

.medical-variant-preview__location {
    padding: 0.75rem 0.9rem;
    border-radius: 12px;
    background: rgba(15, 118, 110, 0.06);
    border: 1px dashed rgba(13, 148, 136, 0.35);
}

.medical-variant-preview__location-value {
    font-weight: 600;
    color: #115e59;
}

.medical-variant-form__parent-card {
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    padding: 0.9rem 1rem;
    background: linear-gradient(135deg, rgba(15, 118, 110, 0.04), rgba(255, 255, 255, 0.9));
}

.medical-alt-row {
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 12px;
    padding: 0.85rem 1rem;
    background: #fafbfc;
}

/* --- Kitchen display (KDS) board - production premium --- */
/* KDS kiosk shell - the dedicated full-screen layout this page renders inside (KdsLayout.razor).
   No admin chrome wraps it any more, so the shell owns the whole viewport and its own dark,
   ambient backdrop (same visual family as the Now Serving board) instead of sitting on the
   plain white admin canvas. */
.kds-shell {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    overflow-x: hidden;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    background:
        radial-gradient(1100px 560px at 6% -10%, rgba(13, 148, 136, 0.22), transparent 55%),
        radial-gradient(900px 520px at 96% 0%, rgba(217, 119, 6, 0.12), transparent 52%),
        linear-gradient(165deg, #020617 0%, #0b1f33 55%, #0f172a 100%);
}

.kds-board {
    --kds-ink: #0b1220;
    --kds-muted: #64748b;
    --kds-surface: #ffffff;
    --kds-teal: #0d9488;
    --kds-teal-deep: #0f766e;
    --kds-ok: #059669;
    --kds-warn: #d97706;
    --kds-crit: #dc2626;
    position: relative;
    z-index: 1;
    padding: clamp(1rem, 2.5vw, 2rem);
}

.kds-board__header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.1rem 1.75rem;
    margin-bottom: 1.65rem;
    padding: 1.15rem 1.35rem;
    border-radius: 1.35rem;
    background:
        radial-gradient(circle at 0% 0%, rgba(13, 148, 136, 0.12), transparent 42%),
        linear-gradient(135deg, #0f172a 0%, #134e4a 100%);
    color: #f8fafc;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
}

.kds-board__eyebrow {
    margin: 0 0 0.3rem;
    font-size: 0.7rem;
    font-weight: 750;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #5eead4;
}

.kds-board__title {
    margin: 0;
    font-size: clamp(1.85rem, 3vw, 2.35rem);
    font-weight: 800;
    letter-spacing: -0.035em;
    color: #fff;
    line-height: 1.1;
}

.kds-board__status {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.55rem 0 0;
    font-size: 0.875rem;
    color: rgba(248, 250, 252, 0.78);
    font-variant-numeric: tabular-nums;
}

.kds-board__status-dot {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 999px;
    background: #94a3b8;
    box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.25);
}

.kds-board__status-dot--live {
    background: #34d399;
    box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.28);
    animation: kds-pulse 1.8s ease-in-out infinite;
}

@keyframes kds-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.15); opacity: 0.85; }
}

.kds-board__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
}

.kds-board__control {
    height: 2.75rem !important;
    min-height: 2.75rem !important;
}

.kds-board__btn.mud-button-root {
    height: 2.75rem !important;
    min-height: 2.75rem !important;
    background: rgba(255, 255, 255, 0.12) !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.32) !important;
    border-radius: 0.85rem !important;
    box-shadow: none !important;
}

.kds-board__view-toggle {
    display: flex;
    align-items: center;
    gap: 0.2rem;
    height: 2.75rem;
    padding: 0.25rem;
    border-radius: 0.95rem;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
}

.kds-board__view-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    height: 100%;
    padding: 0 1rem;
    border: none;
    border-radius: 0.75rem;
    background: transparent;
    color: rgba(255, 255, 255, 0.75);
    font-weight: 700;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 140ms ease, color 140ms ease;
}

.kds-board__view-btn--active {
    background: #fff;
    color: #0f172a;
}

.kds-board__view-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.35rem;
    height: 1.35rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    background: #d97706;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 800;
}

.kds-board__btn.mud-button-root {
    padding-inline: 1.05rem !important;
    text-transform: none !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em;
}

.kds-board__btn.mud-button-root:hover {
    background: rgba(255, 255, 255, 0.2) !important;
}

.kds-board__btn--bell.mud-button-root {
    background: linear-gradient(135deg, #f59e0b 0%, #ea580c 100%) !important;
    border-color: transparent !important;
    color: #fff !important;
    min-width: 7.5rem;
}

.kds-board__btn--bell.mud-button-root:hover {
    background: linear-gradient(135deg, #fbbf24 0%, #f97316 100%) !important;
}

.kds-board__btn--bell-armed.mud-button-root {
    animation: kds-bell-pulse 0.7s ease-in-out infinite;
    box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.35) !important;
}

@keyframes kds-bell-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.04); }
}

.kds-board__btn--voice.mud-button-root {
    border-color: rgba(167, 243, 208, 0.55) !important;
}

.kds-board__btn--logout.mud-button-root {
    border-color: rgba(248, 250, 252, 0.22) !important;
    opacity: 0.85;
}

.kds-board__btn--logout.mud-button-root:hover {
    background: rgba(220, 38, 38, 0.22) !important;
    border-color: rgba(248, 113, 113, 0.55) !important;
    opacity: 1;
}

.kds-voice-dialog.mud-dialog,
.mud-dialog.kds-voice-dialog {
    border-radius: 1.5rem !important;
    overflow: hidden;
}

.kds-voice-dialog__content.mud-dialog-content {
    padding: 1.75rem 1.75rem 0.5rem !important;
}

.kds-voice-dialog__hero {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.kds-voice-dialog__hero-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 1rem;
    background: linear-gradient(145deg, #0d9488 0%, #115e59 100%);
    color: #ecfdf5;
    flex-shrink: 0;
    box-shadow: 0 8px 18px rgba(13, 148, 136, 0.35);
}

.kds-voice-dialog__hero-icon .mud-icon-root {
    font-size: 1.6rem;
}

.kds-voice-dialog__title {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 800;
    color: #0b1220;
}

.kds-voice-dialog__subtitle {
    margin: 0.3rem 0 0;
    font-size: 0.92rem;
    color: #64748b;
    line-height: 1.4;
}

.kds-voice-dialog__presets-label {
    margin: 0 0 0.6rem;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}

.kds-voice-dialog__presets {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.kds-voice-dialog__preset {
    padding: 0.7rem 1.05rem;
    border-radius: 0.85rem;
    border: 1.5px solid rgba(13, 148, 136, 0.3);
    background: rgba(13, 148, 136, 0.06);
    color: #0f766e;
    font-size: 0.92rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 140ms ease, box-shadow 140ms ease;
}

.kds-voice-dialog__preset:hover {
    background: rgba(13, 148, 136, 0.14);
}

.kds-voice-dialog__preset--active {
    background: linear-gradient(135deg, #0d9488, #115e59);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 8px 16px rgba(13, 148, 136, 0.35);
}

.kds-voice-dialog__field .mud-input-outlined {
    font-size: 1.02rem !important;
}

.kds-voice-dialog__cancel {
    color: #64748b !important;
    font-weight: 700 !important;
}

.kds-voice-dialog__send.mud-button-root {
    background: linear-gradient(135deg, #0d9488 0%, #115e59 100%) !important;
    padding: 0.75rem 1.6rem !important;
    border-radius: 0.85rem !important;
    font-weight: 800 !important;
    font-size: 0.98rem !important;
    box-shadow: 0 8px 18px rgba(13, 148, 136, 0.35) !important;
}

.kds-voice-dialog__send.mud-button-root:hover:not(:disabled) {
    box-shadow: 0 10px 22px rgba(13, 148, 136, 0.45) !important;
}

.kds-section-title {
    margin: 0 0 0.25rem;
    font-size: 1.15rem;
    font-weight: 800;
    color: #f8fafc;
}

.kds-section-title--served {
    margin-top: 2.25rem;
}

.kds-section-subtitle {
    margin: 0 0 1.1rem;
    font-size: 0.9rem;
    color: #94a3b8;
}

.kds-empty--inline {
    margin-top: 0;
    text-align: left;
    padding: 1.5rem;
}

.kds-ticket--awaiting {
    border-color: rgba(217, 119, 6, 0.35);
}

.kds-ticket--awaiting .kds-ticket__accent {
    background: linear-gradient(180deg, #f59e0b, #d97706);
}

.kds-ticket--served {
    opacity: 0.82;
}

.kds-ticket--served .kds-ticket__accent {
    background: linear-gradient(180deg, #94a3b8, #64748b);
}

.kds-ticket__bell-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    width: 100%;
    margin-top: 0.85rem;
    padding: 1.1rem;
    border-radius: 0.9rem;
    border: none;
    background: linear-gradient(135deg, #f59e0b 0%, #ea580c 100%);
    color: #fff;
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: 0.01em;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(217, 119, 6, 0.4);
    transition: background 140ms ease, opacity 140ms ease;
}

.kds-ticket__bell-btn .mud-icon-root {
    font-size: 1.5rem;
}

.kds-ticket__bell-btn:hover:not(:disabled) {
    background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%);
}

.kds-ticket__bell-btn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.kds-rail {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(22.5rem, 1fr));
    gap: 1.35rem;
}

.kds-ticket {
    position: relative;
    display: flex;
    min-height: 28rem;
    border-radius: 1.45rem;
    background:
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid rgba(15, 23, 42, 0.07);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 18px 42px rgba(15, 23, 42, 0.09);
    overflow: hidden;
    animation: kds-ticket-in 340ms ease-out;
}

@keyframes kds-ticket-in {
    from { opacity: 0; transform: translateY(10px) scale(0.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.kds-ticket__accent {
    width: 7px;
    flex-shrink: 0;
    background: linear-gradient(180deg, #14b8a6, #34d399);
}

.kds-ticket--late .kds-ticket__accent {
    background: linear-gradient(180deg, #f59e0b, #fbbf24);
}

.kds-ticket--critical .kds-ticket__accent {
    background: linear-gradient(180deg, #ef4444, #fb7185);
}

.kds-ticket--critical {
    border-color: rgba(220, 38, 38, 0.2);
    box-shadow:
        0 1px 2px rgba(220, 38, 38, 0.06),
        0 18px 40px rgba(220, 38, 38, 0.12);
}

.kds-ticket__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 1.35rem 1.35rem 1.2rem;
    min-width: 0;
    background:
        radial-gradient(circle at 100% 0%, rgba(13, 148, 136, 0.06), transparent 38%);
}

.kds-ticket__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.9rem;
}

.kds-ticket__queue {
    display: flex;
    align-items: baseline;
    gap: 0.08rem;
    line-height: 1;
}

.kds-ticket__hash {
    font-size: 1.45rem;
    font-weight: 700;
    color: #94a3b8;
}

.kds-ticket__number {
    font-size: 3.15rem;
    font-weight: 850;
    letter-spacing: -0.05em;
    color: var(--kds-ink);
    font-variant-numeric: tabular-nums;
}

.kds-ticket__meta-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.45rem;
}

.kds-ticket__badge {
    display: inline-flex;
    align-items: center;
    padding: 0.32rem 0.7rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.kds-ticket__badge--status-queued {
    color: #0f766e;
    background: rgba(13, 148, 136, 0.14);
}

.kds-ticket__badge--status-preparing {
    color: #92400e;
    background: rgba(245, 158, 11, 0.18);
}

.kds-ticket__badge--status-ready {
    color: #166534;
    background: rgba(22, 163, 74, 0.16);
}

.kds-ticket__badge--status-done {
    color: #334155;
    background: rgba(100, 116, 139, 0.16);
}

.kds-ticket__age {
    font-size: 1rem;
    font-weight: 800;
    color: #475569;
    font-variant-numeric: tabular-nums;
}

.kds-ticket__age--late {
    color: var(--kds-warn);
}

.kds-ticket__age--critical {
    color: var(--kds-crit);
}

.kds-ticket__identity {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    margin-top: 0.85rem;
}

.kds-ticket__channel {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 800;
    color: #ecfdf5;
    background: linear-gradient(135deg, #0d9488, #0f766e);
    text-transform: uppercase;
    letter-spacing: 0.07em;
}

.kds-ticket__context {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
    gap: 0.65rem;
    margin-top: 0.9rem;
}

.kds-ticket__meta-chip {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.7rem 0.85rem;
    border-radius: 0.9rem;
    background: rgba(13, 148, 136, 0.1);
    border: 1px solid rgba(13, 148, 136, 0.2);
    min-width: 0;
}

.kds-ticket__meta-chip--guest {
    background: rgba(15, 23, 42, 0.04);
    border-color: rgba(15, 23, 42, 0.1);
}

.kds-ticket__meta-chip--staff {
    background: rgba(124, 58, 237, 0.08);
    border-color: rgba(124, 58, 237, 0.22);
}

.kds-ticket__meta-chip--staff .kds-ticket__meta-chip-value {
    color: #6d28d9;
}

.kds-ticket__meta-chip-label {
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}

.kds-ticket__meta-chip-value {
    font-size: 1.12rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #0f172a;
    line-height: 1.2;
    word-break: break-word;
}

.kds-ticket__lines {
    list-style: none;
    margin: 1.1rem 0 0;
    padding: 1rem 0 0;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    flex: 1;
}

.kds-ticket__line {
    display: grid;
    grid-template-columns: 2.5rem 1fr;
    gap: 0.75rem;
    align-items: start;
}

.kds-ticket__qty {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.7rem;
    background: linear-gradient(145deg, #0f172a, #1e293b);
    color: #f8fafc;
    font-size: 1rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.18);
}

.kds-ticket__line-copy {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
    padding-top: 0.28rem;
}

.kds-ticket__item {
    font-size: 1.28rem;
    font-weight: 800;
    color: var(--kds-ink);
    line-height: 1.28;
    letter-spacing: -0.015em;
}

.kds-ticket__mod {
    font-size: 0.8rem;
    color: #64748b;
}

.kds-ticket__mod::before {
    content: "· ";
    color: #94a3b8;
}

.kds-ticket__note {
    margin-top: 0.2rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: #b45309;
    background: rgba(245, 158, 11, 0.14);
    border-radius: 0.45rem;
    padding: 0.28rem 0.5rem;
}

.kds-ticket__order-footer {
    margin-top: 1.15rem;
    padding: 0.95rem 0.85rem;
    border-radius: 1rem;
    text-align: center;
    background:
        linear-gradient(180deg, rgba(15, 23, 42, 0.04) 0%, rgba(13, 148, 136, 0.08) 100%);
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.kds-ticket__order-footer-label {
    display: block;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.kds-ticket__order-footer-no {
    display: block;
    font-size: clamp(1.25rem, 2.2vw, 1.65rem);
    font-weight: 850;
    letter-spacing: -0.02em;
    color: #0b1220;
    font-family: ui-monospace, "Cascadia Mono", SFMono-Regular, Consolas, monospace;
    line-height: 1.2;
    word-break: break-all;
}

.kds-ticket__details-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    width: 100%;
    margin-top: 0.85rem;
    padding: 0.95rem;
    border-radius: 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    color: #f8fafc;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.28);
    transition: background 140ms ease;
}

.kds-ticket__details-btn:hover {
    background: linear-gradient(135deg, #1e293b 0%, #0f766e 100%);
}

.kds-ticket__details-btn .mud-icon-root {
    font-size: 1.3rem;
    color: #5eead4;
}

.kds-ticket__actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.55rem;
    margin-top: 0.95rem;
    padding-top: 0.15rem;
}

.kds-ticket__action {
    border: 1px solid rgba(15, 23, 42, 0.1);
    cursor: pointer;
    border-radius: 0.85rem;
    padding: 0.85rem 0.4rem;
    font-size: 0.88rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    color: #0f172a;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}

.kds-ticket__action:hover:not(:disabled) {
    background: #f1f5f9;
}

/* Resting tints so Prep/Ready/Done read at a glance, not only on hover/active -
   kitchen staff scan the board fast and shouldn't need to hover to tell buttons apart. */
.kds-ticket__action--prep {
    color: #92400e;
    background: rgba(245, 158, 11, 0.1);
    border-color: rgba(217, 119, 6, 0.25);
}

.kds-ticket__action--prep:hover:not(:disabled) {
    background: rgba(245, 158, 11, 0.18);
}

.kds-ticket__action--ready {
    color: #166534;
    background: rgba(34, 197, 94, 0.1);
    border-color: rgba(22, 163, 74, 0.25);
}

.kds-ticket__action--ready:hover:not(:disabled) {
    background: rgba(34, 197, 94, 0.18);
}

.kds-ticket__action--done {
    color: #0f766e;
    background: rgba(13, 148, 136, 0.1);
    border-color: rgba(13, 148, 136, 0.25);
}

/* Takes over the Ready slot once Ready is already set - lets the kitchen ping POS again without
   waiting for it to reach the Served tab. */
.kds-ticket__action--ring {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    color: #fff;
    background: linear-gradient(135deg, #f59e0b 0%, #ea580c 100%);
    border-color: transparent;
    box-shadow: 0 6px 14px rgba(217, 119, 6, 0.3);
}

.kds-ticket__action--ring:hover:not(:disabled) {
    background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%);
}

.kds-ticket__action--ring .mud-icon-root {
    font-size: 1.1rem;
}

.kds-ticket__action--active-prep {
    background: linear-gradient(135deg, #f59e0b, #d97706);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 8px 18px rgba(217, 119, 6, 0.28);
}

.kds-ticket__action--active-prep:hover:not(:disabled) {
    background: linear-gradient(135deg, #d97706, #b45309);
}

.kds-ticket__action--active-ready {
    background: linear-gradient(135deg, #22c55e, #16a34a);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 8px 18px rgba(22, 163, 74, 0.28);
}

.kds-ticket__action--active-ready:hover:not(:disabled) {
    background: linear-gradient(135deg, #16a34a, #15803d);
}

.kds-ticket__action--done:hover:not(:disabled) {
    background: linear-gradient(135deg, #5eead4 0%, #0d9488 100%);
    border-color: transparent;
    color: #042f2e;
}

.kds-ticket__action:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    box-shadow: none;
}

/* Per-ticket busy overlay - only the ticket being updated dims/locks, every other ticket on
   the board stays fully tappable while that one round trip is in flight. */
.kds-ticket--updating {
    pointer-events: none;
}

.kds-ticket__busy {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.55);
    backdrop-filter: blur(1px);
    border-radius: inherit;
}

.kds-ticket__busy-spinner {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    border: 3px solid rgba(13, 148, 136, 0.22);
    border-top-color: #0d9488;
    animation: kds-spin 700ms linear infinite;
}

@keyframes kds-spin {
    to { transform: rotate(360deg); }
}

.kds-empty {
    margin-top: clamp(2rem, 8vh, 5rem);
    text-align: center;
    padding: 3rem 1.5rem;
    max-width: 30rem;
    margin-inline: auto;
    border-radius: 1.5rem;
    background: rgba(15, 23, 42, 0.45);
    border: 1px solid rgba(148, 163, 184, 0.18);
    backdrop-filter: blur(6px);
}

.kds-empty__icon {
    display: inline-block;
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 1.15rem;
    background:
        linear-gradient(145deg, rgba(45, 212, 191, 0.35), rgba(13, 148, 136, 0.15));
    border: 1px solid rgba(94, 234, 212, 0.35);
    box-shadow: 0 0 24px rgba(45, 212, 191, 0.2);
    margin-bottom: 0.95rem;
}

.kds-empty__title {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 800;
    color: #f8fafc;
}

.kds-empty__copy {
    margin: 0.5rem 0 0;
    color: #94a3b8;
    font-size: 0.95rem;
    line-height: 1.5;
}

.kds-empty__branch-select {
    margin: 1.5rem auto 0;
    max-width: 20rem;
}

.kds-empty__branch-select .mud-input.mud-input-outlined {
    background: #fff !important;
    border-radius: 0.85rem !important;
}

/* Ticket details modal - opened from a card's "View details" button. Deliberately oversized
   text throughout: read from arm's length across a hot line, not up close at a desk. */
.kds-detail-dialog.mud-dialog,
.mud-dialog.kds-detail-dialog {
    border-radius: 1.5rem !important;
    overflow: hidden;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.kds-detail-dialog .mud-dialog-title {
    padding: 1.5rem 1.75rem 0.75rem !important;
    background: linear-gradient(135deg, #0f172a 0%, #134e4a 100%);
}

.kds-detail-dialog__title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}

.kds-detail-dialog__queue {
    display: flex;
    align-items: baseline;
    gap: 0.15rem;
    line-height: 1;
}

.kds-detail-dialog__hash {
    font-size: 1.75rem;
    font-weight: 700;
    color: rgba(248, 250, 252, 0.55);
}

.kds-detail-dialog__number {
    font-size: 3.75rem;
    font-weight: 850;
    letter-spacing: -0.04em;
    color: #fff;
    font-variant-numeric: tabular-nums;
}

.kds-detail-dialog__title-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
}

.kds-detail-dialog__age {
    font-size: 1.1rem;
    font-weight: 700;
    color: rgba(248, 250, 252, 0.75);
    font-variant-numeric: tabular-nums;
}

.kds-detail-dialog__content.mud-dialog-content {
    padding: 1.5rem 1.75rem 0.5rem !important;
}

.kds-detail-dialog__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
    gap: 0.85rem;
    margin-bottom: 1.5rem;
}

.kds-detail-dialog__fact {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.85rem 1rem;
    border-radius: 1rem;
    background: rgba(13, 148, 136, 0.08);
    border: 1px solid rgba(13, 148, 136, 0.18);
}

.kds-detail-dialog__fact-label {
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}

.kds-detail-dialog__fact-value {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #0b1220;
    word-break: break-word;
}

.kds-detail-dialog__lines {
    list-style: none;
    margin: 0;
    padding: 1.25rem 0 0.5rem;
    border-top: 2px solid rgba(15, 23, 42, 0.08);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.kds-detail-dialog__line {
    display: grid;
    grid-template-columns: 3.25rem 1fr;
    gap: 1rem;
    align-items: start;
}

.kds-detail-dialog__qty {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 3.25rem;
    height: 3.25rem;
    border-radius: 0.9rem;
    background: linear-gradient(145deg, #0f172a, #1e293b);
    color: #f8fafc;
    font-size: 1.35rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.22);
}

.kds-detail-dialog__line-copy {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
    padding-top: 0.35rem;
}

.kds-detail-dialog__item {
    font-size: 1.65rem;
    font-weight: 800;
    color: #0b1220;
    line-height: 1.25;
    letter-spacing: -0.02em;
}

.kds-detail-dialog__mods {
    font-size: 1.05rem;
    color: #475569;
    font-weight: 600;
}

.kds-detail-dialog__note {
    display: inline-block;
    margin-top: 0.15rem;
    font-size: 1rem;
    font-weight: 700;
    color: #b45309;
    background: rgba(245, 158, 11, 0.14);
    border-radius: 0.6rem;
    padding: 0.4rem 0.7rem;
    width: fit-content;
}

.kds-detail-dialog__actions {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: stretch;
    gap: 0.6rem;
    width: 100%;
    padding: 0.25rem 1.75rem 1.5rem;
}

.kds-detail-dialog__actions .kds-ticket__action {
    padding: 1rem 0.5rem;
    font-size: 1rem;
}

.kds-detail-dialog__close.mud-button-root {
    background: linear-gradient(135deg, #7c2d12 0%, #9a3412 100%) !important;
    color: #fff7ed !important;
    border: 1px solid rgba(251, 146, 60, 0.4) !important;
    border-radius: 0.85rem !important;
    padding: 1rem 0.5rem !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.02em;
    box-shadow: 0 8px 18px rgba(124, 45, 18, 0.35) !important;
    transition: background 140ms ease;
}

.kds-detail-dialog__close.mud-button-root:hover {
    background: linear-gradient(135deg, #9a3412 0%, #c2410c 100%) !important;
}

@media (max-width: 900px) {
    .kds-rail {
        grid-template-columns: repeat(auto-fill, minmax(18.5rem, 1fr));
    }
}

@media (max-width: 600px) {
    .kds-rail {
        grid-template-columns: 1fr;
    }

    .kds-ticket {
        min-height: 0;
    }

    .kds-ticket__number {
        font-size: 2.6rem;
    }
}

/* -- Now serving (customer queue board) -- */
.now-serving {
    --ns-ink: #06101c;
    --ns-panel: rgba(15, 23, 42, 0.72);
    --ns-line: rgba(148, 163, 184, 0.22);
    --ns-ready: #34d399;
    --ns-ready-deep: #059669;
    --ns-prep: #fbbf24;
    --ns-prep-deep: #d97706;
    --ns-violet: #a78bfa;
    --ns-muted: #94a3b8;
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    overflow: hidden;
    background:
        radial-gradient(1100px 560px at 8% -8%, rgba(13, 148, 136, 0.28), transparent 55%),
        radial-gradient(900px 520px at 92% 0%, rgba(217, 119, 6, 0.16), transparent 52%),
        radial-gradient(1000px 600px at 50% 115%, rgba(124, 58, 237, 0.16), transparent 55%),
        linear-gradient(165deg, #020617 0%, #0b1f33 48%, #0f172a 100%);
    color: #f8fafc;
    padding: clamp(1.25rem, 2.5vw, 2.25rem);
}

.now-serving__glow {
    position: absolute;
    inset: auto -10% -20% auto;
    width: 48vw;
    height: 48vw;
    max-width: 42rem;
    max-height: 42rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(45, 212, 191, 0.14), transparent 68%);
    pointer-events: none;
    z-index: 0;
    animation: now-serving-glow-drift 12s ease-in-out infinite alternate;
}

@keyframes now-serving-glow-drift {
    from { transform: translate(0, 0) scale(1); }
    to { transform: translate(-3%, -4%) scale(1.08); }
}

.now-serving__header,
.now-serving__board,
.now-serving__empty {
    position: relative;
    z-index: 1;
}

.now-serving__header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.25rem;
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
    padding-bottom: 1.35rem;
    border-bottom: 1px solid var(--ns-line);
}

.now-serving__eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    background: linear-gradient(90deg, #5eead4, #a78bfa);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.now-serving__title {
    margin: 0;
    font-size: clamp(2.1rem, 4.5vw, 3.1rem);
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.05;
    background: linear-gradient(100deg, #ffffff 0%, #ffffff 55%, #5eead4 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 60px rgba(45, 212, 191, 0.25);
}

.now-serving__branch-label {
    margin: 0.5rem 0 0;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
    font-size: 0.85rem;
    color: #e2e8f0;
    font-weight: 600;
    background: rgba(148, 163, 184, 0.12);
    border: 1px solid rgba(148, 163, 184, 0.22);
}

.now-serving__header-end {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.85rem;
}

.now-serving__branch {
    min-width: 12rem;
}

.now-serving__branch .mud-input.mud-input-outlined {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #fff !important;
    border-radius: 0.75rem !important;
}

.now-serving__branch .mud-input-outlined-border {
    border-color: rgba(255, 255, 255, 0.22) !important;
}

.now-serving__branch .mud-input-slot,
.now-serving__branch .mud-select-input,
.now-serving__branch .mud-input .mud-icon-root {
    color: #fff !important;
}

.now-serving__clock-block {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.3rem;
    padding: 0.6rem 1.1rem;
    border-radius: 1rem;
    background: rgba(15, 23, 42, 0.4);
    border: 1px solid rgba(148, 163, 184, 0.18);
}

.now-serving__clock {
    font-size: 1.5rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
}

.now-serving__mode {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #6ee7b7;
    max-width: 16rem;
    text-align: right;
}

.now-serving__mode::before {
    content: "";
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 999px;
    background: #34d399;
    box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.25);
    animation: kds-pulse 1.8s ease-in-out infinite;
}

.now-serving__board {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: clamp(1rem, 2.5vw, 1.75rem);
    align-items: start;
}

@media (max-width: 960px) {
    .now-serving__board {
        grid-template-columns: 1fr;
    }
}

.now-serving__col {
    min-width: 0;
    border-radius: 1.5rem;
    padding: 1.25rem 1.25rem 1.5rem;
    background: rgba(15, 23, 42, 0.38);
    border: 1px solid rgba(148, 163, 184, 0.14);
    backdrop-filter: blur(6px);
}

.now-serving__col--ready {
    border-color: rgba(52, 211, 153, 0.3);
    box-shadow: 0 0 0 1px rgba(52, 211, 153, 0.06), 0 30px 60px rgba(4, 47, 46, 0.25);
}

.now-serving__col--prep {
    border-color: rgba(251, 191, 36, 0.22);
}

.now-serving__col-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1.15rem;
}

.now-serving__col-title {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-size: clamp(1.2rem, 2vw, 1.55rem);
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #cbd5e1;
}

.now-serving__col-title::before {
    content: "";
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 999px;
    background: var(--ns-prep);
    box-shadow: 0 0 14px 2px var(--ns-prep);
}

.now-serving__col-title--ready {
    color: var(--ns-ready);
}

.now-serving__col-title--ready::before {
    background: var(--ns-ready);
    box-shadow: 0 0 14px 2px var(--ns-ready);
    animation: kds-pulse 1.8s ease-in-out infinite;
}

.now-serving__count {
    min-width: 2.1rem;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    font-size: 0.9rem;
    font-weight: 800;
    text-align: center;
    background: rgba(148, 163, 184, 0.16);
    color: #e2e8f0;
    font-variant-numeric: tabular-nums;
}

.now-serving__count--ready {
    background: rgba(16, 185, 129, 0.22);
    color: #bbf7d0;
    box-shadow: 0 0 0 1px rgba(52, 211, 153, 0.3);
}

.now-serving__cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17.5rem, 1fr));
    gap: 1.1rem;
}

.now-serving__card {
    position: relative;
    overflow: hidden;
    border-radius: 1.25rem;
    padding: 1.25rem 1.25rem 1.3rem;
    background: linear-gradient(165deg, rgba(30, 41, 59, 0.92), rgba(15, 23, 42, 0.88));
    border: 1px solid rgba(148, 163, 184, 0.18);
    box-shadow: 0 18px 40px rgba(2, 6, 23, 0.35);
    min-height: 11.5rem;
    animation: now-serving-in 420ms ease both;
}

.now-serving__card--ready {
    border-color: rgba(52, 211, 153, 0.5);
    background:
        linear-gradient(145deg, rgba(6, 78, 59, 0.6), rgba(15, 23, 42, 0.92) 55%);
    box-shadow:
        0 0 0 1px rgba(52, 211, 153, 0.18),
        0 24px 52px rgba(4, 47, 46, 0.5);
}

.now-serving__card--prep {
    border-color: rgba(251, 191, 36, 0.28);
    box-shadow:
        0 0 0 1px rgba(251, 191, 36, 0.08),
        0 18px 40px rgba(2, 6, 23, 0.35);
}

.now-serving__card-accent {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 4px;
    background: linear-gradient(90deg, #64748b, transparent);
}

.now-serving__card--ready .now-serving__card-accent {
    background: linear-gradient(90deg, var(--ns-ready-deep), #6ee7b7, var(--ns-ready-deep));
    box-shadow: 0 0 16px 1px rgba(52, 211, 153, 0.55);
}

.now-serving__card--prep .now-serving__card-accent {
    background: linear-gradient(90deg, var(--ns-prep-deep), var(--ns-prep), var(--ns-prep-deep));
    box-shadow: 0 0 16px 1px rgba(251, 191, 36, 0.4);
}

.now-serving__card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.7rem;
}

.now-serving__queue {
    display: flex;
    align-items: baseline;
    gap: 0.1rem;
    line-height: 1;
}

.now-serving__hash {
    font-size: 1.35rem;
    font-weight: 700;
    color: rgba(248, 250, 252, 0.55);
}

.now-serving__queue-no {
    font-size: clamp(2.4rem, 4vw, 3.25rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
}

.now-serving__card--ready .now-serving__queue-no {
    color: #ecfdf5;
    text-shadow: 0 0 28px rgba(52, 211, 153, 0.35);
}

.now-serving__type {
    flex-shrink: 0;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #ecfeff;
    background: linear-gradient(135deg, rgba(45, 212, 191, 0.35), rgba(124, 58, 237, 0.28));
    border: 1px solid rgba(255, 255, 255, 0.16);
}

.now-serving__identity {
    margin-bottom: 0.85rem;
}

.now-serving__guest {
    margin: 0 0 0.25rem;
    font-size: 1.05rem;
    font-weight: 650;
    color: #f1f5f9;
}

.now-serving__order-no {
    margin: 0;
    font-size: 0.82rem;
    font-weight: 550;
    letter-spacing: 0.02em;
    color: var(--ns-muted);
    font-variant-numeric: tabular-nums;
    word-break: break-all;
}

.now-serving__items {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.now-serving__item {
    display: grid;
    grid-template-columns: 1.9rem 1fr;
    gap: 0.55rem;
    align-items: center;
    font-size: 0.92rem;
    line-height: 1.3;
}

.now-serving__qty {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.9rem;
    height: 1.9rem;
    border-radius: 0.6rem;
    font-weight: 800;
    font-size: 0.78rem;
    color: #042f2e;
    background: linear-gradient(145deg, #5eead4, #0d9488);
    font-variant-numeric: tabular-nums;
}

.now-serving__card--ready .now-serving__qty {
    background: linear-gradient(145deg, #86efac, #16a34a);
}

.now-serving__item-name {
    color: #e2e8f0;
    font-weight: 550;
}

.now-serving__more,
.now-serving__no-items {
    margin: 0.55rem 0 0;
    font-size: 0.8rem;
    color: var(--ns-muted);
}

.now-serving__idle {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 0.5rem;
    padding: 2.25rem 1.25rem;
    border-radius: 1.1rem;
    border: 1px dashed rgba(148, 163, 184, 0.28);
    background: rgba(15, 23, 42, 0.35);
    color: var(--ns-muted);
}

.now-serving__idle-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    font-size: 1.25rem;
    background: rgba(148, 163, 184, 0.12);
    border: 1px solid rgba(148, 163, 184, 0.2);
}

.now-serving__idle p {
    margin: 0;
    font-size: 0.95rem;
}

.now-serving__empty {
    max-width: 34rem;
    margin-top: 4rem;
    padding: 2rem 2.25rem;
    border-radius: 1.5rem;
    background: rgba(15, 23, 42, 0.45);
    border: 1px solid rgba(148, 163, 184, 0.18);
    backdrop-filter: blur(6px);
}

.now-serving__empty h2 {
    margin: 0 0 0.65rem;
    font-size: 1.75rem;
    font-weight: 800;
    background: linear-gradient(90deg, #ffffff, #5eead4);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.now-serving__empty p {
    margin: 0;
    font-size: 1.05rem;
    line-height: 1.55;
    color: var(--ns-muted);
}

@keyframes now-serving-in {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.985);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .now-serving__card {
        animation: none;
    }
}

/* -- Dining floor board -- */
.dining-floor__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
}

.dining-floor__toggle.mud-selected-item,
.dining-floor__toggle {
    height: 2.75rem;
}

.dining-floor__toggle .mud-button-root,
.dining-floor__toggle .mud-toggle-item,
.dining-floor__refresh.mud-button-root {
    height: 2.75rem !important;
    min-height: 2.75rem !important;
    border-radius: 0.85rem !important;
    text-transform: none !important;
    font-weight: 700 !important;
}

.dining-floor__refresh.mud-button-root {
    padding-inline: 1.1rem !important;
}

.dining-floor__stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    margin-bottom: 1rem;
}

.dining-floor__stat {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 1rem 1.1rem;
    border-radius: 1rem;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.dining-floor__stat-value {
    font-size: 1.85rem;
    font-weight: 850;
    letter-spacing: -0.03em;
    line-height: 1;
    color: #0f172a;
}

.dining-floor__stat-label {
    font-size: 0.78rem;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.dining-floor__stat--free {
    border-top: 3px solid #22c55e;
}

.dining-floor__stat--occupied {
    border-top: 3px solid #ef4444;
}

.dining-floor__stat--reserved {
    border-top: 3px solid #f59e0b;
}

.dining-floor__stat--dirty {
    border-top: 3px solid #64748b;
}

.dining-floor__zones {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    padding: 0.95rem 1.1rem;
    margin-bottom: 1.25rem;
}

.dining-floor__zone {
    appearance: none;
    border: 1px solid rgba(13, 148, 136, 0.28);
    background: #fff;
    color: #0f766e;
    border-radius: 999px;
    padding: 0.45rem 0.95rem;
    font-size: 0.88rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.dining-floor__zone:hover {
    background: rgba(13, 148, 136, 0.08);
}

.dining-floor__zone--active {
    background: #0d9488;
    border-color: #0d9488;
    color: #fff;
}

.dining-floor__rail {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17.5rem, 1fr));
    gap: 1.1rem;
    align-items: stretch;
}

.dining-table-card {
    position: relative;
    display: flex;
    min-height: 15.5rem;
    border-radius: 1.2rem;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 14px 32px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.dining-table-card__accent {
    width: 0.35rem;
    flex-shrink: 0;
    background: #22c55e;
}

.dining-table-card--occupied .dining-table-card__accent {
    background: #ef4444;
}

.dining-table-card--reserved .dining-table-card__accent {
    background: #f59e0b;
}

.dining-table-card--dirty .dining-table-card__accent {
    background: #64748b;
}

.dining-table-card__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 1.15rem 1.15rem 1rem;
    min-width: 0;
}

.dining-table-card__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem;
}

.dining-table-card__name {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 850;
    letter-spacing: -0.02em;
    color: #0f172a;
    line-height: 1.15;
    word-break: break-word;
}

.dining-table-card__meta {
    margin: 0.35rem 0 0;
    font-size: 0.92rem;
    font-weight: 600;
    color: #64748b;
}

.dining-table-card__dot {
    margin: 0 0.25rem;
}

.dining-table-card__badge {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.dining-table-card__badge--free {
    background: rgba(34, 197, 94, 0.14);
    color: #15803d;
}

.dining-table-card__badge--occupied {
    background: rgba(239, 68, 68, 0.14);
    color: #b91c1c;
}

.dining-table-card__badge--reserved {
    background: rgba(245, 158, 11, 0.16);
    color: #b45309;
}

.dining-table-card__badge--dirty {
    background: rgba(100, 116, 139, 0.16);
    color: #334155;
}

.dining-table-card__operator {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #0F766E;
    margin: 0.1rem 0 0.7rem;
}

.dining-table-card__operator--unassigned {
    color: #94A3B8;
    font-weight: 500;
    font-style: italic;
}

.dining-table-card__live {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.75rem;
    align-items: start;
    padding: 0.8rem 0.85rem;
    border-radius: 0.95rem;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.03), rgba(13, 148, 136, 0.07));
    border: 1px solid rgba(15, 23, 42, 0.06);
}

.dining-table-card__queue {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 3.6rem;
    padding: 0.45rem 0.55rem;
    border-radius: 0.8rem;
    background: #0f172a;
    color: #fff;
}

.dining-table-card__queue-label {
    font-size: 0.62rem;
    font-weight: 750;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.7;
}

.dining-table-card__queue-value {
    font-size: 1.35rem;
    font-weight: 850;
    line-height: 1.1;
}

.dining-table-card__order-block {
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
    min-width: 0;
}

.dining-table-card__order-label {
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}

.dining-table-card__order-no {
    font-size: 0.92rem;
    font-weight: 750;
    font-family: ui-monospace, "Cascadia Mono", SFMono-Regular, Consolas, monospace;
    color: #0f172a;
    word-break: break-all;
}

.dining-table-card__guest {
    font-size: 1.05rem;
    font-weight: 750;
    color: #0f172a;
}

.dining-table-card__guest--muted {
    color: #64748b;
    font-weight: 650;
}

.dining-table-card__check {
    font-size: 0.85rem;
    font-weight: 650;
    color: #475569;
}

.dining-table-card__lines {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.28rem;
}

.dining-table-card__lines li {
    font-size: 0.92rem;
    font-weight: 650;
    color: #334155;
    padding-left: 0.75rem;
    position: relative;
}

.dining-table-card__lines li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 0.35rem;
    height: 0.35rem;
    border-radius: 50%;
    background: #0d9488;
}

.dining-table-card__hint {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: #64748b;
}

.dining-table-card__hint--ready {
    color: #15803d;
}

.dining-table-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: auto;
    padding-top: 0.25rem;
}

.dining-table-card__action {
    appearance: none;
    border: 1px solid rgba(15, 23, 42, 0.14);
    background: #fff;
    color: #0f172a;
    border-radius: 0.7rem;
    padding: 0.5rem 0.8rem;
    font-size: 0.82rem;
    font-weight: 750;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.dining-table-card__action:hover:not(:disabled) {
    background: rgba(15, 23, 42, 0.04);
    border-color: rgba(15, 23, 42, 0.28);
}

.dining-table-card__action--primary {
    background: #0d9488;
    border-color: #0d9488;
    color: #fff;
}

.dining-table-card__action--primary:hover:not(:disabled) {
    background: #0f766e;
    border-color: #0f766e;
}

.dining-table-card__action:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

@media (max-width: 900px) {
    .dining-floor__stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .dining-floor__rail {
        grid-template-columns: 1fr;
    }

    .dining-table-card__live {
        grid-template-columns: 1fr;
    }
}

/* -- Order aggregators -- */
.aggregators-page__refresh.mud-button-root {
    height: 2.75rem !important;
    min-height: 2.75rem !important;
    border-radius: 0.85rem !important;
    text-transform: none !important;
    font-weight: 700 !important;
    padding-inline: 1.1rem !important;
}

.aggregators-shell {
    display: grid;
    grid-template-columns: minmax(16rem, 20rem) minmax(0, 1fr);
    gap: 1.15rem;
    margin-bottom: 1.35rem;
    align-items: start;
}

.aggregators-shell__rail,
.aggregators-shell__detail {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 1.15rem;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

.aggregators-shell__rail {
    padding: 1.15rem 1.1rem 1.25rem;
}

.aggregators-shell__rail-label {
    margin: 0 0 0.65rem;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #64748b;
}

.aggregators-shell__select {
    margin-bottom: 0.95rem !important;
}

.aggregators-shell__provider-list {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.aggregators-provider-chip {
    appearance: none;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-align: left;
    border: 1px solid transparent;
    background: rgba(15, 23, 42, 0.025);
    border-radius: 0.9rem;
    padding: 0.7rem 0.75rem;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.aggregators-provider-chip:hover {
    background: rgba(13, 148, 136, 0.06);
}

.aggregators-provider-chip--active {
    background: rgba(13, 148, 136, 0.1);
    border-color: rgba(13, 148, 136, 0.35);
    box-shadow: inset 0 0 0 1px rgba(13, 148, 136, 0.12);
}

.aggregators-provider-chip__avatar,
.aggregators-detail__avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 999px;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.aggregators-detail__avatar {
    width: 3.1rem;
    height: 3.1rem;
    font-size: 0.95rem;
}

.aggregators-provider-chip__copy {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.aggregators-provider-chip__title {
    font-size: 0.95rem;
    font-weight: 750;
    color: #0f172a;
}

.aggregators-provider-chip__status {
    font-size: 0.75rem;
    font-weight: 700;
    color: #94a3b8;
}

.aggregators-provider-chip__status--on {
    color: #0f766e;
}

.aggregators-shell__detail {
    padding: 1.35rem 1.4rem 1.3rem;
}

.aggregators-detail__header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.85rem;
    margin-bottom: 1.35rem;
    padding-bottom: 1.1rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.aggregators-detail__identity {
    display: flex;
    align-items: flex-start;
    gap: 0.95rem;
    min-width: 0;
}

.aggregators-detail__title {
    margin: 0;
    font-size: 1.45rem;
    font-weight: 850;
    letter-spacing: -0.02em;
    color: #0f172a;
}

.aggregators-detail__desc {
    margin: 0.3rem 0 0;
    font-size: 0.95rem;
    line-height: 1.45;
    color: #64748b;
}

.aggregators-detail__code {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 750;
    letter-spacing: 0.04em;
    color: #0f766e;
    background: rgba(13, 148, 136, 0.1);
    border: 1px solid rgba(13, 148, 136, 0.2);
}

.aggregators-detail__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.15rem;
}

.aggregators-detail__field--wide {
    grid-column: 1 / -1;
}

.aggregators-detail__label {
    display: block;
    margin-bottom: 0.4rem;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.aggregators-detail__url-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: flex-start;
}

.aggregators-detail__url {
    flex: 1 1 16rem;
    margin: 0 !important;
}

.aggregators-detail__copy.mud-button-root,
.aggregators-detail__save.mud-button-root {
    height: 2.75rem !important;
    min-height: 2.75rem !important;
    border-radius: 0.85rem !important;
    text-transform: none !important;
    font-weight: 700 !important;
}

.aggregators-detail__hint {
    margin: 0.45rem 0 0;
    font-size: 0.82rem;
    color: #94a3b8;
}

.aggregators-detail__switch {
    margin-top: 0.35rem;
}

.aggregators-detail__footer {
    margin-top: 1.35rem;
    padding-top: 1.1rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.aggregators-detail__sample {
    margin-top: 1rem;
}

.aggregators-detail__sample-code {
    margin: 0;
    padding: 0.9rem 1rem;
    border-radius: 0.85rem;
    background: #0f172a;
    color: #e2e8f0;
    font-size: 0.8rem;
    line-height: 1.45;
    overflow: auto;
    white-space: pre-wrap;
    font-family: ui-monospace, "Cascadia Mono", SFMono-Regular, Consolas, monospace;
}

.aggregators-mappings {
    margin-top: 0.25rem;
}

.aggregators-mappings__header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.85rem;
    margin-bottom: 1rem;
}

.aggregators-mappings__title {
    font-weight: 800 !important;
    margin-bottom: 0.15rem !important;
}

.aggregators-mappings__provider {
    font-weight: 700;
}

@media (max-width: 960px) {
    .aggregators-shell {
        grid-template-columns: 1fr;
    }

    .aggregators-shell__provider-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .aggregators-detail__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .aggregators-shell__provider-list {
        grid-template-columns: 1fr;
    }
}

/* ========== Branch kitchen staff ========== */
.kitchen-staff-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.25rem;
    margin: 0.5rem 0 1.25rem;
    padding: 1.35rem 1.5rem;
    border-radius: 18px;
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(180, 83, 9, 0.14), transparent 55%),
        linear-gradient(135deg, #0B1F33 0%, #16324A 58%, #1B3A52 100%);
    color: #F8FAFC;
    box-shadow: var(--shadow-md);
}

.kitchen-staff-hero__eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(248, 250, 252, 0.72);
    font-weight: 600;
}

.kitchen-staff-hero__title {
    margin: 0 0 0.4rem;
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.kitchen-staff-hero__lead {
    margin: 0;
    max-width: 38rem;
    font-size: 0.92rem;
    line-height: 1.5;
    color: rgba(248, 250, 252, 0.82);
}

.kitchen-staff-hero__cta {
    flex-shrink: 0;
    white-space: nowrap;
}

.kitchen-staff-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 1.25rem;
}

.kitchen-staff-card {
    position: relative;
    display: flex;
    overflow: hidden;
    border-radius: 20px;
    border: 1px solid var(--border-color);
    background: linear-gradient(180deg, #FFFFFF 0%, #FCFDFE 100%);
    box-shadow: var(--shadow-sm);
    transition: box-shadow 0.22s ease, transform 0.22s ease, border-color 0.22s ease;
}

.kitchen-staff-card:hover {
    box-shadow: var(--shadow-lg, 0 16px 32px -12px rgba(15, 23, 42, 0.18));
    transform: translateY(-3px);
    border-color: rgba(11, 31, 51, 0.16);
}

.kitchen-staff-card--inactive {
    opacity: 0.68;
}

.kitchen-staff-card__accent {
    width: 6px;
    flex-shrink: 0;
    background: linear-gradient(180deg, #B45309, #0B1F33);
}

.kitchen-staff-card__body {
    flex: 1;
    padding: 1.35rem 1.5rem 1.15rem;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.kitchen-staff-card__top {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.05rem;
}

.kitchen-staff-card__avatar {
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: 0.02em;
    color: #0B1F33;
    background: linear-gradient(145deg, #F8E7D4, #E8F0F5);
    box-shadow: inset 0 0 0 1px rgba(11, 31, 51, 0.06);
    flex-shrink: 0;
}

.kitchen-staff-card__identity {
    flex: 1;
    min-width: 0;
    padding-top: 0.1rem;
}

.kitchen-staff-card__name {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--ink-color);
    line-height: 1.3;
}

.kitchen-staff-card__email {
    margin: 0.2rem 0 0;
    font-size: 0.85rem;
    color: #64748B;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kitchen-staff-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 1rem;
}

.kitchen-staff-card__phone {
    font-size: 0.88rem;
    font-weight: 500;
    color: #475569;
    display: inline-flex;
    align-items: center;
}

.kitchen-staff-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    border-top: 1px solid var(--border-color);
    padding-top: 0.6rem;
    margin-top: auto;
}

.table-manage-hero {
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(20, 184, 166, 0.16), transparent 55%),
        linear-gradient(135deg, #0B1F33 0%, #123A3C 58%, #145048 100%);
}

.table-manage-card__stat {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.82rem;
    color: #475569;
}

.table-manage-card__stat--order {
    color: #B45309;
    font-weight: 600;
}

.table-manage-zone-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 1.5rem 0 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border-color, #dee2e6);
}

.table-manage-zone-header:first-of-type {
    margin-top: 0;
}

.table-manage-zone-header__icon {
    color: #0F766E;
}

.table-manage-zone-header__title {
    font-weight: 700 !important;
}

.table-manage-zone-header__count {
    color: #64748B;
    margin-left: 0.25rem;
}

.table-manage-dialog__grid-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.assign-dialog .mud-dialog-content {
    max-width: 560px;
}

.assign-dialog__body {
    max-height: 60vh;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.assign-dialog__zones {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.assign-zone {
    border: 1px solid var(--border-color);
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.assign-zone:not(.assign-zone--locked):has(.mud-checkbox-input:checked) {
    border-color: #B45309;
    box-shadow: 0 0 0 1px rgba(180, 83, 9, 0.25);
}

.assign-zone--locked {
    background: #F8FAFC;
}

.assign-zone__header {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.65rem 0.9rem;
    background: #FAFAFA;
    border-bottom: 1px solid var(--border-color);
}

.assign-zone__icon {
    color: #94A3B8;
}

.assign-zone__name {
    font-weight: 700;
    font-size: 0.92rem;
    color: var(--ink-color);
}

.assign-zone__count {
    font-size: 0.78rem;
    color: #94A3B8;
    margin-left: 0.15rem;
}

.assign-zone__lock-chip,
.assign-table__lock-chip {
    margin-left: auto;
}

.assign-zone__tables {
    display: flex;
    flex-direction: column;
    padding: 0.3rem 0.9rem 0.5rem 2.1rem;
}

.assign-table {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.2rem 0;
}

.assign-table--locked {
    opacity: 0.65;
}

.assign-table__name {
    font-size: 0.86rem;
    color: var(--ink-color);
}

.assign-table__implicit {
    margin-left: auto;
    font-size: 0.76rem;
    color: #94A3B8;
    font-style: italic;
}

.kitchen-staff-dialog__hero {
    display: flex;
    gap: 0.9rem;
    align-items: flex-start;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(11, 31, 51, 0.06), rgba(180, 83, 9, 0.08));
    border: 1px solid var(--border-color);
}

.kitchen-staff-dialog__hero-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #0B1F33;
    color: #F8FAFC;
    flex-shrink: 0;
}

.kitchen-staff-dialog__hero-title {
    font-weight: 700 !important;
    margin-bottom: 0.15rem !important;
}

.kitchen-staff-dialog__access {
    padding: 0.85rem 1rem;
    border-radius: 12px;
    background: var(--surface-muted);
    border: 1px solid var(--border-color);
}

.admin-branch-selector--locked {
    pointer-events: none;
    opacity: 0.92;
}

@media (max-width: 720px) {
    .kitchen-staff-hero {
        flex-direction: column;
        align-items: stretch;
    }

    .kitchen-staff-hero__cta {
        width: 100%;
    }
}

/* ========== Android app QR / poster ========== */
.android-app-card {
    background:
        radial-gradient(120% 80% at 100% 0%, rgba(201, 162, 39, 0.12), transparent 55%),
        linear-gradient(160deg, #F8FAFC 0%, #EEF3F8 100%);
    border: 1px solid var(--border-color);
}

.android-qr-panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 280px;
    padding: 1.25rem;
    border-radius: 18px;
    background: #FFFFFF;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-sm);
}

.android-qr-panel img {
    width: 220px;
    height: 220px;
    image-rendering: pixelated;
}

.android-poster-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    background: #0B1F33;
    padding: 2rem;
}

.android-poster-toolbar {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1.25rem;
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid var(--border-color);
}

.android-poster {
    min-height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 3rem 1.5rem 4rem;
    background:
        radial-gradient(90% 70% at 50% 0%, rgba(201, 162, 39, 0.18), transparent 60%),
        linear-gradient(180deg, #0B1F33 0%, #132A40 45%, #0B1F33 100%);
    color: #F8FAFC;
}

.android-poster__eyebrow {
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #E0C35A;
    margin-bottom: 1rem;
}

.android-poster__title {
    margin: 0 0 0.75rem;
    font-size: clamp(2.2rem, 5vw, 3.6rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    max-width: 16ch;
    line-height: 1.1;
}

.android-poster__subtitle {
    margin: 0 0 2rem;
    max-width: 34rem;
    font-size: 1.15rem;
    line-height: 1.55;
    color: #CBD5E1;
}

.android-poster__qr {
    background: #FFFFFF;
    border-radius: 28px;
    padding: 1.5rem;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}

.android-poster__qr img {
    display: block;
    width: min(360px, 70vw);
    height: auto;
    aspect-ratio: 1;
    image-rendering: pixelated;
}

.android-poster__hint {
    margin: 1.5rem 0 0.75rem;
    font-size: 0.95rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #94A3B8;
}

.android-poster__link {
    color: #E0C35A;
    font-weight: 600;
    word-break: break-all;
    max-width: 40rem;
}

@media print {
    .no-print {
        display: none !important;
    }

    .android-poster {
        min-height: 100vh;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}

.self-order-link-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.15rem;
}

.self-order-link-grid--triple {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.self-order-link-grid--quad {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.self-order-link-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem 1.25rem;
    align-items: center;
    border: 1px solid var(--admin-border-soft, #dbe5ef);
    border-radius: 1.35rem !important;
    background:
        radial-gradient(120% 90% at 100% 0%, rgba(15, 107, 120, 0.08), transparent 55%),
        linear-gradient(155deg, #ffffff 0%, #f5fafb 100%);
    box-shadow: 0 10px 28px rgba(15, 40, 55, 0.05);
}

.self-order-link-card--marketplace {
    background:
        radial-gradient(120% 90% at 100% 0%, rgba(37, 99, 235, 0.10), transparent 55%),
        linear-gradient(155deg, #ffffff 0%, #f5f8ff 100%);
}

.self-order-link-card--phone {
    background:
        radial-gradient(120% 90% at 100% 0%, rgba(16, 185, 129, 0.12), transparent 55%),
        linear-gradient(155deg, #ffffff 0%, #f3fbf7 100%);
}

.self-order-link-card--shop {
  border-color: #cfc4ae;
  background: linear-gradient(180deg, #fffcf7 0%, #f6f1e8 100%);
}

.self-order-link-card--kiosk {
    background:
        radial-gradient(120% 90% at 100% 0%, rgba(217, 119, 6, 0.10), transparent 55%),
        linear-gradient(155deg, #ffffff 0%, #fffaf3 100%);
}

.self-order-link-card--staff {
    background:
        radial-gradient(120% 90% at 100% 0%, rgba(124, 58, 237, 0.10), transparent 55%),
        linear-gradient(155deg, #ffffff 0%, #f8f6ff 100%);
}

.self-order-link-card__copy {
    display: grid;
    gap: 0.35rem;
    min-width: 0;
}

.self-order-link-card__badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.12);
    color: #1d4ed8;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.self-order-link-card__badge--phone {
    background: rgba(5, 150, 105, 0.14);
    color: #047857;
}

.self-order-link-card__badge--kiosk {
    background: rgba(217, 119, 6, 0.14);
    color: #b45309;
}

.self-order-link-card__badge--staff {
    background: rgba(124, 58, 237, 0.14);
    color: #6d28d9;
}

.self-order-link-card__qr {
    display: grid;
    place-items: center;
    padding: 0.55rem;
    border-radius: 1rem;
    background: #fff;
    border: 1px solid rgba(15, 40, 55, 0.06);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.self-order-link-card__qr img {
    display: block;
    border-radius: 0.35rem;
}

.self-order-link-card code {
    grid-column: 1 / -1;
    overflow-wrap: anywhere;
    padding: 0.7rem 0.85rem;
    border-radius: 0.75rem;
    background: #edf4f7;
    color: #123b4a;
    font-size: 0.78rem;
}

.self-order-link-card .mud-stack {
    grid-column: 1 / -1;
}

.self-order-link-card__download {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: 0.3rem 0.65rem;
    color: var(--admin-primary, #0f6b78);
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
}

.self-order-poster__powered {
    margin-top: 1.5rem;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.self-order-poster--marketplace .android-poster__eyebrow {
    letter-spacing: 0.16em;
}

.self-order-poster--phone .android-poster__eyebrow {
    letter-spacing: 0.12em;
    color: #059669;
}

.self-order-poster--kiosk .android-poster__eyebrow {
    letter-spacing: 0.12em;
    color: #d97706;
}

@media (max-width: 1200px) {
    .self-order-link-grid--triple,
    .self-order-link-grid--quad {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .self-order-link-grid {
        grid-template-columns: 1fr;
    }
}

.branch-hours-days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.55rem;
}

.branch-hours-day {
    display: grid;
    gap: 0.2rem;
    justify-items: center;
    min-height: 4.25rem;
    padding: 0.65rem 0.35rem;
    border-radius: 1rem;
    border: 1px solid var(--admin-border-soft, #dbe5ef);
    background: linear-gradient(160deg, #fff, #f7fafc);
    color: #64748b;
    cursor: pointer;
    transition: border-color 120ms ease, background 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.branch-hours-day__name {
    font-size: 0.92rem;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.branch-hours-day__state {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.branch-hours-day--open {
    border-color: rgba(15, 107, 120, 0.35);
    background: linear-gradient(160deg, #effaf8, #e6f5f3);
    color: #0f6b78;
    box-shadow: 0 8px 18px rgba(15, 107, 120, 0.08);
}

.branch-hours-day--open .branch-hours-day__state {
    color: #0f6b78;
}

@media (max-width: 700px) {
    .branch-hours-days {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 420px) {
    .branch-hours-days {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ========== Food modifier group editor ========== */
.modifier-form-layout {
    align-items: start;
}

.modifier-option-accordion.variant-section-accordion {
    gap: 0.75rem;
}

.modifier-validation-list {
    margin: 0;
    padding-left: 1.15rem;
}

.modifier-validation-list li + li {
    margin-top: 0.25rem;
}

.modifier-option-panel--error.mud-expand-panel {
    border-color: color-mix(in srgb, var(--mud-palette-error, #dc2626) 55%, #fecaca) !important;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--mud-palette-error, #dc2626) 25%, transparent);
}

.modifier-option-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    min-width: 0;
    padding-right: 0.25rem;
}

.modifier-option-title__kind {
    flex-shrink: 0;
}

.modifier-option-title__thumb {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
    background: var(--mud-palette-background-grey, #f5f5f5);
}

.modifier-option-title__copy {
    flex: 1;
    min-width: 0;
}

.modifier-option-title__copy .mud-typography {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.modifier-option-title__meta {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
}

.modifier-option-title__price {
    min-width: 3.25rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 650 !important;
    color: var(--admin-primary-dark, #0f766e) !important;
}

.modifier-option-title__delete {
    margin-inline-start: 0.15rem;
}

.modifier-option-subpanels {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin-top: 0.35rem;
}

.modifier-option-subpanels .mud-expand-panel {
    border: 1px solid color-mix(in srgb, var(--admin-border, #e2e8f0) 90%, transparent);
    border-radius: 10px !important;
    margin: 0 !important;
    background: color-mix(in srgb, var(--admin-surface-muted, #f8fafc) 88%, #fff);
}

.modifier-preview-panel {
    top: 5.5rem;
}

.modifier-preview-card {
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: var(--iph-radius-md, 14px);
    background: var(--admin-surface, #fff);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 14px 28px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.modifier-preview-card .product-preview-card__label-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 1.1rem 0.35rem;
}

.modifier-preview-card__hero {
    display: flex;
    align-items: center;
    gap: 0.95rem;
    margin: 0.35rem 1.1rem 0;
    padding: 1rem 1.05rem;
    border-radius: 12px;
    background:
        radial-gradient(120% 140% at 0% 0%, rgba(13, 148, 136, 0.18), transparent 55%),
        linear-gradient(145deg, #0f172a 0%, #134e4a 55%, #0f766e 100%);
    color: #fff;
}

.modifier-preview-card__hero-mark {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.12);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16);
}

.modifier-preview-card__eyebrow {
    opacity: 0.78;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 700 !important;
}

.modifier-preview-card__product {
    margin: 0.1rem 0 !important;
    font-weight: 750 !important;
    letter-spacing: -0.02em;
    color: #fff !important;
}

.modifier-preview-card__base {
    opacity: 0.88;
    color: #fff !important;
}

.modifier-preview-card__body {
    padding: 1rem 1.1rem 1.2rem;
}

.modifier-preview-channels {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.modifier-preview-channels .mud-button-root {
    min-height: 2rem;
    border-radius: 999px !important;
    text-transform: none;
    font-weight: 600;
}

.modifier-preview-options {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.modifier-preview-option {
    display: grid;
    gap: 0.2rem;
    width: 100%;
    padding: 0.75rem 0.85rem;
    text-align: left;
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    transition: border-color 140ms ease, box-shadow 140ms ease, background-color 140ms ease, transform 140ms ease;
}

.modifier-preview-option:hover {
    border-color: color-mix(in srgb, var(--admin-primary, #0d9488) 45%, var(--admin-border, #e2e8f0));
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
    transform: translateY(-1px);
}

.modifier-preview-option.is-selected {
    border-color: color-mix(in srgb, var(--admin-primary, #0d9488) 55%, var(--admin-border, #e2e8f0));
    background: linear-gradient(180deg, #f0fdfa 0%, #fff 70%);
    box-shadow: inset 3px 0 0 0 var(--admin-primary, #0d9488);
}

.modifier-preview-option.is-remove {
    opacity: 0.92;
}

.modifier-preview-option__label {
    font-size: 0.92rem;
    font-weight: 650;
    color: var(--admin-text, #0f172a);
}

.modifier-preview-option__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
    color: var(--admin-primary-dark, #0f766e);
    font-weight: 650;
}

.modifier-preview-option__tag {
    color: var(--admin-muted, #64748b);
    font-weight: 600;
}

.modifier-preview-option__nested {
    font-size: 0.72rem;
    color: var(--admin-muted, #64748b);
}

.modifier-preview-total {
    margin-top: 1rem;
    padding: 0.9rem 0.95rem;
    border-radius: 12px;
    background: color-mix(in srgb, var(--admin-surface-muted, #f8fafc) 92%, #fff);
    border: 1px solid var(--admin-border, #e2e8f0);
}

.modifier-preview-total__row {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.85rem;
    color: var(--admin-text-soft, #334155);
    font-variant-numeric: tabular-nums;
}

.modifier-preview-total__row + .modifier-preview-total__row {
    margin-top: 0.35rem;
}

.modifier-preview-total__row--grand {
    margin-top: 0.55rem;
    padding-top: 0.55rem;
    border-top: 1px dashed color-mix(in srgb, var(--admin-border, #e2e8f0) 80%, transparent);
    font-size: 1rem;
    font-weight: 750;
    color: var(--admin-text, #0f172a);
}

@media (max-width: 600px) {
    .modifier-option-title {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .modifier-option-title__meta {
        width: 100%;
        justify-content: flex-end;
    }
}

.medical-catalog-coach {
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 14px;
    background: #fff;
    padding: 1rem 1.15rem 0.85rem;
}

.medical-catalog-coach__header {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    margin-bottom: 0.75rem;
}

.medical-catalog-coach__title {
    font-weight: 650 !important;
}

.medical-catalog-coach__now {
    margin: 0 0 0.5rem;
    padding-left: 1.2rem;
}

.medical-catalog-coach__now li {
    margin-bottom: 0.35rem;
    color: var(--admin-text-soft, #334155);
}

.medical-catalog-coach__fields .mud-expand-panel {
    background: transparent;
}

.medical-catalog-coach__dl {
    margin: 0;
}

.medical-catalog-coach__field {
    padding: 0.65rem 0;
    border-top: 1px solid color-mix(in srgb, var(--admin-border, #e2e8f0) 80%, transparent);
}

.medical-catalog-coach__field dt {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 650;
    margin-bottom: 0.2rem;
}

.medical-catalog-coach__field dd {
    margin: 0;
    display: grid;
    gap: 0.2rem;
    color: var(--admin-text-soft, #334155);
}

.medical-catalog-coach__example {
    color: var(--admin-text, #0f172a);
}

.medical-catalog-guide__toc {
    position: sticky;
    top: 1rem;
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 14px;
    background: #fff;
    padding: 0.85rem 0.65rem;
}

.medical-catalog-guide__toc-item {
    justify-content: flex-start !important;
    text-transform: none !important;
}

.medical-catalog-guide__section {
    scroll-margin-top: 5.5rem;
}

.medical-catalog-guide__card,
.medical-catalog-guide__step,
.medical-catalog-guide__master,
.medical-catalog-guide__term,
.medical-catalog-guide__field {
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 14px;
    background: #fff;
    padding: 0.95rem 1.1rem;
}

.medical-catalog-guide__step,
.medical-catalog-guide__master {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
}

.medical-catalog-guide__step-num {
    flex: 0 0 2rem;
    height: 2rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: var(--mud-palette-primary);
    color: #fff;
    font-weight: 700;
}

.medical-catalog-guide__example,
.medical-catalog-guide__bullets {
    padding-left: 1.2rem;
}

.medical-catalog-guide__example li,
.medical-catalog-guide__bullets li {
    margin-bottom: 0.4rem;
}

.medical-catalog-guide__glossary,
.medical-catalog-guide__field-list {
    display: grid;
    gap: 0.75rem;
}

.medical-catalog-guide__k {
    font-weight: 650;
}

.medical-catalog-guide__field header {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 0.35rem;
}

.medical-catalog-guide__field p {
    margin: 0 0 0.3rem;
}

@media (min-width: 900px) {
    .medical-catalog-guide__glossary {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    .medical-catalog-guide__step,
    .medical-catalog-guide__master,
    .medical-catalog-coach__header {
        flex-wrap: wrap;
    }
}

.fg-stock-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1.5rem;
    padding: 1.75rem 1.85rem;
    margin-bottom: 1.25rem;
    border-radius: 20px;
    background:
        radial-gradient(1200px 280px at 100% -20%, rgba(255, 255, 255, 0.16), transparent 50%),
        linear-gradient(135deg, #0f766e 0%, #115e59 55%, #0f172a 100%);
    color: #f8fafc;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
}

.fg-stock-hero__eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(248, 250, 252, 0.72);
}

.fg-stock-hero__title {
    margin: 0;
    font-size: 1.85rem;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

.fg-stock-hero__product {
    margin: 0.35rem 0 0;
    color: rgba(248, 250, 252, 0.82);
}

.fg-stock-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.fg-stock-hero__actions .mud-button-outlined {
    color: #f8fafc;
    border-color: rgba(248, 250, 252, 0.35);
}

.fg-stock-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.fg-stock-metric {
    padding: 1.1rem 1.2rem;
    border-radius: 16px;
    background: #fff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.fg-stock-metric--accent {
    border-color: color-mix(in srgb, var(--admin-primary, #0d9488) 35%, #e2e8f0);
    background: linear-gradient(180deg, #f0fdfa 0%, #fff 70%);
}

.fg-stock-metric__label {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.fg-stock-metric__value {
    display: block;
    margin-top: 0.35rem;
    font-size: 1.65rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
}

.fg-stock-panel {
    padding: 1.25rem 1.35rem 1.4rem;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    background: #fff;
    min-height: 100%;
}

.fg-stock-panel__title {
    margin: 0 0 0.85rem;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.fg-stock-panel__lede {
    margin: -0.25rem 0 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

.fg-stock-dl {
    display: grid;
    gap: 0.75rem 1rem;
    margin: 0;
}

.fg-stock-dl > div {
    display: grid;
    grid-template-columns: 8.5rem 1fr;
    gap: 0.75rem;
    align-items: baseline;
}

.fg-stock-dl dt {
    margin: 0;
    color: #64748b;
    font-size: 0.8rem;
    font-weight: 600;
}

.fg-stock-dl dd {
    margin: 0;
    color: #0f172a;
    font-weight: 600;
    word-break: break-word;
}

.fg-stock-dl code {
    font-size: 0.82rem;
}

@media (max-width: 900px) {
    .fg-stock-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    .fg-stock-metrics {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    .fg-stock-metrics {
        grid-template-columns: 1fr;
    }

    .fg-stock-dl > div {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }
}

/* ========== Category portfolio list ========== */
.cat-portfolio__kpis {
    margin-top: 1.25rem;
    margin-bottom: 1.15rem;
}

.cat-portfolio__charts {
    margin-bottom: 1.5rem;
}

.cat-stat-card--catalog::before {
    background: linear-gradient(180deg, #0f766e, #5eead4);
}

.cat-stat-card--catalog .je-stat-card__glyph {
    background: rgba(15, 118, 110, 0.12);
    color: #0f766e;
}

.cat-portfolio__table {
    overflow: hidden;
}

.cat-portfolio-grid .mud-table-head .mud-table-cell {
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-weight: 650;
}

.cat-title-cell {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 9.5rem;
}

.cat-title-cell__name {
    font-weight: 650;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.cat-title-cell__meta {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.cat-title-cell__code,
.cat-title-cell__order {
    font-size: 0.75rem;
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

.cat-title-cell__code {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}

.cat-muted {
    color: #94a3b8;
    font-size: 0.85rem;
}

.cat-count-pill {
    display: inline-flex;
    min-width: 2.1rem;
    justify-content: center;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    background: rgba(15, 118, 110, 0.1);
    color: #0f766e;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
}

.cat-count-pill--soft {
    background: rgba(29, 78, 216, 0.1);
    color: #1d4ed8;
}

.cat-count-pill--ghost {
    background: rgba(100, 116, 139, 0.12);
    color: #475569;
}

.cat-col-num,
.cat-col-money {
    text-align: right !important;
}

.cat-money {
    font-variant-numeric: tabular-nums;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #0f172a;
    white-space: nowrap;
}

.cat-money--revenue {
    color: #1d4ed8;
}

.cat-money--cogs {
    color: #b45309;
}

.cat-money--empty {
    color: #94a3b8;
    font-weight: 500;
}

.cat-compare {
    display: grid;
    gap: 1rem;
}

.cat-compare__item {
    padding: 0.75rem 0.85rem;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--admin-border) 88%, transparent);
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.7), #fff);
}

.cat-compare__head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.55rem;
}

.cat-compare__name {
    font-weight: 650;
    color: #0f172a;
}

.cat-compare__margin {
    font-variant-numeric: tabular-nums;
    color: #15803d;
    font-weight: 650;
}

.cat-compare__pair {
    display: grid;
    gap: 0.4rem;
}

.cat-compare__line {
    display: grid;
    grid-template-columns: 4.5rem 1fr 7.5rem;
    align-items: center;
    gap: 0.65rem;
}

.cat-compare__key {
    font-size: 0.7rem;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.cat-compare__key--revenue { color: #1d4ed8; }
.cat-compare__key--cogs { color: #b45309; }

.cat-compare__track {
    height: 0.55rem;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.18);
    overflow: hidden;
}

.cat-compare__fill {
    height: 100%;
    border-radius: inherit;
}

.cat-compare__fill--revenue {
    background: linear-gradient(90deg, #1d4ed8, #60a5fa);
}

.cat-compare__fill--cogs {
    background: linear-gradient(90deg, #b45309, #f59e0b);
}

.cat-compare__amt {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-size: 0.82rem;
    color: #334155;
}

@media (max-width: 720px) {
    .cat-compare__line {
        grid-template-columns: 3.6rem 1fr;
    }

    .cat-compare__amt {
        display: none;
    }
}