:root {
    --app-bg: #f4f6f8;
    --ink: #172033;
    --muted: #667085;
    --line: #e4e7ec;
    --border: var(--line);
    --panel: #ffffff;
    --surface-soft: #f8fafc;
    --sidebar: #0f1f1c;
    --sidebar-soft: #193630;
    --brand: #146c5c;
    --brand-2: #e9b44c;
    --danger-soft: #fff1f0;
    --success-soft: #edf8f3;
}

body {
    background: var(--app-bg);
    color: var(--ink);
    font-size: 14px;
}

body.theme-dark {
    --app-bg: #101614;
    --ink: #edf4f1;
    --muted: #9aa8a3;
    --line: #24332e;
    --border: var(--line);
    --panel: #15211d;
    --surface-soft: #14251f;
    --sidebar: #07120f;
    --sidebar-soft: #193630;
    --bs-body-color: var(--ink);
    --bs-body-bg: var(--app-bg);
    --bs-heading-color: #f5faf8;
    --bs-secondary-color: #b7c5c0;
    --bs-tertiary-color: #9eaea8;
    --bs-border-color: var(--line);
}

body.theme-dark h1,
body.theme-dark h2,
body.theme-dark h3,
body.theme-dark h4,
body.theme-dark h5,
body.theme-dark h6,
body.theme-dark .h1,
body.theme-dark .h2,
body.theme-dark .h3,
body.theme-dark .h4,
body.theme-dark .h5,
body.theme-dark .h6,
body.theme-dark strong,
body.theme-dark .fw-bold,
body.theme-dark .fw-semibold {
    color: #f5faf8;
}

body.theme-dark .app-header,
body.theme-dark .topbar,
body.theme-dark .card,
body.theme-dark .ui-panel {
    background: var(--panel);
    color: var(--ink);
}

body.theme-dark .card-body,
body.theme-dark .card-header,
body.theme-dark .card-footer,
body.theme-dark .content-wrap,
body.theme-dark .modal-body {
    color: var(--ink);
}

body.theme-dark .app-search,
body.theme-dark .app-icon-btn:hover,
body.theme-dark .app-icon-btn:focus,
body.theme-dark .metric-icon {
    background: #1d2c27;
}

body.theme-dark .app-search input,
body.theme-dark .form-control,
body.theme-dark .form-select {
    color: var(--ink);
}

body.theme-dark .input-group-text {
    color: #d7e3df;
    background: #1d3029;
    border-color: #31443d;
}

body.theme-dark .form-control:disabled,
body.theme-dark .form-control[readonly],
body.theme-dark .form-select:disabled {
    color: #c5d3ce;
    background: #1b2a25;
    opacity: 1;
}

body.theme-dark .form-control,
body.theme-dark .form-select,
body.theme-dark .choices__inner {
    background: #17241f;
    border-color: #31443d;
}

body.theme-dark .form-select option {
    color: #edf4f1;
    background: #17241f;
}

body.theme-dark .text-secondary,
body.theme-dark .text-muted,
body.theme-dark .small,
body.theme-dark .page-kicker,
body.theme-dark .form-label,
body.theme-dark .section-title,
body.theme-dark .dt-info,
body.theme-dark .dt-length label,
body.theme-dark .dt-search label {
    color: #c2d0ca !important;
}

body.theme-dark .dropdown-menu {
    color: var(--ink);
    background: #17241f;
    border-color: #31443d;
}

body.theme-dark .dropdown-item {
    color: #e6efec;
}

body.theme-dark .dropdown-item:hover,
body.theme-dark .dropdown-item:focus {
    color: #fff;
    background: #214037;
}

body.theme-dark .profile-menu .border-bottom > div:first-child {
    color: #f5faf8;
}

body.theme-dark .dropdown-divider,
body.theme-dark .border-top,
body.theme-dark .border-bottom,
body.theme-dark .border-start,
body.theme-dark .border-end,
body.theme-dark .border {
    border-color: var(--line) !important;
}

body.theme-dark .modal-content {
    color: var(--ink);
    background: var(--panel);
    border-color: #31443d;
}

body.theme-dark .modal-header,
body.theme-dark .modal-footer {
    border-color: var(--line);
}

body.theme-dark .modal-title {
    color: #f5faf8;
}

body.theme-dark .btn-close {
    filter: invert(1) grayscale(1) brightness(180%);
}

