/*
 * PBDL — design « terminal » (inspiré du terminal Bloomberg).
 * Toutes les règles sont préfixées par .ui-term (posée par assets/terminal.js) : sans activation, aucun effet.
 * Deux palettes sur le même design : data-skin="terminal" (noir/ambre) et data-skin="classic" (navy/or d'origine).
 * Beaucoup de couleurs des pages sont en style inline ou en !important : d'où les !important ci-dessous.
 */

/* =================== PALETTES =================== */
html.ui-term {
    color-scheme: dark;
    --bg: #000000;
    --panel: #070707;
    --bar: #161616;
    --title: #ff9f1a;
    --num: #ffd400;
    --line: #2b2b2b;
    --line-soft: #161616;
    --accent: #ff9f1a;
    --accent-fg: #000000;
    --accent-dim: #b8741a;
    --data: #f2f2f2;
    --muted: #8a8a8a;
    --up: #2bd46a;
    --down: #ff433d;
    --alt: #3fc8ff;
    --field: #000000;
    --field-fg: #ff9f1a;
    --hover: #141414;
    --cmd-bg: #161616;
    --cmd-fg: #f2f2f2;
    --brand-bg: #ff9f1a;
    --brand-fg: #000000;
    --key-on-bg: #ff9f1a;
    --key-on-fg: #000000;
    --th-bg: #000000;
    --th-fg: #ff9f1a;
    --clock-bg: #000000;
    --clock-fg: #8a8a8a;
    --clock-time: #f2f2f2;
    --grid: #1d1d1d;
    --tip-bg: #000000;
    --tip-fg: #f2f2f2;
    --s5: #ff5fd2;
    --s7: #9b8cff;
    --mono: "IBM Plex Mono", Consolas, "Courier New", monospace;
}
html.ui-term[data-skin="classic"] {
    color-scheme: light;
    --bg: #0d1f70;
    --panel: #ffffff;
    --bar: #0d1f70;
    --title: #ffffff;
    --num: #c59122;
    --line: #d9dee8;
    --line-soft: #eef0f4;
    --accent: #c59122;
    --accent-fg: #000000;
    --accent-dim: #a3761b;
    --data: #2c3e50;
    --muted: #6b7280;
    --up: #1e9e50;
    --down: #e74c3c;
    --alt: #1a73e8;
    --field: #ffffff;
    --field-fg: #2c3e50;
    --hover: #f8f9fa;
    --cmd-bg: #c59122;
    --cmd-fg: #ffffff;
    --brand-bg: #0d1f70;
    --brand-fg: #ffffff;
    --key-on-bg: #0d1f70;
    --key-on-fg: #ffffff;
    --th-bg: #0d1f70;
    --th-fg: #ffffff;
    --clock-bg: #1e222d;
    --clock-fg: #909298;
    --clock-time: #ffffff;
    --grid: #e8ebf0;
    --tip-bg: #0d1f70;
    --tip-fg: #ffffff;
    --s5: #8e44ad;
    --s7: #16a085;
}

/* =================== BASE =================== */
html.ui-term, html.ui-term body {
    background: var(--bg) !important;
    color: var(--data);
}
html.ui-term body {
    font-family: var(--mono) !important;
    font-size: 12.5px;
    font-variant-numeric: tabular-nums;
    -webkit-font-smoothing: antialiased;
}
html.ui-term *, html.ui-term *::before, html.ui-term *::after { border-radius: 0 !important; }
html.ui-term h1, html.ui-term h2, html.ui-term h3, html.ui-term h4, html.ui-term h5, html.ui-term h6,
html.ui-term button, html.ui-term input, html.ui-term select, html.ui-term textarea, html.ui-term table {
    font-family: var(--mono) !important;
}
html.ui-term :focus-visible { outline: 1px solid var(--accent) !important; outline-offset: 1px; }
html.ui-term ::selection { background: var(--accent); color: var(--accent-fg); }
html.ui-term .positive, html.ui-term .text-success { color: var(--up) !important; }
html.ui-term .negative, html.ui-term .text-danger { color: var(--down) !important; }

