/* BistWatch.Web — minimal CSS resets. MudBlazor handles component styling.
   Bootstrap link removed — MudBlazor provides the design system. */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Tabular figures for price columns — UI-SPEC typography */
.bw-num {
    font-variant-numeric: tabular-nums;
}

/* Market-status indicator dot in the AppBar (UI-09) */
.bw-status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.bw-status-open {
    background-color: #2D7FF9; /* accent — market open */
}

.bw-status-closed {
    background-color: #8A93A2; /* muted — market closed */
}

/* Mandatory disclaimer footer — UI-09, CMP-07 */
.bw-disclaimer-footer {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 6px 12px;
    border-top: 1px solid rgba(42, 49, 59, 0.5);
    text-align: center;
}

/* Validation states (used by Identity forms) */
.valid.modified:not([type=checkbox]) {
    outline: 1px solid #1FA971;
}

.invalid {
    outline: 1px solid #E5484D;
}

.validation-message {
    color: #E5484D;
    font-size: 12px;
}

/* New-signal prepend animation — /kripto page (Phase 10.1, UI-SPEC) */
@keyframes bw-signal-highlight {
    0%   { background: rgba(45, 127, 249, 0.12); }
    100% { background: transparent; }
}

.bw-signal-new {
    animation: bw-signal-highlight 3s ease-out forwards;
}

/* ── Phase 10.2 UI Polish additions ─────────────────────────────────────────── */

/* 1. Live/connection status badge dots — replace inline hex in Kripto.razor (D-09) */
.bw-status-live { background-color: #1FA971; } /* green — Canlı */
.bw-status-warn { background-color: #E0A106; } /* amber — Yeniden bağlanıyor */
/* bw-status-closed already exists above — reuse for "Bağlantı yok" */

/* 2. Price-change flash keyframes + classes (D-06, watchlist/kripto last-price) */
@keyframes bw-price-up {
    0%   { background: rgba(31, 169, 113, 0.18); }
    100% { background: transparent; }
}
@keyframes bw-price-down {
    0%   { background: rgba(229, 72, 77, 0.18); }
    100% { background: transparent; }
}
.bw-price-up   { animation: bw-price-up   0.8s ease-out forwards; }
.bw-price-down { animation: bw-price-down 0.8s ease-out forwards; }

/* 3. Skeleton shimmer for loading states (D-05) */
@keyframes bw-shimmer {
    0%   { background-position: -200% 0; }
    100% { background-position:  200% 0; }
}
.bw-skeleton {
    border-radius: 4px;
    background: linear-gradient(90deg,
        rgba(42, 49, 59, 0.8) 25%,
        rgba(62, 72, 87, 0.6) 50%,
        rgba(42, 49, 59, 0.8) 75%);
    background-size: 200% 100%;
    animation: bw-shimmer 1.4s ease-in-out infinite;
}

/* 4. Chart container responsive height — wired to Kripto.razor chart wrapper in Plan 02 (D-04) */
.bw-chart-container { width: 100%; height: 400px; }
.bw-chart-container > div { height: 100%; } /* let the wrapped chart fill the responsive container */
@media (max-width: 599px) { .bw-chart-container { height: 300px; } }

/* 5. Focus-visible ring — a11y baseline, accent #2D7FF9 */
:focus-visible {
    outline: 2px solid #2D7FF9;
    outline-offset: 2px;
}

/* 6. Theme-toggle smooth transition — ONLY these selectors (do NOT add global * transition) */
.mud-layout, .mud-main-content, .mud-card, .mud-paper {
    transition: background-color 0.2s ease;
}

/* 7. prefers-reduced-motion: disable all keyframe animations */
@media (prefers-reduced-motion: reduce) {
    .bw-signal-new, .bw-price-up, .bw-price-down, .bw-skeleton {
        animation: none;
    }
}

/* ── Phase 10.2 Plan 04 — Auth page CSS classes (D-03) ──────────────────────── */
/* Replace inline hex on static-SSR auth pages (Login.razor). Colors verbatim    */
/* from BistTheme dark palette. Keep 11px input padding (UI-SPEC inherited exc.)  */

.bw-auth-label {
    display: block;
    color: #8A93A2;
    font-size: .85rem;
}

.bw-auth-input {
    width: 100%;
    padding: 11px;
    border: 1px solid #2A313B;
    border-radius: 6px;
    background: #1B2027;
    color: #E6E9EF;
    box-sizing: border-box;
}

.bw-auth-error {
    color: #E5484D;
    font-size: .8rem;
}

.bw-auth-submit {
    width: 100%;
    padding: 12px;
    background: #2D7FF9;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
}

/* ── Phase 11 additions ──────────────────────────────────────────────────── */

/* Kill-switch banner border accent (trading active vs halted) */
.bw-kill-switch-active {
    border-left: 4px solid #2D7FF9;
}
.bw-kill-switch-halted {
    border-left: 4px solid #E5484D;
}

/* P&L positive / negative semantic coloring (table cells) */
.bw-pnl-positive { color: #1FA971; font-weight: 600; }
.bw-pnl-negative { color: #E5484D; font-weight: 600; }
.bw-pnl-zero     { color: #8A93A2; }

/* Order status chip overrides — compact inline display */
.bw-order-status { font-size: 11px; height: 22px; }

/* Client order ID monospace display */
.bw-client-order-id {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 11px;
    color: #8A93A2;
}