.link-sidebar,
[data-bs-theme][data-color-theme]:root,
:root {
    --brand-accent: #005afe;
    --brand-accent-strong: #0047d1;
    --brand-accent-rgb: 0, 90, 254;
    --brand-accent-soft: #e8f0ff;
    --brand-accent-soft-border: rgba(0, 90, 254, 0.22);
    --brand-dark: #081b40;
    --brand-dark-strong: #04122e;
    --brand-dark-rgb: 8, 27, 64;
    --brand-surface: #f5f8fe;
    --brand-surface-soft: #ecf2fd;
    --brand-border: #dbe4f3;
    --brand-text: #081b40;
    --brand-muted: #5c6b87;
    --bs-primary: var(--brand-accent);
    --bs-primary-rgb: var(--brand-accent-rgb);
    --bs-light-primary: rgba(var(--brand-accent-rgb), 0.1);
    --bs-primary-bg-subtle: rgba(var(--brand-accent-rgb), 0.12);
    --bs-primary-border-subtle: rgba(var(--brand-accent-rgb), 0.28);
    --bs-primary-text-emphasis: var(--brand-dark);
    --bs-secondary: var(--brand-dark);
    --bs-secondary-rgb: var(--brand-dark-rgb);
    --bs-light-secondary: rgba(var(--brand-dark-rgb), 0.1);
    --bs-secondary-bg-subtle: rgba(var(--brand-dark-rgb), 0.08);
    --bs-secondary-text-emphasis: var(--brand-dark);
    --bs-info: var(--brand-accent);
    --bs-info-rgb: var(--brand-accent-rgb);
    --bs-info-bg-subtle: rgba(var(--brand-accent-rgb), 0.12);
    --bs-info-border-subtle: rgba(var(--brand-accent-rgb), 0.24);
    --bs-info-text-emphasis: var(--brand-dark);
    --bs-link-color: var(--brand-text);
    --bs-link-color-rgb: var(--brand-dark-rgb);
    --bs-link-hover-color: var(--brand-accent-strong);
    --bs-link-hover-color-rgb: 0, 71, 209;
    --bs-dark: var(--brand-dark);
    --bs-dark-rgb: var(--brand-dark-rgb);
    --bs-body-bg: var(--brand-surface);
    --bs-body-color: rgba(8, 27, 64, 0.72);
    --bs-body-color-rgb: 8, 27, 64;
    --bs-secondary-color: rgba(8, 27, 64, 0.76);
    --bs-secondary-color-rgb: 8, 27, 64;
    --bs-tertiary-color: rgba(8, 27, 64, 0.56);
    --bs-tertiary-color-rgb: 8, 27, 64;
    --bs-heading-color: var(--brand-text);
    --bs-border-color: var(--brand-border);
    --bs-border-color-translucent: rgba(8, 27, 64, 0.1);
    --bs-focus-ring-color: rgba(var(--brand-accent-rgb), 0.18);
}

