/*!
 * Horizon Base Styles — Phase 1 Design Harmonization
 * Extracted from partials/design-tokens.blade.php
 * Do NOT add component classes here; use horizon-components.css
 */

/* ══ BOOTSTRAP DARK OVERRIDES — ensures bg-light/bg-white never render white ══ */
body { background: var(--hz-bg-page) !important; color: var(--hz-text-main) !important; }
.bg-light  { background-color: var(--hz-bg-card) !important; }
.bg-white  { background-color: var(--hz-bg-card) !important; }
.bg-dark   { background-color: var(--hz-bg-page) !important; }
.text-dark, .text-body { color: var(--hz-text-main) !important; }
.text-muted, .text-secondary { color: var(--hz-text-sub) !important; }
.text-dark { color: var(--hz-text-main) !important; }
.text-body { color: var(--hz-text-main) !important; }
a.text-dark:hover, a.text-body:hover { color: var(--hz-gold) !important; }
.border-light { border-color: var(--hz-border) !important; }
.card:not([class*="hz-"]):not([style*="background"]) {
    background: var(--hz-bg-card) !important;
    border-color: var(--hz-border) !important;
    color: var(--hz-text-main) !important;
}
.card-header, .card-footer {
    background: var(--hz-bg-card) !important;
    border-color: var(--hz-border) !important;
}

/* ══ GLOBAL SECTION CONSISTENCY ══ */
.investment-comparison,
.market-data,
#market-news { background: var(--hz-bg-page) !important; }
html { scroll-behavior: smooth; }
section { transition: background 0.3s ease; }

/* Bootstrap modal — dark override */
.modal-content { background: var(--hz-bg-card) !important; border: 1px solid var(--hz-border) !important; color: var(--hz-text-main) !important; }
.modal-header { border-bottom-color: var(--hz-border) !important; }
.modal-footer { border-top-color: var(--hz-border) !important; }

/* Tables */
table { color: var(--hz-text-main) !important; }
thead th { color: var(--hz-gold) !important; background: var(--hz-glow-xs) !important; border-color: var(--hz-border) !important; }
tbody tr:hover { background: var(--hz-glow-xs) !important; }
td, th { border-color: var(--hz-border) !important; }

/* Form controls — global */
.form-control, .form-select, input:not([type="range"]):not([type="checkbox"]):not([type="radio"]), textarea, select {
    background: var(--hz-bg-card) !important;
    border-color: var(--hz-border) !important;
    color: var(--hz-text-main) !important;
}
.form-control:focus, .form-select:focus, input:focus, textarea:focus {
    border-color: var(--hz-gold) !important;
    box-shadow: 0 0 0 3px var(--hz-glow-sm) !important;
}
input::placeholder, textarea::placeholder { color: var(--hz-text-sub) !important; }

/* Accordion */
.accordion-button, .accordion-item { background: var(--hz-bg-card) !important; color: var(--hz-text-main) !important; border-color: var(--hz-border) !important; }
.accordion-button:not(.collapsed) { color: var(--hz-gold) !important; }

/* Canvas — transparent bg for charts */
canvas { background: transparent !important; }


/* ══ LAYOUT STRUCTURAL STYLES ══ */
body { min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; }
.footer, footer, section[id*="footer"] { margin-top: auto; }
.main-content { margin-top: 70px; min-height: calc(100vh - 70px); }
.skip-to-content { position: absolute; top: -40px; left: 6px; background: var(--hz-gold); color: #000; padding: 8px; text-decoration: none; border-radius: var(--radius-sm); z-index: 10000; transition: top 0.3s ease; }
.skip-to-content:focus { top: 6px; }
.back-to-top { position: fixed; bottom: 20px; right: 20px; width: 50px; height: 50px; background: var(--hz-gold); color: #000; border: none; border-radius: var(--radius-full); display: none; align-items: center; justify-content: center; cursor: pointer; z-index: 1000; transition: all 0.3s ease; box-shadow: 0 4px 20px rgba(0,0,0,0.3); }
.back-to-top:hover { background: var(--hz-gold); transform: scale(1.1); }
.back-to-top.show { display: flex; }
.theme-toggle { position: fixed; top: 100px; right: 20px; width: 50px; height: 50px; background: var(--hz-bg-card); color: var(--hz-text-main); border: 1px solid var(--hz-border); border-radius: var(--radius-full); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 1000; transition: all 0.3s ease; box-shadow: 0 4px 20px rgba(0,0,0,0.3); }
.theme-toggle:hover { background: var(--hz-glow-xs); transform: scale(1.1); }
.rtl-layout { direction: rtl; text-align: right; }
.rtl-layout .back-to-top, .rtl-layout .theme-toggle { right: auto; left: 20px; }
@media (max-width: 768px) { .main-content { margin-top: 60px; min-height: calc(100vh - 60px); } .back-to-top, .theme-toggle { width: 45px; height: 45px; } .theme-toggle { top: 80px; right: 15px; } .back-to-top { bottom: 15px; right: 15px; } .rtl-layout .back-to-top, .rtl-layout .theme-toggle { right: auto; left: 15px; } }
@media print { .skip-to-content, .back-to-top, .theme-toggle { display: none !important; } .main-content { margin-top: 0; } }

/* ══ GLOBAL FONT AWESOME FIX ══ */
i.fas, i.far, i.fab, i.fa, span.fas, span.far, span.fab, span.fa,
.fas, .far, .fab, .fa, [class^="fa-"], [class*=" fa-"],
.fa:before, .fas:before, .far:before, .fab:before,
[class^="fa-"]:before, [class*=" fa-"]:before,
html body * .fas, html body * .far, html body * .fab, html body * .fa,
html body * [class^="fa-"], html body * [class*=" fa-"],
html body * i[class^="fa"], html body * i[class*=" fa"],
html * .fas:before, html * .far:before, html * .fab:before, html * .fa:before,
html * [class^="fa-"]:before, html * [class*=" fa-"]:before {
    font-family: "Font Awesome 6 Free","Font Awesome 6 Pro","Font Awesome 6 Brands","Font Awesome 5 Free","Font Awesome 5 Pro","FontAwesome" !important;
    font-style: normal !important; font-variant: normal !important; text-rendering: auto !important;
    -webkit-font-smoothing: antialiased !important; speak: none !important;
    display: inline-block !important; text-transform: none !important; line-height: 1 !important;
    font-weight: 900 !important;
}
html * .far, html * .far:before, html * .fa-regular:before { font-weight: 400 !important; }
html * .fab, html * .fab:before, html * .fa-brands:before { font-weight: 400 !important; }
html * .fas, html * .fas:before, html * .fa-solid:before { font-weight: 900 !important; }
html * .fal, html * .fal:before, html * .fa-light:before { font-weight: 300 !important; }