body.theme-dark .badge.text-bg-light,
body.theme-dark .badge.bg-light {
    color: #e6efec !important;
    background: #1d3029 !important;
    border-color: #3a5149 !important;
}

body.theme-dark .btn-outline-secondary {
    color: #c8d5d0;
    border-color: #61756e;
}

body.theme-dark .btn-outline-secondary:hover,
body.theme-dark .btn-outline-secondary:focus {
    color: #10211c;
    background: var(--brand-2);
    border-color: var(--brand-2);
}

body.theme-dark .datepicker {
    color: #edf4f1;
    background: #17241f;
    border-color: #3a5b51;
}

body.theme-dark .datepicker table tr td,
body.theme-dark .datepicker table tr th {
    color: #dce7e3;
}

body.theme-dark .datepicker table tr td.old,
body.theme-dark .datepicker table tr td.new,
body.theme-dark .datepicker table tr td.disabled {
    color: #71847d;
}

body.theme-dark .datepicker table tr td.day:hover,
body.theme-dark .datepicker table tr td.focused,
body.theme-dark .datepicker .datepicker-switch:hover,
body.theme-dark .datepicker .prev:hover,
body.theme-dark .datepicker .next:hover {
    color: #fff;
    background: #214037;
}

body.theme-dark .filter-card,
body.theme-dark .daily-table-card {
    background: #13231e;
    border-color: #29423a;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .24);
}

body.theme-dark .form-control::placeholder {
    color: #8da19a;
}

body.theme-dark .filter-card .choices__inner,
body.theme-dark .modal-compact-body .choices__inner,
body.theme-dark .daily-table-card .dt-length select,
body.theme-dark .daily-table-card .dt-search input {
    background: #152a24;
    border-color: #3a5b51;
    color: #edf4f1;
}

body.theme-dark .choices__list--single,
body.theme-dark .choices__placeholder,
body.theme-dark .choices__item {
    color: #edf4f1;
}

body.theme-dark .choices[data-type*="select-one"]::after {
    border-color: #c2d0ca transparent transparent;
}

body.theme-dark .choices[data-type*="select-one"].is-open::after {
    border-color: transparent transparent var(--brand-2);
}

body.theme-dark .choices__list--dropdown,
body.theme-dark .choices__list[aria-expanded] {
    background: #17241f;
    border-color: #3a5b51;
}

body.theme-dark .choices__list--dropdown .choices__item,
body.theme-dark .choices__list[aria-expanded] .choices__item {
    color: #edf4f1;
}

body.theme-dark .choices__list--dropdown .choices__item--selectable.is-highlighted,
body.theme-dark .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
    background: #214037 !important;
    color: #f3c766 !important;
}

body.theme-dark .daily-table {
    --bs-table-color: #edf4f1;
    --bs-table-hover-color: #ffffff;
    --bs-table-hover-bg: #19312a;
    border-color: #29423a;
    color: #edf4f1;
}

body.theme-dark .daily-table thead th {
    background: #17241f;
    border-color: #29423a;
    color: #c2d0ca;
}

body.theme-dark .daily-table tbody td {
    border-color: #29423a;
    color: #edf4f1;
}

body.theme-dark .daily-table tbody tr:hover {
    background: #19312a;
}

body.theme-dark .daily-table-card .dt-layout-row {
    border-color: #29423a;
}

body.theme-dark .dt-container,
body.theme-dark .dt-container .dt-empty,
body.theme-dark .dt-container .dt-processing,
body.theme-dark .dt-container .dt-paging,
body.theme-dark .dt-container .dt-paging-button,
body.theme-dark .table-shell {
    color: #dce7e3 !important;
}

body.theme-dark .daily-table-card .page-link {
    background: #17241f;
    border-color: #29423a;
    color: #c2d0ca;
}

body.theme-dark .daily-table-card .active > .page-link {
    background: var(--brand-2);
    border-color: var(--brand-2);
    color: #241b09;
}

body.theme-dark .btn-reset-icon {
    border-color: #6f8790;
    color: #c2d0ca;
}

body.theme-dark .btn-reset-icon:hover,
body.theme-dark .btn-reset-icon:focus {
    background: var(--brand-2);
    border-color: var(--brand-2);
    color: #241b09;
}

body.theme-dark .dashboard-title,
body.theme-dark .dashboard-panel h2,
body.theme-dark .dashboard-summary-item strong,
body.theme-dark .dashboard-investment-stats strong,
body.theme-dark .dashboard-list-title,
body.theme-dark .dashboard-transaction-copy strong {
    color: #f5faf8;
}