.app-navigation-loader {
    align-items: center;
    background: rgba(245, 248, 254, 0.94);
    display: flex;
    inset: 0;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    transition: opacity 0.08s ease, visibility 0.08s ease;
    visibility: hidden;
    z-index: 100000;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.app-navigation-loader.is-visible {
    opacity: 1;
    pointer-events: auto;
    transition-duration: 0s;
    visibility: visible;
}

.app-navigation-loader__content {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.app-navigation-loader__mark {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(var(--brand-dark-rgb), 0.08);
    border-radius: 24px;
    box-shadow: 0 18px 50px rgba(var(--brand-dark-rgb), 0.14);
    display: inline-flex;
    height: 88px;
    justify-content: center;
    position: relative;
    width: 88px;
}

.app-navigation-loader__mark::before {
    animation: app-navigation-spin 0.9s linear infinite;
    border: 3px solid rgba(var(--brand-accent-rgb), 0.14);
    border-radius: 50%;
    border-top-color: var(--brand-accent);
    content: "";
    inset: 7px;
    position: absolute;
}

.app-navigation-loader__mark img {
    display: block;
    height: 44px;
    object-fit: contain;
    position: relative;
    width: 48px;
    z-index: 1;
}

.app-navigation-loader__label {
    color: var(--brand-dark);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.03em;
}

html.app-navigation-loading,
html.app-navigation-loading body {
    overflow: hidden;
}

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

.icon-wrap {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: rgba(var(--brand-accent-rgb), 0.12);
    border: 1px solid rgba(var(--brand-accent-rgb), 0.24);
    color: var(--brand-dark);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.icon-wrap i,
.icon-wrap iconify-icon {
    color: inherit;
}

.logo-header img {
    height: 36px;
    object-fit: cover;
    object-position: left;
}

.brand-logo {
    padding: 12px 23px;
}

.sidebar-nav ul .sidebar-item .sidebar-link iconify-icon {
    font-size: 24px;
}

[data-layout=vertical] .link-sidebar .left-sidebar .btn-support-fixed {
    display: block;
    position: absolute;
    bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
}

[data-layout=vertical] .link-sidebar .scroll-sidebar {
    height: calc(100vh - 166px);
    box-shadow: inset 0px -4px 10px -5px rgba(0, 0, 0, 0.1);
}

@media (min-width: 1300px) {
    html[data-layout=vertical] .link-sidebar[data-sidebartype=mini-sidebar].link-sidebar .left-sidebar {
        width: 88px;
    }
}

@keyframes widen {
    from {
        width: 60px;
    }

    to {
        width: 178px;
    }
}

html[data-layout=vertical] .link-sidebar[data-sidebartype=mini-sidebar].link-sidebar .left-sidebar:hover .logo-header img {
    animation: widen 0.2s ease-in forwards;
}

html[data-layout=vertical] .link-sidebar[data-sidebartype=mini-sidebar].link-sidebar .left-sidebar:not(:hover) .btn-support-fixed a span {
    display: none;
}

html[data-layout=vertical] .link-sidebar[data-sidebartype=mini-sidebar].link-sidebar .left-sidebar:not(:hover) .btn-support-fixed a {
    --bs-btn-padding-x: 10px;
    --bs-btn-padding-y: 10px;
    line-height: 1;
}

html[data-layout=vertical] .link-sidebar[data-sidebartype=mini-sidebar].link-sidebar .left-sidebar:hover .btn-support-fixed a i {
    display: none;
}

html[data-layout=vertical] .link-sidebar:not([data-sidebartype=mini-sidebar]) .left-sidebar .btn-support-fixed a i {
    display: none;
}



.sidebar-nav .has-arrow[aria-expanded=true]::after,
.sidebar-nav li.active>.has-arrow::after,
.sidebar-nav li>.has-arrow.active::after,
.sidebar-nav ul .sidebar-item .sidebar-link.active:hover.has-arrow::after {
    border-color: #fff;
}

.sidebar-nav ul .sidebar-item .sidebar-link {
    font-weight: 500;
    margin-bottom: 2px;
    padding: 8px 16px;
    font-size: 16px;
}

.sidebar-nav ul .sidebar-item .sidebar-link:not(.active):hover {
    color: var(--brand-dark);
}

.sidebar-nav ul .sidebar-item .sidebar-link.active:hover {
    color: #ffffff;
}

.sidebar-nav ul .sidebar-item.selected .sidebar-link:not(.active):hover {
    color: #ffffff;
}

.sidebar-nav ul .sidebar-item.selected>.sidebar-link,
.sidebar-nav ul .sidebar-item.selected>.sidebar-link.active,
.sidebar-nav ul .sidebar-item>.sidebar-link.active {
    background-color: var(--brand-dark);
    color: #fff;
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-item>.sidebar-link {
    padding: 4px 21px;
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link {
    border: 1px solid transparent;
    border-radius: 50px;
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link:hover {
    border: 1px solid var(--brand-accent);
    color: var(--brand-accent-strong);
}

.sidebar-nav ul .sidebar-item.selected .sidebar-link.has-arrow::after {
    border-color: #ffffff;
}



.form-control::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #bbbbbb;
    opacity: 0.3;
}

.form-control::-moz-placeholder {
    /* Firefox 19+ */
    color: #bbbbbb;
    opacity: 0.3;
}

.form-control:-ms-input-placeholder {
    /* IE 10+ */
    color: #bbbbbb;
    opacity: 0.3;
}

.form-control:-moz-placeholder {
    /* Firefox 18- */
    color: #bbbbbb;
    opacity: 0.3;
}

.card-page {
    min-height: 64vh;
    display: flex;
    justify-content: center;
    flex-direction: row;
    align-content: center;
    align-items: center;
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link:hover .icon-small {
    background: var(--brand-accent);
}

.icon-logoff {
    background-color: transparent;
    border: 1px solid var(--brand-dark);
    border-radius: 100px;
    padding: 5px;
    line-height: 0px !important
}

.icon-logoff iconify-icon {
    color: var(--brand-dark);
}

.icon-logoff:hover {
    background-color: var(--brand-accent);
    border: 1px solid var(--brand-accent);
    border-radius: 100px;
    padding: 5px;
    line-height: 0px !important
}

.icon-logoff:hover iconify-icon {
    color: #ffffff;
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link.active .icon-small {
    background: var(--brand-accent);
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link.active {
    background-color: transparent !important;
    color: var(--brand-accent-strong) !important;
    border-color: var(--brand-accent) !important;
}

.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: unset;
    border: unset;
}

.dataTables_wrapper .row.align-items-center.mt-3 {
    justify-content: center;
}

.dataTables_wrapper .row.align-items-center.mt-3 > .col-sm-12:first-child:empty {
    display: none;
}

.dataTables_wrapper .row.align-items-center.mt-3 > .col-sm-12:last-child {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
}

.dataTables_wrapper .dataTables_paginate,
.app-server-pagination {
    display: flex;
    justify-content: center !important;
    margin-top: 1rem;
    width: 100%;
}

.dataTables_wrapper .dataTables_paginate .pagination,
.app-server-pagination .pagination {
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: center !important;
    margin: 0;
}

.dataTables_wrapper .dataTables_paginate .page-item,
.app-server-pagination .page-item {
    margin: 0;
}

.dataTables_wrapper .dataTables_paginate .page-link,
.app-server-pagination .page-link {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(8, 27, 64, 0.1);
    border-radius: 999px !important;
    box-shadow: 0 5px 14px rgba(8, 27, 64, 0.06);
    color: #334155;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    line-height: 1;
    min-width: 38px;
    padding: 0 0.9rem;
}

.dataTables_wrapper .dataTables_paginate .page-item.active .page-link,
.app-server-pagination .page-item.active .page-link {
    background: var(--brand-dark);
    border-color: var(--brand-dark);
    color: #fff;
}

.dataTables_wrapper .dataTables_paginate .page-item.disabled .page-link,
.app-server-pagination .page-item.disabled .page-link {
    background: var(--brand-surface-soft);
    border-color: transparent;
    box-shadow: none;
    color: #94a3b8;
    opacity: 1;
}

.btn-primary,
.btn-secondary,
.btn-success,
.btn-info,
.btn-dark,
.btn-danger,
.btn-warning {
    --bs-btn-bg: var(--brand-dark);
    --bs-btn-border-color: var(--brand-dark);
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: var(--brand-dark-strong);
    --bs-btn-hover-border-color: var(--brand-dark-strong);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--brand-dark-strong);
    --bs-btn-active-border-color: var(--brand-dark-strong);
    --bs-btn-active-color: #fff;
    --bs-btn-disabled-bg: var(--brand-dark);
    --bs-btn-disabled-border-color: var(--brand-dark);
    --bs-btn-disabled-color: #fff;
    --bs-btn-focus-shadow-rgb: var(--brand-dark-rgb);
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-info,
.btn-outline-dark,
.btn-outline-light,
.btn-outline-danger,
.btn-outline-warning {
    --bs-btn-color: var(--brand-dark);
    --bs-btn-border-color: var(--brand-dark);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-dark);
    --bs-btn-hover-border-color: var(--brand-dark);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-dark-strong);
    --bs-btn-active-border-color: var(--brand-dark-strong);
    --bs-btn-disabled-color: var(--brand-dark);
    --bs-btn-disabled-border-color: var(--brand-dark);
    --bs-btn-focus-shadow-rgb: var(--brand-dark-rgb);
}

.btn-primary,
.btn-secondary,
.btn-success,
.btn-info,
.btn-dark,
.btn-danger,
.btn-warning {
    background-color: var(--brand-dark) !important;
    border-color: var(--brand-dark) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active,
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: var(--brand-dark-strong) !important;
    border-color: var(--brand-dark-strong) !important;
    color: #ffffff !important;
}

.btn-primary.disabled,
.btn-primary:disabled,
.btn-secondary.disabled,
.btn-secondary:disabled,
.btn-success.disabled,
.btn-success:disabled,
.btn-info.disabled,
.btn-info:disabled,
.btn-dark.disabled,
.btn-dark:disabled,
.btn-danger.disabled,
.btn-danger:disabled,
.btn-warning.disabled,
.btn-warning:disabled {
    background-color: var(--brand-dark) !important;
    border-color: var(--brand-dark) !important;
    color: #ffffff !important;
    opacity: .65;
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-info,
.btn-outline-dark,
.btn-outline-light,
.btn-outline-danger,
.btn-outline-warning {
    background-color: transparent !important;
    border-color: var(--brand-dark) !important;
    color: var(--brand-dark) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active,
.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active,
.btn-outline-info:hover,
.btn-outline-info:focus,
.btn-outline-info:active,
.btn-outline-dark:hover,
.btn-outline-dark:focus,
.btn-outline-dark:active,
.btn-outline-light:hover,
.btn-outline-light:focus,
.btn-outline-light:active,
.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-outline-danger:active,
.btn-outline-warning:hover,
.btn-outline-warning:focus,
.btn-outline-warning:active {
    background-color: var(--brand-dark) !important;
    border-color: var(--brand-dark) !important;
    color: #ffffff !important;
}

.text-primary {
    color: var(--brand-accent-strong) !important;
}

.bg-primary,
.btn-check:checked + .btn-outline-primary,
.btn-check:active + .btn-outline-primary,
.show > .btn-outline-primary.dropdown-toggle {
    background-color: var(--brand-accent) !important;
    border-color: var(--brand-accent) !important;
}

.bg-primary-subtle {
    background-color: var(--brand-accent-soft) !important;
}

.border-primary {
    border-color: rgba(var(--brand-accent-rgb), 0.32) !important;
}

.form-check-input:checked,
.form-check-input[type=checkbox]:indeterminate {
    background-color: var(--brand-accent);
    border-color: var(--brand-accent);
}

.form-check-input:focus,
.form-control:focus,
.form-select:focus,
.btn:focus,
.btn-close:focus,
.page-link:focus {
    border-color: rgba(var(--brand-accent-rgb), 0.35);
    box-shadow: 0 0 0 .2rem rgba(var(--brand-accent-rgb), 0.14) !important;
}

.app-home-balance {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    background: linear-gradient(135deg, #fffdfb 0%, #ffffff 56%, #f2f7eb 100%);
    box-shadow: 0 10px 24px rgba(36, 48, 74, 0.06);
}

.app-home-balance__content {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 0;
}

.app-home-balance__summary {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.app-home-balance__eyebrow {
    color: #9b7a55;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 0;
}

.app-home-balance__headline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 14px;
}

.app-home-balance__amount {
    color: #4c5567;
    font-size: clamp(1.55rem, 2.5vw, 2.2rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
}

.app-home-balance__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    color: #7c8494;
    font-size: 0.82rem;
}

.app-home-balance__meta-label {
    color: #6f7685;
    font-weight: 600;
}

.app-home-balance__chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    background: #eef7df;
    color: #2f7a0f;
    font-weight: 700;
}

.app-home-balance__actions {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.app-home-balance__btn {
    --bs-btn-padding-y: 0.5rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-font-size: 0.875rem;
    --bs-btn-line-height: 1.5;
    min-height: 38px;
}

.app-admin-home-hero {
    border-radius: 20px;
    background:
        radial-gradient(circle at top left, rgba(59, 130, 246, 0.16), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f7f9fc 56%, #eef4fb 100%);
    box-shadow: 0 10px 24px rgba(36, 48, 74, 0.06);
}

.app-admin-home-hero__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.app-admin-home-hero__summary {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.app-admin-home-hero__eyebrow {
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 0;
}

.app-admin-home-hero__headline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 14px;
}

.app-admin-home-hero__amount {
    color: #0f172a;
    font-size: clamp(1.7rem, 2.8vw, 2.45rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
}

.app-admin-home-hero__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    color: #64748b;
    font-size: 0.82rem;
}

.app-admin-home-hero__meta-label {
    color: #64748b;
    font-weight: 600;
}

.app-admin-home-hero__chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.05);
    color: #0f172a;
    font-weight: 700;
}

.app-admin-home-hero__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.app-admin-home-hero__btn {
    --bs-btn-padding-y: 0.5rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-font-size: 0.875rem;
    --bs-btn-line-height: 1.5;
    min-height: 38px;
}

.app-admin-home-stat .card-body {
    padding: 0.95rem 1rem 0.82rem;
}

.app-admin-home-stat__row {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.app-admin-home-stat__icon {
    width: 50px;
    height: 50px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.28rem;
    flex-shrink: 0;
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.app-admin-home-stat__icon--accounts {
    background: rgba(59, 130, 246, 0.11);
    color: #2563eb;
}

.app-admin-home-stat__icon--deposits {
    background: rgba(34, 197, 94, 0.11);
    color: #15803d;
}

.app-admin-home-stat__icon--withdrawals {
    background: rgba(245, 158, 11, 0.12);
    color: #b45309;
}

.app-admin-home-stat__content {
    min-width: 0;
    flex: 1 1 auto;
}

.app-admin-home-stat__content strong {
    display: block;
    font-size: 1.9rem;
    line-height: 1;
    font-weight: 800;
    color: #0f172a;
}

.app-admin-home-stat__content span {
    display: block;
    margin-top: 0.3rem;
    font-size: 0.86rem;
    font-weight: 600;
    color: #475569;
}

.app-admin-home-stat__footer {
    margin-top: 0.78rem;
    padding-top: 0.68rem;
    border-top: 1px solid rgba(15, 23, 42, 0.06);
}

.app-admin-home-stat__footer small {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: #64748b;
}

.app-customer-chart-card,
.app-customer-month-card {
    border: 1px solid rgba(201, 184, 160, 0.18);
    box-shadow: 0 10px 24px rgba(36, 48, 74, 0.045);
}

.app-customer-chart-card h5,
.app-customer-month-card h5 {
    line-height: 1.15;
}

.app-customer-chart-card .text-muted,
.app-customer-month-card .text-muted {
    font-size: 0.8rem;
    line-height: 1.2;
}

.app-customer-chart-card .card-body,
.app-customer-month-card .card-body {
    padding: 0.95rem 1rem 0.88rem;
}

.app-customer-chart-wrap {
    position: relative;
    border-radius: 16px;
    background: linear-gradient(180deg, #fffefd 0%, #fbfcfe 100%);
    border: 1px solid rgba(15, 23, 42, 0.06);
    padding: 0.12rem 0.2rem 0.02rem;
}

.app-customer-chart-svg {
    width: 100%;
    height: auto;
    display: block;
}

.app-customer-chart-grid {
    stroke: rgba(15, 23, 42, 0.1);
}

.app-customer-chart-axis {
    stroke: rgba(15, 23, 42, 0.16);
}

.app-customer-chart-line {
    fill: none;
    stroke-width: 2.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.app-customer-chart-line--transactions {
    stroke-width: 3.4;
}

.app-customer-chart-dot {
    stroke: #fff;
    stroke-width: 2;
}

.app-customer-chart-legend {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.28rem 0.62rem;
    width: 100%;
}

.app-customer-chart-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: #243247;
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.2;
}

.app-customer-chart-y-label,
.app-customer-chart-axis-label {
    fill: rgba(8, 27, 64, 0.7);
    font-size: 12px;
}

.app-customer-chart-legend i,
.app-customer-month-item__dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    display: inline-block;
    flex: 0 0 auto;
}

.app-customer-tone-completed {
    background: #2f7a0f;
}

.app-customer-tone-canceled {
    background: #dc2626;
}

.app-customer-tone-transactions {
    background: #6d5efc;
}

.app-customer-month-list {
    display: grid;
    gap: 0.4rem;
}

.app-customer-month-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    padding: 0.64rem 0.78rem;
    border-radius: 12px;
    background: linear-gradient(180deg, #fffefd 0%, #ffffff 100%);
    border: 1px solid rgba(15, 23, 42, 0.06);
}

.app-customer-month-item__label {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    color: #5c6270;
    font-size: 0.8rem;
    font-weight: 600;
}

.app-customer-month-item strong {
    color: #081b40;
    font-size: 0.94rem;
    line-height: 1;
}

.app-customer-op-id {
    color: inherit;
    font-weight: 600;
    letter-spacing: 0.01em;
    text-decoration: none;
}

.app-customer-op-id:hover,
.app-customer-op-id:focus {
    color: inherit;
    text-decoration: none;
}

.app-customer-type-badge {
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.2;
    padding: 0.28rem 0.6rem;
}

.app-customer-type-badge--deposit {
    background: transparent;
    border: 1px solid rgba(101, 163, 13, 0.55);
    color: #4d7c0f;
}

.app-customer-type-badge--withdrawal {
    background: transparent;
    border: 1px solid rgba(37, 99, 235, 0.5);
    color: #1d4ed8;
}

.app-customer-op-row {
    cursor: pointer;
}

.app-customer-op-row:hover td,
.app-customer-op-row:focus td {
    background: rgba(101, 163, 13, 0.04);
}

.app-customer-op-date {
    padding-right: 1.5rem !important;
    position: relative;
}

.app-customer-op-row .app-customer-op-date::after {
    color: #9ca3af;
    content: "\203A";
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    position: absolute;
    right: 0.55rem;
    top: 50%;
    transform: translateY(-50%);
}

.app-customer-op-row:hover .app-customer-op-date::after,
.app-customer-op-row:focus .app-customer-op-date::after {
    color: #111827;
}

.app-statement-table thead th {
    background: #243447;
    color: #f8fafc;
    border-bottom-color: #243447;
    font-size: 0.86rem;
    font-weight: 600;
}

.app-statement-table thead th:first-child {
    border-top-left-radius: 12px;
}

.app-statement-table thead th:last-child {
    border-top-right-radius: 12px;
}

.app-statement-mobile-date {
    color: #64748b;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    margin: 1rem 0.2rem 0.55rem;
    text-transform: uppercase;
}

.app-statement-mobile-date:first-child {
    margin-top: 0;
}

.app-statement-mobile-item,
.app-statement-future-item {
    align-items: center;
    background: #f8fafc;
    border: 1px solid rgba(8, 27, 64, 0.065);
    border-radius: 18px;
    color: #0f172a;
    display: grid;
    gap: 11px;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    margin-bottom: 0.55rem;
    min-height: 72px;
    padding: 12px;
    text-decoration: none;
}

.app-statement-mobile-item:active {
    background: #f1f5f9;
}

.app-statement-mobile-item:focus-visible {
    box-shadow: 0 0 0 3px rgba(var(--brand-accent-rgb), 0.18);
    outline: 0;
}

.app-statement-mobile-icon {
    align-items: center;
    border-radius: 15px;
    display: inline-flex;
    font-size: 1.15rem;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.app-statement-mobile-icon.is-in {
    background: rgba(15, 159, 110, 0.1);
    color: #0f9f6e;
}

.app-statement-mobile-icon.is-out {
    background: rgba(208, 79, 52, 0.1);
    color: #d04f34;
}

.app-statement-mobile-icon.is-future {
    background: rgba(var(--brand-accent-rgb), 0.11);
    color: var(--brand-accent-strong);
}

.app-statement-mobile-copy,
.app-statement-mobile-value {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.app-statement-mobile-copy strong {
    color: #0f172a;
    font-size: 0.88rem;
    line-height: 1.3;
}

.app-statement-mobile-copy small {
    color: #64748b;
    font-size: 0.72rem;
    line-height: 1.3;
    margin-top: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-statement-mobile-value {
    align-items: flex-end;
    text-align: right;
}

.app-statement-mobile-value strong,
.app-statement-future-value {
    color: #0f172a;
    font-size: 0.82rem;
    white-space: nowrap;
}

.app-statement-mobile-value.is-in strong {
    color: #087c58;
}

.app-statement-mobile-value.is-out strong {
    color: #b83e2b;
}

.app-statement-mobile-value small {
    color: #64748b;
    font-size: 0.68rem;
    margin-top: 3px;
}

.app-statement-mobile-value small.completed,
.app-statement-mobile-value small.approved {
    color: #087c58;
}

.app-statement-mobile-value small.pending,
.app-statement-mobile-value small.processing,
.app-statement-mobile-value small.scheduled,
.app-statement-mobile-value small.waiting_account_approval {
    color: #b86b11;
}

.app-statement-mobile-value small.failed,
.app-statement-mobile-value small.rejected,
.app-statement-mobile-value small.canceled,
.app-statement-mobile-value small.cancelled {
    color: #b83e2b;
}

.app-statement-mobile-empty {
    align-items: center;
    color: #64748b;
    display: flex;
    flex-direction: column;
    padding: 2rem 1rem;
    text-align: center;
}

.app-statement-mobile-empty-icon {
    align-items: center;
    background: rgba(var(--brand-accent-rgb), 0.09);
    border-radius: 18px;
    color: var(--brand-accent-strong);
    display: inline-flex;
    font-size: 1.5rem;
    height: 54px;
    justify-content: center;
    margin-bottom: 0.75rem;
    width: 54px;
}

.app-statement-mobile-empty strong {
    color: #0f172a;
    font-size: 0.92rem;
}

.app-statement-mobile-empty small {
    font-size: 0.76rem;
    margin-top: 0.25rem;
}

.app-statement-empty-state {
    align-items: center;
    color: #64748b;
    flex-direction: column;
    justify-content: center;
    min-height: 230px;
    padding: 2.5rem 1rem;
    text-align: center;
}

.app-statement-empty-state__icon {
    align-items: center;
    background: rgba(var(--brand-accent-rgb), 0.09);
    border-radius: 18px;
    color: var(--brand-accent-strong);
    display: inline-flex;
    font-size: 1.5rem;
    height: 54px;
    justify-content: center;
    margin-bottom: 0.75rem;
    width: 54px;
}

.app-statement-empty-state strong {
    color: #0f172a;
    font-size: 0.94rem;
}

.app-statement-empty-state small {
    font-size: 0.78rem;
    margin-top: 0.3rem;
    max-width: 36rem;
}

.app-statement-future-mobile {
    margin-top: 0.25rem;
}

.app-statement-future-item:last-child,
.app-statement-mobile-item:last-child {
    margin-bottom: 0;
}

.app-admin-statement-shell .card-body {
    padding-top: 1rem;
}

.app-admin-statement-filters {
    padding: 0.15rem 0.1rem 0.85rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.app-admin-statement-filters .form-label {
    font-size: 0.8rem;
    font-weight: 700;
    color: #64748b;
}

.app-admin-statement-account {
    color: #334155;
    font-size: 0.84rem;
    font-weight: 600;
}

@media (max-width: 991.98px) {
    .app-home-balance__content {
        align-items: flex-start;
        flex-direction: column;
        padding: 0;
    }

    .app-home-balance__headline {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .app-home-balance__actions {
        justify-content: flex-start;
    }

    .app-admin-home-hero__content {
        align-items: flex-start;
        flex-direction: column;
    }

    .app-admin-home-hero__headline {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .app-admin-home-hero__actions {
        justify-content: flex-start;
    }

    .app-customer-chart-legend {
        justify-content: flex-start;
    }
}

@media (max-width: 575.98px) {
    .app-home-balance__actions .btn {
        width: 100%;
    }

    .app-admin-home-hero__actions .btn {
        width: 100%;
    }

    .app-customer-chart-card .card-body,
    .app-customer-month-card .card-body {
        padding: 0.8rem;
    }

    .app-customer-month-item {
        padding: 0.58rem 0.68rem;
    }
}

/* Aplicativo instalável do cliente */
.app-pwa-install {
    align-items: center;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(8, 27, 64, 0.12);
    border-radius: 22px;
    bottom: max(20px, env(safe-area-inset-bottom));
    box-shadow: 0 24px 60px rgba(8, 27, 64, 0.2);
    display: grid;
    gap: 0.85rem;
    grid-template-columns: auto minmax(0, 1fr);
    max-width: 440px;
    opacity: 0;
    padding: 1rem;
    position: fixed;
    right: 20px;
    transform: translateY(18px);
    transition: opacity 0.2s ease, transform 0.2s ease;
    width: calc(100% - 40px);
    z-index: 1095;
}

.app-pwa-install[hidden] {
    display: none;
}

.app-pwa-install.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.app-pwa-install-icon {
    align-items: center;
    align-self: start;
    background: linear-gradient(145deg, #081b40, #0b3977);
    border-radius: 16px;
    color: #fff;
    display: inline-flex;
    font-size: 1.35rem;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.app-pwa-install-copy {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.app-pwa-install-copy strong {
    color: #081b40;
    font-size: 0.94rem;
}

.app-pwa-install-copy span {
    color: #64748b;
    font-size: 0.8rem;
    line-height: 1.45;
}

.app-pwa-install-actions {
    display: flex;
    gap: 0.45rem;
    grid-column: 2;
}

.app-pwa-install-actions .btn {
    border-radius: 999px;
    min-height: 38px;
    padding-left: 1rem;
    padding-right: 1rem;
}

.app-pwa-install-actions .btn-link {
    color: #64748b;
    text-decoration: none;
}

.app-offline-badge {
    align-items: center;
    background: #7c2d12;
    border-radius: 999px;
    box-shadow: 0 10px 28px rgba(124, 45, 18, 0.24);
    color: #fff;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 700;
    gap: 0.45rem;
    left: 50%;
    padding: 0.55rem 0.9rem;
    position: fixed;
    top: max(12px, env(safe-area-inset-top));
    transform: translateX(-50%);
    z-index: 1100;
}

.app-offline-badge[hidden] {
    display: none;
}

/* Navegação principal do aplicativo do cliente */
.app-customer-mobile-nav {
    display: none;
}

@media (max-width: 767.98px) {
    .app-customer-shell .topbar {
        min-height: calc(70px + env(safe-area-inset-top));
        padding-top: env(safe-area-inset-top);
    }

    .app-customer-shell .body-wrapper {
        padding-top: max(96px, calc(84px + env(safe-area-inset-top))) !important;
    }

    .app-customer-shell .body-wrapper > .container-fluid {
        padding-bottom: calc(104px + env(safe-area-inset-bottom));
    }

    .app-customer-mobile-nav {
        bottom: 0;
        display: block;
        left: 50%;
        max-width: 560px;
        padding: 0;
        pointer-events: none;
        position: fixed;
        transform: translateX(-50%);
        width: 100%;
        z-index: 1035;
    }

    .app-customer-mobile-nav__inner {
        align-items: stretch;
        background: rgba(255, 255, 255, 0.96);
        border-top: 1px solid rgba(8, 27, 64, 0.07);
        box-shadow: 0 -12px 30px rgba(8, 27, 64, 0.08);
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        padding: 8px 10px max(8px, env(safe-area-inset-bottom));
        pointer-events: auto;
        width: 100%;
    }

    .app-customer-mobile-nav__item {
        align-items: center;
        appearance: none;
        background: transparent;
        border: 0;
        border-radius: 15px;
        color: #8090a6;
        display: flex;
        flex-direction: column;
        font-family: inherit;
        font-size: 0.68rem;
        font-weight: 700;
        gap: 3px;
        justify-content: center;
        line-height: 1.1;
        min-height: 54px;
        min-width: 0;
        padding: 0;
        text-align: center;
        text-decoration: none;
        transition: background-color .18s ease, color .18s ease, transform .18s ease;
    }

    .app-customer-mobile-nav__item:hover,
    .app-customer-mobile-nav__item:focus,
    .app-customer-mobile-nav__item:active {
        color: var(--brand-dark);
        text-decoration: none;
    }

    .app-customer-mobile-nav__item:focus-visible {
        box-shadow: 0 0 0 3px rgba(var(--brand-accent-rgb), 0.2);
        outline: 0;
    }

    .app-customer-mobile-nav__item.is-active {
        background: rgba(23, 105, 255, 0.08);
        color: #1769ff;
    }

    .app-customer-mobile-nav__icon {
        align-items: center;
        display: inline-flex;
        font-size: 1.35rem;
        height: auto;
        justify-content: center;
        line-height: 1;
    }

    .app-customer-mobile-nav__button {
        cursor: pointer;
    }

    .app-customer-shell .app-page-intro {
        margin-bottom: 0.9rem;
        padding-left: 0.15rem !important;
        padding-right: 0.15rem !important;
    }

    .app-customer-shell .app-page-intro h3 {
        font-size: 1.42rem;
        line-height: 1.2;
    }

    .app-customer-shell .app-page-intro p {
        font-size: 0.9rem;
        line-height: 1.45;
    }

    .app-customer-shell .app-page-intro > .btn,
    .app-customer-shell .app-page-intro > a.btn {
        width: 100%;
    }

    .app-customer-shell .app-table-hero .card-body {
        padding: 1rem !important;
    }

    .app-customer-shell .app-table-hero .card-body > .d-flex {
        align-items: flex-start !important;
    }

    .app-customer-shell .app-table-hero .card-body > .d-flex > .d-flex:first-child {
        align-items: flex-start !important;
        min-width: 0;
    }

    .app-customer-shell .app-table-hero .icon-wrap {
        border-radius: 14px;
        flex: 0 0 auto;
        height: 44px;
        width: 44px;
    }

    .app-customer-shell .app-table-hero h4 {
        font-size: 1.3rem;
        line-height: 1.2;
    }

    .app-customer-shell .app-table-hero p {
        font-size: 0.88rem;
        line-height: 1.4;
    }

    .app-customer-shell .app-table-hero .card-body > .d-flex > .btn,
    .app-customer-shell .app-table-hero .card-body > .d-flex > a.btn {
        width: 100%;
    }

    .app-customer-shell .card-body > form > button[type="submit"].btn {
        width: 100%;
    }

    .app-customer-shell .form-control:not(.form-control-sm),
    .app-customer-shell .form-select:not(.form-select-sm) {
        min-height: 46px;
    }

    .app-customer-shell .table-responsive {
        border-radius: 14px;
        overscroll-behavior-inline: contain;
    }

    .app-customer-shell .app-customer-chart-wrap {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scrollbar-color: rgba(var(--brand-dark-rgb), 0.28) transparent;
        scrollbar-width: thin;
    }

    .app-customer-shell .app-customer-chart-wrap:focus-visible {
        box-shadow: 0 0 0 3px rgba(var(--brand-accent-rgb), 0.18);
        outline: 0;
    }

    .app-customer-chart-hint {
        align-items: center;
        color: var(--brand-accent-strong);
        display: inline-flex;
        font-size: 0.75rem;
        font-weight: 700;
        gap: 0.2rem;
        margin-top: 0.45rem;
    }

    .app-customer-shell .app-customer-chart-svg {
        min-width: 590px;
    }

    .app-customer-shell .app-pwa-install {
        bottom: calc(82px + env(safe-area-inset-bottom));
    }

    .app-page-shell .body-wrapper > .container-fluid {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .app-page-shell .card,
    .app-page-shell .app-shell-card {
        border-radius: 18px;
    }

    .app-page-shell .card-body {
        padding: 1rem;
    }

    .app-page-shell .btn:not(.btn-sm):not(.btn-action-icon) {
        min-height: 44px;
    }

    .app-page-shell .app-header-bell .nav-link {
        height: 40px;
        width: 40px;
    }

    .app-page-shell .app-profile-pill {
        gap: 0;
        padding: 0.25rem;
    }

    .app-page-shell .app-profile-avatar {
        height: 38px;
        width: 38px;
    }

    .auth-wrapper {
        padding: 0.75rem !important;
    }

    .auth-shell {
        border-radius: 22px !important;
    }

    .auth-panel {
        padding: 1.35rem !important;
    }

    .app-pwa-install {
        bottom: max(12px, env(safe-area-inset-bottom));
        left: 12px;
        right: 12px;
        width: auto;
    }
}

@media (max-width: 399.98px) {
    .app-statement-mobile-item,
    .app-statement-future-item {
        gap: 8px;
        grid-template-columns: 40px minmax(0, 1fr) auto;
        padding: 10px;
    }

    .app-statement-mobile-icon {
        height: 40px;
        width: 40px;
    }

    .app-statement-mobile-value strong,
    .app-statement-future-value {
        font-size: 0.76rem;
    }

    .app-pwa-install {
        grid-template-columns: 42px minmax(0, 1fr);
        padding: 0.85rem;
    }

    .app-pwa-install-icon {
        border-radius: 14px;
        height: 42px;
        width: 42px;
    }

    .app-pwa-install-actions {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }
}

@media (prefers-reduced-motion: reduce) {
    .app-pwa-install,
    .app-navigation-loader,
    .app-navigation-loader__mark::before {
        animation: none;
        transition: none;
    }
}
html.app-zoom-locked,
html.app-zoom-locked body {
    -webkit-text-size-adjust: 100%;
    overscroll-behavior: none;
    touch-action: pan-x pan-y;
}

@media (max-width: 767.98px) {
    html.app-zoom-locked input,
    html.app-zoom-locked select,
    html.app-zoom-locked textarea {
        font-size: 16px !important;
    }
}

/* Tabelas administrativas em telas compactas */
.app-admin-table-hint {
    align-items: center;
    color: #64748b;
    display: none;
    font-size: 0.76rem;
    font-weight: 700;
    gap: 0.35rem;
    justify-content: center;
    margin-top: 0.6rem;
    text-align: center;
}

@media (max-width: 767.98px) {
    .app-admin-shell,
    .app-admin-shell .page-wrapper,
    .app-admin-shell .body-wrapper,
    .app-admin-shell .body-wrapper > .container-fluid,
    .app-admin-shell .card,
    .app-admin-shell .card-body,
    .app-admin-shell .dataTables_wrapper {
        max-width: 100%;
        min-width: 0;
    }

    .app-admin-shell .app-table-shell .row > [class*="col-"] {
        min-width: 0;
    }

    .app-admin-shell .app-table-shell .row.align-items-center.mb-4 .d-flex {
        flex-direction: column;
        width: 100%;
    }

    .app-admin-shell .app-table-shell .row.align-items-center.mb-4 .d-flex > .btn,
    .app-admin-shell .app-table-shell .row.align-items-center.mb-4 .d-flex > a.btn,
    .app-admin-shell .app-table-shell .row.align-items-center.mb-4 .d-flex > .form-select {
        width: 100%;
    }

    .app-admin-shell .app-admin-table-scroll {
        -webkit-overflow-scrolling: touch;
        border: 1px solid #e2e8f0;
        border-radius: 14px;
        max-width: 100%;
        overflow-x: auto !important;
        overflow-y: hidden;
        overscroll-behavior-inline: contain;
        scrollbar-color: rgba(var(--brand-dark-rgb), 0.3) transparent;
        scrollbar-width: thin;
        width: 100%;
    }

    .app-admin-shell .app-admin-table-scroll:focus-visible {
        box-shadow: 0 0 0 3px rgba(var(--brand-accent-rgb), 0.16);
        outline: 0;
    }

    .app-admin-shell .app-admin-table-scroll > table,
    .app-admin-shell .app-admin-table-scroll .dataTables_wrapper table {
        margin-bottom: 0 !important;
        min-width: 100%;
        width: max-content !important;
    }

    .app-admin-shell .app-admin-table-scroll table > :not(caption) > * > * {
        max-width: 300px;
        min-width: max-content;
        white-space: nowrap;
    }

    .app-admin-shell .app-admin-table-scroll table td .fw-semibold,
    .app-admin-shell .app-admin-table-scroll table td .text-muted,
    .app-admin-shell .app-admin-table-scroll table td .small {
        overflow-wrap: anywhere;
        white-space: normal;
    }

    .app-admin-shell .app-admin-table-scroll table td .btn,
    .app-admin-shell .app-admin-table-scroll table td .app-badge,
    .app-admin-shell .app-admin-table-scroll table td .app-badge-soft,
    .app-admin-shell .app-admin-table-scroll table td .app-status-badge {
        white-space: nowrap;
    }

    .app-admin-shell .app-admin-table-scroll.is-overflowing + .app-admin-table-hint:not([hidden]) {
        display: flex;
    }

    .app-admin-shell .dataTables_wrapper .row.align-items-center.mt-3 {
        margin-left: 0;
        margin-right: 0;
        min-width: min(100%, 320px);
    }

    .app-admin-shell .dataTables_wrapper .dataTables_paginate .pagination,
    .app-admin-shell .app-server-pagination .pagination {
        flex-wrap: nowrap;
        max-width: 100%;
    }

    .app-admin-shell .dataTables_wrapper .dataTables_paginate .page-link,
    .app-admin-shell .app-server-pagination .page-link {
        min-width: 34px;
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }
}