/* =================== EN-TÊTE = BARRE DE COMMANDE =================== */
html.ui-term header {
    background: var(--cmd-bg) !important;
    color: var(--cmd-fg) !important;
    padding: 0 16px !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    flex-wrap: wrap;
    gap: 0 !important;
    border-bottom: 1px solid var(--accent);
    position: sticky;
    top: 0;
    z-index: 900;
}
html.ui-term header h1 {
    display: flex;
    align-items: stretch;
    margin: 0 auto 0 0 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--cmd-fg);
}
html.ui-term header h1::before {
    content: "PBDL";
    display: flex;
    align-items: center;
    background: var(--brand-bg);
    color: var(--brand-fg);
    font-weight: 700;
    letter-spacing: .08em;
    padding: 6px 10px;
    margin-right: 10px;
}
html.ui-term header h1 { line-height: 1; align-items: center; }
html.ui-term header .nav-btn {
    display: flex;
    align-items: center;
    border: 0 !important;
    border-left: 1px solid rgba(127,127,127,.35) !important;
    color: var(--cmd-fg) !important;
    /* !important : les boutons de l'en-tête (Personnaliser, PDF) ne prennent pas le fond des champs */
    background: transparent !important;
    padding: 6px 12px !important;
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    text-transform: uppercase;
    letter-spacing: .05em;
    opacity: 1 !important;
}
html.ui-term header .nav-btn:hover { background: rgba(127,127,127,.2) !important; }
html.ui-term header .nav-btn::before { color: var(--num); font-weight: 600; margin-right: 6px; }
html.ui-term[data-skin="classic"] header .nav-btn::before { color: var(--brand-bg); }
html.ui-term header .nav-btn[href*="index.php"]::before { content: "F1"; }
html.ui-term header .nav-btn[href*="screener.php"]::before { content: "F2"; }
html.ui-term header .nav-btn[href*="generator.php"]::before { content: "F3"; }
html.ui-term header .nav-btn[href*="logout.php"]::before { content: "F9"; }

/* Interrupteur de palette (injecté par terminal.js) */
html.ui-term .pbdl-skin {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 4px 10px;
    border-left: 1px solid rgba(127,127,127,.35);
    font-size: 11px;
    text-transform: uppercase;
}
html.ui-term .pbdl-skin span { margin-right: 6px; opacity: .8; }
html.ui-term .pbdl-skin button {
    border: 1px solid currentColor !important;
    background: transparent !important;
    color: inherit !important;
    padding: 1px 8px !important;
    margin: 0 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    cursor: pointer;
}
html.ui-term .pbdl-skin button + button { border-left: 0 !important; }
html.ui-term .pbdl-skin button[aria-pressed="true"] {
    background: var(--key-on-bg) !important;
    color: var(--key-on-fg) !important;
    border-color: var(--key-on-bg) !important;
}

/* =================== MISE EN PAGE =================== */
html.ui-term main { padding: 8px 16px 24px !important; gap: 8px !important; }

