/* ==========================================
   Nuvex Finance — Custom Styles
   ========================================== */

/* ---- Design tokens (varsayılan; oturumda theme-vars.php ile güncellenir) ---- */
:root {
    --brand: #14b8a6;
    --brand-hover: #0d9488;
    --brand-soft: color-mix(in srgb, var(--brand) 12%, transparent);
    --brand-soft-md: color-mix(in srgb, var(--brand) 18%, transparent);
    --brand-ring: color-mix(in srgb, var(--brand) 28%, transparent);
    --brand-shadow: color-mix(in srgb, var(--brand) 32%, transparent);
    --color-income: #059669;
    --color-income-soft: color-mix(in srgb, var(--color-income) 12%, transparent);
    --color-expense: #e11d48;
    --color-expense-soft: color-mix(in srgb, var(--color-expense) 12%, transparent);
}

/* ---- Birleşik buton sistemi ---- */
.nvx-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 0.45rem;
    padding: 0.625rem 1.1rem; border-radius: 12px; border: none; cursor: pointer;
    font-size: 0.875rem; font-weight: 600; line-height: 1.2;
    transition: background 0.15s, color 0.15s, box-shadow 0.15s, transform 0.12s;
}
.nvx-btn:active { transform: scale(0.98); }
.nvx-btn--primary {
    background: var(--brand); color: #fff;
    box-shadow: 0 4px 14px var(--brand-shadow);
}
.nvx-btn--primary:hover { background: var(--brand-hover); }
.nvx-btn--ghost {
    background: #f3f4f6; color: #475569; border: 1px solid #e5e7eb;
}
.dark .nvx-btn--ghost { background: rgba(255,255,255,0.06); color: #cbd5e1; border-color: rgba(255,255,255,0.08); }
.nvx-btn--income { background: var(--color-income-soft); color: var(--color-income); border: 1px solid color-mix(in srgb, var(--color-income) 25%, transparent); }
.nvx-btn--expense { background: var(--color-expense-soft); color: var(--color-expense); border: 1px solid color-mix(in srgb, var(--color-expense) 25%, transparent); }
.nvx-btn--sm { padding: 0.45rem 0.85rem; font-size: 0.8125rem; border-radius: 10px; }
.nvx-btn--block { width: 100%; }

.text-brand { color: var(--brand); }
.bg-brand { background: var(--brand); }
.bg-brand-soft { background: var(--brand-soft); }

/* ---- Scrollbar ---- */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--brand) 35%, transparent);
    border-radius: 100px;
}
::-webkit-scrollbar-thumb:hover {
    background: color-mix(in srgb, var(--brand) 55%, transparent);
}

/* ---- Page Transitions ---- */
main {
    animation: fadeInUp 0.4s ease-out;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ---- Stat Card Animation ---- */
.stat-card {
    animation: scaleIn 0.5s ease-out backwards;
}
.stat-card:nth-child(1) { animation-delay: 0.05s; }
.stat-card:nth-child(2) { animation-delay: 0.1s; }
.stat-card:nth-child(3) { animation-delay: 0.15s; }
.stat-card:nth-child(4) { animation-delay: 0.2s; }

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* ---- Navigation Links (legacy) ---- */
.nav-link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    border-radius: 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #6b7280;
    transition: all 0.2s ease;
}

.nav-link:hover {
    background-color: var(--brand-soft);
    color: var(--brand-hover);
}

.nav-link.active {
    background: linear-gradient(135deg, var(--brand-soft), color-mix(in srgb, var(--brand) 8%, transparent));
    color: var(--brand-hover);
    font-weight: 600;
}

.dark .nav-link {
    color: #9ca3af;
}

.dark .nav-link:hover {
    background-color: var(--brand-soft);
    color: color-mix(in srgb, var(--brand) 85%, white);
}

.dark .nav-link.active {
    background: linear-gradient(135deg, var(--brand-soft-md), color-mix(in srgb, var(--brand) 10%, transparent));
    color: color-mix(in srgb, var(--brand) 85%, white);
}

/* ---- Glassmorphism ---- */
.glass {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.dark .glass {
    background: rgba(17, 24, 39, 0.7);
    border: 1px solid var(--brand-soft);
}

/* ---- Toast Notification ---- */
.toast {
    animation: toastSlideIn 0.4s ease-out;
    min-width: 280px;
    max-width: 400px;
}

.toast.hiding {
    animation: toastSlideOut 0.3s ease-in forwards;
}

@keyframes toastSlideIn {
    from {
        opacity: 0;
        transform: translateX(100px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

@keyframes toastSlideOut {
    from {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
    to {
        opacity: 0;
        transform: translateX(100px) scale(0.95);
    }
}

/* ---- Modal Animation ---- */
.modal-enter {
    opacity: 1 !important;
    transform: scale(1) !important;
}

/* ---- Pulse dot ---- */
.pulse-dot {
    position: relative;
}
.pulse-dot::after {
    content: '';
    position: absolute;
    top: -2px;
    right: -2px;
    width: 8px;
    height: 8px;
    background: var(--brand);
    border-radius: 50%;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(1.5); }
}

/* ---- Number Counter Animation ---- */
@keyframes countUp {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ---- Chart Container ---- */
canvas {
    max-width: 100% !important;
}

/* ---- Input Focus Glow ---- */
input:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: var(--brand) !important;
    box-shadow: 0 0 0 3px var(--brand-ring) !important;
}

.dark input:focus,
.dark select:focus,
.dark textarea:focus {
    box-shadow: 0 0 0 3px var(--brand-ring) !important;
}

/* ---- Loading Spinner ---- */
.spinner {
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

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

/* ---- Responsive Fixes ---- */
@media (max-width: 640px) {
    .stat-card p[data-counter] {
        font-size: 1.375rem;
    }
}

/* ---- Selection Color ---- */
::selection {
    background-color: color-mix(in srgb, var(--brand) 30%, transparent);
    color: inherit;
}

/* ---- Table Hover Row ---- */
tr {
    transition: background-color 0.15s ease;
}

/* ---- Smooth Color Scheme Transition ---- */
* {
    transition-property: background-color, border-color, color;
    transition-duration: 0.15s;
    transition-timing-function: ease;
}
/* Exception for elements that need different transitions */
button, a, .nav-link, .stat-card, input, select, textarea {
    transition: all 0.2s ease;
}

/* ---- Bank Logos ---- */
.bank-logo-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    user-select: none;
    line-height: 0;
    vertical-align: middle;
}

.bank-logo-wrap img {
    display: block;
    width: auto;
    height: 100%;
    max-width: none;
    object-fit: contain;
    object-position: left center;
}

/* İşlem tablosu */
.bank-logo-wrap--sm {
    height: 36px;
}

.bank-logo-wrap--sm img {
    height: 36px;
    max-height: 36px;
}

/* Dashboard */
.bank-logo-wrap--md {
    height: 44px;
}

.bank-logo-wrap--md img {
    height: 44px;
    max-height: 44px;
}

/* Cüzdan kartları */
.bank-logo-wrap--lg {
    height: 52px;
}

.bank-logo-wrap--lg img {
    height: 52px;
    max-height: 52px;
}

.bank-logo-fallback,
.bank-logo-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    letter-spacing: -0.02em;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    flex-shrink: 0;
    user-select: none;
    overflow: hidden;
    vertical-align: middle;
}

.bank-logo-fallback--sm,
.bank-logo-badge--sm {
    width: 36px;
    height: 36px;
    font-size: 10px;
    border-radius: 8px;
}

.bank-logo-fallback--md,
.bank-logo-badge--md {
    width: 44px;
    height: 44px;
    font-size: 11px;
    border-radius: 9px;
}

.bank-logo-fallback--lg,
.bank-logo-badge--lg {
    width: 52px;
    height: 52px;
    font-size: 12px;
    border-radius: 10px;
}

.bank-logo-badge {
    border: 1px solid rgba(0, 0, 0, 0.06);
}

.bank-logo-badge--img {
    padding: 0;
    overflow: hidden;
    border: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

.bank-logo-badge--img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.bank-logo-emblem {
    width: 55%;
    height: 55%;
    color: #ffffff;
}

/* Karanlık mod: şeffaf/koyu wordmark logolar için açık zemin */
.dark .bank-logo-wrap {
    background: #ffffff;
    border-radius: 7px;
    padding: 4px 8px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 1px 3px rgba(0, 0, 0, 0.25);
}

.dark .bank-logo-wrap--sm {
    height: auto;
    min-height: 32px;
}

.dark .bank-logo-wrap--sm img {
    height: 28px;
    max-height: 28px;
}

.dark .bank-logo-wrap--md {
    height: auto;
    min-height: 40px;
}

.dark .bank-logo-wrap--md img {
    height: 36px;
    max-height: 36px;
}

.dark .bank-logo-wrap--lg {
    height: auto;
    min-height: 48px;
}

.dark .bank-logo-wrap--lg img {
    height: 44px;
    max-height: 44px;
}

.dark .bank-logo-badge--img {
    background: #ffffff;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 1px 3px rgba(0, 0, 0, 0.25);
}

/* ---- Auth Pages ---- */
.auth-page {
    min-height: 100vh;
    font-family: 'Figtree', system-ui, sans-serif;
    color: #374151;
    background-color: #e8eaef;
    background-image:
        linear-gradient(165deg, #f0f2f6 0%, #e4e7ec 45%, #dfe3e9 100%);
}

.auth-scene {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.25rem;
    position: relative;
    overflow: hidden;
}

.auth-scene::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(15, 23, 42, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 23, 42, 0.035) 1px, transparent 1px);
    background-size: 40px 40px;
    mask-image: radial-gradient(ellipse 70% 65% at 50% 45%, #000 30%, transparent 100%);
    pointer-events: none;
}

.auth-scene::after {
    content: '';
    position: absolute;
    width: min(520px, 90vw);
    height: min(520px, 90vw);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(99, 102, 241, 0.07) 0%, transparent 68%);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -52%);
    pointer-events: none;
}

/* Ana kart */
.auth-card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 420px;
    background: #fff;
    border-radius: 16px;
    padding: 2.25rem 2rem 2rem;
    box-shadow: 0 4px 24px rgba(15, 23, 42, 0.06), 0 1px 3px rgba(15, 23, 42, 0.04);
}

/* Logo */
.auth-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    text-decoration: none;
    margin-bottom: 1.75rem;
}

.auth-logo__text {
    font-size: 1.0625rem;
    font-weight: 700;
    color: #1f2937;
    letter-spacing: -0.02em;
}

/* Başlık */
.auth-head {
    text-align: center;
    margin-bottom: 1.75rem;
}

.auth-head__title {
    font-size: 1.625rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: #111827;
    line-height: 1.25;
}

.auth-head__sub {
    font-size: 0.9375rem;
    color: #6b7280;
    margin-top: 0.4rem;
}

/* Uyarı */
.auth-alert {
    padding: 0.65rem 0.85rem;
    border-radius: 10px;
    font-size: 0.8125rem;
    margin-bottom: 1.1rem;
    line-height: 1.4;
    text-align: center;
}

.auth-alert--error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #b91c1c;
}

/* Form */
.auth-form {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

.auth-field__label {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.45rem;
}

.auth-field__input {
    width: 100%;
    padding: 0.75rem 0.9rem;
    font-size: 0.875rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    color: #1f2937;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.auth-field__pwd .auth-field__input {
    padding-right: 2.75rem;
}

.auth-field__input::placeholder {
    color: #9ca3af;
}

.auth-field__input:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-ring);
}

.auth-field__pwd {
    position: relative;
}

.auth-pwd-toggle {
    position: absolute;
    right: 0.65rem;
    top: 50%;
    transform: translateY(-50%);
    padding: 0.25rem;
    background: none;
    border: none;
    cursor: pointer;
    color: #9ca3af;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.12s;
}

.auth-pwd-toggle:hover {
    color: #6b7280;
}

.auth-pwd-toggle svg {
    width: 1.15rem;
    height: 1.15rem;
}

.auth-pwd-toggle__hide { display: none; }
.auth-pwd-toggle.is-visible .auth-pwd-toggle__show { display: none; }
.auth-pwd-toggle.is-visible .auth-pwd-toggle__hide { display: block; }

.auth-remember {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #4b5563;
    cursor: pointer;
    user-select: none;
    margin-top: -0.15rem;
}

.auth-remember input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--brand);
    cursor: pointer;
}

.auth-submit {
    width: 100%;
    margin-top: 0.25rem;
    padding: 0.8rem 1rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #fff;
    background: var(--brand);
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: background 0.15s, transform 0.12s, box-shadow 0.15s;
    box-shadow: 0 2px 8px var(--brand-shadow);
}

.auth-submit:hover {
    background: var(--brand-hover);
    transform: translateY(-1px);
    box-shadow: 0 4px 14px var(--brand-shadow);
}

.auth-submit:active {
    transform: translateY(0);
}

.auth-foot {
    margin-top: 1.5rem;
    text-align: center;
}

.auth-foot p {
    font-size: 0.875rem;
    color: #6b7280;
}

.auth-foot a {
    color: var(--brand);
    font-weight: 600;
    text-decoration: none;
}

.auth-foot a:hover {
    text-decoration: underline;
}

.auth-foot__demo {
    margin-top: 0.65rem;
    font-size: 0.75rem;
    color: #9ca3af;
}

.auth-foot__demo code {
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    font-size: 0.6875rem;
    color: #6b7280;
    background: #f9fafb;
    padding: 0.1rem 0.35rem;
    border-radius: 4px;
}

@media (max-width: 480px) {
    .auth-card {
        padding: 1.75rem 1.35rem 1.5rem;
    }

    .auth-head__title {
        font-size: 1.375rem;
    }
}

/* ---- Dashboard & Cards ---- */
.app-shell {
    background: #f3f4f6;
}

.dark.app-shell,
html.dark body.app-shell {
    background: #0a0e14;
}

.app-main {
    max-width: 1440px;
}

.nvx-money {
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}

.card-surface {
    background: #ffffff;
    border: 1px solid #e2e5ea;
    border-radius: 10px;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}

.dark .card-surface {
    background: #131920;
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: none;
}

.card-surface:hover {
    border-color: #d4d8de;
}

.dash-panel {
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 10px;
    padding: 1.125rem 1.25rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}

.dark .dash-panel {
    background: #131920;
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: none;
}

.dash-panel__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.dash-panel__title {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #1f2937;
}

.dark .dash-panel__title {
    color: #f3f4f6;
}

.dash-panel__sub {
    font-size: 0.6875rem;
    color: #9ca3af;
    margin-top: 0.125rem;
}

.dash-panel__link {
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--user-accent);
    white-space: nowrap;
}

.dash-panel__link:hover {
    text-decoration: underline;
}

/* Welcome kart */
.dash-welcome {
    padding: 0;
    overflow: hidden;
}

.dash-welcome__body {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    padding: 1.125rem 1.25rem 0.875rem;
    gap: 0.5rem;
    position: relative;
    min-height: 0;
}

.dash-welcome__content {
    flex: 1;
    min-width: 0;
    z-index: 1;
}

.dash-welcome__greet {
    font-size: 0.8125rem;
    color: #6b7280;
    margin-bottom: 0.125rem;
}

.dash-welcome__date {
    font-size: 0.6875rem;
    color: #9ca3af;
    margin-bottom: 0.75rem;
}

.dash-welcome__label {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ca3af;
    margin-bottom: 0.25rem;
}

.dash-welcome__balance {
    font-size: 1.75rem;
    font-weight: 700;
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.03em;
    color: #111827;
    line-height: 1.15;
    margin-bottom: 0.875rem;
}

.dark .dash-welcome__balance {
    color: #fff;
}

@media (min-width: 1024px) {
    .dash-welcome__balance {
        font-size: 2rem;
    }
}

.dash-welcome__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.dash-welcome__art {
    display: none;
}

.dash-welcome__footer {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid #eef1f6;
    background: #f9fafb;
}

.dark .dash-welcome__footer {
    border-top-color: rgba(255, 255, 255, 0.06);
    background: rgba(255, 255, 255, 0.02);
}

.dash-welcome__mini {
    padding: 0.625rem 1rem;
    border-right: 1px solid #eef1f6;
}

.dark .dash-welcome__mini {
    border-right-color: rgba(255, 255, 255, 0.06);
}

.dash-welcome__mini:last-child {
    border-right: none;
}

.dash-welcome__mini-label {
    display: block;
    font-size: 0.5625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #9ca3af;
    margin-bottom: 0.125rem;
}

.dash-welcome__mini-value {
    display: block;
    font-size: 0.9375rem;
    font-weight: 800;
    color: #111827;
    letter-spacing: -0.02em;
}

.dark .dash-welcome__mini-value {
    color: #f3f4f6;
}

.dash-welcome__mini-change {
    font-size: 0.5625rem;
    font-weight: 600;
}