body.theme-dark .dashboard-summary-item span,
body.theme-dark .dashboard-family-members,
body.theme-dark .dashboard-investment-stats span,
body.theme-dark .dashboard-transaction-copy span,
body.theme-dark .dashboard-empty {
    color: #b9c8c3;
}

body.theme-dark .dashboard-family-total {
    color: #ff5364;
}

body.theme-dark .dashboard-section-label,
body.theme-dark .dashboard-eyebrow {
    color: #42b99f;
}

.app-shell {
    min-height: 100vh;
}

.sidebar {
    min-height: 100vh;
    background: var(--sidebar);
    position: sticky;
    top: 0;
}

.sidebar-backdrop {
    display: none;
}

.sidebar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.sidebar-close-btn {
    width: 38px;
    height: 38px;
    min-height: 38px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .12);
    color: #fff;
    background: rgba(255, 255, 255, .08);
    font-size: 18px;
}

.sidebar-close-btn:hover,
.sidebar-close-btn:focus {
    color: #241b09;
    background: var(--brand-2);
    border-color: var(--brand-2);
}

.brand-mark {
    width: 40px;
    height: 40px;
    display: inline-grid;
    place-items: center;
    background: var(--brand-2);
    color: #2b2109;
    border-radius: 8px;
    font-weight: 800;
}

.brand-logo-mark {
    width: 52px;
    height: 52px;
    display: block;
    flex: 0 0 auto;
}

.brand-lockup {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    max-width: 100%;
}

.brand-lockup-text {
    color: #fff;
    font-size: clamp(24px, 1.8vw, 32px);
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
    letter-spacing: 0;
}

.brand-lockup-dark .brand-lockup-text {
    color: var(--ink);
}

.brand-title {
    color: #fff;
    font-weight: 800;
    line-height: 1.05;
}

.brand-subtitle {
    color: #a9b8b3;
    font-size: 12px;
}

.sidebar a {
    color: #c6d1cd;
    text-decoration: none;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
}

.sidebar a i {
    width: 22px;
    text-align: center;
}

.sidebar a.active,
.sidebar a:hover {
    color: #fff;
    background: var(--sidebar-soft);
}

.app-main {
    min-height: 100vh;
    padding: 0;
}

.app-header {
    min-height: 72px;
    padding: 0 24px;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    position: sticky;
    top: 0;
    z-index: 1030;
}

.app-header-left,
.app-header-actions {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.app-header-actions {
    margin-left: auto;
}

.app-search {
    width: min(36vw, 360px);
    height: 48px;
    align-items: center;
    gap: 12px;
    padding: 0 18px;
    background: #f4f5fb;
    border: 1px solid transparent;
    border-radius: 8px;
    color: #7c8496;
}

.app-search:focus-within {
    border-color: rgba(20, 108, 92, .25);
    box-shadow: 0 0 0 .2rem rgba(20, 108, 92, .08);
}

.app-search i {
    font-size: 20px;
}

.app-search input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--ink);
    font-size: 15px;
}

.app-search input::placeholder {
    color: #7c8496;
}

.app-icon-btn {
    width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #7c8496;
    font-size: 24px;
    position: relative;
}

.app-icon-btn:hover,
.app-icon-btn:focus {
    background: #f4f5fb;
    color: var(--brand);
}

.app-icon-badge::after {
    content: attr(data-count);
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    background: #e9573f;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    line-height: 22px;
    position: absolute;
    top: -2px;
    right: -3px;
}

.app-icon-badge:nth-of-type(2)::after {
    background: #2498dc;
}

.app-profile-toggle {
    width: 52px;
    height: 52px;
    min-height: 52px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--ink);
}

.app-profile-toggle:hover,
.app-profile-toggle:focus {
    background: transparent;
    color: var(--ink);
}

.profile-avatar {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    background: var(--brand-2);
    color: #2b2109;
    font-weight: 850;
    box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .72);
}

.profile-menu {
    min-width: 240px;
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: 0 18px 48px rgba(15, 31, 28, .14);
}

.btn-menu-toggle {
    width: 42px;
    height: 42px;
    min-height: 42px;
    flex: 0 0 auto;
    padding: 0;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--brand);
    font-size: 24px;
    box-shadow: 0 8px 20px rgba(15, 31, 28, .08);
}