/* Bandeau des horaires de marché */
html.ui-term .world-clock-bar {
    background: var(--clock-bg) !important;
    color: var(--clock-fg) !important;
    justify-content: flex-start !important;
    flex-wrap: wrap;
    gap: 4px 22px;
    padding: 6px 8px !important;
    border: 1px solid var(--line);
    box-shadow: none !important;
    font-family: var(--mono) !important;
}
html.ui-term .clock-item { gap: 6px !important; }
html.ui-term .city-name { font-size: 12px !important; letter-spacing: .04em !important; color: var(--clock-fg) !important; }
html.ui-term .city-time { font-size: 12.5px !important; font-weight: 500 !important; color: var(--clock-time); font-family: var(--mono) !important; }
html.ui-term .status-dot { width: 7px !important; height: 7px !important; box-shadow: none !important; }
html.ui-term .status-dot.open { background: #2bd46a !important; }
html.ui-term .status-dot.closed { background: #ff433d !important; }

/* =================== PANNEAUX =================== */
html.ui-term .charts-container.three { gap: 8px !important; margin-top: 0 !important; }
html.ui-term .chart-card,
html.ui-term .widget-card,
html.ui-term .portfolio-manager > section,
html.ui-term .table-container,
html.ui-term .chart-box,
html.ui-term .portfolio-distribution {
    background: var(--panel) !important;
    border: 1px solid var(--line) !important;
    box-shadow: none !important;
}
html.ui-term .chart-card, html.ui-term .widget-card { padding: 0 8px 8px !important; }
html.ui-term .chart-header {
    background: var(--bar);
    color: var(--title);
    margin: 0 -8px 8px;
    padding: 3px 8px;
    border-bottom: 1px solid var(--line);
    flex-wrap: wrap;
    gap: 4px 8px;
    font-size: 11px !important;
}
html.ui-term .chart-header h2,
html.ui-term .chart-header h3 {
    color: var(--title) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: .06em;
}

/* Conteneur global du tableau de bord : chaque section devient un panneau */
html.ui-term .portfolio-manager {
    background: transparent !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
html.ui-term .portfolio-manager > section { padding: 0 8px 8px; margin: 0 !important; }
html.ui-term .portfolio-manager > section > h2,
html.ui-term .table-container > h2,
html.ui-term .portfolio-distribution h2,
html.ui-term .correlation-section h2 {
    background: var(--bar);
    color: var(--title) !important;
    margin: 0 -8px 8px !important;
    padding: 4px 8px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: .06em;
    border-bottom: 1px solid var(--line);
    text-align: left !important;
}
html.ui-term .portfolio-manager > section > h2:not(:first-child) { margin-top: 10px !important; border-top: 1px solid var(--line); }
html.ui-term .portfolio-manager h2:empty { display: none; }
html.ui-term .portfolio-distribution { padding: 0 8px 8px !important; margin-top: 0 !important; }
html.ui-term .portfolio-distribution > div:first-child { margin: 0 -8px 8px !important; background: var(--bar); padding-right: 8px; border-bottom: 1px solid var(--line); }
html.ui-term .portfolio-distribution > div:first-child h2 { margin: 0 !important; border: 0; }
html.ui-term .correlation-section { padding: 0 8px 8px !important; }
html.ui-term .chart-box { border: 0 !important; padding: 0 !important; margin-top: 0 !important; }
html.ui-term .var-chart-container { height: 380px !important; margin-bottom: 0 !important; }
html.ui-term .chart-container-pie { margin: 8px auto !important; }
html.ui-term .table-container { padding: 0 8px 8px !important; }

/* =================== BOUTONS, CHAMPS, ONGLETS =================== */
html.ui-term button,
html.ui-term .period-btn,
html.ui-term .tab-btn,
html.ui-term .fullscreen-btn {
    background: var(--field) !important;
    color: var(--data) !important;
    border: 1px solid var(--line) !important;
    padding: 2px 8px !important;
    margin: 0 !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    letter-spacing: .03em;
    cursor: pointer;
    box-shadow: none !important;
    transition: none !important;
}
html.ui-term button:hover { border-color: var(--accent) !important; }
html.ui-term .period-btn.active,
html.ui-term .tab-btn.active {
    background: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--accent-fg) !important;
}
html.ui-term button.add,
html.ui-term button.btn-add,
html.ui-term .btn-gold,
html.ui-term .btn-generate {
    color: var(--accent) !important;
    border-color: var(--accent) !important;
}
html.ui-term button.delete,
html.ui-term button.btn-del {
    color: var(--down) !important;
    border-color: var(--down) !important;
}
html.ui-term[data-skin="classic"] button.add,
html.ui-term[data-skin="classic"] button.btn-add,
html.ui-term[data-skin="classic"] .btn-gold,
html.ui-term[data-skin="classic"] .btn-generate { background: var(--accent) !important; color: #fff !important; }
html.ui-term[data-skin="classic"] button.delete,
html.ui-term[data-skin="classic"] button.btn-del { background: var(--down) !important; color: #fff !important; }
html.ui-term .period-filters { display: flex; flex-wrap: wrap; gap: 2px; }
html.ui-term .widget-tabs { gap: 2px !important; }
html.ui-term .form-row, html.ui-term .actions-bar { gap: 6px !important; margin-bottom: 6px !important; }
html.ui-term .form-row label { color: var(--muted); text-transform: uppercase; font-weight: 500 !important; }

html.ui-term input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html.ui-term select,
html.ui-term textarea,
html.ui-term .ticker-select,
html.ui-term .form-control,
html.ui-term .form-select {
    background-color: var(--field) !important;
    color: var(--field-fg) !important;
    border: 1px solid var(--line) !important;
    padding: 2px 6px !important;
    margin: 0 !important;
    font-size: 12px !important;
    box-shadow: none !important;
}
/* Nom du portefeuille affiché : en blanc (couleur des données), pas en orange comme les champs */
html.ui-term #versionSelect { color: var(--data) !important; }
html.ui-term input::placeholder, html.ui-term textarea::placeholder { color: var(--muted) !important; opacity: .75; text-transform: uppercase; }
html.ui-term input:focus, html.ui-term select:focus, html.ui-term .form-control:focus, html.ui-term .form-select:focus { border-color: var(--accent) !important; outline: none; }
html.ui-term input[type="date"] { color-scheme: inherit; }

/* Indicateurs de statut (styles inline dans index.php) */
html.ui-term #refresh-status, html.ui-term #calculation-status { color: var(--muted) !important; text-transform: uppercase; font-size: 11px !important; }
html.ui-term #calculation-text { color: var(--num); }
html.ui-term .loading-indicator { color: var(--num); text-transform: uppercase; font-size: 11px; }

/* =================== WIDGET LIVE ET NEWS =================== */
html.ui-term .widget-item {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid var(--line-soft) !important;
    border-left: 2px solid transparent !important;
    padding: 4px 6px !important;
    margin: 0 !important;
}
html.ui-term .widget-item[style*="#28a745"] { border-left-color: var(--up) !important; }
html.ui-term .widget-item[style*="#dc3545"] { border-left-color: var(--down) !important; }
html.ui-term .widget-item span[style*="#555"], html.ui-term .widget-ticker { color: var(--accent) !important; font-weight: 500 !important; font-size: 12px !important; }
html.ui-term[data-skin="classic"] .widget-item span[style*="#555"], html.ui-term[data-skin="classic"] .widget-ticker { color: var(--data) !important; font-weight: 600 !important; }
html.ui-term .widget-item span[style*="#333"] { color: var(--data) !important; font-size: 12.5px !important; }
html.ui-term .widget-item [style*="#28a745"] { color: var(--up) !important; }
html.ui-term .widget-item [style*="#dc3545"] { color: var(--down) !important; }
html.ui-term .widget-item span[style*="#999"] { color: var(--muted) !important; }
html.ui-term .news-item { padding: 5px 2px !important; border-bottom: 1px solid var(--line-soft) !important; }
html.ui-term .news-item:hover { background: var(--hover) !important; }
html.ui-term .news-link { color: var(--data) !important; font-size: 12px !important; font-weight: 400 !important; }
html.ui-term .news-link:hover { color: var(--accent) !important; }
html.ui-term .news-time { color: var(--alt) !important; font-size: 11px !important; margin-top: 2px !important; }
html.ui-term .loading { color: var(--num); text-transform: uppercase; }

/* =================== INDICATEURS (PERFORMANCE ET RISQUE) =================== */
html.ui-term .risk-results { gap: 8px !important; margin: 8px 0 !important; }
html.ui-term .risk-card {
    background: var(--panel) !important;
    border: 1px solid var(--line) !important;
    box-shadow: none !important;
    padding: 0 !important;
    font-family: var(--mono) !important;
}
html.ui-term .risk-title {
    background: var(--bar);
    color: var(--title) !important;
    padding: 4px 8px;
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: .06em;
    border-bottom: 1px solid var(--line);
}
html.ui-term #riskIndicators .risk-title { color: var(--title) !important; }
html.ui-term .risk-horizontal { gap: 0 !important; }
html.ui-term .risk-item {
    background: transparent !important;
    box-shadow: none !important;
    border-right: 1px solid var(--line);
    padding: 6px 8px !important;
    text-align: left !important;
}
html.ui-term .risk-item:last-child { border-right: 0; }
html.ui-term .risk-item-label { color: var(--muted) !important; text-transform: uppercase; font-size: 11px !important; font-weight: 500 !important; }
/* Intitulés des encarts : même couleur pour les indicateurs de rendement et de risque */
html.ui-term #riskIndicators .risk-item-label,
html.ui-term #portfolioIndicators .risk-item-label { color: var(--accent-dim) !important; }
html.ui-term .risk-item-value { align-items: flex-start !important; color: var(--data); font-size: 15px !important; font-weight: 600 !important; }
html.ui-term .risk-item-value span { color: var(--muted) !important; font-size: 11px !important; font-weight: 400 !important; }
html.ui-term .risk-item-sub { color: var(--muted) !important; font-size: 11px !important; }
html.ui-term .risk-purple { color: var(--up) !important; }
html.ui-term .risk-red { color: var(--down) !important; }
html.ui-term .risk-orange { color: var(--num) !important; }

/* =================== TABLEAUX (POSITIONS, SCREENER) =================== */
html.ui-term table { font-size: 12px !important; margin-top: 0 !important; }
html.ui-term th, html.ui-term td { border-bottom: 1px solid var(--line-soft) !important; }
html.ui-term .table-responsive { border: 0 !important; }

html.ui-term #portfolioTable thead tr,
html.ui-term #ScreenerTable thead tr { background: var(--th-bg) !important; }
html.ui-term #portfolioTable thead th,
html.ui-term #ScreenerTable thead th,
html.ui-term #ScreenerTable thead th:first-child,
html.ui-term #portfolioTable th:first-child {
    background: var(--th-bg) !important;
    color: var(--th-fg) !important;
    font-weight: 500 !important;
    font-size: 11px !important;
    text-transform: uppercase;
    border-bottom: 1px solid var(--accent) !important;
    padding: 5px 6px !important;
    white-space: nowrap;
}
html.ui-term #portfolioTable th .fa-sort, html.ui-term #ScreenerTable th .fa-sort { color: var(--accent-dim); }
html.ui-term #portfolioTable td,
html.ui-term #ScreenerTable td {
    padding: 3px 6px !important;
    color: var(--data);
    background: transparent;
}
html.ui-term #portfolioTable td:first-child,
html.ui-term #ScreenerTable td:first-child,
html.ui-term #ScreenerTable .ticker-cell {
    background-color: var(--panel) !important;
    box-shadow: none !important;
}
html.ui-term #portfolioTable tbody tr:hover td,
html.ui-term #ScreenerTable tbody tr:hover td { background-color: var(--hover) !important; }
html.ui-term .ticker-cell { padding: 3px 6px !important; }
html.ui-term .full-name-display, html.ui-term .ticker-fullname { color: var(--data) !important; font-weight: 500 !important; }
html.ui-term .ticker-hover-display { color: var(--accent) !important; background: var(--panel) !important; }
html.ui-term .badge-class { color: var(--muted); text-transform: uppercase; font-size: 11px; }
html.ui-term #portfolioTable td button,
html.ui-term #ScreenerTable td button { padding: 0 6px !important; font-size: 11px !important; }
html.ui-term .btn-delete { color: var(--muted) !important; border: 1px solid var(--line) !important; background: var(--field) !important; }
html.ui-term .btn-delete:hover { color: var(--down) !important; border-color: var(--down) !important; }
html.ui-term #portfolioTable tfoot tr,
html.ui-term #portfolioTable tfoot td,
html.ui-term #portfolioTable tfoot td:first-child,
html.ui-term tfoot td {
    background: var(--accent) !important;
    color: var(--accent-fg) !important;
    font-weight: 700 !important;
    border: 0 !important;
}

/* Vue fongible : badge « N lots » et sous-lignes des achats */
html.ui-term .lot-badge {
    background: transparent !important;
    color: var(--accent) !important;
    border: 1px solid var(--accent);
    padding: 0 4px !important;
    font-size: 10.5px !important;
    font-weight: 500 !important;
    text-transform: uppercase;
}
html.ui-term #portfolioTable tr.lot-row td {
    background-color: var(--hover) !important;
    color: var(--muted) !important;
    font-size: 11.5px !important;
    font-style: normal !important;
}
html.ui-term #portfolioTable tr.lot-row td.positive { color: var(--up) !important; }
html.ui-term #portfolioTable tr.lot-row td.negative { color: var(--down) !important; }
html.ui-term #portfolioTable tr.lot-row td:first-child { padding-left: 18px !important; }
html.ui-term .lot-toggle { min-width: 44px; color: var(--accent) !important; border-color: var(--accent) !important; }

