/* PropFlow — Slate Finance chrome (phase 2 : dock, header, cartes, heroes) */

/* —— Header —— */
.app-top-chrome,
.pc-header-modern {
    background: var(--pro-header-bg) !important;
    border-bottom: 1px solid var(--pro-header-border) !important;
    box-shadow: var(--pro-header-shadow) !important;
}

.header.mobile-only,
.header.mobile-only .header-content,
.app-header-unified {
    background: transparent !important;
    box-shadow: none !important;
}

/* —— Dock : pill sobre, accent unique —— */
.nav {
    background: var(--pro-surface-elevated) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid var(--pro-border-subtle) !important;
    box-shadow: var(--pro-shadow-sm) !important;
    border-radius: var(--pro-radius-lg) !important;
}

html[data-theme="dark"] .nav {
    box-shadow: none !important;
}

.nav-tabs--dock .nav-tab,
.pc-nav-item,
.nav-tabs--dock .nav-tab[data-page],
.pc-nav-item[data-page],
html[data-theme="dark"] .nav-tabs--dock .nav-tab[data-page],
html[data-theme="dark"] .pc-nav-item[data-page] {
    --nav-hue: var(--pro-accent);
}

.nav-tab.active {
    background: var(--pro-accent-muted) !important;
    color: var(--pro-accent) !important;
}

.nav-tab.active .nav-text {
    color: var(--pro-accent) !important;
}

.nav-tabs--dock .nav-tab {
    border-radius: 12px !important;
}

/* —— Cartes : surface plate + bordure —— */
.enhanced-card,
.overview-master-card,
.card,
.simple-history-card,
.revolut-transaction-group,
#dashboardBoard > [data-feed-page],
#dashboardBoard .dash-w--native,
#dashboardBoard .dash-bagels-card {
    background: var(--pro-surface-elevated) !important;
    border: 1px solid var(--pro-border-subtle) !important;
    border-radius: var(--pro-radius-lg) !important;
    box-shadow: var(--pro-shadow-sm) !important;
}

html[data-theme="dark"] .enhanced-card,
html[data-theme="dark"] .overview-master-card,
html[data-theme="dark"] .card,
html[data-theme="dark"] .simple-history-card {
    box-shadow: none !important;
}

.enhanced-card:hover,
.overview-master-card:hover,
.simple-history-card:hover {
    box-shadow: var(--pro-shadow) !important;
    border-color: var(--pro-border) !important;
}

html[data-theme="dark"] .enhanced-card:hover,
html[data-theme="dark"] .overview-master-card:hover,
html[data-theme="dark"] .simple-history-card:hover {
    box-shadow: none !important;
    background: var(--pro-surface-muted) !important;
}

/* —— Heroes : fini le dégradé arc-en-ciel —— */
.pf-hero__glow,
.pf-hero__grid,
.mm-hero__glow,
.mm-hero__grid,
.pf-hero::before,
.pf-hero::after,
.mm-hero::before,
.mm-hero::after {
    display: none !important;
}

