/* YousoroFinance redesign-web — base: canvas, typography, page frame (light theme) */

:root body.yf-redesign.yf-dashboard-auth {
    background: var(--rd-canvas);
    color: var(--rd-ink);
    font-family: var(--rd-font);
    font-feature-settings: "cv11", "ss01";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Soft ambient light at the top of the canvas — gives depth without noise */
:root body.yf-redesign.yf-dashboard-auth .content {
    position: relative;
    background:
        radial-gradient(1200px 520px at 12% -8%, rgba(var(--rd-accent-rgb), .07), transparent 62%),
        radial-gradient(900px 480px at 92% -12%, rgba(47, 111, 228, .05), transparent 60%),
        var(--rd-canvas);
}

/* One typeface everywhere. Legacy rules reference “IBM Plex Mono”, which is not shipped,
   so numbers fell back to the OS monospace. Icons (tabler) keep their own font. */
:root body.yf-redesign.yf-dashboard-auth :not(.ti, [class^="ti-"], [class*=" ti-"], code, pre, kbd, samp) {
    font-family: var(--rd-font) !important;
}

:root body.yf-redesign.yf-dashboard-auth :is(h1, h2, h3, h4, h5, h6) {
    color: var(--rd-ink);
    font-family: var(--rd-font);
    letter-spacing: var(--rd-tracking-snug);
}

:root body.yf-redesign.yf-dashboard-auth :is(strong, b) { font-weight: 650; }

/* The site footer keeps its own brand styling in both designs */
:root body.yf-redesign.yf-dashboard-auth a:not(.yf-public-footer *) { color: var(--rd-accent); text-decoration: none; }
:root body.yf-redesign.yf-dashboard-auth a:not(.yf-public-footer *):hover { color: var(--rd-accent-hover); }

:root body.yf-redesign.yf-dashboard-auth .text-muted,
:root body.yf-redesign.yf-dashboard-auth .text-secondary { color: var(--rd-muted) !important; }
:root body.yf-redesign.yf-dashboard-auth .text-success { color: var(--rd-positive) !important; }
:root body.yf-redesign.yf-dashboard-auth .text-danger { color: var(--rd-negative) !important; }
:root body.yf-redesign.yf-dashboard-auth .text-warning { color: var(--rd-warning) !important; }

/* Money & numbers: tabular figures so columns and totals never jitter */
:root body.yf-redesign.yf-dashboard-auth :is(.yf-money-cell, .yf-money-cell__amount, .account-value, .yf-total-money__amount,
    .finance-analytics-kpi__value, .yf-net-assets-value, table td, table th, strong) {
    font-variant-numeric: tabular-nums;
}

:root body.yf-redesign.yf-dashboard-auth ::selection { background: var(--rd-accent-soft-strong); color: var(--rd-ink); }

/* Page frame */
:root body.yf-redesign.yf-dashboard-auth .yf-dashboard-container {
    width: 100%;
    max-width: var(--rd-page-max);
    margin-inline: auto;
    padding-top: 24px !important;
    padding-inline: var(--rd-gutter);
}

:root body.yf-redesign.yf-dashboard-auth .yf-dashboard-shell {
    padding: 0 0 56px;
    color: var(--rd-ink);
}

:root body.yf-redesign.yf-dashboard-auth .yf-dashboard-shell .row {
    --bs-gutter-x: var(--rd-grid-gap);
    --bs-gutter-y: 0;
}

:root body.yf-redesign.yf-dashboard-auth .yf-dashboard-shell > [id$="-show"] > .row + .row,
:root body.yf-redesign.yf-dashboard-auth .yf-assets-section > .row + .row,
:root body.yf-redesign.yf-dashboard-auth .yf-dashboard-shell .row.mt-2 {
    margin-top: var(--rd-grid-gap) !important;
}

/* Section enter motion when switching tabs */
@media all {
    :root body.yf-redesign.yf-dashboard-auth .yf-dashboard-shell > [id$="-show"]:not([style*="display: none"]) {
        /* backwards, not both: a lingering transform would trap the tutorial highlight under #overlay */
        animation: rd-section-fade .32s ease backwards;
    }
    /* Cards rise one after another (index set by interactions.js); restarts on every section switch */
    :root body.yf-redesign.yf-dashboard-auth .yf-dashboard-shell > [id$="-show"]:not([style*="display: none"]) .card[style*="--rd-stagger"] {
        animation: rd-card-in .4s cubic-bezier(.22, .61, .36, 1) backwards;
        animation-delay: calc(var(--rd-stagger, 0) * 35ms);
    }
}
@keyframes rd-section-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes rd-card-in {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: none; }
}