/* Mouvements, liquidités, positions clôturées */
html.ui-term .op-panel {
    background: var(--panel) !important;
    border: 1px solid var(--line) !important;
    padding: 0 8px 8px !important;
    margin: 8px 0 !important;
}
html.ui-term .op-head {
    background: var(--bar);
    margin: 0 -8px 8px !important;
    padding: 4px 8px;
    border-bottom: 1px solid var(--line);
}
html.ui-term .op-title {
    color: var(--title) !important;
    font-size: 12px;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: .06em;
}
html.ui-term .op-tab {
    background: var(--field) !important;
    color: var(--data) !important;
    border: 1px solid var(--line) !important;
}
html.ui-term .op-tab.active {
    background: var(--accent) !important;
    color: var(--accent-fg) !important;
    border-color: var(--accent) !important;
}
html.ui-term .op-field {
    color: var(--muted) !important;
    font-size: 10.5px !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    letter-spacing: .04em;
}
html.ui-term .op-summary { color: var(--data) !important; font-size: 11.5px !important; }
html.ui-term .op-summary strong { color: var(--accent); }
html.ui-term .op-summary strong.negative { color: var(--down) !important; }
html.ui-term .op-summary strong.positive { color: var(--up) !important; }
html.ui-term .op-warn { color: var(--down) !important; }
html.ui-term #portfolioTable tr.cash-row td {
    background-color: var(--hover) !important;
    color: var(--data) !important;
    font-weight: 600 !important;
    border-top: 1px solid var(--accent) !important;
}
html.ui-term #portfolioTable tr.cash-row td:first-child { background-color: var(--hover) !important; }
html.ui-term .sell-btn { color: var(--alt) !important; border-color: var(--alt) !important; }
html.ui-term .closed-positions {
    margin-top: 8px;
    background: var(--panel);
    border: 1px solid var(--line);
    padding: 0;
}
html.ui-term .closed-positions summary {
    background: var(--bar);
    color: var(--title);
    padding: 4px 8px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    cursor: pointer;
}
html.ui-term .closed-table th {
    background: var(--th-bg) !important;
    color: var(--th-fg) !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    border-bottom: 1px solid var(--accent) !important;
}
html.ui-term .closed-table td { color: var(--data); padding: 3px 6px !important; }
html.ui-term .closed-mv { color: var(--muted); text-align: left; padding: 2px 8px; font-size: 11.5px; }