.dash-welcome__mini-change.up { color: #059669; }
.dash-welcome__mini-change.down { color: #e11d48; }

.dash-welcome__mini--income .dash-welcome__mini-value { color: #059669; }
.dash-welcome__mini--expense .dash-welcome__mini-value { color: #e11d48; }

/* Dashboard butonları */
.dash-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4375rem 0.75rem;
    border-radius: 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    transition: all 0.15s ease;
}

.dash-btn--income {
    background: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}

.dash-btn--income:hover { background: #d1fae5; }

.dash-btn--expense {
    background: #fff1f2;
    color: #e11d48;
    border: 1px solid #fecdd3;
}

.dash-btn--expense:hover { background: #ffe4e6; }

.dash-btn--ghost {
    background: #f3f4f6;
    color: #4b5563;
    border: 1px solid #e5e7eb;
}

.dash-btn--ghost:hover { background: #e5e7eb; }

.dark .dash-btn--income { background: rgba(16, 185, 129, 0.12); border-color: rgba(16, 185, 129, 0.2); }
.dark .dash-btn--expense { background: rgba(244, 63, 94, 0.12); border-color: rgba(244, 63, 94, 0.2); }
.dark .dash-btn--ghost { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.08); color: #d1d5db; }

/* Cüzdan listesi */
.dash-wallet-list {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.dash-wallet-item__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.375rem;
}

.dash-wallet-item__pct {
    font-size: 0.75rem;
    font-weight: 600;
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    color: #64748b;
    flex-shrink: 0;
}

.dash-ai-card {
    background: #fff;
    border-top: 3px solid var(--user-accent);
    position: relative;
}

.dark .dash-ai-card {
    background: #131920;
    border-top-color: var(--user-accent);
}

.dash-ai-card__icon {
    width: 2rem;
    height: 2rem;
    border-radius: 6px;
    background: var(--user-accent-soft, var(--brand-soft));
    color: var(--user-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.75rem;
}

.dash-btn--ai {
    background: #1e2430;
    color: #fff;
    border: none;
}

.dash-btn--ai:hover {
    background: #2d3542;
}

.dark .dash-btn--ai {
    background: #f3f4f6;
    color: #111827;
}

.dark .dash-btn--ai:hover {
    background: #e5e7eb;
}

.wallet-card {
    background: linear-gradient(135deg, rgba(255,255,255,0.02), transparent);
    position: relative;
    overflow: hidden;
}

.wallet-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: var(--wallet-accent, var(--brand));
    border-radius: 3px 0 0 3px;
    opacity: 0.7;
}

.landing-mockup {
    animation: mockupFloat 6s ease-in-out infinite;
}

@keyframes mockupFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

/* ==========================================
   Sidebar — nötr finans paneli
   ========================================== */
.nvx-sidebar {
    width: 252px;
    height: 100vh;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-right: 1px solid #e8ecf1;
}

.dark .nvx-sidebar {
    background: #0c1117;
    border-right-color: rgba(255, 255, 255, 0.07);
}

.nvx-sidebar__brand {
    padding: 1.125rem 1rem 1rem;
    border-bottom: 1px solid #eef1f5;
}

.dark .nvx-sidebar__brand {
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

.nvx-sidebar__brand-link {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

/* Nuvex mark — sidebar, auth, landing */
.nvx-logo {
    display: block;
    flex-shrink: 0;
    border-radius: 9px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(15, 118, 110, 0.18), 0 0 0 1px rgba(15, 118, 110, 0.08);
}
.nvx-logo__svg {
    width: 100%;
    height: 100%;
    display: block;
}
.nvx-logo__tile {
    fill: #0f766e;
}
.dark .nvx-logo {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(45, 212, 191, 0.12);
}
.dark .nvx-logo__tile {
    fill: #115e59;
}

.nvx-sidebar__app {
    display: block;
    font-size: 0.9375rem;
    font-weight: 700;
    color: #111827;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.dark .nvx-sidebar__app {
    color: #f3f4f6;
}

.nvx-sidebar__tag {
    display: block;
    font-size: 0.6875rem;
    color: #94a3b8;
    font-weight: 500;
    margin-top: 0.125rem;
}

.nvx-sidebar__nav {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem 0.625rem;
}

.nvx-sidebar__divider {
    height: 1px;
    margin: 0.625rem 0.5rem;
    background: #eef1f5;
}

.dark .nvx-sidebar__divider {
    background: rgba(255, 255, 255, 0.06);
}

.nvx-sidebar__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.nvx-sidebar__link {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.625rem;
    margin-bottom: 1px;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #64748b;
    transition: background 0.12s ease, color 0.12s ease;
}

.dark .nvx-sidebar__link {
    color: #94a3b8;
}

.nvx-sidebar__link:hover {
    background: #f4f6f8;
    color: #1e293b;
}

.dark .nvx-sidebar__link:hover {
    background: rgba(255, 255, 255, 0.04);
    color: #e2e8f0;
}

.nvx-sidebar__link--active {
    background: color-mix(in srgb, var(--user-accent) 10%, transparent);
    color: var(--user-accent);
    font-weight: 600;
}

.dark .nvx-sidebar__link--active {
    background: color-mix(in srgb, var(--user-accent) 14%, transparent);
    color: color-mix(in srgb, var(--user-accent) 85%, white);
}

.nvx-sidebar__icon {
    width: 1.125rem;
    height: 1.125rem;
    flex-shrink: 0;
    opacity: 0.9;
}

.nvx-sidebar__icon svg {
    width: 100%;
    height: 100%;
}

.nvx-sidebar__foot {
    padding: 0.75rem 0.625rem;
    border-top: 1px solid #eef1f5;
}

.dark .nvx-sidebar__foot {
    border-top-color: rgba(255, 255, 255, 0.06);
}

.nvx-sidebar__user {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem;
    border-radius: 0.625rem;
    background: #f8fafc;
}

.dark .nvx-sidebar__user {
    background: rgba(255, 255, 255, 0.03);
}

.nvx-sidebar__name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1e293b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dark .nvx-sidebar__name {
    color: #f1f5f9;
}

.nvx-sidebar__mail {
    font-size: 0.6875rem;
    color: #94a3b8;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nvx-sidebar__logout {
    padding: 0.375rem;
    border-radius: 0.375rem;
    color: #94a3b8;
    flex-shrink: 0;
    transition: color 0.12s, background 0.12s;
}

.nvx-sidebar__logout:hover {
    color: #ef4444;
    background: rgba(239, 68, 68, 0.08);
}

.nvx-sidebar__user .user-avatar {
    flex-shrink: 0;
}

/* Eski sidebar sınıfları — geriye dönük */
.app-sidebar {
    width: 268px;
    height: 100vh;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, #1e1b4b 0%, #151338 45%, #0f0d24 100%);
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 4px 0 24px rgba(15, 13, 36, 0.15);
}

.app-sidebar__head {
    padding: 1.25rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.app-sidebar__brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.app-sidebar__title {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.app-sidebar__subtitle {
    font-size: 0.6875rem;
    color: rgba(165, 180, 252, 0.65);
    font-weight: 500;
}

.app-sidebar__nav {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem 0.625rem;
}

.sidebar-section {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(165, 180, 252, 0.45);
    padding: 0.875rem 0.75rem 0.375rem;
    margin: 0;
}

.sidebar-section:first-child {
    padding-top: 0.25rem;
}

.sidebar-link {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5625rem 0.75rem;
    margin-bottom: 2px;
    border-radius: 0.625rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: rgba(226, 232, 240, 0.72);
    transition: background 0.15s ease, color 0.15s ease;
    position: relative;
}

.sidebar-link:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}

.sidebar-link--active {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-weight: 600;
}

.sidebar-link--active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 60%;
    background: var(--user-accent);
    border-radius: 0 4px 4px 0;
}

.sidebar-link__icon {
    width: 1.125rem;
    height: 1.125rem;
    flex-shrink: 0;
    opacity: 0.85;
}

.sidebar-link__icon svg {
    width: 100%;
    height: 100%;
}

.sidebar-link__label {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sidebar-badge {
    font-size: 0.5625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.125rem 0.375rem;
    border-radius: 999px;
    background: rgba(139, 92, 246, 0.25);
    color: #c4b5fd;
}

.app-sidebar__promo {
    margin: 0 0.625rem 0.5rem;
    padding: 0.75rem;
    border-radius: 0.75rem;
    background: var(--brand-soft);
    border: 1px solid rgba(129, 140, 248, 0.15);
}

.app-sidebar__user {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(0, 0, 0, 0.15);
}

.app-sidebar__avatar {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.625rem;
    background: linear-gradient(135deg, var(--brand), var(--brand));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
}

.sidebar-logout {
    padding: 0.375rem;
    border-radius: 0.5rem;
    color: rgba(165, 180, 252, 0.5);
    transition: color 0.15s, background 0.15s;
}

.sidebar-logout:hover {
    color: #fca5a5;
    background: rgba(239, 68, 68, 0.12);
}

/* ==========================================
   App Header
   ========================================== */
.app-header {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0 1rem;
    height: 3.75rem;
    background: #fff;
    border-bottom: 1px solid #e5e9f0;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.03);
}

.dark .app-header {
    background: rgba(6, 13, 24, 0.92);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

@media (min-width: 1024px) {
    .app-header {
        padding: 0 1.75rem;
    }
}

.app-header__left {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.app-header__menu {
    padding: 0.5rem;
    border-radius: 0.625rem;
    color: #6b7280;
}

.app-header__menu:hover {
    background: rgba(0, 0, 0, 0.05);
}

.app-header__context {
    min-width: 0;
}

.app-header__title {
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: min(42vw, 14rem);
}

@media (min-width: 640px) {
    .app-header__title {
        max-width: 16rem;
    }
}

.dark .app-header__title {
    color: #f9fafb;
}

/* ==========================================
   Page Hero (ortak sayfa başlığı)
   ========================================== */
.page-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
    flex-wrap: wrap;
    padding: 1.35rem 1.5rem;
    border-radius: 16px;
    background: #fff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.dark .page-hero {
    background: #131920;
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: none;
}

.page-hero--accent {
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 9%, #fff), #fff);
    border-color: color-mix(in srgb, var(--brand) 14%, #e2e8f0);
}

.dark .page-hero--accent {
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 12%, #131920), #131920);
    border-color: color-mix(in srgb, var(--brand) 16%, transparent);
}

.page-hero__main {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    min-width: 0;
    flex: 1;
}

.page-hero__icon {
    width: 3rem;
    height: 3rem;
    border-radius: 14px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--brand) 14%, transparent);
    color: var(--brand);
}

.page-hero__icon svg {
    width: 1.5rem;
    height: 1.5rem;
}

.page-hero__kicker {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #94a3b8;
    margin-bottom: 0.15rem;
}

.page-hero__title {
    font-size: clamp(1.25rem, 2.5vw, 1.5rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    color: #0f172a;
    line-height: 1.2;
}

.dark .page-hero__title {
    color: #f8fafc;
}

.page-hero__sub {
    font-size: 0.875rem;
    color: #64748b;
    margin-top: 0.35rem;
    max-width: 36rem;
    line-height: 1.45;
}

.page-hero__aside {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.page-hero__actions {
    flex-shrink: 0;
}

.page-hero__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 1.15rem;
    background: var(--brand);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s, transform 0.15s, box-shadow 0.15s;
    box-shadow: 0 1px 2px color-mix(in srgb, var(--brand) 25%, transparent);
}

.page-hero__btn:hover {
    background: var(--brand-hover);
    transform: translateY(-1px);
}

.page-hero__btn svg {
    width: 1rem;
    height: 1rem;
}

.page-hero__badge {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.15);
    color: #64748b;
}

.page-hero__badge.is-on {
    background: rgba(16, 185, 129, 0.12);
    color: #10b981;
}

.page-empty {
    text-align: center;
    padding: 3rem 1.5rem;
}

.page-empty__icon {
    width: 3.25rem;
    height: 3.25rem;
    margin: 0 auto 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--brand) 10%, transparent);
    border-radius: 14px;
    color: var(--brand);
}

.page-empty__icon svg {
    width: 1.5rem;
    height: 1.5rem;
}

.page-empty__title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #475569;
}

.dark .page-empty__title {
    color: #cbd5e1;
}

.page-empty__sub {
    font-size: 0.8125rem;
    color: #94a3b8;
    margin-top: 0.35rem;
    max-width: 22rem;
    margin-left: auto;
    margin-right: auto;
}

.page-empty__btn {
    margin-top: 1rem;
}

.app-header__search {
    flex: 1;
    max-width: 420px;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.875rem;
    border-radius: 0.75rem;
    background: #f3f4f6;
    border: 1px solid transparent;
}

.dark .app-header__search {
    background: rgba(255, 255, 255, 0.05);
}

.app-header__search:focus-within {
    border-color: color-mix(in srgb, var(--brand) 35%, transparent);
    box-shadow: 0 0 0 3px var(--brand-ring);
}

.app-header__search-input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    font-size: 0.8125rem;
    color: inherit;
    box-shadow: none !important;
}

.app-header__actions {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-left: auto;
}

.app-header__quick-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4375rem 0.875rem;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 600;
    background: var(--user-accent);
    color: #fff;
    box-shadow: 0 1px 4px var(--user-accent-ring, rgba(99, 102, 241, 0.25));
    transition: background 0.15s, filter 0.15s;
}

.app-header__quick-btn:hover {
    filter: brightness(1.08);
}

.app-header__icon-btn {
    padding: 0.5rem;
    border-radius: 0.625rem;
    color: #6b7280;
}

.app-header__icon-btn:hover {
    background: rgba(0, 0, 0, 0.05);
}

.dark .app-header__icon-btn:hover {
    background: rgba(255, 255, 255, 0.06);
}

.app-header__profile {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.5rem 0.25rem 0.25rem;
    border-radius: 0.625rem;
    transition: background 0.15s;
}

.app-header__profile:hover {
    background: rgba(0, 0, 0, 0.04);
}

.dark .app-header__profile:hover {
    background: rgba(255, 255, 255, 0.06);
}

.app-header__profile-name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #374151;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dark .app-header__profile-name {
    color: #e5e7eb;
}

/* User avatar */
.user-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--avatar-bg, var(--brand));
    color: #fff;
    font-weight: 700;
    letter-spacing: -0.02em;
    border-radius: 0.5rem;
    user-select: none;
    line-height: 1;
}

.user-avatar--sm {
    width: 2rem;
    height: 2rem;
    font-size: 0.625rem;
}

.user-avatar--md {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 0.6875rem;
}

.user-avatar--lg {
    width: 2.75rem;
    height: 2.75rem;
    font-size: 0.8125rem;
}

.user-avatar--ring {
    box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--user-accent-ring, rgba(99, 102, 241, 0.25));
}

.dark .user-avatar--ring {
    box-shadow: 0 0 0 2px #0c1222, 0 0 0 3px var(--brand-ring);
}

.app-sidebar__user .user-avatar {
    border-radius: 0.625rem;
}

.app-dropdown {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 0.875rem;
    padding: 0.375rem;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}

.dark .app-dropdown {
    background: #0c1222;
    border-color: rgba(255, 255, 255, 0.08);
}

.app-dropdown__item {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    width: 100%;
    padding: 0.625rem 0.75rem;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    text-align: left;
    transition: background 0.15s;
}

.app-dropdown__item:hover {
    background: rgba(0, 0, 0, 0.04);
}

.dark .app-dropdown__item:hover {
    background: rgba(255, 255, 255, 0.05);
}

/* ==========================================
   Dashboard v3 widgets
   ========================================== */