.btn-menu-toggle:hover,
.btn-menu-toggle:focus {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
}

.content-wrap {
    max-width: 1480px;
    min-height: calc(100vh - 72px);
    padding: 24px;
}

.topbar {
    background: rgba(255, 255, 255, .82);
    backdrop-filter: blur(12px);
    border: 1px solid var(--line);
    border-radius: 8px;
}

.page-kicker {
    color: var(--muted);
    font-size: 13px;
}

.card,
.ui-panel {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: 0 10px 28px rgba(15, 31, 28, .06);
}

.metric-card {
    min-height: 118px;
    overflow: hidden;
    position: relative;
}

.metric-icon {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    display: inline-grid;
    place-items: center;
    background: #f2f4f7;
}

.metric-value {
    font-size: clamp(20px, 2vw, 28px);
    font-weight: 800;
    line-height: 1.15;
}

.section-title {
    font-size: 15px;
    font-weight: 800;
    margin-bottom: 0;
}

.btn {
    border-radius: 8px;
    font-weight: 650;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.form-control,
.form-select {
    border-radius: 8px;
    border-color: #d0d5dd;
    min-height: 42px;
}

textarea.form-control {
    min-height: 104px;
}

.form-label {
    color: #344054;
    font-size: 13px;
    font-weight: 700;
}

.table {
    --bs-table-bg: transparent;
}

.table td,
.table th {
    vertical-align: middle;
    padding: .85rem 1rem;
}

.table thead th {
    color: #667085;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0;
    background: #f9fafb;
    border-bottom: 1px solid var(--line);
}

.badge {
    border-radius: 999px;
    padding: .42rem .62rem;
}

.auth-page {
    min-height: 100vh;
    background:
        linear-gradient(120deg, rgba(247, 250, 247, .96), rgba(242, 246, 243, .94)),
        radial-gradient(circle at top left, rgba(233, 180, 76, .22), transparent 34%);
}

.auth-wrap {
    max-width: 1120px;
}

.auth-brand .brand-title {
    color: var(--ink);
    font-size: 28px;
}

.auth-brand .brand-subtitle {
    color: var(--muted);
}

.auth-visual {
    background: #0f1f1c;
    color: #fff;
    border-radius: 8px;
    min-height: 620px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 24px 80px rgba(15, 31, 28, .22);
}

.auth-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg, rgba(233, 180, 76, .2), transparent 36%),
        linear-gradient(315deg, rgba(20, 108, 92, .5), transparent 42%);
}

.auth-visual-content {
    position: relative;
    z-index: 1;
}

.hisab-card {
    background: rgba(255, 255, 255, .94);
    color: var(--ink);
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 8px;
    box-shadow: 0 18px 44px rgba(0, 0, 0, .18);
}

.ledger-line {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
}

.ledger-line:last-child {
    border-bottom: 0;
}

.ledger-contact-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
}

.ledger-contact-row:last-child {
    border-bottom: 0;
}

body.theme-dark .ledger-contact-row {
    border-color: #29423a;
}

.ledger-history-scroll {
    max-height: 520px;
    overflow-y: auto;
}

.ledger-history-summary {
    color: #1f2937;
}

.ledger-history-summary .fw-semibold {
    color: #111827;
}

.auth-card {
    max-width: 460px;
    margin: 0 auto;
    border: 1px solid var(--line);
    box-shadow: 0 22px 60px rgba(15, 31, 28, .12);
}

.auth-card .form-control {
    min-height: 48px;
    background: #fbfcfd;
}

.auth-card .btn-primary {
    min-height: 48px;
    background: var(--brand);
    border-color: var(--brand);
}

.auth-link {
    color: var(--brand);
    font-weight: 700;
    text-decoration: none;
}

.auth-link:hover {
    color: #0f5448;
    text-decoration: underline;
}

.modal-content {
    border-radius: 8px;
    border: 1px solid var(--line);
    box-shadow: 0 24px 70px rgba(15, 31, 28, .18);
}

.modal-header,
.modal-footer {
    border-color: var(--line);
}

.modal-title {
    color: #061b49;
    font-weight: 800;
}

body.theme-dark #ledgerHistoryModal .modal-content {
    background: #13231f;
    border-color: rgba(115, 145, 136, .28);
}

