.branch-module-window {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.branch-module-window > div,
.branch-module-page {
    width: 100%;
    height: 100%;
}

.branch-module-page {
    overflow: auto;
    padding: 12px;
    color: #30343f;
    background: #f6f7fb;
}

.branch-module-band {
    width: 100%;
    padding: 14px;
    margin-bottom: 12px;
    border: 1px dotted #777;
    background: transparent;
}

.branch-module-band-header,
.branch-module-report-toolbar,
.branch-module-member-toolbar,
.branch-module-form-actions,
.branch-module-metadata {
    display: flex;
    align-items: center;
    gap: 12px;
}

.branch-module-band-header {
    justify-content: space-between;
    margin-bottom: 12px;
    font-size: 18px;
}

.branch-module-form-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(150px, 1fr));
    gap: 12px;
    align-items: end;
}

.branch-module-form-grid .form-group,
.branch-module-report-toolbar .form-group,
.branch-module-member-toolbar .form-group {
    margin-bottom: 0;
}

.branch-module-form-actions {
    min-height: 44px;
}

.branch-module-member-toolbar,
.branch-module-report-toolbar {
    flex-wrap: wrap;
    align-items: end;
    margin-bottom: 12px;
}

.branch-module-member-toolbar .form-group:first-child,
.branch-module-report-toolbar .form-group:first-child,
.branch-module-report-toolbar .form-group:nth-child(2) {
    flex: 1 1 260px;
}

.branch-module-report-toolbar .branch-module-filter-field {
    flex: 1 1 220px;
    min-width: 180px;
}

#ABranchAdminRoot .branch-module-report-toolbar .branch-admin-currency-field {
    flex: 0 1 190px;
    width: 190px;
    max-width: 190px;
}

#ABranchAdminRoot .branch-module-report-toolbar .branch-admin-branch-field {
    flex: 0 1 310px;
    width: 310px;
    max-width: 310px;
}

.branch-module-date-field,
.branch-module-date-field .custom-date-input {
    width: 150px;
    max-width: 100%;
}

.branch-module-command {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}

.branch-module-search {
    display: flex;
    align-items: center;
    gap: 8px;
    width: min(320px, 100%);
}

.branch-module-table-wrap {
    width: 100%;
    overflow: auto;
}

.branch-module-table-wrap table {
    width: 100%;
    min-width: 850px;
    margin-bottom: 0;
}

.branch-module-table-wrap th,
.branch-module-table-wrap td {
    vertical-align: middle !important;
}

.branch-module-actions {
    white-space: nowrap;
}

.branch-module-actions button {
    width: 34px;
    height: 34px;
    padding: 0;
    margin: 0 3px;
    border: 0;
    background: transparent;
    color: #30343f;
}

.branch-module-actions button:hover,
.branch-module-actions button:focus {
    color: #2389c9;
}

.branch-module-selected-row td {
    background: #e8f3fb !important;
}

.branch-module-secondary {
    margin-top: 3px;
    color: #6d7480;
    font-size: 12px;
}

.branch-module-status {
    display: inline-block;
    padding: 3px 7px;
    border-radius: 4px;
    font-size: 12px;
}

.branch-module-status.is-ok,
.branch-module-status.is-head {
    color: #18733b;
    background: #e5f5eb;
}

.branch-module-status.is-warning {
    color: #8b5b00;
    background: #fff2cf;
}

.branch-module-empty {
    padding: 24px !important;
    text-align: center;
    color: #6d7480;
}

.branch-module-metadata {
    flex-wrap: wrap;
    min-height: 28px;
    padding-top: 10px;
    border-top: 1px solid #ddd;
    color: #555d68;
}

.branch-module-report-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 10px;
}

.branch-module-report-actions .branch-module-command:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.branch-module-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 10px;
}

.branch-module-kpi {
    min-height: 82px;
    padding: 12px;
    border: 1px solid #d9dee8;
    border-radius: 4px;
    background: #fff;
}

.branch-module-kpi span,
.branch-module-kpi strong {
    display: block;
}

.branch-module-kpi span {
    color: #646c78;
    font-size: 13px;
}

.branch-module-kpi strong {
    margin-top: 8px;
    color: #2389c9;
    font-size: 22px;
    font-weight: 600;
}

.branch-module-kpi.is-warning {
    border-color: #e4b44a;
}

.branch-module-kpi.is-warning strong {
    color: #a36a00;
}

@media (max-width: 1100px) {
    .branch-module-form-grid {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
    }

    .branch-module-kpis {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
    }
}

@media (max-width: 650px) {
    .branch-module-page {
        padding: 6px;
    }

    .branch-module-form-grid {
        grid-template-columns: 1fr;
    }

    .branch-module-kpis {
        grid-template-columns: 1fr;
    }

    .branch-module-band-header {
        align-items: stretch;
        flex-direction: column;
    }

    #ABranchAdminRoot .branch-module-report-toolbar .branch-admin-branch-field,
    #ABranchAdminRoot .branch-module-report-toolbar .branch-admin-currency-field {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
    }
}

.branch-module-page[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

.branch-module-page[dir="rtl"] .branch-module-table-wrap table {
    direction: rtl;
}

.branch-module-page[dir="rtl"] .branch-module-actions {
    direction: rtl;
}

.branch-module-page[dir="rtl"] input[dir="ltr"],
.branch-module-page[dir="rtl"] .branch-module-secondary[dir="ltr"] {
    text-align: left;
}