.data-page {
    --data-brand: #0f8ec7;
    --data-brand-dark: #0878ad;
    --data-brand-soft: #e9f7ff;
    --data-success: #10b981;
    --data-success-soft: #ecfdf5;
    --data-warning: #f59e0b;
    --data-warning-soft: #fffbeb;
    --data-purple: #8b5cf6;
    --data-purple-soft: #f3efff;
    --data-text: #172033;
    --data-muted: #7d8ca3;
    --data-border: #dce5ee;
    --data-soft: #f8fafc;
    color: var(--data-text);
    display: grid;
    gap: 1.45rem;
}

.data-page__header,
.data-page__actions,
.data-toolbar,
.data-toolbar__controls,
.data-entity,
.data-row-actions,
.data-grid-card__header,
.data-grid-card__actions {
    align-items: center;
    display: flex;
}

.data-page__header {
    justify-content: space-between;
    gap: 1rem;
}

.data-breadcrumb {
    align-items: center;
    color: var(--data-muted);
    display: flex;
    font-size: .93rem;
    gap: .5rem;
    margin-bottom: .45rem;
}

.data-breadcrumb strong {
    color: var(--data-text);
}

.data-page h1 {
    font-size: 1.8rem;
    font-weight: 900;
    line-height: 1.1;
    margin: 0;
}

.data-page p {
    color: #66758d;
    margin: .45rem 0 0;
}

.data-page__actions,
.data-toolbar__controls,
.data-row-actions {
    gap: .65rem;
}

.data-button,
.data-icon-button,
.data-view-toggle button,
.data-action-button {
    align-items: center;
    border-radius: 9px;
    display: inline-flex;
    font-weight: 800;
    gap: .45rem;
    justify-content: center;
    min-height: 40px;
    text-decoration: none;
}

.data-button {
    border: 1px solid var(--data-border);
    padding: .55rem 1rem;
}

.data-button--secondary {
    background: #fff;
    color: #344154;
}

.data-button--primary {
    background: var(--data-brand);
    border-color: var(--data-brand);
    color: #fff;
}

.data-button--primary:hover {
    background: var(--data-brand-dark);
    border-color: var(--data-brand-dark);
    color: #fff;
}

.data-stat-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.data-stat-card,
.data-card,
.data-grid-card {
    background: #fff;
    border: 1px solid var(--data-border);
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(16, 24, 40, .035);
}

.data-stat-card {
    align-items: center;
    display: flex;
    gap: 1rem;
    min-height: 96px;
    padding: 1rem 1.15rem;
}