/* Matrice de corrélation (cellules recolorées par terminal.js en palette terminal) */
html.ui-term #correlationMatrixContainer { background: var(--panel) !important; border: 1px solid var(--line) !important; }
html.ui-term .correlation-table th {
    background: var(--th-bg) !important;
    color: var(--th-fg) !important;
    font-weight: 500 !important;
    font-size: 11px !important;
    border: 1px solid var(--line) !important;
}
html.ui-term .correlation-table td { font-size: 11px !important; padding: 6px 2px !important; }

/* Liste « Répartition » (style inline) */
html.ui-term #pieCategory { border-radius: 0 !important; }

/* =================== FENÊTRES MODALES =================== */
html.ui-term .modal-overlay, html.ui-term .chart-modal, html.ui-term #tickerModal { background: rgba(0,0,0,.82) !important; }
html.ui-term .modal-content,
html.ui-term .chart-modal-content,
html.ui-term .ticker-modal-card {
    background: var(--panel) !important;
    color: var(--data);
    border: 1px solid var(--accent) !important;
    box-shadow: none !important;
}
html.ui-term .modal-content h2, html.ui-term #modalTitle, html.ui-term #modalChartTitle {
    color: var(--title) !important;
    font-size: 13px !important;
    text-transform: uppercase;
    letter-spacing: .06em;
}
html.ui-term .modal-content h2 { background: var(--bar); margin: -20px -20px 10px !important; padding: 6px 12px; }
html.ui-term .close-modal, html.ui-term .ticker-close-btn { color: var(--accent) !important; z-index: 2; }
html.ui-term .ticker-modal-header { background: var(--bar) !important; border-bottom: 1px solid var(--line) !important; }
html.ui-term .ios-fullscreen-fallback { background-color: var(--bg) !important; }
html.ui-term .chart-card:fullscreen { background: var(--panel) !important; padding: 8px !important; }