body.theme-dark #ledgerHistoryModal .modal-header,
body.theme-dark #ledgerHistoryModal .modal-footer,
body.theme-dark #ledgerHistoryModal .ledger-history-summary,
body.theme-dark #ledgerHistoryModal .daily-table thead th,
body.theme-dark #ledgerHistoryModal .daily-table tbody td {
    border-color: rgba(115, 145, 136, .24);
}

body.theme-dark #ledgerHistoryModal .modal-title,
body.theme-dark #ledgerHistoryModal .ledger-history-summary,
body.theme-dark #ledgerHistoryModal .ledger-history-summary .fw-semibold,
body.theme-dark #ledgerHistoryModal .daily-table tbody td,
body.theme-dark #ledgerHistoryModal .daily-table tbody td span:not(.text-danger):not(.text-success) {
    color: #edf4f1;
}

body.theme-dark #ledgerHistoryModal .modal-header .small,
body.theme-dark #ledgerHistoryModal .daily-table tbody td.text-secondary,
body.theme-dark #ledgerHistoryModal .daily-table tbody td .text-secondary {
    color: #b8c8c2 !important;
}

body.theme-dark #ledgerHistoryModal .daily-table tbody tr:hover {
    background: rgba(233, 180, 76, .06);
}

body.theme-dark #ledgerHistoryModal .btn-close {
    filter: invert(1) grayscale(1) brightness(200%);
}

.btn-primary {
    background: var(--brand);
    border-color: var(--brand);
}

.btn-primary:hover,
.btn-primary:focus {
    background: #0f5448;
    border-color: #0f5448;
}

.btn-theme-accent {
    background: var(--brand-2);
    border-color: var(--brand-2);
    color: #241b09;
}

.btn-theme-accent:hover,
.btn-theme-accent:focus {
    background: #dba83f;
    border-color: #dba83f;
    color: #241b09;
}

.btn-muted {
    background: #98a8b3;
    border-color: #98a8b3;
    color: #fff;
}

.btn-muted:hover,
.btn-muted:focus {
    background: #7f929f;
    border-color: #7f929f;
    color: #fff;
}

#toast-container > .toast {
    border-radius: 8px;
    box-shadow: 0 18px 48px rgba(15, 31, 28, .16);
    opacity: 1;
}

#toast-container > .toast-success {
    background-color: var(--brand);
}

#toast-container > .toast-error {
    background-color: #d94841;
}

#toast-container .toast-close-button {
    text-shadow: none;
    opacity: .85;
}

.filter-card {
    box-shadow: 0 10px 28px rgba(15, 31, 28, .06);
}

.daily-filter-row {
    display: flex;
    align-items: end;
    gap: 12px;
}

.daily-filter-field {
    width: min(260px, 34vw);
    min-width: 180px;
}

.daily-filter-reset {
    flex: 0 0 auto;
}

.dashboard-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
}

.dashboard-eyebrow,
.dashboard-section-label {
    color: var(--brand);
    letter-spacing: 0;
}

.dashboard-title {
    margin: 2px 0 0;
    font-size: 26px;
    font-weight: 800;
}

.dashboard-period-form {
    display: flex;
    align-items: end;
    gap: 10px;
}

.dashboard-period-form.is-loading {
    opacity: .7;
    pointer-events: none;
}

.dashboard-period-select,
.dashboard-custom-date {
    width: 190px;
}

.dashboard-period-form .form-label {
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 700;
}

.dashboard-filter-submit {
    margin-bottom: 0;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: 16px;
}

.dashboard-panel {
    padding: 20px;
    overflow: hidden;
}

.dashboard-panel-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.dashboard-panel h2 {
    margin: 3px 0 0;
    font-size: 18px;
    font-weight: 800;
}

.dashboard-section-label {
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.dashboard-panel-icon {
    display: inline-grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 8px;
    font-size: 19px;
}

.dashboard-panel-icon.expense {
    color: #b42335;
    background: #fff0f2;
}

.dashboard-panel-icon.private {
    color: var(--brand);
    background: #e5f4ef;
}

.dashboard-family-total {
    font-size: 34px;
    font-weight: 850;
    color: #e1374b;
}

.dashboard-comparison {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 20px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
    color: var(--muted);
}

.dashboard-family-members {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
    color: var(--muted);
    font-weight: 600;
}

.dashboard-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-summary-grid-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dashboard-summary-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 76px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface-soft, #f8fafc);
}

.dashboard-summary-item > i {
    font-size: 21px;
}

.dashboard-summary-item span,
.dashboard-investment-stats span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.dashboard-summary-item strong {
    display: block;
    margin-top: 2px;
    font-size: 18px;
}

