/* Bank owns its page composition; widgets and tenant colors use shared tokens. */
.bank-page .bank-list {
    gap: 0;
    overflow: visible;
}

.bank-page .bank-search {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--mkp-border);
}

.bank-page .bank-search .form-label {
    flex-shrink: 0;
    margin: 0;
}

.bank-page:has(.bank-list) .admin-page-header {
    margin-bottom: 12px;
}

.bank-page .bank-search .admin-search {
    width: 100%;
    max-width: 380px;
}

.bank-page .bank-list > .k-grid {
    --mkp-grid-cell-x: 12px;
    --mkp-grid-cell-y: 1px;
    border: 0;
    border-radius: 0 0 var(--mkp-radius-lg) var(--mkp-radius-lg);
}

.bank-page .bank-list > .k-grid.mkp-grid-bounded > .k-grid-container > .k-grid-content {
    max-height: max(320px, calc(100dvh - 286px));
}

/* Fixed layout leaves the unbounded name column the remaining space instead
   of distributing it proportionally across short codes and numbers. Kendo
   keeps ownership of the colgroup, including manual column resizing. */
.bank-page .bank-list :is(.k-grid-table, .k-grid-header-table) {
    table-layout: fixed;
    min-width: 680px;
}

.bank-page .bank-list .k-grid :is(.k-grid-table, .k-grid-header-table) > colgroup > col:not([style*="width"]) {
    width: auto;
}

.bank-page .k-grid .k-grid-header-table > thead > tr > th {
    box-sizing: border-box;
    height: 36px;
    padding-block: 3px;
    color: var(--mkp-foreground);
    font-size: 14px;
    font-weight: 600;
}

.bank-page .k-grid .k-grid-table > tbody > tr > td {
    box-sizing: border-box;
    height: 32px;
    overflow-wrap: anywhere;
}

.bank-page .k-grid .k-grid-table > tbody > tr > td .btn {
    min-height: 28px;
    min-width: 28px;
    padding: 3px 6px;
    font-size: 14px;
    line-height: 20px;
}

.bank-page .k-grid .k-grid-table > tbody > tr > td .btn .fa {
    font-size: 14px;
}

.bank-page .k-grid .k-grid-pager {
    padding: 8px 12px;
}

.bank-page .k-grid .k-grid-norecords {
    width: 100%;
}

.bank-page .k-grid td:nth-child(2),
.bank-page .k-grid td:nth-child(3) {
    font-variant-numeric: tabular-nums;
}

.bank-page .bank-empty {
    display: grid;
    width: 100%;
    justify-items: center;
    gap: 8px;
    padding: 40px 20px;
    white-space: normal;
    text-align: center;
}

.bank-page .bank-empty > i {
    font-size: 24px;
    color: var(--mkp-muted-foreground);
    margin-bottom: 4px;
}

.bank-page .bank-empty p,
.bank-page .bank-section-heading p {
    margin: 0;
    color: var(--mkp-muted-foreground);
}

.bank-editor {
    max-width: var(--mkp-form-width);
}

.bank-page .bank-form-card .card-body {
    padding: 24px;
}

.bank-page .bank-section-heading {
    margin-bottom: 24px;
}

.bank-page .bank-section-heading h2 {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 6px;
}

.bank-page .bank-field-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-top: 24px;
}

.bank-page .bank-form-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 16px 24px;
    background: transparent;
    border-top: 1px solid var(--mkp-border);
}

.bank-page .bank-field-row .form-text {
    margin: 8px 0 0;
    color: var(--mkp-muted-foreground);
    font-size: 14px;
    line-height: 20px;
}

@media (max-width: 575.98px) {
    .bank-page .bank-search {
        align-items: stretch;
        flex-direction: column;
        gap: 8px;
    }

    .bank-page .bank-search,
    .bank-page .bank-form-card .card-body,
    .bank-page .bank-form-footer {
        padding: 16px;
    }

    .bank-page .bank-field-row {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media print {
    .bank-page .bank-list > .k-grid.mkp-grid-bounded > .k-grid-container > .k-grid-content {
        max-height: none;
    }
}