/* =================== GÉNÉRATEUR (BOOTSTRAP 5.3) =================== */
html.ui-term body {
    --bs-body-bg: var(--bg);
    --bs-body-color: var(--data);
    --bs-border-color: var(--line);
    --bs-secondary-color: var(--muted);
    --bs-tertiary-bg: var(--hover);
    --bs-emphasis-color: var(--data);
    --bs-link-color: var(--accent);
    --bs-link-hover-color: var(--accent);
    --bs-font-monospace: var(--mono);
    --bs-body-font-family: var(--mono);
}
html.ui-term .container-fluid { padding: 8px 16px 24px !important; }
html.ui-term .row.g-4 { --bs-gutter-y: 8px; --bs-gutter-x: 8px; }
html.ui-term .card {
    --bs-card-bg: var(--panel);
    --bs-card-color: var(--data);
    --bs-card-border-color: var(--line);
    background: var(--panel) !important;
    color: var(--data);
    border: 1px solid var(--line) !important;
    box-shadow: none !important;
}
html.ui-term .card-header,
html.ui-term .card-header.bg-dark {
    background: var(--bar) !important;
    color: var(--title) !important;
    padding: 4px 8px !important;
    border-bottom: 1px solid var(--line) !important;
}
html.ui-term .card-header h5, html.ui-term .card-title {
    color: var(--title) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: .06em;
}
html.ui-term[data-skin="classic"] .card-body .card-title { color: var(--data) !important; }
html.ui-term .card-body, html.ui-term .card-body.bg-light { background: var(--panel) !important; color: var(--data); padding: 10px 12px !important; }
html.ui-term .bg-light { background-color: var(--panel) !important; color: var(--data) !important; }
html.ui-term .bg-white { background-color: var(--panel) !important; }
html.ui-term .text-dark { color: var(--data) !important; }
html.ui-term .text-muted { color: var(--muted) !important; }
html.ui-term .text-primary { color: var(--accent) !important; }
html.ui-term[data-skin="classic"] .text-primary { color: var(--alt) !important; }
html.ui-term .text-light { color: var(--line) !important; }
html.ui-term .shadow-sm, html.ui-term .shadow { box-shadow: none !important; }
html.ui-term .section-title {
    color: var(--accent) !important;
    border-left: 2px solid var(--accent) !important;
    font-size: 11.5px !important;
    letter-spacing: .06em !important;
}
html.ui-term .form-label, html.ui-term .form-check-label { color: var(--muted); font-size: 11.5px !important; text-transform: uppercase; }
html.ui-term .filter-scrollbox { background: var(--field) !important; border: 1px solid var(--line) !important; }
html.ui-term .filter-scrollbox .form-check:hover { background: var(--hover) !important; }
html.ui-term .filter-scrollbox .form-check-label { color: var(--data); text-transform: none; }
html.ui-term .filter-scrollbox::-webkit-scrollbar-thumb { background: var(--line) !important; }
html.ui-term .form-check-input {
    background-color: var(--field) !important;
    border: 1px solid var(--muted) !important;
}
html.ui-term .form-check-input:checked { background-color: var(--accent) !important; border-color: var(--accent) !important; }
html.ui-term .form-switch .form-check-input { border-radius: 0 !important; }
html.ui-term .advanced-input:disabled { background-color: var(--hover) !important; color: var(--muted) !important; }
html.ui-term .input-group-text { background: var(--bar) !important; color: var(--muted) !important; border: 1px solid var(--line) !important; font-size: 12px; }
html.ui-term .btn { font-family: var(--mono) !important; }
html.ui-term .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--data);
    --bs-table-border-color: var(--line-soft);
    --bs-table-hover-bg: var(--hover);
    color: var(--data);
}
html.ui-term .table > thead, html.ui-term .table-light, html.ui-term .table-light th {
    --bs-table-bg: var(--th-bg);
    --bs-table-color: var(--th-fg);
    background: var(--th-bg) !important;
    color: var(--th-fg) !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    border-bottom: 1px solid var(--accent) !important;
}
html.ui-term .table td, html.ui-term .table th { padding: 4px 6px !important; }
html.ui-term .badge { font-family: var(--mono); font-weight: 500; }
html.ui-term .badge.bg-light { background: var(--field) !important; color: var(--data) !important; border-color: var(--line) !important; }
html.ui-term .progress { background: var(--line) !important; }
html.ui-term .progress-bar.bg-success { background: var(--up) !important; }
html.ui-term .progress-bar.bg-primary { background: var(--accent) !important; }
html.ui-term .progress-bar.bg-warning { background: var(--num) !important; }
html.ui-term .alert { background: var(--panel) !important; border: 1px solid var(--line) !important; color: var(--data) !important; }
html.ui-term .alert-danger { border-color: var(--down) !important; color: var(--down) !important; }
html.ui-term .alert-warning { border-color: var(--num) !important; color: var(--num) !important; }
html.ui-term .kpi-card {
    background: var(--panel) !important;
    color: var(--data) !important;
    border: 1px solid var(--line) !important;
    border-top: 2px solid var(--accent) !important;
    box-shadow: none !important;
    text-align: left !important;
    padding: 8px 10px !important;
}
html.ui-term .kpi-card.kpi-return { border-top-color: var(--alt) !important; }
html.ui-term .kpi-card.kpi-vol { border-top-color: var(--down) !important; }
html.ui-term .kpi-card h6, html.ui-term .kpi-card .text-uppercase { color: var(--muted) !important; font-size: 11px !important; opacity: 1 !important; }
html.ui-term .name-overlay-wrap::after { background: var(--hover) !important; }