.dash-progress {
    height: 6px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.dark .dash-progress {
    background: rgba(255, 255, 255, 0.08);
}

.dash-progress__bar {
    height: 100%;
    border-radius: 999px;
    transition: width 0.6s ease;
}

.dash-insight {
    padding: 1rem;
    border-radius: 0.875rem;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.dash-insight--rose {
    background: rgba(244, 63, 94, 0.06);
    border-color: rgba(244, 63, 94, 0.12);
}

.dash-insight--emerald {
    background: rgba(16, 185, 129, 0.06);
    border-color: rgba(16, 185, 129, 0.12);
}

.dash-insight--primary {
    background: var(--brand-soft);
    border-color: color-mix(in srgb, var(--brand) 20%, transparent);
}

.dash-insight--violet {
    background: var(--brand-soft);
    border-color: color-mix(in srgb, var(--brand) 20%, transparent);
}

.dash-insight__label {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    opacity: 0.65;
    margin-bottom: 0.5rem;
}

.dash-insight__name {
    font-size: 0.9375rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.dash-insight__amount {
    font-size: 1.125rem;
    font-weight: 800;
}

.dash-tab {
    padding: 0.375rem 0.875rem;
    border-radius: 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #6b7280;
    transition: all 0.15s;
}

.dash-tab--active {
    background: #fff;
    color: #111827;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.dark .dash-tab--active {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

/* Settings page */
.settings-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 1rem;
    align-items: start;
}
@media (max-width: 768px) { .settings-layout { grid-template-columns: 1fr; } }
.settings-nav { padding: 0; overflow: hidden; }
.settings-nav__profile {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 1rem 1.125rem; border-bottom: 1px solid #eef1f6;
}
.dark .settings-nav__profile { border-bottom-color: rgba(255,255,255,.06); }
.settings-nav__list { padding: 0.5rem; }
.settings-nav__link {
    display: flex; align-items: center; gap: 0.625rem;
    padding: 0.5625rem 0.75rem; border-radius: 0.5rem;
    font-size: 0.8125rem; font-weight: 500; color: #6b7280; margin-bottom: 2px;
}
.settings-nav__link svg { width: 1.125rem; height: 1.125rem; flex-shrink: 0; }
.settings-nav__link:hover { background: #f3f4f6; color: #374151; }
.settings-nav__link--active {
    background: var(--user-accent-soft); color: var(--user-accent); font-weight: 600;
}
.settings-section__title { font-size: 1rem; font-weight: 700; margin-bottom: 0.25rem; }
.settings-section__desc { font-size: 0.8125rem; color: #9ca3af; margin-bottom: 1.25rem; }
.settings-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 640px) { .settings-grid-2 { grid-template-columns: 1fr; } }
.settings-field { margin-bottom: 1rem; }
.settings-field label { display: block; font-size: 0.8125rem; font-weight: 600; margin-bottom: 0.375rem; }
.settings-field input, .settings-field select {
    width: 100%; padding: 0.625rem 0.875rem; border: 1px solid #e5e9f0;
    border-radius: 0.5rem; font-size: 0.875rem; background: #fff;
}
.dark .settings-field input, .dark .settings-field select {
    background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.08);
}
.settings-hint { font-size: 0.6875rem; color: #9ca3af; margin-top: 0.25rem; }
.settings-save {
    padding: 0.5625rem 1.25rem; background: var(--user-accent); color: #fff;
    font-size: 0.8125rem; font-weight: 600; border-radius: 0.5rem; border: none; cursor: pointer;
}
.settings-theme-picker { display: flex; gap: 0.75rem; }
.settings-theme-opt {
    flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.375rem;
    padding: 1rem; border: 2px solid #e5e9f0; border-radius: 0.75rem; cursor: pointer;
    font-size: 0.8125rem; font-weight: 600; color: #6b7280;
}
.settings-theme-opt.active { border-color: var(--user-accent); background: var(--user-accent-soft); color: var(--user-accent); }
.settings-accent-grid { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.settings-accent-swatch {
    width: 2rem; height: 2rem; border-radius: 50%; background: var(--swatch);
    cursor: pointer; border: 3px solid transparent;
}
.settings-accent-swatch.active { border-color: #fff; box-shadow: 0 0 0 2px var(--swatch); }
.settings-preview { padding: 1rem; background: #f9fafb; border-radius: 0.5rem; margin-bottom: 1rem; }
.settings-preview-btn {
    padding: 0.5rem 1rem; color: #fff; border: none; border-radius: 0.5rem;
    font-size: 0.8125rem; font-weight: 600; background: var(--user-accent);
}
.settings-alert--success { padding: 0.75rem 1rem; border-radius: 0.5rem; background: #ecfdf5; border: 1px solid #a7f3d0; color: #059669; font-size: 0.8125rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

/* Wallets premium */
/* Legacy wallet classes — kept for dashboard references */
.wallet-hero {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    background: linear-gradient(135deg, #1e1b4b, #312e81); border: none !important;
    color: #fff; padding: 1.25rem 1.5rem !important;
}
.wallet-hero__label { font-size: 0.6875rem; text-transform: uppercase; letter-spacing: .08em; opacity: .75; }
.wallet-hero__amount { font-size: 1.75rem; font-weight: 800; letter-spacing: -.03em; }
.wallet-hero__meta { font-size: 0.8125rem; opacity: .7; margin-top: 0.25rem; }
.wallet-hero__btn {
    display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.5625rem 1rem;
    background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.25);
    border-radius: 0.5rem; color: #fff; font-size: 0.8125rem; font-weight: 600;
}

/* ==========================================
   AI Advisor — editorial layout
   ========================================== */
.nvx-advisor {
    max-width: 1120px;
    margin: 0 auto;
}

.nvx-advisor__header {
    margin-bottom: 1.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid #e2e5ea;
}

.dark .nvx-advisor__header {
    border-bottom-color: rgba(255, 255, 255, 0.07);
}

.nvx-advisor__eyebrow {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #94a3b8;
    margin-bottom: 0.375rem;
}

.nvx-advisor__title {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #111827;
    margin-bottom: 0.375rem;
}

.dark .nvx-advisor__title {
    color: #f3f4f6;
}

.nvx-advisor__desc {
    font-size: 0.875rem;
    color: #64748b;
    max-width: 36rem;
    line-height: 1.55;
}

.nvx-advisor__meta {
    font-size: 0.75rem;
    color: #94a3b8;
    margin-top: 0.625rem;
}

.nvx-advisor__meta a {
    color: var(--user-accent, var(--brand-hover));
    margin-left: 0.375rem;
}

.nvx-advisor__meta a:hover {
    text-decoration: underline;
}

.nvx-advisor__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}

@media (min-width: 1024px) {
    .nvx-advisor__layout {
        grid-template-columns: 320px 1fr;
        align-items: start;
    }
}

.nvx-advisor__sidebar {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.nvx-advisor__block {
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 10px;
    padding: 1rem;
}

.dark .nvx-advisor__block {
    background: #131920;
    border-color: rgba(255, 255, 255, 0.06);
}

.nvx-advisor__block-title {
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 0.75rem;
}

.nvx-advisor__prompts {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.nvx-prompt {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    width: 100%;
    text-align: left;
    padding: 0.625rem 0.75rem;
    border-radius: 8px;
    border: 1px solid transparent;
    background: #f8fafc;
    transition: background 0.12s, border-color 0.12s;
}

.dark .nvx-prompt {
    background: rgba(255, 255, 255, 0.03);
}

.nvx-prompt:hover:not(:disabled) {
    background: #f1f5f9;
    border-color: #e2e5ea;
}

.dark .nvx-prompt:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.08);
}

.nvx-prompt:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.nvx-prompt__num {
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #94a3b8;
    padding-top: 0.125rem;
    flex-shrink: 0;
}

.nvx-prompt__body {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.nvx-prompt__body strong {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1e293b;
}

.dark .nvx-prompt__body strong {
    color: #e2e8f0;
}

.nvx-prompt__body small {
    font-size: 0.6875rem;
    color: #94a3b8;
    line-height: 1.4;
}

.nvx-advisor__textarea {
    width: 100%;
    padding: 0.75rem;
    font-size: 0.8125rem;
    line-height: 1.5;
    border: 1px solid #e2e5ea;
    border-radius: 8px;
    background: #f8fafc;
    resize: vertical;
    min-height: 88px;
}

.dark .nvx-advisor__textarea {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.08);
    color: #e2e8f0;
}

.nvx-advisor__submit {
    width: 100%;
    margin-top: 0.625rem;
    padding: 0.5625rem 1rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #fff;
    background: #1e2430;
    border-radius: 8px;
    transition: background 0.12s;
}

.nvx-advisor__submit:hover:not(:disabled) {
    background: #2d3542;
}

.dark .nvx-advisor__submit {
    background: #e5e7eb;
    color: #111827;
}

.dark .nvx-advisor__submit:hover:not(:disabled) {
    background: #f3f4f6;
}

.nvx-advisor__main {
    min-height: 320px;
}

.nvx-advisor__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 320px;
    padding: 2rem;
    background: #fff;
    border: 1px dashed #d4d8de;
    border-radius: 10px;
}

.dark .nvx-advisor__empty {
    background: #131920;
    border-color: rgba(255, 255, 255, 0.1);
}

.nvx-advisor__empty-icon {
    width: 3rem;
    height: 3rem;
    border-radius: 10px;
    background: #f1f5f9;
    color: #94a3b8;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.nvx-advisor__empty-icon svg {
    width: 1.5rem;
    height: 1.5rem;
}

.nvx-advisor__empty-title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 0.25rem;
}

.dark .nvx-advisor__empty-title {
    color: #cbd5e1;
}

.nvx-advisor__empty-text {
    font-size: 0.8125rem;
    color: #94a3b8;
}

.nvx-advisor__loading {
    min-height: 320px;
    padding: 2rem;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.dark .nvx-advisor__loading {
    background: #131920;
    border-color: rgba(255, 255, 255, 0.06);
}

.nvx-advisor__loading-bar {
    width: 120px;
    height: 3px;
    background: #e2e5ea;
    border-radius: 999px;
    overflow: hidden;
    position: relative;
    margin-bottom: 0.5rem;
}

.nvx-advisor__loading-bar::after {
    content: '';
    position: absolute;
    inset: 0;
    width: 40%;
    background: var(--user-accent, var(--brand-hover));
    border-radius: 999px;
    animation: nvxLoadSlide 1.2s ease-in-out infinite;
}

@keyframes nvxLoadSlide {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(350%); }
}

.nvx-advisor__loading p {
    font-size: 0.875rem;
    font-weight: 600;
    color: #334155;
}

.dark .nvx-advisor__loading p {
    color: #e2e8f0;
}

.nvx-advisor__loading span {
    font-size: 0.75rem;
    color: #94a3b8;
}

.nvx-advisor__result {
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 10px;
    overflow: hidden;
}

.dark .nvx-advisor__result {
    background: #131920;
    border-color: rgba(255, 255, 255, 0.06);
}

.nvx-advisor__result-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #eef1f5;
    background: #fafbfc;
}

.dark .nvx-advisor__result-head {
    background: rgba(255, 255, 255, 0.02);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

.nvx-advisor__result-label {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #1e293b;
    letter-spacing: -0.01em;
}

.dark .nvx-advisor__result-label {
    color: #f1f5f9;
}

.nvx-advisor__result-time {
    display: block;
    font-size: 0.6875rem;
    color: #94a3b8;
    margin-top: 0.125rem;
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
}

.nvx-advisor__copy {
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
    padding: 0.375rem 0.625rem;
    border: 1px solid #e2e5ea;
    border-radius: 6px;
    background: #fff;
    flex-shrink: 0;
}

.nvx-advisor__copy:hover {
    border-color: #cbd5e1;
    color: #334155;
}

.nvx-advisor__result-body {
    padding: 1.25rem 1.5rem 1.5rem;
    font-size: 0.875rem;
    line-height: 1.65;
    color: #334155;
}

.dark .nvx-advisor__result-body {
    color: #cbd5e1;
}

.nvx-report__h {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #111827;
    margin: 1.25rem 0 0.5rem;
    letter-spacing: -0.02em;
}

.nvx-report__h:first-child {
    margin-top: 0;
}

.dark .nvx-report__h {
    color: #f3f4f6;
}

.nvx-report__p {
    margin-bottom: 0.75rem;
}

.nvx-report__p:last-child {
    margin-bottom: 0;
}

.nvx-report__list {
    margin: 0.5rem 0 1rem;
    padding-left: 1.25rem;
    list-style: disc;
}

.nvx-report__list li {
    margin-bottom: 0.375rem;
}

.nvx-report__list li::marker {
    color: var(--user-accent, var(--brand-hover));
}

.nvx-advisor__notice {
    display: flex;
    gap: 1rem;
    padding: 1.25rem;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 10px;
}

.dark .nvx-advisor__notice {
    background: rgba(245, 158, 11, 0.08);
    border-color: rgba(245, 158, 11, 0.2);
}

.nvx-advisor__notice-icon {
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    background: #f59e0b;
    color: #fff;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.nvx-advisor__notice h3 {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #92400e;
    margin-bottom: 0.25rem;
}

.dark .nvx-advisor__notice h3 {
    color: #fcd34d;
}

.nvx-advisor__notice p {
    font-size: 0.8125rem;
    color: #a16207;
    margin-bottom: 0.75rem;
}

.dark .nvx-advisor__notice p {
    color: #fde68a;
}

.nvx-advisor__notice-btn {
    display: inline-flex;
    padding: 0.4375rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 600;
    background: #1e2430;
    color: #fff;
    border-radius: 6px;
}

.nvx-advisor__disclaimer {
    font-size: 0.6875rem;
    color: #94a3b8;
    text-align: center;
    margin-top: 1.5rem;
    padding-bottom: 0.5rem;
}

/* ==========================================
   Dashboard — Category distribution panel
   ========================================== */
.nvx-cat__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.875rem;
}

.nvx-cat__period {
    font-size: 0.75rem;
    font-weight: 500;
    color: #475569;
    padding: 0.375rem 1.75rem 0.375rem 0.625rem;
    border: 1px solid #e2e5ea;
    border-radius: 7px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%2394a3b8' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E") no-repeat right 0.5rem center;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
}

.dark .nvx-cat__period {
    background-color: #131920;
    border-color: rgba(255, 255, 255, 0.1);
    color: #cbd5e1;
}

.nvx-cat__toggle {
    display: inline-flex;
    gap: 2px;
    padding: 3px;
    background: #f1f5f9;
    border-radius: 8px;
    margin-bottom: 1.25rem;
}

.dark .nvx-cat__toggle {
    background: rgba(255, 255, 255, 0.05);
}

.nvx-cat__toggle-btn {
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
    padding: 0.3125rem 0.875rem;
    border-radius: 6px;
    transition: background 0.12s, color 0.12s;
}

.nvx-cat__toggle-btn--active {
    background: #fff;
    color: #0f172a;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

.dark .nvx-cat__toggle-btn--active {
    background: #2d3542;
    color: #f1f5f9;
}

.nvx-cat__chart {
    position: relative;
    height: 200px;
    margin-bottom: 1.25rem;
}

.nvx-cat__center {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    text-align: center;
}

.nvx-cat__center-label {
    font-size: 0.625rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #94a3b8;
    margin-bottom: 0.25rem;
}

.nvx-cat__center-value {
    font-size: 1.0625rem;
    font-weight: 700;
    color: #0f172a;
}

.dark .nvx-cat__center-value {
    color: #f1f5f9;
}

.nvx-cat__legend {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.nvx-cat__row {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.5rem;
    border-radius: 7px;
    transition: background 0.12s;
}

.nvx-cat__row:hover {
    background: #f8fafc;
}

.dark .nvx-cat__row:hover {
    background: rgba(255, 255, 255, 0.03);
}

.nvx-cat__row--muted {
    opacity: 0.75;
}

.nvx-cat__dot {
    width: 9px;
    height: 9px;
    border-radius: 3px;
    flex-shrink: 0;
}

.nvx-cat__name {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #334155;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dark .nvx-cat__name {
    color: #cbd5e1;
}

.nvx-cat__pct {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #94a3b8;
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    min-width: 2.75rem;
    text-align: right;
}

.nvx-cat__amt {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #0f172a;
    min-width: 5rem;
    text-align: right;
}

.dark .nvx-cat__amt {
    color: #e2e8f0;
}

.nvx-cat__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 2rem 1rem;
    color: #94a3b8;
    text-align: center;
}

.nvx-cat__empty svg {
    width: 2rem;
    height: 2rem;
    opacity: 0.6;
}

.nvx-cat__empty span {
    font-size: 0.8125rem;
}

/* ==========================================
   Abonelikler (Subscriptions)
   ========================================== */
.sub-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    flex-shrink: 0;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}
.sub-logo img {
    width: 60%;
    height: 60%;
    object-fit: contain;
    display: block;
}
.sub-logo--text {
    color: #fff;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.sub-logo--sm { width: 2.25rem; height: 2.25rem; border-radius: 10px; font-size: 0.95rem; }
.sub-logo--md { width: 2.875rem; height: 2.875rem; font-size: 1.15rem; }

/* Hero */
.sub-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 1.25rem;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1.375rem 1.5rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .sub-hero { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }

.sub-hero__main { min-width: 0; }

.sub-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--brand);
    background: var(--brand-soft);
    padding: 0.3rem 0.6rem;
    border-radius: 999px;
    margin-bottom: 0.85rem;
}
.sub-hero__badge svg { width: 0.85rem; height: 0.85rem; }
.sub-hero__label { font-size: 0.75rem; color: #94a3b8; font-weight: 500; }
.sub-hero__amount { font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; margin-top: 0.15rem; color: #0f172a; }
.dark .sub-hero__amount { color: #f8fafc; }
.sub-hero__meta { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8125rem; color: #64748b; margin-top: 0.5rem; flex-wrap: wrap; }
.sub-hero__meta strong { color: #334155; font-weight: 700; }
.dark .sub-hero__meta strong { color: #e2e8f0; }
.sub-hero__dot { opacity: 0.4; }

.sub-hero__next {
    position: relative;
    background: #f8fafc;
    border: 1px solid #e9edf2;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    overflow: hidden;
}
.dark .sub-hero__next { background: #0e141b; border-color: rgba(255, 255, 255, 0.06); }
.sub-hero__next::before {
    content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--brand, var(--brand));
}
.sub-hero__next-cap { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.06em; color: #94a3b8; font-weight: 600; }
.sub-hero__next-row { display: flex; align-items: center; gap: 0.6rem; margin-top: 0.5rem; }
.sub-hero__next-name { font-size: 0.875rem; font-weight: 700; color: #1f2937; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dark .sub-hero__next-name { color: #f1f5f9; }
.sub-hero__next-date { font-size: 0.75rem; color: #64748b; margin-top: 0.05rem; }

.sub-hero__add {
    grid-column: -1;
    justify-self: end;
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 1rem;
    background: var(--brand);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: transform 0.15s, background 0.15s;
}
.sub-hero__add:hover { background: var(--brand-hover); transform: translateY(-1px); }
.sub-hero__add svg { width: 1rem; height: 1rem; }

/* Yaklaşan ödeme rayı */
.sub-rail {
    display: flex;
    gap: 0.625rem;
    overflow-x: auto;
    padding-bottom: 0.25rem;
    scrollbar-width: thin;
}
.sub-rail::-webkit-scrollbar { height: 5px; }
.sub-rail::-webkit-scrollbar-thumb { background: rgba(148, 163, 184, 0.4); border-radius: 999px; }
.sub-rail__item {
    display: flex; align-items: center; gap: 0.55rem;
    background: #fff; border: 1px solid #e2e5ea;
    border-radius: 11px; padding: 0.55rem 0.85rem 0.55rem 0.6rem;
    flex: 0 0 auto; min-width: 11.5rem;
}
.dark .sub-rail__item { background: #131920; border-color: rgba(255, 255, 255, 0.06); }
.sub-rail__item.is-soon { border-color: color-mix(in srgb, var(--brand) 50%, transparent); }
.sub-rail__info { min-width: 0; flex: 1; }
.sub-rail__name { font-size: 0.8125rem; font-weight: 700; color: #1f2937; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dark .sub-rail__name { color: #f1f5f9; }
.sub-rail__days { font-size: 0.6875rem; color: #94a3b8; font-weight: 500; }
.sub-rail__item.is-soon .sub-rail__days { color: var(--brand); font-weight: 600; }
.sub-rail__amount { font-size: 0.8125rem; font-weight: 700; color: #475569; font-family: 'IBM Plex Mono', monospace; }
.dark .sub-rail__amount { color: #cbd5e1; }

/* Kart grid */
.sub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr));
    gap: 0.875rem;
}
.sub-card {
    position: relative;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1rem 1.05rem 0.9rem;
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
.dark .sub-card { background: #131920; border-color: rgba(255, 255, 255, 0.06); }
.sub-card:hover { box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08); transform: translateY(-2px); border-color: color-mix(in srgb, var(--brand) 35%, #e2e5ea); }
.dark .sub-card:hover { box-shadow: 0 8px 28px rgba(0, 0, 0, 0.4); }
.sub-card.is-paused { opacity: 0.6; }
.sub-card.is-paused .sub-logo { filter: grayscale(1); }
.sub-card__bar { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--brand, var(--brand)); }

.sub-card__head { display: flex; align-items: flex-start; gap: 0.7rem; }
.sub-card__title { flex: 1; min-width: 0; }
.sub-card__name { font-size: 0.95rem; font-weight: 700; color: #111827; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dark .sub-card__name { color: #f8fafc; }
.sub-card__cycle {
    display: inline-block; margin-top: 0.2rem;
    font-size: 0.625rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
    color: var(--brand, var(--brand));
    background: color-mix(in srgb, var(--brand) 12%, transparent);
    padding: 0.12rem 0.45rem; border-radius: 999px;
}

.sub-card__menu { position: relative; }
.sub-card__menu-btn {
    padding: 0.3rem; color: #cbd5e1; border-radius: 7px; transition: color 0.15s, background 0.15s;
    line-height: 0;
}
.sub-card__menu-btn:hover { color: #64748b; background: rgba(148, 163, 184, 0.12); }
.sub-card__menu-btn svg { width: 1.05rem; height: 1.05rem; }
.sub-card__dropdown {
    position: absolute; right: 0; top: calc(100% + 0.3rem);
    background: #fff; border: 1px solid #e2e5ea; border-radius: 10px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14);
    padding: 0.3rem; min-width: 8.5rem; z-index: 20;
    display: none; flex-direction: column;
}
.dark .sub-card__dropdown { background: #1a212b; border-color: rgba(255, 255, 255, 0.08); }
.sub-card__dropdown.is-open { display: flex; }
.sub-card__dropdown button {
    text-align: left; font-size: 0.8125rem; font-weight: 500; color: #334155;
    padding: 0.45rem 0.6rem; border-radius: 7px; transition: background 0.12s;
}
.dark .sub-card__dropdown button { color: #cbd5e1; }
.sub-card__dropdown button:hover { background: rgba(148, 163, 184, 0.14); }
.sub-card__dropdown button.is-danger { color: #ef4444; }
.sub-card__dropdown button.is-danger:hover { background: rgba(239, 68, 68, 0.1); }

.sub-card__price { margin: 0.95rem 0 0.85rem; display: flex; align-items: baseline; gap: 0.5rem; flex-wrap: wrap; }
.sub-card__price .nvx-money { font-size: 1.5rem; font-weight: 800; color: #0f172a; letter-spacing: -0.03em; }
.dark .sub-card__price .nvx-money { color: #f8fafc; }
.sub-card__permonth { font-size: 0.6875rem; color: #94a3b8; font-weight: 500; }

.sub-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; padding-top: 0.8rem; border-top: 1px dashed #e5e9f0; }
.dark .sub-card__foot { border-top-color: rgba(255, 255, 255, 0.08); }
.sub-card__renew { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.75rem; color: #64748b; font-weight: 500; }
.sub-card__renew svg { width: 0.9rem; height: 0.9rem; opacity: 0.7; }
.sub-card__chip { font-size: 0.6875rem; font-weight: 600; color: #475569; background: rgba(148, 163, 184, 0.14); padding: 0.18rem 0.55rem; border-radius: 999px; }
.dark .sub-card__chip { color: #cbd5e1; }
.sub-card__chip.is-soon { color: #b45309; background: rgba(245, 158, 11, 0.16); }
.dark .sub-card__chip.is-soon { color: #fbbf24; }
.sub-card__chip.is-paused { color: #64748b; background: rgba(148, 163, 184, 0.16); }

/* Boş durum */
.sub-empty {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 3.5rem 1.5rem; background: #fff; border: 1px dashed #d8dee6; border-radius: 14px;
}
.dark .sub-empty { background: #131920; border-color: rgba(255, 255, 255, 0.1); }
.sub-empty__icon { width: 3.5rem; height: 3.5rem; display: flex; align-items: center; justify-content: center; border-radius: 14px; background: var(--brand-soft); color: var(--brand); margin-bottom: 1rem; }
.sub-empty__icon svg { width: 1.75rem; height: 1.75rem; }
.sub-empty h3 { font-size: 1.05rem; font-weight: 700; color: #1f2937; }
.dark .sub-empty h3 { color: #f1f5f9; }
.sub-empty p { font-size: 0.875rem; color: #64748b; max-width: 26rem; margin: 0.4rem 0 1.25rem; line-height: 1.5; }
.sub-empty__btn {
    padding: 0.55rem 1rem;
    background: var(--brand);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
}
.sub-empty__btn:hover { background: var(--brand-hover); }

/* Modal */
.sub-modal { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.sub-modal.hidden { display: none; }
.sub-modal__backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, 0.55); backdrop-filter: blur(4px); }
.sub-modal__panel {
    position: relative; width: 100%; max-width: 40rem; max-height: 92vh; overflow-y: auto;
    background: #fff; border-radius: 16px; box-shadow: 0 24px 70px rgba(0, 0, 0, 0.3);
    animation: subModalIn 0.18s ease;
}
@keyframes subModalIn { from { opacity: 0; transform: translateY(12px) scale(0.98); } to { opacity: 1; transform: none; } }
.dark .sub-modal__panel { background: #161d26; }
.sub-modal__header { display: flex; align-items: center; justify-content: space-between; padding: 1.15rem 1.4rem; border-bottom: 1px solid #eef1f5; }
.dark .sub-modal__header { border-bottom-color: rgba(255, 255, 255, 0.07); }
.sub-modal__header h3 { font-size: 1.05rem; font-weight: 700; color: #0f172a; }
.dark .sub-modal__header h3 { color: #f8fafc; }
.sub-modal__close { padding: 0.4rem; color: #94a3b8; border-radius: 8px; line-height: 0; }
.sub-modal__close:hover { color: #475569; background: rgba(148, 163, 184, 0.14); }
.sub-modal__close svg { width: 1.15rem; height: 1.15rem; }
.sub-modal__body { padding: 1.25rem 1.4rem 1.4rem; }

.sub-field__label { display: block; font-size: 0.75rem; font-weight: 600; color: #64748b; margin-bottom: 0.4rem; }
.sub-picker { max-height: 14rem; overflow-y: auto; margin-bottom: 1.25rem; padding-right: 0.25rem; }
.sub-picker__group { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #94a3b8; margin: 0.75rem 0 0.45rem; }
.sub-picker__group:first-child { margin-top: 0; }
.sub-picker__row { display: grid; grid-template-columns: repeat(auto-fill, minmax(5.2rem, 1fr)); gap: 0.4rem; }
.sub-picker__item {
    display: flex; flex-direction: column; align-items: center; gap: 0.35rem;
    padding: 0.55rem 0.35rem; border: 1px solid #e9edf2; border-radius: 10px;
    transition: border-color 0.12s, background 0.12s; background: #fff;
}
.dark .sub-picker__item { background: #1a212b; border-color: rgba(255, 255, 255, 0.07); }
.sub-picker__item:hover { border-color: #c7cdd6; }
.sub-picker__item.is-active { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand); }
.sub-picker__logo {
    width: 2.1rem; height: 2.1rem; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden; color: #fff; font-weight: 800; font-size: 0.85rem;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}
.sub-picker__logo img { width: 60%; height: 60%; object-fit: contain; }
.sub-picker__name { font-size: 0.625rem; font-weight: 600; color: #475569; text-align: center; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.dark .sub-picker__name { color: #cbd5e1; }

.sub-modal__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.85rem; }
.sub-field--full { grid-column: 1 / -1; }
.sub-field input, .sub-field select {
    width: 100%; padding: 0.6rem 0.8rem; font-size: 0.875rem;
    background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 9px; color: #1f2937;
    transition: border-color 0.12s, box-shadow 0.12s;
}
.dark .sub-field input, .dark .sub-field select { background: #0e141b; border-color: rgba(255, 255, 255, 0.08); color: #f1f5f9; }
.sub-field input:focus, .sub-field select:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft-md); }

.sub-modal__footer { display: flex; justify-content: flex-end; gap: 0.6rem; margin-top: 1.35rem; }
.sub-btn { padding: 0.6rem 1.25rem; border-radius: 9px; font-size: 0.8125rem; font-weight: 600; transition: background 0.12s, transform 0.12s; }
.sub-btn--ghost { color: #64748b; background: rgba(148, 163, 184, 0.12); }
.sub-btn--ghost:hover { background: rgba(148, 163, 184, 0.2); }
.sub-btn--primary { background: #0f172a; color: #fff; }
.sub-btn--primary:hover { background: #1e293b; transform: translateY(-1px); }
.dark .sub-btn--primary { background: var(--brand); }
.dark .sub-btn--primary:hover { background: #7c7ff5; }

@media (max-width: 860px) {
    .sub-hero { grid-template-columns: 1fr; }
    .sub-hero__add { grid-column: 1; justify-self: stretch; width: auto; justify-content: center; }
}
@media (max-width: 520px) {
    .sub-modal__grid { grid-template-columns: 1fr; }
}

/* ==========================================
   Hedefler (Goals)
   ========================================== */
.goal-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15);
}
.goal-icon--sm { width: 2.125rem; height: 2.125rem; border-radius: 9px; }
.goal-icon--md { width: 2.625rem; height: 2.625rem; }
.goal-icon__svg { width: 1.1rem !important; height: 1.1rem !important; }

/* Hero */
.goal-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    align-items: center;
    gap: 1.25rem;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1.375rem 1.5rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
    position: relative;
}
.dark .goal-hero {
    background: #131920;
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: none;
}
.goal-hero__left { min-width: 0; }
.goal-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--brand);
    background: var(--brand-soft);
    padding: 0.3rem 0.6rem;
    border-radius: 999px;
    margin-bottom: 0.85rem;
}
.goal-hero__badge svg { width: 0.85rem; height: 0.85rem; }
.goal-hero__label { font-size: 0.75rem; color: #94a3b8; font-weight: 500; }
.goal-hero__amount { font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; margin-top: 0.15rem; color: #0f172a; }
.dark .goal-hero__amount { color: #f8fafc; }
.goal-hero__meta { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8125rem; color: #64748b; margin-top: 0.5rem; flex-wrap: wrap; }
.goal-hero__meta strong { color: #334155; font-weight: 700; }
.dark .goal-hero__meta strong { color: #e2e8f0; }
.goal-hero__dot { opacity: 0.4; }

.goal-hero__ring { position: relative; flex-shrink: 0; }
.goal-hero__ring-label {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.goal-hero__ring-pct { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.03em; color: #0f172a; line-height: 1; }
.dark .goal-hero__ring-pct { color: #f8fafc; }
.goal-hero__ring-cap { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.06em; color: #94a3b8; margin-top: 0.15rem; }
.goal-arc { display: block; }

.goal-hero__featured {
    position: relative;
    background: #f8fafc;
    border: 1px solid #e9edf2;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    overflow: hidden;
    min-width: 0;
}
.dark .goal-hero__featured { background: #0e141b; border-color: rgba(255, 255, 255, 0.06); }
.goal-hero__featured::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--brand, #14b8a6);
}
.goal-hero__featured-cap { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.06em; color: #94a3b8; font-weight: 600; }
.goal-hero__featured-row { display: flex; align-items: center; gap: 0.6rem; margin-top: 0.45rem; }
.goal-hero__featured-name { font-size: 0.875rem; font-weight: 700; color: #1f2937; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dark .goal-hero__featured-name { color: #f1f5f9; }
.goal-hero__featured-sub { font-size: 0.75rem; color: #64748b; margin-top: 0.05rem; }

.goal-hero__add {
    grid-column: -1;
    justify-self: end;
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 1rem;
    background: var(--brand);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.15s, transform 0.15s;
}
.goal-hero__add:hover { background: var(--brand-hover); transform: translateY(-1px); }
.goal-hero__add svg { width: 1rem; height: 1rem; }

/* Son hareketler */
.goal-feed {
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1rem 1.15rem 0.85rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .goal-feed { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }

.goal-feed__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid #eef1f5;
}
.dark .goal-feed__head { border-bottom-color: rgba(255, 255, 255, 0.06); }

.goal-feed__title {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #1f2937;
    line-height: 1.2;
}
.dark .goal-feed__title { color: #f3f4f6; }

.goal-feed__sub {
    font-size: 0.75rem;
    color: #94a3b8;
    margin-top: 0.15rem;
}

.goal-feed__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.625rem;
    height: 1.625rem;
    padding: 0 0.45rem;
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--brand);
    background: var(--brand-soft);
    border-radius: 999px;
    flex-shrink: 0;
}

.goal-feed__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.goal-feed__item {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.65rem 0.75rem;
    border-radius: 11px;
    transition: background 0.12s;
}
.goal-feed__item:hover { background: rgba(148, 163, 184, 0.08); }
.dark .goal-feed__item:hover { background: rgba(255, 255, 255, 0.04); }

.goal-feed__lead {
    position: relative;
    flex-shrink: 0;
}

.goal-feed__type {
    position: absolute;
    right: -4px;
    bottom: -4px;
    width: 1.125rem;
    height: 1.125rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12);
}
.dark .goal-feed__type { border-color: #131920; }
.goal-feed__type svg { width: 0.55rem; height: 0.55rem; }
.goal-feed__type.is-deposit { background: #059669; color: #fff; }
.goal-feed__type.is-withdraw { background: #dc2626; color: #fff; }

.goal-feed__body {
    flex: 1;
    min-width: 0;
}

.goal-feed__name {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.25;
}
.dark .goal-feed__name { color: #f1f5f9; }

.goal-feed__meta {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.2rem;
    min-width: 0;
}

.goal-feed__tag {
    display: inline-flex;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    flex-shrink: 0;
}
.goal-feed__tag.is-deposit { color: #047857; background: rgba(5, 150, 105, 0.12); }
.goal-feed__tag.is-withdraw { color: #b91c1c; background: rgba(220, 38, 38, 0.1); }

.goal-feed__note {
    font-size: 0.6875rem;
    color: #94a3b8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.goal-feed__side {
    text-align: right;
    flex-shrink: 0;
    min-width: 7.5rem;
}

.goal-feed__amount {
    display: block;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
}
.goal-feed__amount.is-plus { color: #059669; }
.goal-feed__amount.is-minus { color: #dc2626; }

.goal-feed__time {
    display: block;
    font-size: 0.6875rem;
    color: #94a3b8;
    margin-top: 0.15rem;
    white-space: nowrap;
}

.goal-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}
.goal-section-head__title {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #1f2937;
}
.dark .goal-section-head__title { color: #f3f4f6; }
.goal-section-head__count {
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--brand);
    background: var(--brand-soft);
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
}
.goal-section-head__count.is-done {
    color: #059669;
    background: rgba(5, 150, 105, 0.12);
}

.goal-section-label {
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #94a3b8;
    margin-bottom: 0.75rem;
}

/* Kart grid */
.goal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    gap: 0.875rem;
}
.goal-grid--completed { opacity: 0.85; }

.goal-card {
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1.1rem 1.15rem;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
.dark .goal-card { background: #131920; border-color: rgba(255, 255, 255, 0.06); }
.goal-card:hover { box-shadow: 0 8px 28px rgba(15, 23, 42, 0.09); transform: translateY(-2px); border-color: color-mix(in srgb, var(--brand) 40%, #e2e5ea); }
.dark .goal-card:hover { box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35); }

.goal-card__top { display: flex; gap: 0.85rem; align-items: flex-start; }
.goal-card__arc-wrap { position: relative; flex-shrink: 0; }
.goal-card__arc-pct {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8125rem;
    font-weight: 800;
    color: var(--brand, var(--brand));
    letter-spacing: -0.02em;
}
.goal-card__info { flex: 1; min-width: 0; }
.goal-card__head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.35rem; }
.goal-card__name { font-size: 0.9375rem; font-weight: 700; color: #111827; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dark .goal-card__name { color: #f8fafc; }
.goal-card__amounts { display: flex; align-items: baseline; gap: 0.3rem; flex-wrap: wrap; }
.goal-card__current { font-size: 1.125rem; font-weight: 800; color: #0f172a; letter-spacing: -0.02em; }
.dark .goal-card__current { color: #f8fafc; }
.goal-card__sep { color: #cbd5e1; font-size: 0.875rem; }
.goal-card__target { font-size: 0.8125rem; color: #94a3b8; font-weight: 500; }
.goal-card__date { font-size: 0.6875rem; color: #64748b; margin-top: 0.3rem; }
.goal-card__hint { font-size: 0.6875rem; color: var(--brand); font-weight: 600; margin-top: 0.25rem; }

.goal-card__bar { height: 4px; background: rgba(148, 163, 184, 0.18); border-radius: 999px; margin: 0.85rem 0 0.75rem; overflow: hidden; }
.goal-card__bar-fill { height: 100%; background: var(--brand, var(--brand)); border-radius: 999px; transition: width 0.6s ease; }

.goal-card__actions { display: flex; gap: 0.35rem; flex-wrap: wrap; }
.goal-card__btn {
    display: inline-flex; align-items: center; gap: 0.3rem;
    padding: 0.35rem 0.65rem;
    font-size: 0.6875rem; font-weight: 600;
    color: #64748b; background: rgba(148, 163, 184, 0.12);
    border-radius: 7px; transition: background 0.12s, color 0.12s;
}
.goal-card__btn:hover { background: rgba(148, 163, 184, 0.22); color: #334155; }
.dark .goal-card__btn:hover { color: #e2e8f0; }
.goal-card__btn svg { width: 0.75rem; height: 0.75rem; }
.goal-card__btn--primary { color: #fff; background: var(--brand, var(--brand)); }
.goal-card__btn--primary:hover { filter: brightness(1.1); color: #fff; }
.goal-card__btn--danger { color: #ef4444; }
.goal-card__btn--danger:hover { background: rgba(239, 68, 68, 0.12); color: #ef4444; }

.goal-card--done {
    border-style: dashed;
    border-color: color-mix(in srgb, var(--brand) 35%, #e2e5ea);
    padding: 1rem 1.15rem;
}
.goal-card__done-badge {
    display: inline-flex; align-items: center; gap: 0.35rem;
    font-size: 0.6875rem; font-weight: 700; color: #059669;
    background: rgba(5, 150, 105, 0.12);
    padding: 0.2rem 0.55rem; border-radius: 999px;
    margin-bottom: 0.65rem;
}
.goal-card__done-badge svg { width: 0.85rem; height: 0.85rem; }

/* Boş durum */
.goal-empty {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 3.5rem 1.5rem;
    background: #fff; border: 1px dashed #d8dee6; border-radius: 14px;
}
.dark .goal-empty { background: #131920; border-color: rgba(255, 255, 255, 0.1); }
.goal-empty__rings { width: 5rem; height: 5rem; color: var(--brand); margin-bottom: 1rem; opacity: 0.7; }
.goal-empty h3 { font-size: 1.05rem; font-weight: 700; color: #1f2937; }
.dark .goal-empty h3 { color: #f1f5f9; }
.goal-empty p { font-size: 0.875rem; color: #64748b; max-width: 26rem; margin: 0.4rem 0 1.25rem; line-height: 1.5; }
.goal-empty__btn { padding: 0.65rem 1.3rem; background: var(--brand); color: #fff; border-radius: 10px; font-size: 0.8125rem; font-weight: 600; }

/* Modal */
.goal-modal { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.goal-modal.hidden { display: none; }
.goal-modal__backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, 0.55); backdrop-filter: blur(4px); }
.goal-modal__panel {
    position: relative; width: 100%; max-width: 40rem; max-height: 92vh; overflow-y: auto;
    background: #fff; border-radius: 16px; box-shadow: 0 24px 70px rgba(0, 0, 0, 0.3);
    animation: goalModalIn 0.18s ease;
}
.goal-modal__panel--sm { max-width: 22rem; }
@keyframes goalModalIn { from { opacity: 0; transform: translateY(12px) scale(0.98); } to { opacity: 1; transform: none; } }
.dark .goal-modal__panel { background: #161d26; }
.goal-modal__header { display: flex; align-items: center; justify-content: space-between; padding: 1.15rem 1.4rem; border-bottom: 1px solid #eef1f5; }
.dark .goal-modal__header { border-bottom-color: rgba(255, 255, 255, 0.07); }
.goal-modal__header h3 { font-size: 1.05rem; font-weight: 700; color: #0f172a; }
.dark .goal-modal__header h3 { color: #f8fafc; }
.goal-modal__close { padding: 0.4rem; color: #94a3b8; border-radius: 8px; line-height: 0; }
.goal-modal__close:hover { color: #475569; background: rgba(148, 163, 184, 0.14); }
.goal-modal__close svg { width: 1.15rem; height: 1.15rem; }
.goal-modal__body { padding: 1.25rem 1.4rem 1.4rem; }

.goal-field__label { display: block; font-size: 0.75rem; font-weight: 600; color: #64748b; margin-bottom: 0.4rem; }
.goal-picker { max-height: 12rem; overflow-y: auto; margin-bottom: 1.25rem; padding-right: 0.25rem; }
.goal-picker__group { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #94a3b8; margin: 0.75rem 0 0.45rem; }
.goal-picker__group:first-child { margin-top: 0; }
.goal-picker__row { display: grid; grid-template-columns: repeat(auto-fill, minmax(5.5rem, 1fr)); gap: 0.4rem; }
.goal-picker__item {
    display: flex; flex-direction: column; align-items: center; gap: 0.35rem;
    padding: 0.55rem 0.35rem; border: 1px solid #e9edf2; border-radius: 10px;
    transition: border-color 0.12s, background 0.12s; background: #fff;
}
.dark .goal-picker__item { background: #1a212b; border-color: rgba(255, 255, 255, 0.07); }
.goal-picker__item:hover { border-color: #c7cdd6; }
.goal-picker__item.is-active { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand); }
.goal-picker__icon {
    width: 2.1rem; height: 2.1rem; border-radius: 9px;
    display: inline-flex; align-items: center; justify-content: center; color: #fff;
}
.goal-picker__svg { width: 1.1rem !important; height: 1.1rem !important; }
.goal-picker__name { font-size: 0.625rem; font-weight: 600; color: #475569; text-align: center; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.dark .goal-picker__name { color: #cbd5e1; }

.goal-modal__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.85rem; }
.goal-field--full { grid-column: 1 / -1; }
.goal-field input, .goal-field select {
    width: 100%; padding: 0.6rem 0.8rem; font-size: 0.875rem;
    background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 9px; color: #1f2937;
    transition: border-color 0.12s, box-shadow 0.12s;
}
.dark .goal-field input, .dark .goal-field select { background: #0e141b; border-color: rgba(255, 255, 255, 0.08); color: #f1f5f9; }
.goal-field input:focus, .goal-field select:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft-md); }

.goal-modal__footer { display: flex; justify-content: flex-end; gap: 0.6rem; margin-top: 1.35rem; }
.goal-btn { padding: 0.6rem 1.25rem; border-radius: 9px; font-size: 0.8125rem; font-weight: 600; transition: background 0.12s, transform 0.12s; }
.goal-btn--ghost { color: #64748b; background: rgba(148, 163, 184, 0.12); }
.goal-btn--ghost:hover { background: rgba(148, 163, 184, 0.2); }
.goal-btn--primary { background: var(--brand); color: #fff; }
.goal-btn--primary:hover { background: #7c7ff5; transform: translateY(-1px); }

@media (max-width: 960px) {
    .goal-hero { grid-template-columns: 1fr auto; }
    .goal-hero__featured { grid-column: 1 / -1; }
    .goal-hero__add { grid-column: 1 / -1; justify-self: stretch; justify-content: center; }
}
@media (max-width: 560px) {
    .goal-hero { grid-template-columns: 1fr; }
    .goal-hero__ring { justify-self: center; }
    .goal-modal__grid { grid-template-columns: 1fr; }
    .goal-feed__side { min-width: 5.5rem; }
    .goal-feed__amount { font-size: 0.8125rem; }
    .goal-feed__note { display: none; }
}

/* ==========================================
   Kategori rozetleri
   ========================================== */
.cat-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    vertical-align: middle;
}
.cat-badge__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--cat-color, var(--brand));
    color: #fff;
    border-radius: 10px;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.18),
        0 3px 10px color-mix(in srgb, var(--cat-color) 38%, transparent);
}
.cat-badge--sm .cat-badge__icon { width: 2rem; height: 2rem; border-radius: 9px; }
.cat-badge--md .cat-badge__icon { width: 2.375rem; height: 2.375rem; }
.cat-badge--lg .cat-badge__icon { width: 2.75rem; height: 2.75rem; border-radius: 11px; }
.cat-badge__svg { width: 1.05rem !important; height: 1.05rem !important; stroke-width: 2 !important; }
.cat-badge__svg--sm { width: 0.95rem !important; height: 0.95rem !important; }
.cat-badge__svg--lg { width: 1.25rem !important; height: 1.25rem !important; }
.cat-badge__text {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #334155;
    white-space: nowrap;
}
.dark .cat-badge__text { color: #e2e8f0; }
.cat-badge--icon-only { gap: 0; }

/* ==========================================
   Kategoriler sayfası
   ========================================== */
.cat-page__head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem;
    margin-bottom: 1.25rem; flex-wrap: wrap;
}
.cat-page__title { font-size: 1.05rem; font-weight: 700; color: #1f2937; letter-spacing: -0.01em; }
.dark .cat-page__title { color: #f3f4f6; }
.cat-page__sub { font-size: 0.8125rem; color: #94a3b8; margin-top: 0.15rem; }
.cat-page__add {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.6rem 1.1rem; background: #0f172a; color: #fff;
    border-radius: 10px; font-size: 0.8125rem; font-weight: 600;
    transition: background 0.12s, transform 0.12s;
}
.cat-page__add:hover { background: #1e293b; transform: translateY(-1px); }
.dark .cat-page__add { background: var(--brand); }
.dark .cat-page__add:hover { background: #7c7ff5; }
.cat-page__add svg { width: 0.95rem; height: 0.95rem; }

.cat-form {
    background: #fff; border: 1px solid #e2e5ea; border-radius: 14px;
    padding: 1.1rem 1.25rem 1.2rem; margin-bottom: 1.25rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .cat-form { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }
.cat-form.hidden { display: none; }
.cat-form__head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem;
    margin-bottom: 1rem; padding-bottom: 0.85rem; border-bottom: 1px solid #eef1f5;
}
.dark .cat-form__head { border-bottom-color: rgba(255, 255, 255, 0.06); }
.cat-form__title { font-size: 0.875rem; font-weight: 700; color: #1f2937; }
.dark .cat-form__title { color: #f3f4f6; }
.cat-form__sub { font-size: 0.75rem; color: #94a3b8; margin-top: 0.15rem; }
.cat-form__close { padding: 0.35rem; color: #94a3b8; border-radius: 8px; line-height: 0; }
.cat-form__close:hover { color: #475569; background: rgba(148, 163, 184, 0.14); }
.cat-form__close svg { width: 1.1rem; height: 1.1rem; }
.cat-form__grid {
    display: grid; grid-template-columns: 1.4fr 0.8fr 1fr 0.5fr auto;
    gap: 0.75rem; align-items: end;
}
.cat-field__label {
    display: block; font-size: 0.6875rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.04em; color: #94a3b8; margin-bottom: 0.35rem;
}
.cat-field__input {
    width: 100%; padding: 0.6rem 0.75rem; font-size: 0.8125rem;
    background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 9px; color: #1f2937;
}
.dark .cat-field__input { background: #0e141b; border-color: rgba(255, 255, 255, 0.08); color: #f1f5f9; }
.cat-field__input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.cat-field__picker { width: 100%; height: 2.5rem; border: none; border-radius: 9px; cursor: pointer; padding: 0; }
.cat-form__submit {
    padding: 0.6rem 1.2rem; background: #0f172a; color: #fff;
    border-radius: 9px; font-size: 0.8125rem; font-weight: 600; white-space: nowrap;
}
.dark .cat-form__submit { background: var(--brand); }

.cat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.cat-panel {
    background: #fff; border: 1px solid #e2e5ea; border-radius: 14px; overflow: hidden;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .cat-panel { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }
.cat-panel__head {
    display: flex; align-items: center; gap: 0.55rem;
    padding: 0.85rem 1.1rem; border-bottom: 1px solid #eef1f5;
}
.dark .cat-panel__head { border-bottom-color: rgba(255, 255, 255, 0.06); }
.cat-panel__head svg { width: 1rem; height: 1rem; flex-shrink: 0; }
.cat-panel--income .cat-panel__head { background: rgba(16, 185, 129, 0.06); }
.cat-panel--income .cat-panel__head svg { color: #059669; }
.cat-panel--income h4 { color: #047857; }
.dark .cat-panel--income h4 { color: #34d399; }
.cat-panel--expense .cat-panel__head { background: rgba(244, 63, 94, 0.06); }
.cat-panel--expense .cat-panel__head svg { color: #e11d48; }
.cat-panel--expense h4 { color: #be123c; }
.dark .cat-panel--expense h4 { color: #fb7185; }
.cat-panel__head h4 { flex: 1; font-size: 0.875rem; font-weight: 700; }
.cat-panel__count {
    font-size: 0.6875rem; font-weight: 700; padding: 0.15rem 0.5rem; border-radius: 999px;
}
.cat-panel--income .cat-panel__count { color: #059669; background: rgba(16, 185, 129, 0.12); }
.cat-panel--expense .cat-panel__count { color: #e11d48; background: rgba(244, 63, 94, 0.1); }

.cat-panel__list { max-height: 32rem; overflow-y: auto; }
.cat-row {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.65rem 1.1rem;
    border-bottom: 1px solid #f1f5f9;
    transition: background 0.12s;
}
.dark .cat-row { border-bottom-color: rgba(255, 255, 255, 0.05); }
.cat-row:last-child { border-bottom: none; }
.cat-row:hover { background: rgba(148, 163, 184, 0.06); }
.dark .cat-row:hover { background: rgba(255, 255, 255, 0.03); }
.cat-row__body { flex: 1; min-width: 0; display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.cat-row__name { font-size: 0.875rem; font-weight: 600; color: #1f2937; }
.dark .cat-row__name { color: #f1f5f9; }
.cat-row__tag {
    font-size: 0.625rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
    color: #94a3b8; background: rgba(148, 163, 184, 0.12); padding: 0.1rem 0.45rem; border-radius: 999px;
}
.cat-row__actions { display: flex; gap: 0.15rem; margin-left: auto; }
.cat-row__delete,
.cat-row__edit {
    padding: 0.35rem; color: #cbd5e1; border-radius: 7px; line-height: 0;
    opacity: 0; transition: opacity 0.15s, color 0.12s, background 0.12s;
    background: transparent; border: none; cursor: pointer;
}
.cat-row:hover .cat-row__delete,
.cat-row:hover .cat-row__edit { opacity: 1; }
.cat-row__delete:hover { color: #ef4444; background: rgba(239, 68, 68, 0.1); }
.cat-row__edit:hover { color: var(--brand); background: var(--brand-soft); }
.cat-row__delete svg,
.cat-row__edit svg { width: 1rem; height: 1rem; }

@media (max-width: 900px) {
    .cat-grid { grid-template-columns: 1fr; }
    .cat-form__grid { grid-template-columns: 1fr 1fr; }
    .cat-field--action { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
    .cat-form__grid { grid-template-columns: 1fr; }
}

/* ==========================================
   İşlemler — filtre + tablo
   ========================================== */
.txn-filter {
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1.1rem 1.25rem 1.2rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .txn-filter { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }

.txn-filter__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid #eef1f5;
}
.dark .txn-filter__head { border-bottom-color: rgba(255, 255, 255, 0.06); }
.txn-filter__title { font-size: 0.875rem; font-weight: 700; color: #1f2937; letter-spacing: -0.01em; }
.dark .txn-filter__title { color: #f3f4f6; }
.txn-filter__sub { font-size: 0.75rem; color: #94a3b8; margin-top: 0.15rem; }
.txn-filter__active {
    font-size: 0.6875rem; font-weight: 700; color: var(--brand);
    background: var(--brand-soft); padding: 0.2rem 0.55rem; border-radius: 999px;
}

.txn-filter__form { display: flex; flex-direction: column; gap: 0.85rem; }

.txn-filter__search { position: relative; }
.txn-filter__search-icon {
    position: absolute; left: 0.85rem; top: 50%; transform: translateY(-50%);
    width: 1rem; height: 1rem; color: #94a3b8; pointer-events: none;
}
.txn-filter__search input {
    width: 100%; padding: 0.7rem 0.85rem 0.7rem 2.5rem;
    font-size: 0.875rem; background: #f8fafc; border: 1px solid #e2e5ea;
    border-radius: 10px; color: #1f2937; transition: border-color 0.12s, box-shadow 0.12s;
}
.dark .txn-filter__search input { background: #0e141b; border-color: rgba(255, 255, 255, 0.08); color: #f1f5f9; }
.txn-filter__search input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }

.txn-filter__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
}
.txn-field__label {
    display: block; font-size: 0.6875rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.04em; color: #94a3b8; margin-bottom: 0.35rem;
}
.txn-field__input {
    width: 100%; padding: 0.6rem 0.75rem; font-size: 0.8125rem;
    background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 9px; color: #1f2937;
    transition: border-color 0.12s, box-shadow 0.12s;
}
.dark .txn-field__input { background: #0e141b; border-color: rgba(255, 255, 255, 0.08); color: #f1f5f9; }
.txn-field__input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }

.txn-filter__actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.txn-filter__btn {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.6rem 1.1rem; border-radius: 9px;
    font-size: 0.8125rem; font-weight: 600; transition: background 0.12s, transform 0.12s;
}
.txn-filter__btn svg { width: 0.95rem; height: 0.95rem; }
.txn-filter__btn--primary { background: #0f172a; color: #fff; }
.txn-filter__btn--primary:hover { background: #1e293b; transform: translateY(-1px); }
.dark .txn-filter__btn--primary { background: var(--brand); }
.dark .txn-filter__btn--primary:hover { background: #7c7ff5; }
.txn-filter__btn--ghost { color: #64748b; background: rgba(148, 163, 184, 0.12); }
.txn-filter__btn--ghost:hover { background: rgba(148, 163, 184, 0.2); }

/* Panel + tablo */
.txn-panel {
    background: #fff; border: 1px solid #e2e5ea; border-radius: 14px; overflow: hidden;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .txn-panel { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }

.txn-panel__head {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 1rem 1.25rem; border-bottom: 1px solid #eef1f5; flex-wrap: wrap;
}
.dark .txn-panel__head { border-bottom-color: rgba(255, 255, 255, 0.06); }
.txn-panel__title { font-size: 0.9375rem; font-weight: 700; color: #1f2937; letter-spacing: -0.01em; }
.dark .txn-panel__title { color: #f3f4f6; }
.txn-panel__sub { font-size: 0.75rem; color: #94a3b8; margin-top: 0.1rem; }
.txn-panel__actions { display: flex; gap: 0.45rem; flex-wrap: wrap; }
.txn-panel__btn {
    display: inline-flex; align-items: center; gap: 0.35rem;
    padding: 0.5rem 0.85rem; border-radius: 9px;
    font-size: 0.75rem; font-weight: 600; transition: background 0.12s;
}
.txn-panel__btn svg { width: 0.85rem; height: 0.85rem; }
.txn-panel__btn--income { color: #059669; background: rgba(5, 150, 105, 0.1); }
.txn-panel__btn--income:hover { background: rgba(5, 150, 105, 0.18); }
.txn-panel__btn--expense { color: #dc2626; background: rgba(220, 38, 38, 0.1); }
.txn-panel__btn--expense:hover { background: rgba(220, 38, 38, 0.16); }

.txn-table { width: 100%; border-collapse: collapse; }
.txn-table thead tr { background: #f8fafc; }
.dark .txn-table thead tr { background: rgba(255, 255, 255, 0.03); }
.txn-table th {
    text-align: left; padding: 0.65rem 1.25rem;
    font-size: 0.625rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.06em; color: #94a3b8;
}
.txn-table th.txn-col-amount,
.txn-table td.txn-col-amount {
    text-align: right;
    white-space: nowrap;
    width: 9rem;
    padding-right: 1.5rem;
}
.txn-table th.txn-col-actions,
.txn-table td.txn-col-actions {
    text-align: center;
    white-space: nowrap;
    width: 5.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}
.txn-table th.txn-col-date,
.txn-table td.txn-row__date {
    white-space: nowrap;
    width: 6.5rem;
}
.txn-table tbody tr { border-top: 1px solid #f1f5f9; transition: background 0.12s; }
.dark .txn-table tbody tr { border-top-color: rgba(255, 255, 255, 0.05); }
.txn-table tbody tr:hover { background: rgba(148, 163, 184, 0.06); }
.dark .txn-table tbody tr:hover { background: rgba(255, 255, 255, 0.03); }
.txn-table td { padding: 0.85rem 1.25rem; vertical-align: middle; }

.txn-row__main { display: flex; align-items: center; gap: 0.65rem; min-width: 0; }
.txn-row__dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.txn-row__dot.is-income { background: #10b981; box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2); }
.txn-row__dot.is-expense { background: #f43f5e; box-shadow: 0 0 0 3px rgba(244, 63, 94, 0.2); }
.txn-row__desc { font-size: 0.875rem; font-weight: 600; color: #1f2937; }
.dark .txn-row__desc { color: #f1f5f9; }
.txn-row__note { font-size: 0.6875rem; color: #94a3b8; margin-top: 0.1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 14rem; }
.txn-row__wallet { display: inline-flex; align-items: center; cursor: default; }
.txn-row__date { font-size: 0.8125rem; color: #64748b; white-space: nowrap; }
.txn-row__amount { font-size: 0.875rem; font-weight: 700; letter-spacing: -0.02em; }
.txn-row__amount.is-income { color: #059669; }
.txn-row__amount.is-expense { color: #dc2626; }

.txn-row__actions { display: inline-flex; gap: 0.2rem; justify-content: center; }
.txn-row__action {
    padding: 0.35rem; color: #94a3b8; border-radius: 7px; line-height: 0; transition: color 0.12s, background 0.12s;
}
.txn-row__action svg { width: 1rem; height: 1rem; }
.txn-row__action:hover { color: var(--brand); background: var(--brand-soft); }
.txn-row__action.is-danger:hover { color: #ef4444; background: rgba(239, 68, 68, 0.1); }

.txn-mobile-list { border-top: 1px solid #f1f5f9; }
.dark .txn-mobile-list { border-top-color: rgba(255, 255, 255, 0.05); }
.txn-mobile {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.85rem 1.1rem; border-bottom: 1px solid #f1f5f9;
}
.dark .txn-mobile { border-bottom-color: rgba(255, 255, 255, 0.05); }
.txn-mobile__body { flex: 1; min-width: 0; }
.txn-mobile__desc { font-size: 0.875rem; font-weight: 600; color: #1f2937; }
.dark .txn-mobile__desc { color: #f1f5f9; }
.txn-mobile__meta { font-size: 0.6875rem; color: #94a3b8; margin-top: 0.1rem; }
.txn-mobile__side { text-align: right; flex-shrink: 0; }
.txn-mobile__links { display: flex; gap: 0.5rem; justify-content: flex-end; margin-top: 0.25rem; }
.txn-mobile__links button { font-size: 0.6875rem; font-weight: 600; color: var(--brand); }
.txn-mobile__links button:last-child { color: #94a3b8; }

.txn-empty { text-align: center; padding: 3rem 1.5rem; }
.txn-empty__icon {
    width: 3.25rem; height: 3.25rem; margin: 0 auto 0.85rem;
    display: flex; align-items: center; justify-content: center;
    background: rgba(148, 163, 184, 0.12); border-radius: 12px; color: #94a3b8;
}
.txn-empty__icon svg { width: 1.5rem; height: 1.5rem; }
.txn-empty__title { font-size: 0.9375rem; font-weight: 600; color: #475569; }
.dark .txn-empty__title { color: #cbd5e1; }
.txn-empty__sub { font-size: 0.8125rem; color: #94a3b8; margin-top: 0.25rem; }

.txn-pagination {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 0.85rem 1.25rem; border-top: 1px solid #eef1f5; flex-wrap: wrap;
}
.dark .txn-pagination { border-top-color: rgba(255, 255, 255, 0.06); }
.txn-pagination__info { font-size: 0.8125rem; color: #94a3b8; }
.txn-pagination__links { display: flex; gap: 0.35rem; flex-wrap: wrap; }
.txn-pagination__link {
    padding: 0.4rem 0.7rem; font-size: 0.8125rem; font-weight: 500;
    color: #64748b; background: rgba(148, 163, 184, 0.1); border-radius: 8px;
    transition: background 0.12s, color 0.12s;
}
.txn-pagination__link:hover { background: rgba(148, 163, 184, 0.18); color: #334155; }
.txn-pagination__link.is-active { background: var(--brand); color: #fff; }

@media (max-width: 900px) {
    .txn-filter__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
    .txn-filter__grid { grid-template-columns: 1fr; }
    .txn-panel__head { flex-direction: column; align-items: flex-start; }
}

/* ==========================================
   Cüzdanlar (Wallets)
   ========================================== */
.wlt-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1.375rem 1.5rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .wlt-hero { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }

.wlt-hero__label { font-size: 0.75rem; color: #94a3b8; font-weight: 500; }
.wlt-hero__amount { font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; margin-top: 0.15rem; color: #0f172a; }
.dark .wlt-hero__amount { color: #f8fafc; }
.wlt-hero__meta { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8125rem; color: #64748b; margin-top: 0.5rem; }
.wlt-hero__dot { opacity: 0.4; }

.wlt-hero__add {
    display: inline-flex; align-items: center; gap: 0.45rem;
    padding: 0.65rem 1.15rem;
    background: #0f172a; color: #fff;
    border-radius: 10px; font-size: 0.8125rem; font-weight: 600;
    white-space: nowrap; flex-shrink: 0;
    transition: background 0.15s, transform 0.15s;
}
.wlt-hero__add:hover { background: #1e293b; transform: translateY(-1px); }
.dark .wlt-hero__add { background: var(--brand); }
.dark .wlt-hero__add:hover { background: #7c7ff5; }
.wlt-hero__add svg { width: 1rem; height: 1rem; }

/* Dağılım rayı */
.wlt-rail {
    display: flex;
    gap: 0.625rem;
    overflow-x: auto;
    padding-bottom: 0.25rem;
    scrollbar-width: thin;
}
.wlt-rail::-webkit-scrollbar { height: 5px; }
.wlt-rail::-webkit-scrollbar-thumb { background: rgba(148, 163, 184, 0.4); border-radius: 999px; }
.wlt-rail__item {
    display: flex; align-items: center; gap: 0.65rem;
    background: #fff; border: 1px solid #e2e5ea;
    border-left: 3px solid var(--brand, var(--brand));
    border-radius: 11px; padding: 0.55rem 0.9rem 0.55rem 0.65rem;
    flex: 0 0 auto; min-width: 9.5rem;
    transition: border-color 0.12s, box-shadow 0.12s;
}
.dark .wlt-rail__item { background: #131920; border-color: rgba(255, 255, 255, 0.06); }
.wlt-rail__item:hover { box-shadow: 0 4px 14px rgba(15, 23, 42, 0.07); }
.wlt-rail__info { display: flex; flex-direction: column; gap: 0.05rem; }
.wlt-rail__pct { font-size: 0.6875rem; font-weight: 700; color: var(--brand, var(--brand)); }
.wlt-rail__amount { font-size: 0.8125rem; font-weight: 700; color: #334155; }
.dark .wlt-rail__amount { color: #e2e8f0; }

/* Form */
.wlt-form {
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1.1rem 1.25rem 1.2rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .wlt-form { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }
.wlt-form.hidden { display: none; }
.wlt-form__head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem;
    margin-bottom: 1rem; padding-bottom: 0.85rem; border-bottom: 1px solid #eef1f5;
}
.dark .wlt-form__head { border-bottom-color: rgba(255, 255, 255, 0.06); }
.wlt-form__title { font-size: 0.875rem; font-weight: 700; color: #1f2937; letter-spacing: -0.01em; }
.dark .wlt-form__title { color: #f3f4f6; }
.wlt-form__sub { font-size: 0.75rem; color: #94a3b8; margin-top: 0.15rem; }
.wlt-form__close { padding: 0.35rem; color: #94a3b8; border-radius: 8px; line-height: 0; }
.wlt-form__close:hover { color: #475569; background: rgba(148, 163, 184, 0.14); }
.wlt-form__close svg { width: 1.1rem; height: 1.1rem; }
.wlt-form__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.85rem; }
.wlt-field__label {
    display: block; font-size: 0.6875rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.04em; color: #94a3b8; margin-bottom: 0.35rem;
}
.wlt-field__input {
    width: 100%; padding: 0.6rem 0.75rem; font-size: 0.8125rem;
    background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 9px; color: #1f2937;
    transition: border-color 0.12s, box-shadow 0.12s;
}
.dark .wlt-field__input { background: #0e141b; border-color: rgba(255, 255, 255, 0.08); color: #f1f5f9; }
.wlt-field__input:focus { outline: none; border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12); }
.wlt-field__color { display: flex; align-items: center; gap: 0.5rem; }
.wlt-field__picker { width: 2.5rem; height: 2.5rem; border: none; border-radius: 9px; cursor: pointer; padding: 0; }
.wlt-form__submit {
    flex: 1; padding: 0.6rem 1rem; background: #0f172a; color: #fff;
    border-radius: 9px; font-size: 0.8125rem; font-weight: 600; transition: background 0.12s;
}
.wlt-form__submit:hover { background: #1e293b; }
.dark .wlt-form__submit { background: #3b82f6; }
.dark .wlt-form__submit:hover { background: #60a5fa; }

/* Kart grid */
.wlt-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: 0.875rem;
}

.wlt-card {
    position: relative;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 0;
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
    cursor: default;
}
.dark .wlt-card { background: #131920; border-color: rgba(255, 255, 255, 0.06); }
.wlt-card:hover { box-shadow: 0 10px 32px rgba(15, 23, 42, 0.1); transform: translateY(-3px); border-color: color-mix(in srgb, var(--brand) 35%, #e2e5ea); }
.dark .wlt-card:hover { box-shadow: 0 10px 32px rgba(0, 0, 0, 0.35); }
.wlt-card.is-negative { border-color: rgba(239, 68, 68, 0.25); }
.wlt-card.is-negative .wlt-card__top { background: linear-gradient(135deg, rgba(239,68,68,0.12), rgba(239,68,68,0.04)); }

.wlt-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1rem 1.1rem 0.85rem;
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 14%, #fff), color-mix(in srgb, var(--brand) 4%, #fff));
    border-bottom: 1px solid color-mix(in srgb, var(--brand) 12%, transparent);
}
.dark .wlt-card__top { background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 18%, #131920), color-mix(in srgb, var(--brand) 6%, #131920)); }

.wlt-card__logo { display: inline-flex; filter: drop-shadow(0 2px 6px rgba(15, 23, 42, 0.12)); }
.wlt-card__actions { display: flex; gap: 0.15rem; margin-left: auto; }
.wlt-card__delete,
.wlt-card__edit {
    padding: 0.35rem; color: #94a3b8; border-radius: 7px; line-height: 0;
    opacity: 0; transition: opacity 0.15s, color 0.12s, background 0.12s;
    background: transparent; border: none; cursor: pointer;
}
.wlt-card:hover .wlt-card__delete,
.wlt-card:hover .wlt-card__edit { opacity: 1; }
.wlt-card__delete:hover { color: #ef4444; background: rgba(239, 68, 68, 0.1); }
.wlt-card__edit:hover { color: var(--brand); background: var(--brand-soft); }
.wlt-card__delete svg,
.wlt-card__edit svg { width: 1rem; height: 1rem; }

.wlt-card__balance {
    font-size: 1.625rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: #0f172a;
    padding: 0.85rem 1.1rem 0.25rem;
    line-height: 1.1;
}
.dark .wlt-card__balance { color: #f8fafc; }
.wlt-card__balance.is-negative { color: #dc2626; }

.wlt-card__share {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0 1.1rem 0.65rem;
}
.wlt-card__bar {
    flex: 1;
    height: 4px;
    background: rgba(148, 163, 184, 0.18);
    border-radius: 999px;
    overflow: hidden;
}
.wlt-card__bar-fill {
    height: 100%;
    background: var(--brand, var(--brand));
    border-radius: 999px;
    transition: width 0.5s ease;
}
.wlt-card__pct {
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--brand, var(--brand));
    min-width: 2rem;
    text-align: right;
}

.wlt-card__foot {
    display: flex;
    align-items: center;
    padding: 0.55rem 1.1rem 0.85rem;
    border-top: 1px dashed #eef1f5;
}
.dark .wlt-card__foot { border-top-color: rgba(255, 255, 255, 0.06); }
.wlt-card__badge {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #b45309;
    background: rgba(245, 158, 11, 0.14);
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
}
.wlt-card__date { font-size: 0.6875rem; color: #94a3b8; }

/* Boş durum */
.wlt-empty {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 3.5rem 1.5rem; background: #fff; border: 1px dashed #d8dee6; border-radius: 14px;
}
.dark .wlt-empty { background: #131920; border-color: rgba(255, 255, 255, 0.1); }
.wlt-empty__icon {
    width: 3.5rem; height: 3.5rem; display: flex; align-items: center; justify-content: center;
    border-radius: 14px; background: rgba(59, 130, 246, 0.1); color: #3b82f6; margin-bottom: 1rem;
}
.wlt-empty__icon svg { width: 1.75rem; height: 1.75rem; }
.wlt-empty h3 { font-size: 1.05rem; font-weight: 700; color: #1f2937; }
.dark .wlt-empty h3 { color: #f1f5f9; }
.wlt-empty p { font-size: 0.875rem; color: #64748b; max-width: 26rem; margin: 0.4rem 0 1.25rem; line-height: 1.5; }
.wlt-empty__btn { padding: 0.65rem 1.3rem; background: #3b82f6; color: #fff; border-radius: 10px; font-size: 0.8125rem; font-weight: 600; }

@media (max-width: 900px) {
    .wlt-form__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
    .wlt-hero { flex-direction: column; align-items: stretch; }
    .wlt-hero__add { width: 100%; justify-content: center; }
    .wlt-form__grid { grid-template-columns: 1fr; }
}

/* ==========================================
   Yedekleme
   ========================================== */
.bkp-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1.35rem 1.5rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .bkp-hero { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }

.bkp-hero__label { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #94a3b8; }
.bkp-hero__title { font-size: 1.35rem; font-weight: 800; letter-spacing: -0.03em; color: #0f172a; margin-top: 0.2rem; }
.dark .bkp-hero__title { color: #f8fafc; }
.bkp-hero__sub { font-size: 0.8125rem; color: #64748b; margin-top: 0.35rem; max-width: 28rem; }

.bkp-hero__btn {
    display: inline-flex; align-items: center; gap: 0.45rem;
    padding: 0.7rem 1.2rem; background: #0f172a; color: #fff;
    border: none; border-radius: 10px; font-size: 0.8125rem; font-weight: 600;
    cursor: pointer; transition: background 0.12s, transform 0.12s;
}
.bkp-hero__btn:hover { background: #1e293b; transform: translateY(-1px); }
.dark .bkp-hero__btn { background: var(--brand); }
.dark .bkp-hero__btn:hover { background: #7c7ff5; }
.bkp-hero__btn svg { width: 1rem; height: 1rem; }

.bkp-stat { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.15rem !important; }
.bkp-stat__icon {
    width: 2.5rem; height: 2.5rem; border-radius: 10px;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.bkp-stat__icon svg { width: 1.25rem; height: 1.25rem; }
.bkp-stat__icon--blue { background: rgba(59, 130, 246, 0.12); color: #3b82f6; }
.bkp-stat__icon--green { background: rgba(16, 185, 129, 0.12); color: #10b981; }
.bkp-stat__icon--amber { background: rgba(245, 158, 11, 0.12); color: #f59e0b; }
.bkp-stat__label { font-size: 0.6875rem; color: #94a3b8; font-weight: 500; }
.bkp-stat__value { font-size: 1.25rem; font-weight: 800; color: #0f172a; letter-spacing: -0.02em; line-height: 1.1; }
.bkp-stat__value--sm { font-size: 0.9375rem; font-weight: 700; }
.dark .bkp-stat__value { color: #f8fafc; }

.bkp-panel { padding: 0 !important; overflow: hidden; }
.bkp-panel__head { padding: 1.1rem 1.25rem; border-bottom: 1px solid #eef1f5; }
.dark .bkp-panel__head { border-bottom-color: rgba(255, 255, 255, 0.06); }
.bkp-panel__title { font-size: 0.9375rem; font-weight: 700; color: #1f2937; }
.dark .bkp-panel__title { color: #f3f4f6; }
.bkp-panel__sub { font-size: 0.75rem; color: #94a3b8; margin-top: 0.15rem; }

.bkp-empty {
    padding: 2.5rem 1.5rem; text-align: center; color: #94a3b8;
}
.bkp-empty svg { width: 2.5rem; height: 2.5rem; margin: 0 auto 0.75rem; opacity: 0.5; }
.bkp-empty p { font-size: 0.9375rem; font-weight: 600; color: #64748b; }
.dark .bkp-empty p { color: #94a3b8; }
.bkp-empty span { display: block; font-size: 0.8125rem; margin-top: 0.25rem; }

.bkp-list { display: flex; flex-direction: column; }
.bkp-row {
    display: flex; align-items: center; gap: 0.85rem;
    padding: 0.85rem 1.25rem; border-bottom: 1px solid #f1f3f6;
    transition: background 0.1s;
}
.dark .bkp-row { border-bottom-color: rgba(255, 255, 255, 0.04); }
.bkp-row:last-child { border-bottom: none; }
.bkp-row:hover { background: rgba(99, 102, 241, 0.03); }

.bkp-row__icon {
    width: 2.25rem; height: 2.25rem; border-radius: 9px;
    background: var(--brand-soft); color: var(--brand);
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.bkp-row__icon svg { width: 1.1rem; height: 1.1rem; }
.bkp-row__info { flex: 1; min-width: 0; }
.bkp-row__name { font-size: 0.8125rem; font-weight: 600; color: #1f2937; font-family: 'IBM Plex Mono', ui-monospace, monospace; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dark .bkp-row__name { color: #e2e8f0; }
.bkp-row__meta { font-size: 0.6875rem; color: #94a3b8; margin-top: 0.15rem; }
.bkp-row__meta span { opacity: 0.5; margin: 0 0.2rem; }

.bkp-row__actions { display: flex; align-items: center; gap: 0.35rem; flex-shrink: 0; }
.bkp-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem;
    padding: 0.45rem 0.75rem; border-radius: 8px; font-size: 0.75rem; font-weight: 600;
    border: none; cursor: pointer; transition: background 0.12s; text-decoration: none;
}
.bkp-btn svg { width: 0.9rem; height: 0.9rem; }
.bkp-btn--primary { background: var(--brand-soft); color: var(--brand); }
.bkp-btn--primary:hover { background: rgba(99, 102, 241, 0.2); }
.bkp-btn--ghost { background: transparent; color: #94a3b8; padding: 0.45rem; }
.bkp-btn--ghost:hover { background: rgba(239, 68, 68, 0.1); color: #ef4444; }

.bkp-info { padding: 1.15rem 1.25rem !important; }
.bkp-info__title { font-size: 0.875rem; font-weight: 700; color: #1f2937; margin-bottom: 0.65rem; }
.dark .bkp-info__title { color: #f3f4f6; }
.bkp-info__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.45rem; }
.bkp-info__list li {
    font-size: 0.8125rem; color: #64748b; line-height: 1.5;
    padding-left: 1rem; position: relative;
}
.bkp-info__list li::before {
    content: ''; position: absolute; left: 0; top: 0.55em;
    width: 4px; height: 4px; border-radius: 50%; background: var(--brand);
}

@media (max-width: 640px) {
    .bkp-row { flex-wrap: wrap; }
    .bkp-row__actions { width: 100%; justify-content: flex-end; padding-top: 0.35rem; }
}

/* ==========================================
   E-Posta Ayarları
   ========================================== */
.mail-hero {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    background: #fff; border: 1px solid #e2e5ea; border-radius: 14px; padding: 1.35rem 1.5rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .mail-hero { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }
.mail-hero__label { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #94a3b8; }
.mail-hero__title { font-size: 1.35rem; font-weight: 800; letter-spacing: -0.03em; color: #0f172a; margin-top: 0.2rem; }
.dark .mail-hero__title { color: #f8fafc; }
.mail-hero__sub { font-size: 0.8125rem; color: #64748b; margin-top: 0.35rem; max-width: 32rem; }
.mail-hero__badge {
    font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
    padding: 0.35rem 0.75rem; border-radius: 999px; background: rgba(148, 163, 184, 0.15); color: #64748b;
}
.mail-hero__badge.is-on { background: rgba(16, 185, 129, 0.12); color: #10b981; }

.mail-form { padding: 0 !important; overflow: hidden; }
.mail-form__section { padding: 1.25rem 1.5rem; border-bottom: 1px solid #eef1f5; }
.dark .mail-form__section { border-bottom-color: rgba(255, 255, 255, 0.06); }
.mail-form__section--last { border-bottom: none; }
.mail-form__title { font-size: 0.9375rem; font-weight: 700; color: #1f2937; }
.dark .mail-form__title { color: #f3f4f6; }
.mail-form__desc { font-size: 0.75rem; color: #94a3b8; margin: 0.2rem 0 1rem; }
.mail-form__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.85rem; }
.mail-field--wide { grid-column: 1 / -1; }
@media (max-width: 640px) { .mail-form__grid { grid-template-columns: 1fr; } }

.mail-field__label {
    display: block; font-size: 0.6875rem; font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.04em; color: #94a3b8; margin-bottom: 0.35rem;
}
.mail-field__input {
    width: 100%; padding: 0.65rem 0.85rem; font-size: 0.8125rem;
    background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 9px; color: #1f2937;
    transition: border-color 0.12s, box-shadow 0.12s;
}
.dark .mail-field__input { background: #0e141b; border-color: rgba(255, 255, 255, 0.08); color: #f1f5f9; }
.mail-field__input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }

.mail-toggle {
    display: flex; align-items: center; gap: 0.85rem; cursor: pointer; user-select: none;
}
.mail-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.mail-toggle__track {
    width: 2.75rem; height: 1.5rem; border-radius: 999px; background: #cbd5e1;
    position: relative; transition: background 0.2s; flex-shrink: 0;
}
.mail-toggle__thumb {
    position: absolute; top: 3px; left: 3px; width: 1.125rem; height: 1.125rem;
    border-radius: 50%; background: #fff; transition: transform 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.mail-toggle input:checked + .mail-toggle__track { background: var(--brand); }
.mail-toggle input:checked + .mail-toggle__track .mail-toggle__thumb { transform: translateX(1.25rem); }
.mail-toggle__text { display: flex; flex-direction: column; gap: 0.15rem; }
.mail-toggle__text strong { font-size: 0.875rem; color: #1f2937; font-weight: 600; }
.dark .mail-toggle__text strong { color: #f3f4f6; }
.mail-toggle__text small { font-size: 0.75rem; color: #94a3b8; }

.mail-form__actions { margin-top: 1.25rem; }
.mail-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
    padding: 0.65rem 1.2rem; border-radius: 9px; font-size: 0.8125rem; font-weight: 600;
    border: none; cursor: pointer; transition: background 0.12s, transform 0.12s;
}
.mail-btn--primary { background: #0f172a; color: #fff; }
.mail-btn--primary:hover { background: #1e293b; transform: translateY(-1px); }
.dark .mail-btn--primary { background: var(--brand); }
.dark .mail-btn--primary:hover { background: #7c7ff5; }
.mail-btn--outline {
    background: transparent; color: var(--brand); border: 1px solid var(--brand-ring);
}
.mail-btn--outline:hover { background: rgba(99, 102, 241, 0.08); }

.mail-test { padding: 1.15rem 1.5rem !important; }
.mail-test__title { font-size: 0.9375rem; font-weight: 700; color: #1f2937; }
.dark .mail-test__title { color: #f3f4f6; }
.mail-test__sub { font-size: 0.75rem; color: #94a3b8; margin-top: 0.15rem; }
.mail-test__form { display: flex; gap: 0.65rem; margin-top: 1rem; flex-wrap: wrap; }
.mail-test__form .mail-field__input { flex: 1; min-width: 200px; }

.mail-info { padding: 1.15rem 1.5rem !important; }
.mail-info__title { font-size: 0.875rem; font-weight: 700; color: #1f2937; margin-bottom: 0.75rem; }
.dark .mail-info__title { color: #f3f4f6; }
.mail-info__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.65rem; }
@media (max-width: 768px) { .mail-info__grid { grid-template-columns: 1fr; } }
.mail-info__card {
    padding: 0.75rem 0.85rem; background: #f8fafc; border: 1px solid #eef1f5; border-radius: 9px;
    display: flex; flex-direction: column; gap: 0.2rem;
}
.dark .mail-info__card { background: #0e141b; border-color: rgba(255, 255, 255, 0.06); }
.mail-info__card strong { font-size: 0.8125rem; color: #1f2937; }
.dark .mail-info__card strong { color: #e2e8f0; }
.mail-info__card span { font-size: 0.6875rem; color: #94a3b8; font-family: 'IBM Plex Mono', ui-monospace, monospace; }
.mail-info__note { font-size: 0.75rem; color: #64748b; margin-top: 0.85rem; line-height: 1.5; }

/* Özet tercihleri (ayarlar sekmesi) */
.sum-prefs__warn {
    display: flex; gap: 0.75rem; align-items: flex-start;
    padding: 0.85rem 1rem; margin-bottom: 1.25rem;
    background: rgba(245, 158, 11, 0.1); border: 1px solid rgba(245, 158, 11, 0.25);
    border-radius: 10px; font-size: 0.8125rem; color: #92400e;
}
.dark .sum-prefs__warn { color: #fbbf24; background: rgba(245, 158, 11, 0.08); }
.sum-prefs__warn svg { width: 1.25rem; height: 1.25rem; flex-shrink: 0; margin-top: 0.1rem; }
.sum-prefs__warn strong { display: block; font-weight: 600; margin-bottom: 0.15rem; }
.sum-prefs__warn p { margin: 0; color: inherit; opacity: 0.9; }
.sum-prefs__warn a { color: #b45309; font-weight: 600; text-decoration: underline; }
.dark .sum-prefs__warn a { color: #fcd34d; }

.sum-prefs__list { display: flex; flex-direction: column; gap: 0.5rem; }
.sum-prefs__row {
    display: flex; align-items: center; gap: 0.85rem;
    padding: 0.85rem 1rem; border: 1px solid #eef1f5; border-radius: 11px;
    cursor: pointer; transition: border-color 0.12s, background 0.12s;
}
.dark .sum-prefs__row { border-color: rgba(255, 255, 255, 0.06); }
.sum-prefs__row:hover:not(.sum-prefs__row--disabled) { border-color: var(--brand-ring); background: rgba(99, 102, 241, 0.03); }
.sum-prefs__row--disabled { opacity: 0.55; cursor: not-allowed; }

.sum-prefs__icon {
    width: 2.25rem; height: 2.25rem; border-radius: 9px;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.sum-prefs__icon svg { width: 1.15rem; height: 1.15rem; }
.sum-prefs__icon--mail { background: var(--brand-soft); color: var(--brand); }
.sum-prefs__icon--tg { background: rgba(14, 165, 233, 0.12); color: #0ea5e9; }

.sum-prefs__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.1rem; }
.sum-prefs__text strong { font-size: 0.875rem; color: #1f2937; font-weight: 600; }
.dark .sum-prefs__text strong { color: #f3f4f6; }
.sum-prefs__text small { font-size: 0.75rem; color: #94a3b8; line-height: 1.4; }

.sum-prefs__check {
    width: 1.125rem; height: 1.125rem; accent-color: var(--brand); cursor: pointer; flex-shrink: 0;
}

.sum-prefs__preview { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.sum-prefs__preview-btn {
    padding: 0.6rem 1rem; border-radius: 9px; font-size: 0.8125rem; font-weight: 600;
    background: var(--brand-soft); color: var(--brand); border: none; cursor: pointer;
    transition: background 0.12s;
}
.sum-prefs__preview-btn:hover { background: rgba(99, 102, 241, 0.2); }
.sum-prefs__preview-btn--alt { background: rgba(15, 23, 42, 0.08); color: #0f172a; }
.dark .sum-prefs__preview-btn--alt { background: rgba(255,255,255,0.08); color: #e2e8f0; }
.sum-prefs__preview-btn--tg { background: rgba(14, 165, 233, 0.12); color: #0284c7; }
.sum-prefs__preview-btn--tg:hover { background: rgba(14, 165, 233, 0.2); }

.sum-prefs__chat .mail-field__input { max-width: 16rem; }

.sum-prefs__help { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.55rem; }
.sum-prefs__help li { font-size: 0.8125rem; color: #64748b; line-height: 1.55; padding-left: 0.85rem; position: relative; }
.sum-prefs__help li::before { content: '·'; position: absolute; left: 0; color: var(--brand); font-weight: 700; }

.sum-prefs__cron { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #eef1f5; }
.dark .sum-prefs__cron { border-top-color: rgba(255, 255, 255, 0.06); }
.sum-prefs__cron-label { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #94a3b8; }
.sum-prefs__cron-url {
    display: block; margin-top: 0.4rem; padding: 0.55rem 0.75rem;
    background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 8px;
    font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 0.6875rem;
    color: #475569; word-break: break-all;
}
.dark .sum-prefs__cron-url { background: #0e141b; border-color: rgba(255,255,255,0.08); color: #94a3b8; }
.sum-prefs__cron-hint { font-size: 0.6875rem; color: #94a3b8; margin-top: 0.5rem; line-height: 1.5; }

/* ==========================================
   Kullanıcı yönetimi
   ========================================== */
.usr-hero {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    background: #fff; border: 1px solid #e2e5ea; border-radius: 14px; padding: 1.35rem 1.5rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .usr-hero { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }
.usr-hero__label { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #94a3b8; }
.usr-hero__title { font-size: 1.35rem; font-weight: 800; letter-spacing: -0.03em; color: #0f172a; margin-top: 0.2rem; }
.dark .usr-hero__title { color: #f8fafc; }
.usr-hero__sub { font-size: 0.8125rem; color: #64748b; margin-top: 0.35rem; }
.usr-hero__btn {
    display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.7rem 1.2rem;
    background: #0f172a; color: #fff; border: none; border-radius: 10px;
    font-size: 0.8125rem; font-weight: 600; cursor: pointer; transition: background 0.12s, transform 0.12s;
}
.usr-hero__btn:hover { background: #1e293b; transform: translateY(-1px); }
.dark .usr-hero__btn { background: var(--brand); }
.dark .usr-hero__btn:hover { background: #7c7ff5; }
.usr-hero__btn svg { width: 1rem; height: 1rem; }

.usr-stat { padding: 1rem 1.15rem !important; }
.usr-stat__label { font-size: 0.6875rem; color: #94a3b8; font-weight: 500; }
.usr-stat__value { font-size: 1.35rem; font-weight: 800; color: #0f172a; letter-spacing: -0.02em; line-height: 1.1; margin-top: 0.15rem; }
.dark .usr-stat__value { color: #f8fafc; }

.usr-form { padding: 1.25rem 1.5rem !important; }
.usr-form__title { font-size: 0.9375rem; font-weight: 700; color: #1f2937; margin-bottom: 1rem; }
.dark .usr-form__title { color: #f3f4f6; }
.usr-form__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.85rem; align-items: end; }
.usr-form__grid--edit { margin-top: 0.5rem; }
@media (max-width: 768px) { .usr-form__grid { grid-template-columns: 1fr; } }

.usr-field__label {
    display: block; font-size: 0.6875rem; font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.04em; color: #94a3b8; margin-bottom: 0.35rem;
}
.usr-field__input {
    width: 100%; padding: 0.6rem 0.75rem; font-size: 0.8125rem;
    background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 9px; color: #1f2937;
}
.dark .usr-field__input { background: #0e141b; border-color: rgba(255, 255, 255, 0.08); color: #f1f5f9; }
.usr-field__input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.usr-field--action, .usr-field--actions { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
.usr-check { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8125rem; color: #64748b; cursor: pointer; padding-top: 1.25rem; }

.usr-btn {
    padding: 0.6rem 1rem; border-radius: 9px; font-size: 0.8125rem; font-weight: 600;
    border: none; cursor: pointer; transition: background 0.12s;
}
.usr-btn--primary { background: var(--brand); color: #fff; }
.usr-btn--primary:hover { background: #5558e3; }
.usr-btn--danger { background: rgba(239, 68, 68, 0.12); color: #ef4444; }
.usr-btn--danger:hover { background: rgba(239, 68, 68, 0.2); }

.usr-panel { padding: 0 !important; overflow: hidden; }
.usr-panel__head { padding: 1.1rem 1.25rem; border-bottom: 1px solid #eef1f5; }
.dark .usr-panel__head { border-bottom-color: rgba(255, 255, 255, 0.06); }
.usr-panel__title { font-size: 0.9375rem; font-weight: 700; color: #1f2937; }
.dark .usr-panel__title { color: #f3f4f6; }

.usr-empty { padding: 2rem; text-align: center; color: #94a3b8; font-size: 0.875rem; }

.usr-list { display: flex; flex-direction: column; }
.usr-row { border-bottom: 1px solid #f1f3f6; }
.dark .usr-row { border-bottom-color: rgba(255, 255, 255, 0.04); }
.usr-row:last-child { border-bottom: none; }

.usr-row__head {
    display: flex; align-items: center; gap: 0.85rem; padding: 0.85rem 1.25rem;
    cursor: pointer; list-style: none;
}
.usr-row__head::-webkit-details-marker { display: none; }
.usr-row[open] .usr-row__head { background: rgba(99, 102, 241, 0.03); }

.usr-row__avatar {
    width: 2.25rem; height: 2.25rem; border-radius: 9px; background: var(--brand); color: #fff;
    display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.875rem; flex-shrink: 0;
}
.usr-row__info { flex: 1; min-width: 0; }
.usr-row__name { font-size: 0.875rem; font-weight: 600; color: #1f2937; display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.dark .usr-row__name { color: #f3f4f6; }
.usr-row__email { font-size: 0.75rem; color: #94a3b8; margin-top: 0.1rem; }
.usr-row__meta { display: flex; gap: 0.35rem; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }

.usr-badge {
    font-size: 0.625rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
    padding: 0.2rem 0.5rem; border-radius: 999px; background: rgba(148, 163, 184, 0.15); color: #64748b;
}
.usr-badge--admin { background: var(--brand-soft); color: var(--brand); }
.usr-badge--active { background: rgba(16, 185, 129, 0.12); color: #10b981; }
.usr-badge--inactive { background: rgba(239, 68, 68, 0.1); color: #ef4444; }
.usr-badge--self { background: rgba(245, 158, 11, 0.12); color: #d97706; text-transform: none; letter-spacing: 0; }

.usr-row__body { padding: 0 1.25rem 1.25rem; border-top: 1px solid #f1f3f6; }
.dark .usr-row__body { border-top-color: rgba(255, 255, 255, 0.04); }
.usr-row__date { font-size: 0.6875rem; color: #94a3b8; margin-top: 0.75rem; }

@media (max-width: 640px) {
    .usr-row__head { flex-wrap: wrap; }
    .usr-row__meta { width: 100%; justify-content: flex-start; padding-left: 3.1rem; }
}

/* ==========================================
   Transferler
   ========================================== */
.trf-hero {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    background: #fff; border: 1px solid #e2e5ea; border-radius: 14px; padding: 1.35rem 1.5rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .trf-hero { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }
.trf-hero__label { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #94a3b8; }
.trf-hero__amount { font-size: 1.75rem; font-weight: 800; letter-spacing: -0.03em; color: #0f172a; margin-top: 0.15rem; }
.dark .trf-hero__amount { color: #f8fafc; }
.trf-hero__sub { font-size: 0.8125rem; color: #64748b; margin-top: 0.35rem; }
.trf-hero__btn {
    display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.7rem 1.2rem;
    background: var(--brand); color: #fff; border: none; border-radius: 10px;
    font-size: 0.8125rem; font-weight: 600; cursor: pointer; transition: background 0.12s, transform 0.12s;
    box-shadow: 0 4px 14px var(--brand-shadow);
}
.trf-hero__btn:hover { background: var(--brand-hover); transform: translateY(-1px); }
.trf-hero__btn svg { width: 1rem; height: 1rem; }

.trf-empty__btn {
    display: inline-block; margin-top: 0.75rem; padding: 0.55rem 1rem;
    background: var(--brand-soft); color: var(--brand); border-radius: 9px;
    font-size: 0.8125rem; font-weight: 600; text-decoration: none; border: none; cursor: pointer;
}
.dark .trf-empty__btn { background: var(--brand-soft-md); color: color-mix(in srgb, var(--brand) 85%, white); }

.trf-list { display: flex; flex-direction: column; }
.trf-row {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    padding: 1rem 1.25rem; border-bottom: 1px solid #f1f3f6;
}
.dark .trf-row { border-bottom-color: rgba(255, 255, 255, 0.04); }
.trf-row:last-child { border-bottom: none; }

.trf-row__flow { display: flex; align-items: center; gap: 0.65rem; flex-wrap: wrap; min-width: 0; }
.trf-row__wallet { display: flex; align-items: center; gap: 0.45rem; min-width: 0; }
.trf-row__wallet-name { font-size: 0.8125rem; font-weight: 600; color: #1f2937; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 8rem; }
.dark .trf-row__wallet-name { color: #f3f4f6; }
.trf-row__arrow { color: #94a3b8; }
.trf-row__arrow svg { width: 1.1rem; height: 1.1rem; }

.trf-row__meta { display: flex; align-items: center; gap: 1rem; margin-left: auto; }
.trf-row__desc { font-size: 0.8125rem; font-weight: 500; color: #374151; }
.dark .trf-row__desc { color: #e5e7eb; }
.trf-row__date { font-size: 0.6875rem; color: #94a3b8; margin-top: 0.1rem; }
.trf-row__amount { font-size: 0.9375rem; font-weight: 700; color: var(--brand); white-space: nowrap; }
.dark .trf-row__amount { color: color-mix(in srgb, var(--brand) 85%, white); }

.dash-btn--transfer {
    background: var(--brand-soft); color: var(--brand); border: 1px solid color-mix(in srgb, var(--brand) 22%, transparent);
}
.dark .dash-btn--transfer { background: var(--brand-soft-md); color: color-mix(in srgb, var(--brand) 85%, white); border-color: color-mix(in srgb, var(--brand) 30%, transparent); }
.dash-btn--transfer:hover { background: color-mix(in srgb, var(--brand) 18%, transparent); }

.dash-trf-item {
    display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
    padding: 0.65rem 0.75rem; border-radius: 10px; transition: background 0.12s;
}
.dash-trf-item:hover { background: var(--brand-soft); }
.dark .dash-trf-item:hover { background: var(--brand-soft-md); }
.dash-trf-item__wallets { display: flex; align-items: center; gap: 0.4rem; min-width: 0; flex: 1; }
.dash-trf-item__from, .dash-trf-item__to {
    font-size: 0.8125rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 6rem;
}
.dash-trf-item__side { text-align: right; shrink: 0; }

.dash-sub-item {
    display: flex; align-items: center; gap: 0.65rem;
    padding: 0.65rem 0.75rem; border-radius: 10px; transition: background 0.12s;
}
.dash-sub-item:hover { background: rgba(99, 102, 241, 0.04); }
.dark .dash-sub-item:hover { background: rgba(99, 102, 241, 0.08); }

/* ==========================================
   Cron yönetimi
   ========================================== */
.crn-hero {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    background: #fff; border: 1px solid #e2e5ea; border-radius: 14px; padding: 1.35rem 1.5rem;
}
.dark .crn-hero { background: #131920; border-color: rgba(255, 255, 255, 0.06); }
.crn-hero__label { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #94a3b8; }
.crn-hero__title { font-size: 1.35rem; font-weight: 800; letter-spacing: -0.03em; color: #0f172a; margin-top: 0.2rem; }
.dark .crn-hero__title { color: #f8fafc; }
.crn-hero__sub { font-size: 0.8125rem; color: #64748b; margin-top: 0.35rem; }
.crn-hero__status { display: flex; gap: 0.5rem; flex-wrap: wrap; }

.crn-pill {
    font-size: 0.6875rem; font-weight: 700; padding: 0.35rem 0.65rem; border-radius: 999px;
}
.crn-pill--ok { background: rgba(16, 185, 129, 0.12); color: #10b981; }
.crn-pill--warn { background: rgba(245, 158, 11, 0.12); color: #d97706; }

.crn-stat { padding: 1rem 1.15rem !important; }
.crn-stat__label { font-size: 0.6875rem; color: #94a3b8; font-weight: 500; }
.crn-stat__value { font-size: 1.35rem; font-weight: 800; color: #0f172a; letter-spacing: -0.02em; line-height: 1.1; margin-top: 0.15rem; }
.crn-stat__value--sm { font-size: 0.9375rem; font-weight: 700; }
.crn-stat__value.is-danger { color: #ef4444; }
.dark .crn-stat__value { color: #f8fafc; }

.crn-sub { padding: 1rem 1.15rem !important; text-align: center; }
.crn-sub__label { font-size: 0.6875rem; color: #94a3b8; }
.crn-sub__value { font-size: 1.5rem; font-weight: 800; color: var(--brand); margin-top: 0.2rem; }

.crn-warn {
    display: flex; gap: 0.75rem; align-items: flex-start; padding: 1rem 1.15rem;
    background: rgba(245, 158, 11, 0.08); border: 1px solid rgba(245, 158, 11, 0.25); border-radius: 12px;
    font-size: 0.8125rem; color: #92400e;
}
.dark .crn-warn { background: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.2); color: #fbbf24; }
.crn-warn svg { width: 1.25rem; height: 1.25rem; flex-shrink: 0; margin-top: 0.1rem; }
.crn-warn a { font-weight: 600; text-decoration: underline; }

.crn-jobs { display: flex; flex-direction: column; gap: 1rem; }
.crn-job { padding: 1.25rem 1.5rem !important; }
.crn-job__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.crn-job__title { font-size: 0.9375rem; font-weight: 700; color: #1f2937; }
.dark .crn-job__title { color: #f3f4f6; }
.crn-job__desc { font-size: 0.8125rem; color: #64748b; margin-top: 0.25rem; line-height: 1.5; }
.crn-job__schedule {
    display: inline-flex; align-items: center; gap: 0.35rem; margin-top: 0.5rem;
    font-size: 0.6875rem; font-weight: 600; color: var(--brand); text-transform: uppercase; letter-spacing: 0.04em;
}
.crn-job__schedule svg { width: 0.875rem; height: 0.875rem; }

.crn-job__run {
    display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.6rem 1.1rem;
    background: var(--brand); color: #fff; border: none; border-radius: 10px;
    font-size: 0.8125rem; font-weight: 600; cursor: pointer;
    transition: background 0.12s, transform 0.12s, box-shadow 0.12s; white-space: nowrap;
    box-shadow: 0 1px 2px rgba(99, 102, 241, 0.25);
}
.crn-job__run:hover { background: #5558e3; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(99, 102, 241, 0.25); }
.crn-job__run:disabled { opacity: 0.65; cursor: not-allowed; transform: none; box-shadow: none; }
.crn-job__run svg { width: 1rem; height: 1rem; flex-shrink: 0; pointer-events: none; }

.crn-job__url-block { margin-top: 0.85rem; }
.crn-job__url-label { font-size: 0.625rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #94a3b8; }
.crn-job__url-row { display: flex; gap: 0.5rem; align-items: stretch; margin-top: 0.35rem; min-width: 0; }
.crn-job__url {
    flex: 1; min-width: 0; display: block; padding: 0.55rem 0.75rem;
    background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 8px;
    font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 0.6875rem;
    color: #475569; word-break: break-all; line-height: 1.5; overflow: hidden;
}
.dark .crn-job__url { background: #0e141b; border-color: rgba(255,255,255,0.08); color: #94a3b8; }

.crn-copy {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2.5rem; height: auto; min-height: 2.5rem; padding: 0;
    background: #fff; border: 1px solid #e2e5ea; border-radius: 8px;
    cursor: pointer; color: #64748b; flex-shrink: 0;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.crn-copy:hover { background: #f8fafc; color: #0f172a; border-color: #cbd5e1; }
.crn-copy.is-copied { background: rgba(16, 185, 129, 0.1); color: #10b981; border-color: rgba(16, 185, 129, 0.35); }
.crn-copy svg { width: 1rem; height: 1rem; pointer-events: none; }
.dark .crn-copy { background: #1a2230; border-color: rgba(255,255,255,0.1); color: #94a3b8; }
.dark .crn-copy:hover { background: #243044; color: #f1f5f9; }

.crn-panel { padding: 1.25rem 1.5rem !important; }
.crn-panel__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.crn-panel__title { font-size: 0.9375rem; font-weight: 700; color: #1f2937; }
.dark .crn-panel__title { color: #f3f4f6; }
.crn-panel__sub { font-size: 0.8125rem; color: #64748b; margin-top: 0.15rem; }
.crn-panel__link { font-size: 0.75rem; font-weight: 600; color: var(--brand); white-space: nowrap; }
.crn-panel__hint { font-size: 0.6875rem; color: #94a3b8; margin-top: 0.65rem; line-height: 1.5; }

.crn-secret {
    display: block; padding: 0.65rem 0.85rem; background: #f8fafc; border: 1px solid #e2e5ea; border-radius: 8px;
    font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 0.75rem; color: #475569; word-break: break-all;
}
.dark .crn-secret { background: #0e141b; border-color: rgba(255,255,255,0.08); color: #94a3b8; }

.crn-empty { padding: 2.5rem; text-align: center; color: #94a3b8; }
.crn-empty p { font-size: 0.875rem; font-weight: 600; color: #64748b; }
.crn-empty span { display: block; font-size: 0.75rem; margin-top: 0.35rem; }

.crn-log-list { display: flex; flex-direction: column; }
.crn-log-row {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
    padding: 0.75rem 0; border-bottom: 1px solid #f1f3f6;
}
.dark .crn-log-row { border-bottom-color: rgba(255,255,255,0.04); }
.crn-log-row:last-child { border-bottom: none; }
.crn-log-row__main { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.crn-log-row__type { font-size: 0.8125rem; font-weight: 600; color: #1f2937; }
.dark .crn-log-row__type { color: #f3f4f6; }
.crn-log-row__trigger { font-size: 0.6875rem; color: #94a3b8; padding: 0.15rem 0.45rem; background: #f1f5f9; border-radius: 999px; }
.dark .crn-log-row__trigger { background: rgba(255,255,255,0.06); }
.crn-log-row__meta { display: flex; gap: 0.65rem; flex-wrap: wrap; font-size: 0.6875rem; color: #94a3b8; }
.crn-log-row__meta .is-danger { color: #ef4444; font-weight: 600; }

.crn-badge {
    font-size: 0.625rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
    padding: 0.2rem 0.5rem; border-radius: 999px;
}
.crn-badge--success { background: rgba(16, 185, 129, 0.12); color: #10b981; }
.crn-badge--partial { background: rgba(245, 158, 11, 0.12); color: #d97706; }
.crn-badge--error { background: rgba(239, 68, 68, 0.12); color: #ef4444; }

/* Auth extras */
.auth-form__row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.25rem; }
.auth-forgot { font-size: 0.8125rem; color: var(--brand); text-decoration: none; }
.auth-forgot:hover { text-decoration: underline; }
.auth-alert--success { background: rgba(16, 185, 129, 0.12); border: 1px solid rgba(16, 185, 129, 0.25); color: #059669; }

/* Landing */
.landing-page { background: linear-gradient(160deg, #0f172a 0%, #134e4a 45%, #0f172a 100%); color: #e2e8f0; min-height: 100vh; }
.landing-header { display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 5vw; }
.landing-header__brand { display: flex; align-items: center; gap: 0.65rem; font-weight: 700; color: #fff; text-decoration: none; }
.landing-header__nav { display: flex; align-items: center; gap: 1rem; }
.landing-header__nav a { color: #cbd5e1; text-decoration: none; font-size: 0.875rem; }
.landing-header__cta { background: var(--brand); color: #fff !important; padding: 0.45rem 0.9rem; border-radius: 999px; font-weight: 600; }
.landing-hero { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 2rem; padding: 3rem 5vw 4rem; align-items: center; }
.landing-hero__badge { display: inline-block; font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: #5eead4; margin-bottom: 0.75rem; }
.landing-hero h1 { font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1.1; font-weight: 800; color: #fff; margin-bottom: 1rem; }
.landing-hero h1 span { color: #2dd4bf; }
.landing-hero__sub { color: #94a3b8; max-width: 34rem; margin-bottom: 1.5rem; }
.landing-hero__actions { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1rem; }
.landing-btn { display: inline-flex; padding: 0.7rem 1.2rem; border-radius: 12px; font-weight: 600; text-decoration: none; }
.landing-btn--primary { background: var(--brand); color: #fff; }
.landing-btn--ghost { border: 1px solid rgba(255,255,255,0.2); color: #e2e8f0; }
.landing-hero__demo { font-size: 0.8125rem; color: #64748b; }
.landing-mock { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08); border-radius: 20px; padding: 1rem; }
.landing-mock__bar { height: 10px; width: 40%; background: rgba(255,255,255,0.15); border-radius: 999px; margin-bottom: 1rem; }
.landing-mock__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.landing-mock__card { height: 72px; background: rgba(255,255,255,0.08); border-radius: 12px; }
.landing-mock__card--wide { grid-column: 1 / -1; height: 120px; }
.landing-features { padding: 2rem 5vw 4rem; }
.landing-features h2 { text-align: center; font-size: 1.75rem; font-weight: 700; color: #fff; margin-bottom: 2rem; }
.landing-features__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.landing-feature { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); border-radius: 16px; padding: 1.25rem; }
.landing-feature h3 { color: #fff; font-weight: 700; margin-bottom: 0.5rem; }
.landing-feature p { color: #94a3b8; font-size: 0.875rem; }
.landing-footer { display: flex; justify-content: space-between; padding: 1.5rem 5vw; border-top: 1px solid rgba(255,255,255,0.08); color: #64748b; font-size: 0.8125rem; }
.landing-footer a { color: #5eead4; }

/* ==========================================
   Install Wizard
   ========================================== */
.install-page {
    min-height: 100vh;
    font-family: 'Figtree', system-ui, sans-serif;
    color: #374151;
    background-color: #e8eaef;
    background-image: linear-gradient(165deg, #f0f2f6 0%, #e4e7ec 45%, #dfe3e9 100%);
}

.install-scene {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.25rem;
    position: relative;
    overflow: hidden;
}

.install-scene::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(15, 23, 42, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 23, 42, 0.035) 1px, transparent 1px);
    background-size: 40px 40px;
    mask-image: radial-gradient(ellipse 75% 70% at 50% 45%, #000 25%, transparent 100%);
    pointer-events: none;
}

.install-wrap {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 380px) minmax(0, 520px);
    gap: 0;
    width: min(960px, 100%);
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow:
        0 4px 6px rgba(15, 23, 42, 0.04),
        0 24px 48px rgba(15, 23, 42, 0.08);
    border: 1px solid rgba(15, 23, 42, 0.06);
}

.install-brand {
    background: linear-gradient(160deg, #0f172a 0%, #134e4a 55%, #0d9488 100%);
    color: #fff;
    padding: 2.25rem 2rem;
    display: flex;
    flex-direction: column;
}

.install-brand__inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.install-brand__logo {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-bottom: 2rem;
}

.install-brand__name {
    font-size: 1.0625rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.install-brand__ver {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.55);
    margin-top: 0.1rem;
}

.install-brand__headline {
    font-size: 1.625rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.25;
    margin-bottom: 0.75rem;
}

.install-brand__desc {
    font-size: 0.9375rem;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.55;
    margin-bottom: 1.75rem;
}

.install-brand__features {
    list-style: none;
    padding: 0;
    margin: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.install-brand__features li {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.4;
}

.install-brand__feat-icon {
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    display: grid;
    place-items: center;
    flex-shrink: 0;
    margin-top: 0.05rem;
}

.install-brand__feat-icon svg {
    width: 0.75rem;
    height: 0.75rem;
    color: #5eead4;
}

.install-brand__support {
    margin-top: 2rem;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.45);
    line-height: 1.5;
}

.install-brand__support a {
    color: #99f6e4;
    text-decoration: none;
}

.install-brand__support a:hover {
    text-decoration: underline;
}

.install-card {
    padding: 2rem 2.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.install-card__top {
    margin-bottom: 1.25rem;
}

.install-card__eyebrow {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--brand);
    margin-bottom: 0.35rem;
}

.install-card__title {
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: #111827;
    line-height: 1.2;
}

.install-card__step {
    font-size: 0.8125rem;
    color: #94a3b8;
    margin-top: 0.25rem;
}

.install-progress {
    display: flex;
    align-items: center;
    gap: 0;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #eef1f5;
}

.install-progress__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
    min-width: 3.5rem;
}

.install-progress__dot {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: 0.6875rem;
    font-weight: 700;
    background: #f1f5f9;
    color: #94a3b8;
    border: 2px solid #e2e8f0;
    transition: background 0.2s, border-color 0.2s, color 0.2s;
}

.install-progress__dot svg {
    width: 0.85rem;
    height: 0.85rem;
}

.install-progress__item--active .install-progress__dot {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
    box-shadow: 0 0 0 4px var(--brand-soft);
}

.install-progress__item--done .install-progress__dot {
    background: #ecfdf5;
    border-color: #6ee7b7;
    color: #059669;
}

.install-progress__label {
    font-size: 0.625rem;
    font-weight: 600;
    color: #94a3b8;
    text-align: center;
    max-width: 4.5rem;
    line-height: 1.2;
}

.install-progress__item--active .install-progress__label {
    color: var(--brand);
}

.install-progress__item--done .install-progress__label {
    color: #059669;
}

.install-progress__line {
    flex: 1;
    height: 2px;
    background: #e2e8f0;
    margin: 0 0.15rem;
    margin-bottom: 1.1rem;
    border-radius: 1px;
}

.install-progress__line--done {
    background: #6ee7b7;
}

.install-body {
    flex: 1;
}

.install-lead {
    font-size: 0.9375rem;
    color: #64748b;
    line-height: 1.55;
    margin-bottom: 1.25rem;
}

.install-code {
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    font-size: 0.8125rem;
    background: #f1f5f9;
    color: #334155;
    padding: 0.1rem 0.4rem;
    border-radius: 5px;
}

.install-req-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.install-req-item {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.75rem 0.85rem;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    background: #fafbfc;
}

.install-req-item--ok {
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.install-req-item--fail {
    border-color: #fecaca;
    background: #fef2f2;
}

.install-req-item__icon {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}

.install-req-item--ok .install-req-item__icon {
    background: #dcfce7;
    color: #059669;
}

.install-req-item--fail .install-req-item__icon {
    background: #fee2e2;
    color: #dc2626;
}

.install-req-item__icon svg {
    width: 0.85rem;
    height: 0.85rem;
}

.install-req-item__label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.install-req-item__hint {
    font-size: 0.6875rem;
    color: #94a3b8;
    margin-top: 0.1rem;
}

.install-summary {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.75rem 1rem;
    background: #f8fafc;
    border-radius: 10px;
    margin-bottom: 1.25rem;
}

.install-summary__score {
    font-size: 1.125rem;
    font-weight: 800;
    color: var(--brand);
    letter-spacing: -0.02em;
}

.install-summary__text {
    font-size: 0.8125rem;
    color: #64748b;
}

.install-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.install-form__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.85rem;
}

.install-field__label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 0.4rem;
}

.install-field__input {
    width: 100%;
    padding: 0.7rem 0.85rem;
    font-size: 0.875rem;
    font-family: inherit;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    color: #1e293b;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.install-field__input::placeholder {
    color: #94a3b8;
}

.install-field__input:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-ring);
}

.install-info-box {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 1rem 1.1rem;
    background: color-mix(in srgb, var(--brand) 8%, #fff);
    border: 1px solid color-mix(in srgb, var(--brand) 18%, transparent);
    border-radius: 12px;
    margin-bottom: 1.25rem;
}

.install-info-box svg {
    width: 1.5rem;
    height: 1.5rem;
    color: var(--brand);
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.install-info-box__title {
    font-size: 0.875rem;
    font-weight: 700;
    color: #0f172a;
}

.install-info-box__sub {
    font-size: 0.8125rem;
    color: #64748b;
    margin-top: 0.15rem;
    line-height: 1.45;
}

.install-actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
}

.install-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.72rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    font-family: inherit;
    border-radius: 10px;
    cursor: pointer;
    text-decoration: none;
    border: none;
    transition: background 0.15s, transform 0.12s, box-shadow 0.15s, color 0.15s;
}

.install-btn svg {
    width: 1rem;
    height: 1rem;
}

.install-btn--primary {
    background: var(--brand);
    color: #fff;
    box-shadow: 0 2px 8px var(--brand-shadow);
}

.install-btn--primary:hover {
    background: var(--brand-hover);
    transform: translateY(-1px);
    box-shadow: 0 4px 14px var(--brand-shadow);
}

.install-btn--ghost {
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
}

.install-btn--ghost:hover {
    background: #e2e8f0;
    color: #1e293b;
}

.install-btn--full {
    width: 100%;
}

.install-alert {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.75rem 0.95rem;
    border-radius: 12px;
    font-size: 0.8125rem;
    line-height: 1.45;
    margin-bottom: 1.25rem;
}

.install-alert svg {
    width: 1.125rem;
    height: 1.125rem;
    flex-shrink: 0;
    margin-top: 0.05rem;
}

.install-alert--err {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #b91c1c;
}

.install-note {
    font-size: 0.8125rem;
    color: #64748b;
    line-height: 1.5;
    padding: 0.65rem 0.85rem;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 10px;
    color: #92400e;
}

.install-foot {
    margin-top: 1.75rem;
    padding-top: 1rem;
    border-top: 1px solid #eef1f5;
    font-size: 0.75rem;
    color: #94a3b8;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.install-foot__sep {
    opacity: 0.5;
}

@media (max-width: 820px) {
    .install-wrap {
        grid-template-columns: 1fr;
        max-width: 520px;
    }

    .install-brand {
        padding: 1.75rem 1.5rem;
    }

    .install-brand__headline {
        font-size: 1.35rem;
    }

    .install-brand__features {
        margin-bottom: 0;
    }

    .install-brand__support {
        margin-top: 1.25rem;
    }

    .install-card {
        padding: 1.5rem 1.35rem 1.25rem;
    }

    .install-req-grid,
    .install-form__grid {
        grid-template-columns: 1fr;
    }

    .install-progress__label {
        display: none;
    }

    .install-progress__item {
        min-width: auto;
    }
}

@media (max-width: 480px) {
    .install-scene {
        padding: 1rem 0.75rem;
    }

    .install-wrap {
        border-radius: 16px;
    }

    .install-progress {
        gap: 0;
    }

    .install-actions {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .install-btn {
        width: 100%;
    }
}

/* Import — CSV içe aktarma */
.imp-page { max-width: 1100px; }
.imp-hero {
    display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem;
    padding: 1.25rem 1.35rem; border-radius: 16px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 10%, #fff), #fff);
    border: 1px solid color-mix(in srgb, var(--brand) 14%, transparent);
}
.dark .imp-hero {
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 14%, #131920), #131920);
    border-color: color-mix(in srgb, var(--brand) 18%, transparent);
}
.imp-hero__icon {
    width: 3rem; height: 3rem; border-radius: 14px; flex-shrink: 0;
    display: grid; place-items: center;
    background: color-mix(in srgb, var(--brand) 16%, transparent);
    color: var(--brand);
}
.imp-hero__icon svg { width: 1.5rem; height: 1.5rem; }
.imp-hero__title { font-size: 1.375rem; font-weight: 800; letter-spacing: -0.02em; color: #0f172a; }
.dark .imp-hero__title { color: #f8fafc; }
.imp-hero__sub { font-size: 0.875rem; color: #64748b; margin-top: 0.15rem; }

.imp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.imp-card {
    background: #fff; border: 1px solid #e8ecf1; border-radius: 18px;
    padding: 1.35rem 1.4rem; box-shadow: 0 1px 2px rgba(15,23,42,0.04);
}
.dark .imp-card { background: rgba(19,25,32,0.92); border-color: rgba(255,255,255,0.07); }
.imp-card__head { margin-bottom: 1.15rem; }
.imp-card__title { font-size: 1rem; font-weight: 700; color: #0f172a; }
.dark .imp-card__title { color: #f1f5f9; }
.imp-card__desc { font-size: 0.8125rem; color: #64748b; margin-top: 0.2rem; }
.imp-card__desc code { font-size: 0.75rem; padding: 0.1rem 0.35rem; background: #f1f5f9; border-radius: 4px; }
.dark .imp-card__desc code { background: rgba(255,255,255,0.08); }

.imp-drop {
    position: relative; margin-bottom: 1.15rem;
    border: 2px dashed #cbd5e1; border-radius: 16px;
    background: #f8fafc; transition: border-color 0.15s, background 0.15s;
}
.dark .imp-drop { border-color: rgba(255,255,255,0.12); background: rgba(255,255,255,0.02); }
.imp-drop.is-dragover,
.imp-drop.has-file { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 6%, #f8fafc); cursor: pointer; }
.dark .imp-drop.is-dragover,
.dark .imp-drop.has-file { background: color-mix(in srgb, var(--brand) 10%, #131920); }
.imp-drop__input {
    position: absolute; width: 0; height: 0; opacity: 0; overflow: hidden;
}
.imp-drop__inner { padding: 1.75rem 1rem; text-align: center; }
.imp-drop__icon {
    width: 3rem; height: 3rem; margin: 0 auto 0.75rem; border-radius: 999px;
    display: grid; place-items: center;
    background: color-mix(in srgb, var(--brand) 12%, transparent); color: var(--brand);
}
.imp-drop__icon svg { width: 1.35rem; height: 1.35rem; }
.imp-drop__title { font-size: 0.9375rem; font-weight: 600; color: #334155; }
.dark .imp-drop__title { color: #e2e8f0; }
.imp-drop__hint { font-size: 0.75rem; color: #94a3b8; margin: 0.25rem 0 0.85rem; }
.imp-drop__btn {
    display: inline-flex; align-items: center; gap: 0.35rem;
    padding: 0.5rem 1rem; border-radius: 10px; border: none; cursor: pointer;
    background: var(--brand); color: #fff; font-size: 0.8125rem; font-weight: 600;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--brand) 35%, transparent);
    transition: transform 0.12s, box-shadow 0.12s;
}
.imp-drop__btn:hover { transform: translateY(-1px); }
.imp-drop__name {
    margin-top: 0.65rem; font-size: 0.8125rem; font-weight: 600; color: var(--brand);
    word-break: break-all;
}

.imp-field { margin-bottom: 1rem; }
.imp-field__label { display: block; font-size: 0.8125rem; font-weight: 600; color: #475569; margin-bottom: 0.4rem; }
.dark .imp-field__label { color: #cbd5e1; }
.imp-field__select {
    width: 100%; padding: 0.65rem 0.85rem; border-radius: 12px;
    border: 1px solid #e2e8f0; background: #fff; font-size: 0.875rem; color: #0f172a;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2394a3b8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 0.65rem center; background-size: 1rem;
    padding-right: 2.25rem;
}
.dark .imp-field__select { background-color: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.1); color: #f1f5f9; }
.imp-field__hint { font-size: 0.75rem; color: #94a3b8; margin-top: 0.35rem; }

.imp-submit {
    display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
    width: 100%; padding: 0.75rem 1rem; border: none; border-radius: 12px; cursor: pointer;
    background: linear-gradient(135deg, var(--brand), color-mix(in srgb, var(--brand) 80%, #0f766e));
    color: #fff; font-size: 0.9375rem; font-weight: 700;
    box-shadow: 0 6px 20px color-mix(in srgb, var(--brand) 30%, transparent);
    transition: transform 0.12s, box-shadow 0.12s;
}
.imp-submit svg { width: 1.1rem; height: 1.1rem; }
.imp-submit:hover { transform: translateY(-1px); box-shadow: 0 8px 24px color-mix(in srgb, var(--brand) 38%, transparent); }

.imp-format-list { display: flex; flex-direction: column; gap: 0.55rem; margin-bottom: 1.15rem; }
.imp-format-item {
    display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.65rem 0.75rem;
    border-radius: 12px; background: #f8fafc; border: 1px solid #eef2f6;
}
.dark .imp-format-item { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.06); }
.imp-format-item__num {
    width: 1.65rem; height: 1.65rem; border-radius: 8px; flex-shrink: 0;
    display: grid; place-items: center; font-size: 0.75rem; font-weight: 800;
    background: color-mix(in srgb, var(--brand) 14%, transparent); color: var(--brand);
}
.imp-format-item__label { font-size: 0.8125rem; font-weight: 600; color: #334155; }
.dark .imp-format-item__label { color: #e2e8f0; }
.imp-format-item__ex { font-size: 0.75rem; color: #94a3b8; margin-top: 0.1rem; }

.imp-link {
    display: inline-flex; align-items: center; gap: 0.45rem;
    font-size: 0.8125rem; font-weight: 600; color: var(--brand); text-decoration: none;
    padding: 0.55rem 0.75rem; border-radius: 10px;
    background: color-mix(in srgb, var(--brand) 8%, transparent);
    transition: background 0.12s;
}
.imp-link svg { width: 1rem; height: 1rem; }
.imp-link:hover { background: color-mix(in srgb, var(--brand) 14%, transparent); }

@media (max-width: 900px) {
    .imp-grid { grid-template-columns: 1fr; }
}

/* Recurring */
.rec-hero { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.rec-hero__title { font-size: 1.5rem; font-weight: 800; }
.rec-hero__sub { color: #64748b; font-size: 0.875rem; }
.rec-field__input { width: 100%; padding: 0.55rem 0.75rem; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; }
.dark .rec-field__input { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.08); }
.rec-submit, .rec-add-btn { background: var(--brand); color: #fff; border: none; border-radius: 10px; padding: 0.6rem 1rem; font-weight: 600; cursor: pointer; }
.rec-form__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }
.rec-field--wide { grid-column: 1 / -1; }
.rec-field--action { display: flex; align-items: end; }
.rec-row { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem; margin-bottom: 0.65rem; flex-wrap: wrap; }
.rec-row__main { display: flex; gap: 0.75rem; align-items: flex-start; }
.rec-row__type { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; padding: 0.2rem 0.45rem; border-radius: 999px; }
.rec-row__type--income { background: rgba(16,185,129,0.12); color: #059669; }
.rec-row__type--expense { background: rgba(239,68,68,0.12); color: #dc2626; }
.rec-row__title { font-weight: 700; }
.rec-row__meta { font-size: 0.8125rem; color: #64748b; }
.rec-row__amount { font-weight: 800; text-align: right; }
.rec-row__next { font-size: 0.75rem; color: #94a3b8; text-align: right; }
.rec-row__actions { display: flex; gap: 0.35rem; justify-content: flex-end; margin-top: 0.35rem; }
.rec-row__btn { font-size: 0.75rem; padding: 0.3rem 0.55rem; border-radius: 8px; border: 1px solid #e2e8f0; background: #fff; cursor: pointer; }
.rec-row__btn--danger { color: #dc2626; border-color: rgba(239,68,68,0.25); }

@media (max-width: 900px) {
    .landing-hero { grid-template-columns: 1fr; }
    .landing-features__grid { grid-template-columns: 1fr; }
    .rec-form__grid { grid-template-columns: 1fr 1fr; }
}

/* ==========================================
   Confirm Dialog
   ========================================== */
body.nvx-dialog-open {
    overflow: hidden;
}

.nvx-dialog {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: grid;
    place-items: center;
    padding: 1.25rem;
}

.nvx-dialog.hidden {
    display: none;
}

.nvx-dialog__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(4px);
}

.nvx-dialog__panel {
    position: relative;
    z-index: 1;
    width: min(100%, 400px);
    background: #fff;
    border-radius: 16px;
    padding: 1.5rem 1.5rem 1.25rem;
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.18);
    border: 1px solid #e2e8f0;
    text-align: center;
    animation: nvxDialogIn 0.2s ease;
}

.dark .nvx-dialog__panel {
    background: #131920;
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45);
}

@keyframes nvxDialogIn {
    from { opacity: 0; transform: scale(0.96) translateY(8px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

.nvx-dialog__icon {
    width: 3rem;
    height: 3rem;
    margin: 0 auto 1rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
}

.nvx-dialog__icon.is-danger {
    background: rgba(244, 63, 94, 0.12);
    color: #e11d48;
}

.nvx-dialog__icon.is-info {
    background: color-mix(in srgb, var(--brand) 14%, transparent);
    color: var(--brand);
}

.nvx-dialog__icon-svg {
    width: 1.5rem;
    height: 1.5rem;
    display: none;
}

.nvx-dialog__icon.is-danger .nvx-dialog__icon-svg--warn { display: block; }
.nvx-dialog__icon.is-info .nvx-dialog__icon-svg--info { display: block; }

.nvx-dialog__title {
    font-size: 1.0625rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #0f172a;
    margin-bottom: 0.45rem;
}

.dark .nvx-dialog__title {
    color: #f8fafc;
}

.nvx-dialog__message {
    font-size: 0.875rem;
    color: #64748b;
    line-height: 1.55;
    margin-bottom: 1.25rem;
}

.nvx-dialog__actions {
    display: flex;
    gap: 0.65rem;
}

.nvx-dialog__btn {
    flex: 1;
    padding: 0.7rem 1rem;
    border-radius: 10px;
    font-size: 0.875rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: background 0.15s, transform 0.12s;
}

.nvx-dialog__btn--ghost {
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
}

.dark .nvx-dialog__btn--ghost {
    background: rgba(255, 255, 255, 0.06);
    color: #cbd5e1;
    border-color: rgba(255, 255, 255, 0.08);
}

.nvx-dialog__btn--ghost:hover {
    background: #e2e8f0;
}

.nvx-dialog__btn--danger {
    background: #e11d48;
    color: #fff;
}

.nvx-dialog__btn--danger:hover {
    background: #be123c;
    transform: translateY(-1px);
}

.nvx-dialog__btn--primary {
    background: var(--brand);
    color: #fff;
}

.nvx-dialog__btn--primary:hover {
    background: var(--brand-hover);
    transform: translateY(-1px);
}

/* ========================================
   Kredi Kartları
   ======================================== */
.cc-hero {
    display: grid;
    grid-template-columns: 1.4fr 1fr auto;
    align-items: center;
    gap: 1.25rem;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1.375rem 1.5rem;
    box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}
.dark .cc-hero { background: #131920; border-color: rgba(255, 255, 255, 0.06); box-shadow: none; }

.cc-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--brand);
    background: var(--brand-soft);
    padding: 0.3rem 0.6rem;
    border-radius: 999px;
    margin-bottom: 0.85rem;
}
.cc-hero__badge svg { width: 0.85rem; height: 0.85rem; }
.cc-hero__label { font-size: 0.75rem; color: #94a3b8; font-weight: 500; }
.cc-hero__amount { font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; margin-top: 0.15rem; color: #0f172a; }
.dark .cc-hero__amount { color: #f8fafc; }
.cc-hero__meta { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8125rem; color: #64748b; margin-top: 0.5rem; flex-wrap: wrap; }
.cc-hero__meta strong { color: #334155; font-weight: 700; }
.dark .cc-hero__meta strong { color: #e2e8f0; }
.cc-hero__dot { opacity: 0.4; }

.cc-hero__next {
    position: relative;
    background: #f8fafc;
    border: 1px solid #e9edf2;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    overflow: hidden;
}
.dark .cc-hero__next { background: #0e141b; border-color: rgba(255, 255, 255, 0.06); }
.cc-hero__next::before {
    content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--brand, #14b8a6);
}
.cc-hero__next-cap { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: #94a3b8; }
.cc-hero__next-row { display: flex; align-items: center; gap: 0.75rem; margin-top: 0.5rem; }
.cc-hero__next-name { font-weight: 700; font-size: 0.9375rem; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dark .cc-hero__next-name { color: #f1f5f9; }
.cc-hero__next-date { font-size: 0.8125rem; color: #64748b; margin-top: 0.15rem; }

.cc-hero__actions { display: flex; flex-direction: column; gap: 0.5rem; }
.cc-hero__add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.55rem 1rem;
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    background: var(--brand);
    color: #fff;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s, transform 0.15s;
}
.cc-hero__add svg { width: 1rem; height: 1rem; }
.cc-hero__add:hover { background: var(--brand-hover); transform: translateY(-1px); }
.cc-hero__add--ghost { background: transparent; color: var(--brand); border: 1px solid var(--brand); }
.cc-hero__add--ghost:hover { background: var(--brand-soft); }

.cc-section__head { margin-bottom: 1rem; }
.cc-section__title { font-size: 1.0625rem; font-weight: 700; color: #0f172a; }
.dark .cc-section__title { color: #f8fafc; }
.cc-section__sub { font-size: 0.8125rem; color: #64748b; margin-top: 0.2rem; }

.cc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
}

.cc-card {
    position: relative;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 14px;
    padding: 1rem 1.1rem 0.85rem;
    overflow: hidden;
}
.dark .cc-card { background: #131920; border-color: rgba(255, 255, 255, 0.06); }
.cc-card__bar {
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: var(--brand, #14b8a6);
}
.cc-card__head { display: flex; align-items: flex-start; gap: 0.65rem; }
.cc-card__name { font-weight: 700; font-size: 0.9375rem; color: #0f172a; }
.dark .cc-card__name { color: #f8fafc; }
.cc-card__bank { font-size: 0.75rem; color: #94a3b8; margin-top: 0.1rem; }
.cc-card__menu {
    margin-left: auto;
    padding: 0.25rem;
    border: none;
    background: transparent;
    color: #94a3b8;
    cursor: pointer;
    border-radius: 6px;
}
.cc-card__menu svg { width: 1.1rem; height: 1.1rem; }
.cc-card__menu:hover { background: #f1f5f9; color: #475569; }
.dark .cc-card__menu:hover { background: rgba(255,255,255,0.06); color: #cbd5e1; }

.cc-card__dropdown {
    display: none;
    position: absolute;
    right: 0.75rem;
    top: 2.5rem;
    z-index: 10;
    min-width: 8rem;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
    overflow: hidden;
}
.dark .cc-card__dropdown { background: #1a2332; border-color: rgba(255,255,255,0.08); }
.cc-card__dropdown.is-open { display: block; }
.cc-card__dropdown button {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.55rem 0.85rem;
    font-size: 0.8125rem;
    border: none;
    background: transparent;
    cursor: pointer;
    color: #334155;
}
.dark .cc-card__dropdown button { color: #e2e8f0; }
.cc-card__dropdown button:hover { background: #f8fafc; }
.dark .cc-card__dropdown button:hover { background: rgba(255,255,255,0.05); }

.cc-card__body {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-top: 1rem;
    gap: 0.75rem;
}
.cc-card__label { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: #94a3b8; }
.cc-card__debt { font-size: 1.375rem; font-weight: 800; color: #dc2626; margin-top: 0.15rem; }
.dark .cc-card__debt { color: #f87171; }
.cc-card__chip {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.3rem 0.55rem;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
}
.dark .cc-card__chip { background: rgba(255,255,255,0.06); color: #cbd5e1; }
.cc-card__chip.is-soon { background: #fef3c7; color: #b45309; }
.dark .cc-card__chip.is-soon { background: rgba(245, 158, 11, 0.15); color: #fbbf24; }

.cc-card__foot {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.85rem;
    margin-top: 0.85rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f1f5f9;
    font-size: 0.75rem;
    color: #64748b;
}
.dark .cc-card__foot { border-color: rgba(255,255,255,0.06); }
.cc-card__foot strong { color: #334155; font-weight: 700; }
.dark .cc-card__foot strong { color: #e2e8f0; }

.cc-card__reminders { display: flex; gap: 0.35rem; margin-top: 0.55rem; flex-wrap: wrap; }
.cc-tag {
    font-size: 0.625rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.2rem 0.45rem;
    border-radius: 999px;
    background: var(--brand-soft);
    color: var(--brand);
}

.cc-inst-list { display: flex; flex-direction: column; gap: 0.65rem; }
.cc-inst-row {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1rem;
    background: #fff;
    border: 1px solid #e2e5ea;
    border-radius: 12px;
    border-left: 3px solid var(--brand, #14b8a6);
}
.dark .cc-inst-row { background: #131920; border-color: rgba(255,255,255,0.06); }
.cc-inst-row.is-soon { border-left-color: #f59e0b; }
.cc-inst-row.is-done { opacity: 0.55; border-left-color: #94a3b8; }

.cc-inst-row__main { min-width: 0; }
.cc-inst-row__progress {
    height: 3px;
    background: #e2e8f0;
    border-radius: 999px;
    margin-bottom: 0.55rem;
    overflow: hidden;
}
.dark .cc-inst-row__progress { background: rgba(255,255,255,0.08); }
.cc-inst-row__progress span {
    display: block;
    height: 100%;
    background: var(--brand);
    border-radius: 999px;
}
.cc-inst-row__title { font-weight: 600; font-size: 0.9375rem; color: #0f172a; }
.dark .cc-inst-row__title { color: #f8fafc; }
.cc-inst-row__meta { font-size: 0.8125rem; color: #64748b; margin-top: 0.15rem; }

.cc-inst-row__due { text-align: right; }
.cc-inst-row__days { display: block; font-size: 0.8125rem; font-weight: 600; color: #334155; }
.dark .cc-inst-row__days { color: #e2e8f0; }
.cc-inst-row__date { font-size: 0.75rem; color: #94a3b8; }
.cc-inst-row__done { font-size: 0.8125rem; font-weight: 600; color: #16a34a; }

.cc-inst-row__actions { display: flex; gap: 0.35rem; flex-wrap: wrap; justify-content: flex-end; }
.cc-inst-row__pay,
.cc-inst-row__edit,
.cc-inst-row__del {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.35rem 0.65rem;
    border-radius: 8px;
    border: none;
    cursor: pointer;
}
.cc-inst-row__pay { background: var(--brand); color: #fff; }
.cc-inst-row__pay:hover { background: var(--brand-hover); }
.cc-inst-row__edit { background: #f1f5f9; color: #475569; }
.dark .cc-inst-row__edit { background: rgba(255,255,255,0.08); color: #cbd5e1; }
.cc-inst-row__del { background: transparent; color: #dc2626; border: 1px solid #fecaca; }
.dark .cc-inst-row__del { border-color: rgba(248,113,113,0.3); color: #f87171; }

.cc-empty {
    text-align: center;
    padding: 2.5rem 1.5rem;
    background: #fff;
    border: 1px dashed #d1d5db;
    border-radius: 14px;
}
.dark .cc-empty { background: #131920; border-color: rgba(255,255,255,0.1); }
.cc-empty--compact { padding: 1.25rem; }
.cc-empty__icon {
    width: 3rem; height: 3rem;
    margin: 0 auto 1rem;
    display: flex; align-items: center; justify-content: center;
    border-radius: 12px;
    background: var(--brand-soft);
    color: var(--brand);
}
.cc-empty__icon svg { width: 1.5rem; height: 1.5rem; }
.cc-empty h3 { font-weight: 700; color: #0f172a; }
.dark .cc-empty h3 { color: #f8fafc; }
.cc-empty p, .cc-empty__text { font-size: 0.875rem; color: #64748b; margin-top: 0.5rem; max-width: 28rem; margin-left: auto; margin-right: auto; }
.cc-empty__btn {
    margin-top: 1.25rem;
    padding: 0.55rem 1.15rem;
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    background: var(--brand);
    color: #fff;
    border: none;
    cursor: pointer;
}
.cc-empty__btn--sm { margin-top: 0.75rem; padding: 0.4rem 0.85rem; }

.cc-modal {
    position: fixed;
    inset: 0;
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
.cc-modal.hidden { display: none; }
.cc-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(4px);
}
.cc-modal__panel {
    position: relative;
    width: 100%;
    max-width: 28rem;
    max-height: 90vh;
    overflow-y: auto;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.2);
}
.dark .cc-modal__panel { background: #131920; border: 1px solid rgba(255,255,255,0.08); }
.cc-modal__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #f1f5f9;
}
.dark .cc-modal__head { border-color: rgba(255,255,255,0.06); }
.cc-modal__head h3 { font-weight: 700; font-size: 1.0625rem; color: #0f172a; }
.dark .cc-modal__head h3 { color: #f8fafc; }
.cc-modal__close {
    border: none;
    background: transparent;
    font-size: 1.5rem;
    line-height: 1;
    color: #94a3b8;
    cursor: pointer;
}
.cc-modal__form { padding: 1.25rem; }
.cc-field { margin-bottom: 0.85rem; }
.cc-field label { display: block; font-size: 0.8125rem; font-weight: 600; color: #475569; margin-bottom: 0.35rem; }
.dark .cc-field label { color: #94a3b8; }
.cc-field input,
.cc-field select {
    width: 100%;
    padding: 0.55rem 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    font-size: 0.875rem;
    background: #fff;
    color: #0f172a;
}
.dark .cc-field input,
.dark .cc-field select {
    background: #0e141b;
    border-color: rgba(255,255,255,0.1);
    color: #f8fafc;
}
.cc-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.cc-checks { display: flex; flex-direction: column; gap: 0.45rem; margin-bottom: 0.5rem; }
.cc-check { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8125rem; color: #475569; cursor: pointer; }
.dark .cc-check { color: #94a3b8; }
.cc-modal__foot {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f1f5f9;
}
.dark .cc-modal__foot { border-color: rgba(255,255,255,0.06); }
.cc-btn {
    padding: 0.5rem 1rem;
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
}
.cc-btn--ghost { background: transparent; color: #64748b; border: 1px solid #e2e8f0; }
.dark .cc-btn--ghost { border-color: rgba(255,255,255,0.12); color: #94a3b8; }
.cc-btn--primary { background: var(--brand); color: #fff; }
.cc-btn--primary:hover { background: var(--brand-hover); }

@media (max-width: 900px) {
    .cc-hero { grid-template-columns: 1fr; }
    .cc-hero__actions { flex-direction: row; flex-wrap: wrap; }
    .cc-inst-row { grid-template-columns: 1fr; }
    .cc-inst-row__due { text-align: left; }
    .cc-inst-row__actions { justify-content: flex-start; }
}

/* ========================================
   İkonlu Select (nvx-isel)
   ======================================== */
.nvx-isel {
    position: relative;
}

.nvx-isel__native {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.nvx-isel__trigger {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    padding: 0.7rem 0.85rem;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    font-size: 0.9375rem;
    font-weight: 500;
    color: #0f172a;
    cursor: pointer;
    text-align: left;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.dark .nvx-isel__trigger {
    background: rgba(31, 41, 55, 0.5);
    border-color: #374151;
    color: #f3f4f6;
}

.nvx-isel__trigger:hover,
.nvx-isel.is-open .nvx-isel__trigger {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-soft);
}

.nvx-isel__trigger.is-placeholder .nvx-isel__trigger-label {
    color: #94a3b8;
    font-weight: 400;
}

.nvx-isel__trigger-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.nvx-isel__trigger-label {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nvx-isel__chevron {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    color: #94a3b8;
    transition: transform 0.15s;
}

.nvx-isel.is-open .nvx-isel__chevron {
    transform: rotate(180deg);
}

.nvx-isel__menu {
    position: absolute;
    z-index: 70;
    left: 0;
    right: 0;
    top: calc(100% + 0.35rem);
    max-height: 14rem;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
    padding: 0.35rem;
}

.dark .nvx-isel__menu {
    background: #1a1f2e;
    border-color: #374151;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}

.nvx-isel__option {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    padding: 0.55rem 0.65rem;
    border: none;
    background: transparent;
    border-radius: 9px;
    cursor: pointer;
    text-align: left;
    font-size: 0.875rem;
    color: #334155;
}

.dark .nvx-isel__option {
    color: #e2e8f0;
}

.nvx-isel__option:hover {
    background: #f1f5f9;
}

.dark .nvx-isel__option:hover {
    background: rgba(255, 255, 255, 0.06);
}

.nvx-isel__option.is-active {
    background: var(--brand-soft);
    color: var(--brand);
}

.nvx-isel__label {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nvx-isel__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 9px;
    background: var(--isel-color, #6366f1);
    flex-shrink: 0;
}

.nvx-isel__badge--empty {
    background: #e2e8f0;
}

.dark .nvx-isel__badge--empty {
    background: #374151;
}

.nvx-isel__badge-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.nvx-isel__svg {
    width: 1rem !important;
    height: 1rem !important;
    stroke-width: 2 !important;
}

.nvx-isel__logo {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.nvx-isel__logo .bank-logo-badge {
    width: 2rem;
    height: 2rem;
}

.nvx-isel__logo .bank-logo-badge img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}