@keyframes rd-section-in {
    from { opacity: 0; transform: translateY(10px); }
    60% { opacity: 1; }
    to { opacity: 1; transform: none; }
}

/* Scrollbars — thin, quiet */
:root body.yf-redesign.yf-dashboard-auth * {
    scrollbar-width: thin;
    scrollbar-color: rgba(60, 60, 67, .22) transparent;
}
:root body.yf-redesign.yf-dashboard-auth ::-webkit-scrollbar { width: 10px; height: 10px; }
:root body.yf-redesign.yf-dashboard-auth ::-webkit-scrollbar-track { background: transparent; }
:root body.yf-redesign.yf-dashboard-auth ::-webkit-scrollbar-thumb {
    border: 3px solid transparent;
    border-radius: 999px;
    background: rgba(60, 60, 67, .22) padding-box;
}
:root body.yf-redesign.yf-dashboard-auth ::-webkit-scrollbar-thumb:hover { background-color: rgba(60, 60, 67, .36); }

/* Preloader */
:root body.yf-redesign.yf-dashboard-auth #preloader { background: var(--rd-canvas); }

/* Separators */
:root body.yf-redesign.yf-dashboard-auth hr {
    border: 0;
    border-top: 1px solid var(--rd-line);
    opacity: 1;
}

/* Floating “report an error” trigger — make it a calm glass pill */
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__trigger {
    height: 40px;
    padding: 0 16px;
    border: 0 !important;
    border-radius: var(--rd-radius-pill) !important;
    background: var(--rd-surface-glass-strong) !important;
    color: var(--rd-ink-2) !important;
    box-shadow: var(--rd-shadow-raised) !important;
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    font-size: 13px;
    font-weight: 600;
}
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__trigger { height: 44px; padding: 0 16px 0 6px; }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__trigger:hover { color: var(--rd-ink) !important; transform: none; box-shadow: var(--rd-shadow-modal) !important; }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__trigger i { background: var(--rd-accent-soft); color: var(--rd-accent-ink); }
/* Dialog on «Эфир» tokens (light and dark) */
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__dialog { border-radius: 24px; background: var(--rd-surface); color: var(--rd-ink); box-shadow: var(--rd-shadow-modal); }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__backdrop { background: rgba(0, 0, 0, .32); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__icon { background: var(--rd-accent-soft); color: var(--rd-accent-ink); }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__heading > span { color: var(--rd-accent-ink); }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__heading h2 { color: var(--rd-ink); }
:root body.yf-redesign.yf-dashboard-auth :is(.yf-error-report__heading p, .yf-error-report__status, .yf-error-report label small) { color: var(--rd-muted); }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report label { color: var(--rd-ink-2); }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report :is(input, textarea) { border: 0 !important; background: var(--rd-fill-soft) !important; color: var(--rd-ink) !important; box-shadow: none; }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report :is(input, textarea):focus { box-shadow: 0 0 0 3px var(--rd-accent-ring) !important; }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__captcha-row b { background: var(--rd-fill-soft); color: var(--rd-ink); }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report__close:hover { background: var(--rd-fill-soft); color: var(--rd-ink); }
:root body.yf-redesign.yf-dashboard-auth .yf-error-report form .yf26-button { border: 0; background: var(--rd-accent); color: #fff; box-shadow: 0 10px 22px -12px rgba(var(--rd-accent-rgb), .9); }

/* Focus visibility — one consistent ring everywhere */
:root body.yf-redesign.yf-dashboard-auth :is(a, button, [role="button"], [role="tab"], [role="option"]):focus-visible {
    outline: none;
    box-shadow: var(--rd-focus-ring) !important;
}

@media (max-width: 575.98px) {
    :root body.yf-redesign.yf-dashboard-auth .yf-dashboard-container { padding-top: 16px !important; padding-inline: 12px; }
    :root body.yf-redesign.yf-dashboard-auth { --rd-grid-gap: 14px; }
}

/* Programmatically focused headings/containers (tabindex=-1) must not show a ring */
:root body.yf-redesign.yf-dashboard-auth [tabindex="-1"]:focus { outline: none; box-shadow: none; }