/* =================== PAGES DE CONNEXION =================== */
html.ui-term body:has(.auth-container) { background: var(--bg) !important; }
html.ui-term .auth-container {
    background: var(--panel) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid var(--accent) !important;
    box-shadow: none !important;
    padding: 0 24px 20px !important;
    color: var(--data);
    font-family: var(--mono);
    text-align: left !important;
}
html.ui-term .auth-container .logo { margin: 16px 0 10px !important; }
html.ui-term .auth-container .logo img { width: 40% !important; }
html.ui-term .auth-container h2 {
    background: var(--bar);
    color: var(--title) !important;
    margin: 0 -24px 14px !important;
    padding: 6px 12px;
    font-size: 13px !important;
    text-transform: uppercase;
    letter-spacing: .08em;
    text-align: center !important;
}
html.ui-term .auth-container input { margin: 6px 0 !important; padding: 8px !important; }
html.ui-term .auth-container button[type="submit"] {
    background: var(--accent) !important;
    color: var(--accent-fg) !important;
    border-color: var(--accent) !important;
    padding: 8px !important;
    margin-top: 8px !important;
    font-weight: 700 !important;
}
html.ui-term .auth-container a { color: var(--accent) !important; }
html.ui-term .auth-container p, html.ui-term .auth-container footer { color: var(--muted); font-size: 11.5px; }
html.ui-term .auth-container .error { color: var(--down) !important; }
html.ui-term .auth-container .pbdl-skin { margin-top: 12px; padding: 0; border: 0; color: var(--muted); }

/* =================== PAGE ADMIN =================== */
html.ui-term .admin-panel {
    background: var(--panel) !important;
    color: var(--data);
    border: 1px solid var(--accent);
    box-shadow: none !important;
    font-family: var(--mono) !important;
}
html.ui-term .admin-panel h2 { color: var(--title); font-size: 13px; text-transform: uppercase; }
html.ui-term .admin-panel .info { background: var(--field) !important; color: var(--num) !important; border: 1px solid var(--line) !important; }
html.ui-term .admin-panel .btn { background: var(--accent) !important; color: var(--accent-fg) !important; }
html.ui-term .admin-panel a { color: var(--accent) !important; }

/* =================== PETITS ÉCRANS =================== */
@media (max-width: 768px) {
    html.ui-term header h1 { width: 100%; margin-right: 0 !important; }
    html.ui-term header .nav-btn { padding: 6px 8px !important; }
    html.ui-term .risk-item { border-right: 0; border-bottom: 1px solid var(--line); }
}