.data-stat-card__icon {
    align-items: center;
    border-radius: 10px;
    display: inline-flex;
    flex: 0 0 48px;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.data-stat-card__icon--info {
    background: var(--data-brand-soft);
    color: var(--data-brand);
}

.data-stat-card__icon--success {
    background: var(--data-success-soft);
    color: var(--data-success);
}

.data-stat-card__icon--warning {
    background: var(--data-warning-soft);
    color: var(--data-warning);
}

.data-stat-card__icon--purple {
    background: var(--data-purple-soft);
    color: var(--data-purple);
}

.data-stat-card__icon--muted {
    background: #f1f5f9;
    color: #64748b;
}

.data-stat-card span {
    color: #66758d;
    display: block;
    font-weight: 800;
    place-content: center;
    text-align: center;
}

.data-stat-card strong {
    color: var(--data-text);
    display: block;
    font-size: 1.85rem;
    line-height: 1;
}

.data-card {
    overflow: hidden;
}

.data-filter-card {
    align-items: end;
    background: #fff;
    border: 1px solid var(--data-border);
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(16, 24, 40, .035);
    display: grid;
    gap: .9rem;
    grid-template-columns: minmax(280px, 2.5fr) repeat(4, minmax(150px, 1fr)) auto;
    padding: 1rem 1.15rem;
}

.data-filter-field {
    display: grid;
    gap: .45rem;
}

.data-filter-field > span:first-child {
    color: #66758d;
    font-size: .85rem;
    font-weight: 900;
}

.data-filter-field select,
.data-filter-field input {
    background: #fff;
    border: 1px solid #cfd9e6;
    border-radius: 9px;
    color: #344154;
    min-height: 42px;
    outline: 0;
    padding: .6rem .85rem;
    width: 100%;
}

.data-filter-actions {
    align-items: center;
    display: flex;
    gap: .65rem;
}

.data-alert {
    align-items: center;
    border-radius: 12px;
    display: flex;
    gap: .8rem;
    padding: .85rem 1rem;
}

.data-alert--warning {
    background: var(--data-warning-soft);
    border: 1px solid #fde7b5;
    color: #b45309;
}

.data-alert a {
    color: inherit;
    font-weight: 950;
    margin-left: auto;
    text-decoration: none;
    white-space: nowrap;
}

.data-toolbar {
    background: #fbfcfe;
    border-bottom: 1px solid var(--data-border);
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 1.15rem;
}

.data-toolbar__title {
    align-items: center;
    display: flex;
    gap: .55rem;
}

.data-toolbar__title h2 {
    color: var(--data-text);
    font-size: 1rem;
    font-weight: 900;
    margin: 0;
}

.data-toolbar__title i {
    color: var(--data-brand);
}

.data-search {
    flex: 1 1 360px;
    max-width: 480px;
    position: relative;
}

.data-search--fluid {
    display: block;
    max-width: none;
}

.data-search i {
    color: #9aa8ba;
    left: .9rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.data-search input,
.data-toolbar select {
    background: #fff;
    border: 1px solid #cfd9e6;
    border-radius: 9px;
    color: #344154;
    min-height: 42px;
    outline: 0;
}

.data-search input {
    padding: .6rem 1rem .6rem 2.55rem;
    width: 100%;
}

.data-toolbar select {
    padding: .55rem 2rem .55rem .8rem;
}

.data-icon-button,
.data-view-toggle button {
    background: #fff;
    border: 1px solid #cfd9e6;
    color: #506179;
    width: 42px;
}

.data-view-toggle {
    display: inline-flex;
}

.data-view-toggle button {
    border-radius: 0;
    margin-left: -1px;
}

.data-view-toggle button:first-child {
    border-bottom-left-radius: 9px;
    border-top-left-radius: 9px;
    margin-left: 0;
}

.data-view-toggle button:last-child {
    border-bottom-right-radius: 9px;
    border-top-right-radius: 9px;
}

.data-view-toggle button.is-active {
    background: var(--data-brand);
    border-color: var(--data-brand);
    color: #fff;
}

.data-table-wrap {
    overflow-x: auto;
}

.data-table {
    border-collapse: separate;
    border-spacing: 0;
    min-width: 980px;
    width: 100%;
}

table.table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

.data-table thead th {
    background: #f8fafc;
    border-bottom: 1px solid var(--data-border);
    color: #74839a;
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .08em;
    padding: .9rem 1rem;
    text-transform: uppercase;
    white-space: nowrap;
}

table.table thead th {
    background: #f8fafc;
    border-bottom: 1px solid var(--data-border, #dce5ee);
    color: #74839a;
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .08em;
    padding: .9rem 1rem;
    text-transform: uppercase;
    white-space: nowrap;
}

.data-table tbody td {
    border-bottom: 1px solid #edf2f7;
    padding: 1rem;
    vertical-align: middle;
}

table.table tbody td {
    border-bottom: 1px solid #edf2f7;
    padding: 1rem;
    vertical-align: middle;
}

.data-table tbody tr:last-child td {
    border-bottom: 0;
}

table.table tbody tr:last-child td {
    border-bottom: 0;
}

.data-table__numeric {
    text-align: right;
    white-space: nowrap;
}

.data-table__actions {
    text-align: right;
    white-space: nowrap;
}

.data-table__actions .data-row-actions {
    justify-content: flex-end;
}

.data-row {
    transition: background .16s ease;
}

.data-row:hover,
.data-row.is-selected {
    background: #f8fafc;
}

.data-row.is-muted {
    background: #fbfcfe;
    opacity: .72;
}

.data-row.is-danger-soft {
    background: #fff7f7;
}

.data-table__select {
    width: 58px;
}

.data-table input[type="checkbox"] {
    accent-color: var(--data-brand);
}

.data-entity {
    gap: .9rem;
    min-width: 280px;
}

.data-avatar {
    align-items: center;
    background: var(--data-brand-soft);
    border: 1px solid #caeaff;
    border-radius: 10px;
    color: var(--data-brand);
    display: inline-flex;
    flex: 0 0 48px;
    font-weight: 900;
    height: 48px;
    justify-content: center;
    overflow: hidden;
    width: 48px;
}

.data-avatar img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.data-avatar--initials {
    background: linear-gradient(135deg, #e9f7ff, #f3efff);
}

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

.data-link:hover {
    color: var(--data-brand-dark);
}

.data-link--muted {
    color: #66758d;
}

.data-link--danger {
    background: transparent;
    border: 0;
    color: #ef4444;
    cursor: pointer;
    font: inherit;
    font-weight: 900;
    padding: 0;
}

.data-link--danger:hover {
    color: #dc2626;
}

.data-type-label {
    align-items: center;
    display: inline-flex;
    gap: .55rem;
}

.data-type-label i {
    border-radius: 999px;
    flex: 0 0 .55rem;
    height: .55rem;
    width: .55rem;
}

.data-type-label strong {
    color: #334155;
    font-weight: 900;
}

.data-profile-card {
    align-items: center;
    background: #fff;
    border: 1px solid var(--data-border);
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(16, 24, 40, .04);
    display: grid;
    gap: 1rem;
    grid-template-columns: auto 1fr auto;
    min-height: 132px;
    padding: 1.25rem 1.45rem;
}

.data-profile-card__avatar {
    align-items: center;
    background: var(--data-brand-soft);
    border: 3px solid #fff;
    border-radius: 14px;
    box-shadow: 0 6px 14px rgba(15, 23, 42, .12);
    color: var(--data-brand);
    display: inline-flex;
    flex: 0 0 72px;
    font-size: 1.25rem;
    font-weight: 950;
    height: 72px;
    justify-content: center;
    overflow: hidden;
    width: 72px;
}

.data-profile-card__avatar img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.data-profile-card__avatar--initials {
    background: linear-gradient(135deg, #e9f7ff, #f3efff);
}

.data-profile-card__body {
    min-width: 0;
}

.data-profile-card__heading {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
}

.data-profile-card__heading h2 {
    color: var(--data-text);
    font-size: 1.35rem;
    font-weight: 950;
    line-height: 1.1;
    margin: 0;
}

.data-profile-card p {
    color: #62728a;
    font-size: 1rem;
    font-weight: 750;
    margin: .35rem 0 0;
}

.data-profile-card__meta {
    align-items: center;
    color: #74839a;
    display: flex;
    flex-wrap: wrap;
    gap: .95rem;
    margin-top: .85rem;
}

.data-profile-card__meta span {
    align-items: center;
    display: inline-flex;
    gap: .35rem;
}

.data-profile-card__meta i {
    color: #94a3b8;
}

.data-profile-card__link {
    align-items: center;
    color: #2563eb;
    display: inline-flex;
    font-weight: 900;
    gap: .35rem;
    justify-content: flex-end;
    text-decoration: none;
    white-space: nowrap;
}

.data-profile-card__link:hover {
    color: #1d4ed8;
}

.balance-summary-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.balance-summary-grid__empty {
    grid-column: 1 / -1;
}

.balance-summary-card {
    --balance-color: #3b82f6;
    --balance-soft: #eff6ff;
    background: #fff;
    border: 1px solid var(--data-border);
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(16, 24, 40, .04);
    min-height: 170px;
    overflow: hidden;
    padding: 1.15rem;
    position: relative;
}

.balance-summary-card::after {
    background: var(--balance-soft);
    border-radius: 999px;
    content: "";
    height: 150px;
    opacity: .65;
    position: absolute;
    right: -76px;
    top: -86px;
    width: 150px;
}

.balance-summary-card--green {
    --balance-color: var(--data-success);
    --balance-soft: var(--data-success-soft);
}

.balance-summary-card--purple {
    --balance-color: var(--data-purple);
    --balance-soft: var(--data-purple-soft);
}

.balance-summary-card--orange {
    --balance-color: #fb923c;
    --balance-soft: #fff7ed;
}

.balance-summary-card--muted {
    --balance-color: #94a3b8;
    --balance-soft: #f1f5f9;
}

.balance-summary-card__type {
    align-items: center;
    color: #344154;
    display: inline-flex;
    font-weight: 900;
    gap: .55rem;
    position: relative;
    z-index: 1;
}

.balance-summary-card__type i {
    background: var(--balance-color);
    border-radius: 999px;
    height: 10px;
    width: 10px;
}

.balance-summary-card__value {
    color: var(--balance-color);
    display: block;
    font-size: 1.9rem;
    font-weight: 950;
    line-height: 1;
    margin-top: 1.15rem;
    position: relative;
    z-index: 1;
}

.balance-summary-card__caption {
    color: #8a98ab;
    display: block;
    font-weight: 800;
    margin-top: .4rem;
    position: relative;
    z-index: 1;
}

.balance-summary-card__bar {
    background: #edf2f7;
    border-radius: 999px;
    display: block;
    height: 7px;
    margin-top: 1rem;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.balance-summary-card__bar i {
    background: var(--balance-color);
    border-radius: inherit;
    display: block;
    height: 100%;
}

.balance-summary-card__details {
    color: #64748b;
    display: grid;
    font-size: .82rem;
    font-weight: 800;
    gap: .35rem .75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: .8rem;
    position: relative;
    z-index: 1;
}

.data-tab-card__header {
    align-items: center;
    border-bottom: 1px solid var(--data-border);
    display: flex;
    justify-content: space-between;
    padding: 0 1rem;
}

.data-tab-card__header .record-tabs {
    border-bottom: 0;
}

.data-tab-card__period {
    margin-left: auto;
    min-width: 220px;
}

.data-tab-card .record-tab-panel {
    padding: 0;
}

.data-split-panel {
    display: grid;
    gap: 1.25rem;
    padding: 1rem;
}

.data-inline-form {
    align-items: end;
    background: #fbfcfe;
    border: 1px solid #e4ebf3;
    border-radius: 12px;
    display: grid;
    gap: .9rem;
    grid-template-columns: repeat(3, minmax(160px, 1fr)) auto;
    padding: 1rem;
}

.data-inline-form label {
    display: grid;
    gap: .4rem;
}

.data-inline-form label span {
    color: #66758d;
    font-size: .85rem;
    font-weight: 900;
}

.data-inline-form__wide {
    grid-column: 1 / -2;
}

.data-activity-list {
    display: grid;
    gap: .85rem;
    padding: 1rem;
}

.data-activity-item {
    align-items: center;
    background: #fff;
    border: 1px solid #edf2f7;
    border-radius: 12px;
    display: grid;
    gap: .85rem;
    grid-template-columns: auto 1fr;
    padding: .9rem 1rem;
}

.data-activity-item__icon {
    align-items: center;
    border-radius: 10px;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.data-activity-item__icon--blue {
    background: var(--data-brand-soft);
    color: var(--data-brand);
}

.data-activity-item__icon--purple {
    background: var(--data-purple-soft);
    color: var(--data-purple);
}

.data-activity-item strong,
.data-activity-item span {
    display: block;
}

.data-activity-item strong {
    color: var(--data-text);
    font-weight: 900;
}

.data-activity-item span {
    color: #8a98ab;
    font-weight: 750;
    margin-top: .15rem;
}

.data-empty-panel {
    align-items: center;
    background: #fff;
    border: 1px dashed #d6e0eb;
    border-radius: 14px;
    color: #9aa8ba;
    display: grid;
    gap: .4rem;
    justify-items: center;
    min-height: 150px;
    padding: 1.5rem;
    text-align: center;
}

.data-empty-panel i {
    background: #eef2f7;
    border-radius: 999px;
    color: #94a3b8;
    display: inline-flex;
    font-size: 1.4rem;
    padding: .8rem;
}

.data-empty-panel strong {
    color: #64748b;
    font-weight: 950;
}

.data-compact-card .data-toolbar {
    border-bottom: 0;
}

.settings-tabs {
    align-items: center;
    background: #fff;
    border: 1px solid var(--data-border);
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(16, 24, 40, .04);
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    padding: .7rem;
}

.settings-tabs__item {
    align-items: center;
    border-radius: 9px;
    color: #6b7a90;
    display: inline-flex;
    font-weight: 900;
    gap: .45rem;
    min-height: 40px;
    padding: .55rem .8rem;
    text-decoration: none;
}

.settings-tabs__item:hover,
.settings-tabs__item.is-active {
    background: #edf5ff;
    color: #2563eb;
}

.settings-hero {
    align-items: center;
    background: linear-gradient(135deg, #2f6df6, #1d4ed8);
    border-radius: 14px;
    box-shadow: 0 14px 30px rgba(37, 99, 235, .22);
    color: #fff;
    display: grid;
    gap: 1rem;
    grid-template-columns: auto 1fr auto;
    padding: 1.45rem 1.6rem;
}

.settings-hero__icon {
    align-items: center;
    background: rgba(255, 255, 255, .18);
    border-radius: 12px;
    display: inline-flex;
    font-size: 1.55rem;
    height: 58px;
    justify-content: center;
    width: 58px;
}

.settings-hero h2 {
    color: inherit;
    font-size: 1.25rem;
    font-weight: 950;
    margin: 0;
}

.settings-hero p {
    color: rgba(255, 255, 255, .85);
    font-weight: 700;
    margin: .25rem 0 0;
}

.settings-hero__stats {
    display: flex;
    gap: .8rem;
}

.settings-hero__stat {
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 12px;
    min-width: 96px;
    padding: .8rem 1rem;
    text-align: center;
}

.settings-hero__stat strong,
.settings-hero__stat span {
    display: block;
}

.settings-hero__stat strong {
    font-size: 1.35rem;
    font-weight: 950;
}

.settings-hero__stat span {
    color: rgba(255, 255, 255, .82);
    font-size: .78rem;
    font-weight: 850;
}

.settings-card-grid {
    display: grid;
    gap: 1.15rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.settings-card {
    background: #fff;
    border: 1px solid var(--data-border);
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(16, 24, 40, .04);
    display: grid;
    gap: 1rem;
    min-height: 270px;
    padding: 1.3rem;
}

.settings-card__top {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.settings-card__icon,
.settings-panel__icon {
    align-items: center;
    border-radius: 11px;
    display: inline-flex;
    flex: 0 0 48px;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.settings-card__icon--blue,
.settings-panel__icon--blue {
    background: #edf5ff;
    color: #2563eb;
}

.settings-card__icon--purple,
.settings-panel__icon--purple {
    background: #f3efff;
    color: #8b5cf6;
}

.settings-card__icon--green,
.settings-panel__icon--green {
    background: #ecfdf5;
    color: #10b981;
}

.settings-card__icon--orange,
.settings-panel__icon--orange {
    background: #fff7ed;
    color: #f97316;
}

.settings-card__icon--red,
.settings-panel__icon--red {
    background: #fee2e2;
    color: #ef4444;
}

.settings-card__icon--teal,
.settings-panel__icon--teal {
    background: #ecfdf5;
    color: #0f9f90;
}

.settings-card h2,
.settings-card h3 {
    color: var(--data-text);
    font-size: 1.05rem;
    font-weight: 950;
    margin: 0;
}

.settings-card p {
    color: #64748b;
    font-weight: 750;
    line-height: 1.45;
    margin: .45rem 0 0;
}

.settings-card__footer {
    align-self: end;
    border-top: 1px solid #edf2f7;
    display: grid;
    gap: .8rem;
    padding-top: .85rem;
}

.settings-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.settings-chip {
    background: #f1f5f9;
    border-radius: 999px;
    color: #526278;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 900;
    padding: .25rem .55rem;
}

.settings-chip--blue {
    background: #edf5ff;
    color: #2563eb;
}

.settings-chip--green {
    background: #ecfdf5;
    color: #07815d;
}

.settings-chip--orange {
    background: #fff7ed;
    color: #ea580c;
}

.settings-chip--purple {
    background: #f3efff;
    color: #7c3aed;
}

.settings-chip--teal {
    background: #ecfdf5;
    color: #0f9f90;
}

.settings-panel {
    background: #fff;
    border: 1px solid var(--data-border);
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(16, 24, 40, .04);
    overflow: hidden;
}

.settings-panel__header {
    align-items: center;
    border-bottom: 1px solid #edf2f7;
    display: flex;
    gap: .85rem;
    justify-content: space-between;
    padding: 1rem 1.15rem;
}

.settings-panel__title {
    align-items: center;
    display: flex;
    gap: .85rem;
}

.settings-panel__title h2 {
    color: var(--data-text);
    font-size: 1rem;
    font-weight: 950;
    margin: 0;
}

.settings-panel__title span {
    color: #8a98ab;
    display: block;
    font-size: .85rem;
    font-weight: 750;
}

.settings-layout {
    display: grid;
    gap: 1.15rem;
    grid-template-columns: minmax(0, 1fr) 360px;
}

.settings-form {
    display: grid;
    gap: 1rem;
    padding: 1.15rem;
}

.settings-form__grid {
    display: grid;
    gap: .95rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.settings-form__grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.settings-field {
    display: grid;
    gap: .4rem;
}

.settings-field--full {
    grid-column: 1 / -1;
}

.settings-field > span,
.settings-field > label:first-child {
    color: #526278;
    font-size: .84rem;
    font-weight: 900;
}

.settings-form .form-control,
.settings-form .form-select {
    min-height: 44px;
}

.settings-option-grid {
    display: grid;
    gap: .75rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.settings-option {
    align-items: center;
    background: #fff;
    border: 1px solid #dbe4ee;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    gap: .75rem;
    min-height: 74px;
    padding: .85rem;
}

.settings-option input {
    accent-color: #2563eb;
}

.settings-option:has(input:checked) {
    background: #edf5ff;
    border-color: #b8d4ff;
    color: #2563eb;
}

.settings-switch-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 1.1rem;
}

.settings-toggle {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    font-weight: 850;
    gap: .55rem;
}

.settings-toggle input {
    accent-color: #2563eb;
    height: 18px;
    width: 18px;
}

.settings-color-dot {
    border: 3px solid #eef2f7;
    border-radius: 999px;
    display: inline-flex;
    height: 30px;
    width: 30px;
}

.settings-mini-calendar {
    align-items: center;
    background: #fff7ed;
    border-radius: 9px;
    color: #ea580c;
    display: inline-flex;
    flex-direction: column;
    font-size: .72rem;
    font-weight: 950;
    height: 42px;
    justify-content: center;
    line-height: 1;
    width: 42px;
}

.settings-side-card {
    background: #fff;
    border: 1px solid var(--data-border);
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(16, 24, 40, .04);
    overflow: hidden;
}

.settings-side-card__body {
    display: grid;
    gap: .85rem;
    padding: 1rem;
}

.settings-note {
    align-items: flex-start;
    border-radius: 12px;
    display: flex;
    gap: .65rem;
    padding: .85rem;
}

.settings-note--blue {
    background: #edf5ff;
    border: 1px solid #cfe2ff;
    color: #2563eb;
}

.settings-note--warning {
    background: #fffbeb;
    border: 1px solid #fde7b5;
    color: #b45309;
}

.settings-panel__icon--muted {
    background: #eef2f7;
    color: #8ba0b8;
}

.data-button--danger {
    background: #fff;
    border-color: #fecaca;
    color: #ef4444;
}

.data-button--danger:hover {
    background: #fef2f2;
    border-color: #fca5a5;
    color: #dc2626;
}

.leave-request-page {
    --leave-primary: #2f6df6;
    --leave-primary-soft: #eff6ff;
    --leave-border: #dce5ee;
    --leave-muted: #8ba0b8;
}

.leave-request-back {
    align-items: center;
    color: #64748b;
    display: inline-flex;
    font-weight: 800;
    gap: .4rem;
    text-decoration: none;
    width: fit-content;
}

.leave-request-back:hover {
    color: var(--leave-primary);
}

.leave-request-layout {
    align-items: start;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1fr) 330px;
}

.leave-request-main,
.leave-request-side {
    display: grid;
    gap: 1.25rem;
}

.leave-request-side {
    position: sticky;
    top: 1rem;
}

.leave-type-grid {
    display: grid;
    gap: .85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 1.15rem;
}

.leave-type-card {
    align-items: center;
    background: #fff;
    border: 2px solid var(--leave-border);
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    gap: .75rem;
    min-height: 74px;
    padding: .85rem 1rem;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.leave-type-card:hover,
.leave-type-card.is-selected {
    background: var(--leave-primary-soft);
    border-color: var(--leave-primary);
    box-shadow: 0 10px 24px rgba(47, 109, 246, .08);
}

.leave-type-card input {
    accent-color: var(--leave-primary);
}

.leave-type-card__dot {
    background: var(--leave-type-color, var(--leave-primary));
    border-radius: 999px;
    flex: 0 0 .58rem;
    height: .58rem;
    width: .58rem;
}

.leave-type-card strong,
.leave-type-card small {
    display: block;
}

.leave-type-card strong {
    color: #223047;
    font-weight: 900;
}

.leave-type-card small {
    color: var(--leave-muted);
    font-weight: 800;
}

.leave-request-info {
    align-items: center;
    background: #eaf2ff;
    border: 1px solid #cfe0ff;
    border-radius: 8px;
    color: #2563eb;
    display: flex;
    font-weight: 850;
    gap: .45rem;
    padding: .8rem .95rem;
}

.leave-upload-zone {
    align-items: center;
    border: 2px dashed #d4e0ee;
    border-radius: 12px;
    color: #74869f;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: .25rem;
    justify-content: center;
    margin: 1.15rem;
    min-height: 144px;
    text-align: center;
}

.leave-upload-zone:hover {
    background: #f8fbff;
    border-color: #9db8d8;
}

.leave-upload-zone i {
    color: #a6b6c9;
    font-size: 1.75rem;
}

.leave-upload-zone strong {
    color: #60728c;
    font-weight: 900;
}

.leave-upload-zone span,
.leave-upload-zone em {
    color: #99a8bb;
    font-style: normal;
    font-weight: 750;
}

.leave-request-actions {
    align-items: center;
    background: #fff;
    border: 1px solid var(--leave-border);
    border-radius: 13px;
    box-shadow: 0 8px 22px rgba(16, 24, 40, .035);
    display: flex;
    justify-content: space-between;
    padding: 1rem 1.15rem;
}

.leave-request-actions > div {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    justify-content: flex-end;
}

.leave-summary {
    display: grid;
    gap: .8rem;
    grid-template-columns: 1fr auto;
    margin: 0;
    padding: 1.15rem;
}

.leave-summary dt {
    color: #7f90a8;
    font-weight: 850;
}

.leave-summary dd {
    color: #263348;
    font-weight: 900;
    margin: 0;
    text-align: right;
}

.leave-balance-box {
    background: #f8fafc;
    border: 1px solid #e6edf5;
    border-radius: 9px;
    display: grid;
    gap: .55rem;
    margin: 0 1.15rem 1.15rem;
    padding: .9rem;
}

.leave-balance-box > strong {
    color: #334155;
    font-weight: 950;
}

.leave-balance-box span {
    align-items: center;
    color: #74869f;
    display: flex;
    font-weight: 800;
    justify-content: space-between;
}

.leave-balance-box b {
    color: #172033;
}

.leave-mini-timeline {
    padding: 1.15rem;
}

.leave-mini-timeline__item {
    align-items: start;
    display: grid;
    gap: .1rem .65rem;
    grid-template-columns: 28px 1fr;
}

.leave-mini-timeline__item i {
    align-items: center;
    background: #fef3c7;
    border-radius: 999px;
    color: #d97706;
    display: inline-flex;
    grid-row: span 2;
    height: 28px;
    justify-content: center;
    width: 28px;
}

.leave-mini-timeline__item strong {
    color: #334155;
    font-weight: 900;
}

.leave-mini-timeline__item small {
    color: var(--leave-muted);
    font-weight: 750;
}

.leave-mini-timeline__item.is-muted i {
    background: #eaf2ff;
    color: #9db2cc;
}

.my-leaves-page {
    --leave-blue: #2f6df6;
}

.my-leaves-layout {
    align-items: start;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1fr) 340px;
}

.my-leaves-side {
    display: grid;
    gap: 1rem;
}

.my-leaves-upcoming {
    border-top: 1px solid #edf2f7;
    display: grid;
}

.my-leaves-upcoming__item {
    align-items: center;
    color: inherit;
    display: grid;
    gap: .85rem;
    grid-template-columns: 48px minmax(0, 1fr);
    padding: 1rem 1.25rem;
    text-decoration: none;
}

.my-leaves-upcoming__item + .my-leaves-upcoming__item {
    border-top: 1px solid #f1f5f9;
}

.my-leaves-upcoming__item:hover {
    background: #f8fbff;
}

.my-leaves-upcoming__date {
    align-items: center;
    background: #dbeafe;
    border-radius: 10px;
    color: #2f6df6;
    display: inline-flex;
    flex-direction: column;
    height: 48px;
    justify-content: center;
    line-height: 1;
    width: 48px;
}

.my-leaves-upcoming__date strong {
    font-size: .7rem;
    font-weight: 950;
    text-transform: uppercase;
}

.my-leaves-upcoming__date b {
    font-size: 1.05rem;
    font-weight: 950;
    margin-top: .15rem;
}

.my-leaves-upcoming__content strong {
    color: #334155;
    display: block;
    font-weight: 950;
}

.my-leaves-upcoming__content small {
    color: #8ba0b8;
    display: block;
    font-weight: 750;
    margin-top: .1rem;
}

.my-leaves-upcoming__empty {
    color: #8ba0b8;
    font-weight: 850;
    padding: 1rem 1.25rem;
}

.my-leaves-toolbar {
    align-items: center;
    display: grid;
    gap: .8rem;
    grid-template-columns: minmax(220px, 1fr) 180px 180px auto;
    padding: 1.15rem 1.25rem;
}

.my-leaves-count {
    color: #8ba0b8;
    font-weight: 900;
    justify-self: end;
    white-space: nowrap;
}

.data-table--my-leaves .data-row-actions {
    justify-content: flex-start;
}

.data-table--my-leaves .data-row-actions form {
    margin: 0;
}

.my-leaves-placeholder {
    align-items: center;
    color: #8ba0b8;
    display: grid;
    gap: .6rem;
    justify-items: center;
    min-height: 260px;
    padding: 2rem;
    text-align: center;
}

.my-leaves-placeholder > i {
    align-items: center;
    background: #eaf2ff;
    border-radius: 999px;
    color: var(--leave-blue);
    display: inline-flex;
    font-size: 1.8rem;
    height: 58px;
    justify-content: center;
    width: 58px;
}

.my-leaves-placeholder strong {
    color: #334155;
    font-size: 1.05rem;
    font-weight: 950;
}

.my-leaves-timeline {
    display: grid;
    gap: .75rem;
    padding: 1.15rem;
}

.my-leaves-timeline article {
    align-items: center;
    border-bottom: 1px solid #edf2f7;
    display: grid;
    gap: .4rem 1rem;
    grid-template-columns: 145px minmax(0, 1fr) auto;
    padding: .85rem 0;
}

.my-leaves-timeline article:last-child {
    border-bottom: 0;
}

.my-leaves-timeline strong {
    color: #334155;
    font-weight: 900;
}

.my-leaves-timeline small {
    color: #8ba0b8;
    font-weight: 800;
}

.data-entity__title,
.data-grid-card__title {
    color: var(--data-text);
    display: inline-block;
    font-weight: 900;
    text-decoration: none;
}

.data-entity__title:hover,
.data-grid-card__title:hover {
    color: var(--data-brand);
}

.data-entity__meta,
.data-sub-text {
    color: var(--data-muted);
    font-size: .85rem;
}

.data-entity__meta {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
    margin-top: .15rem;
}

.data-main-text {
    color: #344154;
    font-weight: 700;
}

.data-type,
.data-conflict {
    align-items: center;
    display: inline-flex;
    font-weight: 850;
    gap: .45rem;
}

.data-type__dot {
    border-radius: 999px;
    height: 8px;
    width: 8px;
}

.data-type__dot--blue {
    background: #3b82f6;
}

.data-type__dot--green {
    background: var(--data-success);
}

.data-type__dot--purple {
    background: var(--data-purple);
}

.data-balance-value {
    color: var(--data-success);
}

.data-balance-value--danger {
    color: #dc2626;
}

.data-conflict--success {
    color: var(--data-success);
}

.data-conflict--warning {
    color: #d97706;
    line-height: 1.15;
}

.data-badge-stack {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.data-badge {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 900;
    gap: .4rem;
    padding: .25rem .6rem;
    width: fit-content;
}

.data-badge i {
    border-radius: 50%;
    display: inline-block;
    height: 6px;
    width: 6px;
}

.data-badge--success {
    background: var(--data-success-soft);
    border: 1px solid #b7f0d4;
    color: #07815d;
}

.data-badge--success i {
    background: var(--data-success);
}

.data-badge--warning {
    background: var(--data-warning-soft);
    border: 1px solid #fde7b5;
    color: #b45309;
}

.data-badge--warning i {
    background: var(--data-warning);
}

.data-badge--muted {
    background: #f1f5f9;
    border: 1px solid #d9e2ed;
    color: #64748b;
}

.data-badge--muted i {
    background: #94a3b8;
}

.data-badge--info {
    background: var(--data-brand-soft);
    border: 1px solid #caeaff;
    color: var(--data-brand-dark);
}

.data-badge--info i {
    display: none;
}

.data-badge--danger {
    background: #fee2e2;
    border: 1px solid #fecaca;
    color: #dc2626;
}

.data-badge--danger i {
    background: #ef4444;
}

.data-row-actions {
    justify-content: flex-end;
    opacity: 0;
    transition: opacity .16s ease;
}

.data-row:hover .data-row-actions,
.data-grid-card .data-row-actions,
.data-row-actions--visible {
    opacity: 1;
}

.data-action-button {
    background: transparent;
    border: 0;
    color: #8a98ab;
    height: 34px;
    width: 34px;
}

.data-action-button:hover {
    background: var(--data-brand-soft);
    color: var(--data-brand);
}

.data-action-button--label {
    border-radius: 8px;
    gap: .35rem;
    height: 32px;
    padding: 0 .75rem;
    width: auto;
}

.data-action-button--label span {
    display: inline;
}

.data-action-button--success {
    background: var(--data-success-soft);
    color: #166534;
}

.data-action-button--success:hover {
    background: #dcfce7;
    color: #15803d;
}

.data-action-button--warning:hover {
    background: #fff7ed;
    color: #ea580c;
}

.data-action-button--danger:hover {
    background: #fef2f2;
    color: #dc2626;
}

.data-action-button--label.data-action-button--danger {
    background: #fff1f2;
    color: #dc2626;
}

.data-action-button--label.data-action-button--danger:hover {
    background: #fee2e2;
    color: #b91c1c;
}

.data-action-button span {
    display: none;
}

.data-action-button--label span {
    display: inline;
}

.data-empty {
    align-items: center;
    color: var(--data-muted);
    display: flex;
    flex-direction: column;
    gap: .5rem;
    justify-content: center;
    min-height: 220px;
    padding: 2rem;
    text-align: center;
}

.data-empty i {
    color: #b5c1d0;
    font-size: 2.2rem;
}

.data-empty strong {
    color: var(--data-text);
    font-size: 1.05rem;
}

.data-grid-view {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 1rem;
}

.data-grid-view[hidden] {
    display: none;
}

.data-grid-card {
    padding: 1rem;
}

.data-grid-card.is-muted {
    opacity: .72;
}

.data-grid-card__header {
    justify-content: space-between;
    margin-bottom: .8rem;
}

.data-grid-card p {
    margin-bottom: 1rem;
}

.data-grid-card dl {
    display: grid;
    gap: .6rem;
    margin: 0 0 1rem;
}

.data-grid-card dl div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.data-grid-card dt {
    color: var(--data-muted);
    font-weight: 700;
}

.data-grid-card dd {
    color: #344154;
    font-weight: 800;
    margin: 0;
    text-align: right;
}

.data-count-badge {
    align-items: center;
    background: var(--data-brand-soft);
    border-radius: 999px;
    color: var(--data-brand-dark);
    display: inline-flex;
    font-weight: 900;
    height: 38px;
    justify-content: center;
    min-width: 38px;
    padding: 0 .7rem;
}

.data-grid-card__actions {
    border-top: 1px solid #edf2f7;
    justify-content: flex-end;
    padding-top: .8rem;
}

@media (max-width: 1199.98px) {
    .data-stat-grid,
    .data-grid-view,
    .balance-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .data-profile-card {
        grid-template-columns: auto 1fr;
    }

    .data-profile-card__link {
        grid-column: 2;
        justify-content: flex-start;
    }

    .data-inline-form {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }

    .data-inline-form__wide {
        grid-column: 1 / -1;
    }

    .settings-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .settings-layout {
        grid-template-columns: 1fr;
    }
}

.data-row-actions--visible {
    opacity: 1;
}

.data-pill {
    background: #eef2f7;
    border-radius: 999px;
    color: #526278;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 900;
    padding: .25rem .6rem;
}

.data-table-legend {
    align-items: center;
    color: #8b9ab0;
    display: inline-flex;
    font-size: .84rem;
    font-weight: 850;
    gap: .35rem;
}

.data-table-legend i {
    background: #cbd5e1;
    border-radius: 999px;
    height: 8px;
    width: 8px;
}

.data-table-legend--danger i {
    background: #ef4444;
}

.data-value {
    font-weight: 900;
}

.data-value--warning {
    color: #ea580c;
}

.data-value--purple {
    color: #8b5cf6;
}

.data-table--balances {
    min-width: 1320px;
}

@media (max-width: 991.98px) {
    .data-page__header,
    .data-toolbar,
    .data-tab-card__header {
        align-items: stretch;
        flex-direction: column;
    }

    .data-page__actions,
    .data-toolbar__controls {
        flex-wrap: wrap;
    }

    .data-search {
        max-width: none;
    }

    .data-tab-card__period {
        margin: 0 0 1rem;
    }
}

@media (max-width: 1400px) {
    .data-filter-card {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .data-filter-field--wide,
    .data-filter-actions {
        grid-column: span 3;
    }
}

@media (max-width: 720px) {
    .data-filter-card {
        grid-template-columns: 1fr;
    }

    .data-filter-field--wide,
    .data-filter-actions {
        grid-column: auto;
    }

    .data-filter-actions {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 767.98px) {
    .data-stat-grid,
    .data-grid-view,
    .balance-summary-grid {
        grid-template-columns: 1fr;
    }

    .data-page__actions .data-button {
        flex: 1 1 auto;
    }

    .data-profile-card,
    .data-inline-form {
        grid-template-columns: 1fr;
    }

    .data-profile-card__link {
        grid-column: auto;
    }

    .balance-summary-card__details {
        grid-template-columns: 1fr;
    }

    .settings-hero,
    .settings-card-grid,
    .settings-form__grid,
    .settings-form__grid--3,
    .settings-option-grid,
    .leave-request-layout,
    .leave-type-grid,
    .my-leaves-layout,
    .my-leaves-toolbar {
        grid-template-columns: 1fr;
    }

    .settings-hero__stats,
    .settings-tabs {
        align-items: stretch;
        flex-direction: column;
    }

    .settings-field--full {
        grid-column: auto;
    }

    .leave-request-side {
        position: static;
    }

    .leave-request-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .leave-request-actions > div,
    .leave-request-actions .data-button {
        width: 100%;
    }

    .my-leaves-count {
        justify-self: start;
    }

    .my-leaves-timeline article {
        align-items: start;
        grid-template-columns: 1fr;
    }
}