.dashboard-summary-item.income > i { color: #168567; }
.dashboard-summary-item.expense > i { color: #e1374b; }
.dashboard-summary-item.investment > i { color: #377dff; }
.dashboard-summary-item.savings > i { color: #b47b00; }

.dashboard-overview-panel,
.dashboard-investment-panel {
    min-height: 360px;
}

.dashboard-chart-wrap {
    height: 280px;
}

.dashboard-pie-wrap {
    max-width: 460px;
    margin-inline: auto;
}

.dashboard-investment-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 20px;
}

.dashboard-investment-stats > div {
    padding: 12px;
    border-radius: 8px;
    background: #edf7f3;
}

.dashboard-investment-stats strong {
    display: block;
    margin-top: 4px;
    font-size: 17px;
}

.dashboard-list-title {
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 800;
}

.dashboard-investment-list > div,
.dashboard-transaction {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--border);
}

.dashboard-investment-list span small {
    display: block;
    color: var(--muted);
}

.dashboard-recent-panel {
    grid-column: 1 / -1;
}

.dashboard-transaction {
    justify-content: start;
}

.dashboard-transaction-icon {
    display: inline-grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 8px;
}

.dashboard-transaction-icon.income { color: #168567; background: #e7f7f1; }
.dashboard-transaction-icon.expense { color: #e1374b; background: #fff0f2; }
.dashboard-transaction-icon.investment { color: #377dff; background: #edf3ff; }

.dashboard-transaction-copy {
    min-width: 0;
    flex: 1;
}

.dashboard-transaction-copy strong,
.dashboard-transaction-copy span {
    display: block;
}

.dashboard-transaction-copy span {
    overflow: hidden;
    color: var(--muted);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-transaction-amount {
    white-space: nowrap;
}

.dashboard-transaction-amount.income { color: #168567; }
.dashboard-transaction-amount.expense { color: #e1374b; }
.dashboard-transaction-amount.investment { color: #377dff; }

.dashboard-empty {
    padding: 24px 0;
    color: var(--muted);
    text-align: center;
}

body.theme-dark .dashboard-summary-item {
    background: #14251f;
}

body.theme-dark .dashboard-panel-icon.expense,
body.theme-dark .dashboard-transaction-icon.expense {
    background: #331a20;
}

body.theme-dark .dashboard-panel-icon.private,
body.theme-dark .dashboard-transaction-icon.income,
body.theme-dark .dashboard-investment-stats > div {
    background: #17332a;
}

body.theme-dark .dashboard-transaction-icon.investment {
    background: #192a43;
}

@media (max-width: 991.98px) {
    .dashboard-toolbar,
    .dashboard-period-form {
        align-items: stretch;
        flex-direction: column;
    }

    .dashboard-period-select,
    .dashboard-custom-date {
        width: 100%;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-recent-panel {
        grid-column: auto;
    }
}

@media (max-width: 575.98px) {
    .dashboard-panel {
        padding: 15px;
    }

    .dashboard-summary-grid,
    .dashboard-summary-grid-three,
    .dashboard-investment-stats {
        grid-template-columns: 1fr;
    }

    .dashboard-transaction {
        align-items: start;
    }

    .dashboard-transaction-amount {
        font-size: 13px;
    }
}

.choices {
    margin-bottom: 0;
    width: 100%;
}

.choices__inner {
    min-height: 42px;
    border: 1px solid #d0d5dd;
    border-radius: 8px;
    background: #fff;
    display: flex;
    align-items: center;
    padding: 6px 38px 6px 14px;
    font-size: 14px;
}

.choices__list--single {
    padding: 0;
}

.choices__placeholder {
    color: #6c757d;
    opacity: 1;
}

.filter-control + .choices .choices__inner,
.filter-card .choices__inner {
    min-height: 42px;
    padding: 6px 38px 6px 14px;
    font-size: 14px;
    background: #f8fafc;
}

.modal-compact-body .choices__inner {
    min-height: 42px;
    padding: 6px 38px 6px 14px;
    font-size: 14px;
    background: #f8fafc;
}

.choices[data-type*="select-one"]::after {
    border-color: #2f3437 transparent transparent;
    border-width: 6px;
    right: 16px;
    margin-top: -3px;
}

.choices[data-type*="select-one"].is-open::after {
    border-color: transparent transparent var(--brand);
    margin-top: -8px;
}

.choices.is-focused .choices__inner,
.choices.is-open .choices__inner {
    border-color: #b8c4d4;
    box-shadow: 0 0 0 .2rem rgba(20, 108, 92, .12);
}

.choices__list--dropdown,
.choices__list[aria-expanded] {
    border: 1px solid #d0d5dd;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 18px 48px rgba(15, 31, 28, .14);
    overflow: hidden;
    margin-top: 6px;
    z-index: 1060;
}

.choices__list--dropdown .choices__list,
.choices__list[aria-expanded] .choices__list {
    scrollbar-color: var(--brand) #edf8f3;
    scrollbar-width: thin;
}

.choices__list--dropdown .choices__list::-webkit-scrollbar,
.choices__list[aria-expanded] .choices__list::-webkit-scrollbar {
    width: 8px;
}

.choices__list--dropdown .choices__list::-webkit-scrollbar-track,
.choices__list[aria-expanded] .choices__list::-webkit-scrollbar-track {
    background: #edf8f3;
}

.choices__list--dropdown .choices__list::-webkit-scrollbar-thumb,
.choices__list[aria-expanded] .choices__list::-webkit-scrollbar-thumb {
    background: var(--brand);
    border-radius: 999px;
}

.choices__list--dropdown .choices__item,
.choices__list[aria-expanded] .choices__item {
    font-size: 14px;
    padding: 9px 14px;
    color: #172033;
}

.choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
    background: #e4f3ee !important;
    color: var(--brand) !important;
}

.choices__list--dropdown .choices__item.is-selected,
.choices__list[aria-expanded] .choices__item.is-selected,
.choices__list--dropdown .choices__item.is-selected.is-highlighted,
.choices__list[aria-expanded] .choices__item.is-selected.is-highlighted,
.choices__list--dropdown .choices__item[aria-selected="true"],
.choices__list[aria-expanded] .choices__item[aria-selected="true"] {
    background: var(--brand) !important;
    color: #fff !important;
    font-weight: 700;
}

.choices__list--dropdown .choices__item[aria-selected="true"].is-highlighted,
.choices__list[aria-expanded] .choices__item[aria-selected="true"].is-highlighted {
    background: #0f5448 !important;
    color: #fff !important;
}

.btn-reset-icon {
    width: 42px;
    height: 42px;
    min-height: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    font-size: 18px;
}

.btn-reset-icon:hover,
.btn-reset-icon:focus {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
}

.daily-table-card {
    overflow: hidden;
}

.daily-total-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 14px;
    border-radius: 999px;
    background: #f8fafc;
    border: 1px solid #dde3ec;
    color: var(--ink);
}

.daily-total-label {
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.daily-total-value {
    color: var(--brand);
    font-size: 16px;
    font-weight: 850;
    white-space: nowrap;
}

body.theme-dark .daily-total-chip {
    background: #17241f;
    border-color: #29423a;
}

body.theme-dark .daily-total-label {
    color: #c2d0ca;
}

body.theme-dark .daily-total-value {
    color: #f3c766;
}

.table-shell {
    padding: 0 20px 18px;
}

.daily-table-card .dt-layout-row {
    margin: 0;
    padding: 16px 0;
    border-bottom: 1px solid var(--line);
    align-items: center;
}

.daily-table-card .dt-layout-row:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: nowrap;
}

.daily-table-card .dt-layout-row:first-child .dt-layout-cell {
    width: auto;
    flex: 0 0 auto;
}

.daily-table-card .dt-layout-row:first-child .dt-layout-cell.dt-layout-end {
    margin-left: auto;
}

.daily-table-card .dt-length,
.daily-table-card .dt-search {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
}

.daily-table-card .dt-search label,
.daily-table-card .dt-length label {
    margin: 0;
    white-space: nowrap;
}

.daily-table-card .dt-layout-row:last-child {
    border-top: 1px solid var(--line);
    border-bottom: 0;
}

.daily-table-card .dt-length select,
.daily-table-card .dt-search input {
    border: 1px solid #cfd7e3;
    border-radius: 8px;
    min-height: 38px;
    box-shadow: none;
}

.daily-table-card .dt-search input {
    min-width: 270px;
    margin-left: 10px;
}

.daily-table {
    border: 1px solid var(--line);
}

.daily-table thead th {
    background: #fbfcfd;
    color: #667085;
    font-size: 13px;
    font-weight: 800;
    padding: 12px 18px;
    border-right: 1px solid var(--line);
}

.daily-table tbody td {
    padding: 12px 18px;
    border-right: 1px solid var(--line);
    border-top: 1px solid var(--line);
    font-size: 14px;
}

.daily-table tbody td[rowspan] {
    vertical-align: middle;
    text-align: center;
}

.btn-row-action {
    width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;
}

.daily-table thead th:last-child,
.daily-table tbody td:last-child {
    border-right: 0;
}

.daily-table tbody tr:hover {
    background: #f8fbfa;
}

.daily-table-card .pagination {
    margin: 0;
}

.daily-table-card .page-link {
    border-color: var(--line);
    color: #344054;
    min-width: 44px;
    min-height: 44px;
    display: grid;
    place-items: center;
}

.daily-table-card .active > .page-link {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
}

.datepicker {
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: 0 18px 48px rgba(15, 31, 28, .14);
    padding: 10px;
}

.datepicker table tr td.active,
.datepicker table tr td.active:hover {
    background: var(--brand) !important;
}

.datepicker table tr td.today {
    background: #fff4d7 !important;
}

.input-group-text {
    border-radius: 8px 0 0 8px;
    background: #f8fafc;
    color: var(--brand);
    border-color: #d0d5dd;
}

.input-group .form-control {
    border-radius: 0 8px 8px 0;
}

.modal-compact-header .modal-title {
    font-size: 17px !important;
}

.modal-compact-header .small {
    font-size: 12px;
}

.modal-compact-body .form-label {
    margin-bottom: 4px;
    font-size: 12px;
}

.modal-compact-body .form-control,
.modal-compact-body .form-select,
.modal-compact-body .input-group-text {
    min-height: 42px;
    font-size: 14px;
}

.modal-compact-body .form-control,
.modal-compact-body .form-select {
    padding-top: 6px;
    padding-bottom: 6px;
}

.modal-compact-footer {
    gap: 8px;
}

.btn-modal-action {
    min-height: 38px;
    font-size: 14px;
}

@media (max-width: 991px) {
    .app-header {
        min-height: 64px;
        padding: 0 12px;
    }

    .content-wrap {
        padding: 16px 12px;
        min-height: calc(100vh - 64px);
    }

    .sidebar {
        width: min(82vw, 300px);
        min-height: 100vh;
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 1045;
        transform: translateX(-100%);
        transition: transform .22s ease;
        box-shadow: 24px 0 60px rgba(15, 31, 28, .22);
    }

    body.sidebar-open {
        overflow: hidden;
    }

    body.sidebar-open .sidebar {
        transform: translateX(0);
    }

    body.sidebar-open .sidebar-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1040;
        background: rgba(15, 31, 28, .45);
        backdrop-filter: blur(2px);
    }

    .sidebar nav {
        display: grid;
        grid-template-columns: 1fr;
    }

    .auth-visual {
        min-height: auto;
    }

    .brand-lockup-text {
        font-size: 26px;
    }
}

@media (max-width: 767px) {
    .daily-filter-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 42px;
        gap: 8px;
        align-items: end;
    }

    .daily-filter-field {
        width: auto;
        min-width: 0;
    }

    .daily-filter-field .form-label {
        font-size: 11px;
        margin-bottom: 4px;
        white-space: nowrap;
    }

    .daily-filter-row .choices__inner {
        min-height: 42px;
        padding-left: 10px;
        padding-right: 30px;
    }

    .app-header-actions {
        gap: 4px;
    }

    .app-icon-btn {
        width: 38px;
        height: 38px;
        min-height: 38px;
        font-size: 21px;
    }

    .app-profile-toggle {
        width: 42px;
        height: 42px;
        min-height: 42px;
        padding: 0;
        background: transparent;
    }

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

    .daily-table-card .dt-layout-row:first-child {
        gap: 8px;
    }

    .daily-table-card .dt-length,
    .daily-table-card .dt-search {
        gap: 8px;
    }

    .daily-table-card .dt-search input {
        min-width: 0;
        width: 170px;
        margin-left: 0;
        margin-top: 0;
    }

    .daily-table-card .dt-search label,
    .daily-table-card .dt-length label {
        font-size: 13px;
    }

    .daily-total-chip {
        min-height: 38px;
        padding: 0 12px;
    }

    .daily-total-label {
        font-size: 12px;
    }

    .daily-total-value {
        font-size: 14px;
    }
}