.pf-hero,
.mm-hero,
html[data-theme="dark"] .pf-hero,
html[data-theme="dark"] .mm-hero {
    overflow: visible !important;
    isolation: auto !important;
    margin-bottom: 8px !important;
    padding:
        12px
        max(var(--pro-space-page), env(safe-area-inset-right, 0px))
        10px
        max(var(--pro-space-page), env(safe-area-inset-left, 0px)) !important;
    background: transparent !important;
    color: var(--pro-text) !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.pf-hero__title,
.mm-hero__title {
    color: var(--pro-text) !important;
    text-shadow: none !important;
    font-weight: 700 !important;
    font-size: clamp(1.25rem, 3.8vw, 1.5rem) !important;
    letter-spacing: -0.03em !important;
}

.pf-hero__sub,
.mm-hero__sub {
    color: var(--pro-text-muted) !important;
    text-shadow: none !important;
}

.pf-hero__kind {
    color: var(--pro-accent) !important;
    background: var(--pro-accent-muted) !important;
    border: 1px solid color-mix(in srgb, var(--pro-accent) 22%, transparent) !important;
    text-shadow: none !important;
}

.pf-hero__kind--analyse {
    color: var(--pro-success) !important;
    background: var(--pro-success-bg) !important;
    border-color: var(--pro-success-border) !important;
}

.pf-crumb__back {
    color: var(--pro-text-muted) !important;
}

.pf-crumb__back:hover {
    color: var(--pro-text) !important;
}

body[data-page-kind="tool"] .pf-hero {
    padding-top: 10px !important;
    padding-bottom: 8px !important;
}

body[data-page-kind="tool"] .pf-hero__title {
    font-size: clamp(1.125rem, 3.2vw, 1.35rem) !important;
}

/* FAB */
.app-fab__btn {
    background: var(--pro-accent) !important;
    color: var(--pro-on-accent) !important;
    box-shadow: var(--pro-shadow-md) !important;
}

.fab-floating {
    background: var(--pro-accent) !important;
    color: var(--pro-on-accent) !important;
    box-shadow: var(--pro-shadow-md) !important;
}

/* —— Phase 3 : Dashboard / Analyse —— */
.dash-tile,
.dash-year,
.dash-dyn__sheet {
    background: var(--pro-surface-elevated) !important;
    border: 1px solid var(--pro-border-subtle) !important;
    box-shadow: var(--pro-shadow-sm) !important;
}

html[data-theme="dark"] .dash-tile,
html[data-theme="dark"] .dash-year,
html[data-theme="dark"] .dash-dyn__sheet {
    box-shadow: none !important;
}

.dash-dyn__sheet .dash-cmp:nth-child(even) {
    background: var(--pro-surface-muted) !important;
}

.dash-section__title::before,
.dash-section--money .dash-section__title::before,
.dash-section--cost .dash-section__title::before,
.dash-section--perf .dash-section__title::before,
.dash-section--record .dash-section__title::before {
    background: var(--pro-accent) !important;
}

.hub-switch__opt.is-active,
.analyse-lens .hub-switch__opt.is-active,
.filter-btn.active,
.metrics-tab.active,
.report-tab.active,
.propfirm-tab.active {
    color: var(--pro-accent) !important;
}

.filter-btn.active,
.metrics-tab.active,
.report-tab.active,
.propfirm-tab.active {
    background: var(--pro-accent-muted) !important;
    border-color: color-mix(in srgb, var(--pro-accent) 28%, transparent) !important;
}

.kpi-card,
.stat-card.kpi-card,
.kpi-card--hero {
    background: var(--pro-surface-elevated) !important;
    border: 1px solid var(--pro-border-subtle) !important;
    box-shadow: var(--pro-shadow-sm) !important;
}

html[data-theme="dark"] .kpi-card,
html[data-theme="dark"] .stat-card.kpi-card {
    box-shadow: none !important;
}

/* —— Phase 4 : Plus hub, tuiles, menu —— */
.pcmp-tile {
    background: var(--pro-surface-elevated) !important;
    border: 1px solid var(--pro-border-subtle) !important;
    border-radius: var(--pro-radius-lg) !important;
    box-shadow: var(--pro-shadow-sm) !important;
    transform: none !important;
}

.pcmp-tile::before {
    display: none !important;
}

.pcmp-tile:hover {
    transform: none !important;
    border-color: color-mix(in srgb, var(--pro-accent) 35%, var(--pro-border-subtle)) !important;
    box-shadow: var(--pro-shadow) !important;
    background: var(--pro-surface-muted) !important;
}

.pcmp-tile:active {
    background: var(--pro-accent-muted) !important;
    transform: none !important;
}

.plus-hub__tiles .pcmp-tile[data-app-menu-action="account-context"] {
    background: var(--pro-surface-elevated) !important;
    border: 1px solid var(--pro-border-subtle) !important;
}

.app-menu-drawer__panel {
    background: var(--pro-surface-elevated) !important;
    border: 1px solid var(--pro-border-subtle) !important;
    box-shadow: var(--pro-shadow-md) !important;
}

.app-menu-drawer__item:hover,
.app-menu-drawer__item:focus-visible {
    background: var(--pro-surface-muted) !important;
}

/* —— Phase 5 : Historique, inputs, modales —— */
#analyse #history .history-controls-container,
#analyse .revolut-transaction-group,
#analyse .mm-firm-group,
#analyse .mm-table-head,
#analyse .mm-day-log.challenge-stats-history-section,
#analyse #history .empty-state {
    border: 1px solid var(--pro-border-subtle) !important;
    box-shadow: var(--pro-shadow-sm) !important;
}

html[data-theme="dark"] #analyse #history .history-controls-container,
html[data-theme="dark"] #analyse .revolut-transaction-group,
html[data-theme="dark"] #analyse .mm-firm-group {
    box-shadow: none !important;
}

#analyse .mm-firm-group--alt {
    background: var(--pro-surface-muted) !important;
}

#analyse #history .history-search-input,
input[type="text"],
input[type="number"],
input[type="password"],
input[type="date"],
input[type="search"],
select,
textarea {
    border-color: var(--pro-border-subtle) !important;
    background: var(--pro-surface-elevated) !important;
    color: var(--pro-text) !important;
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible,
#analyse #history .history-search-input:focus {
    outline: none !important;
    border-color: var(--pro-accent) !important;
    box-shadow: 0 0 0 3px var(--pro-accent-muted) !important;
}

.modal-panel,
.sheet-panel {
    background: var(--pro-surface-elevated) !important;
    border: 1px solid var(--pro-border-subtle) !important;
    box-shadow: var(--pro-shadow-md) !important;
}

.revolut-transaction-amount.positive,
.stat-value.positive,
.kpi-value.positive {
    color: var(--pro-success) !important;
}

.revolut-transaction-amount.negative,
.stat-value.negative,
.kpi-value.negative {
    color: var(--pro-danger) !important;
}

.dash-studio-toggle {
    background: var(--pro-surface-muted) !important;
    border: 1px solid var(--pro-border-subtle) !important;
    box-shadow: none !important;
}