/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

:root { --ink: #f5f7fb; --muted: #9ca8ba; --panel: #131d2e; --line: #26344a; }
body { min-height: 100vh; color: var(--ink); background: #0b1220; background-image: radial-gradient(circle at 80% -10%, #1b3b55 0, transparent 38%); }
.monitor-nav { background: rgba(11, 18, 32, .75); border-bottom: 1px solid rgba(73, 100, 134, .35); backdrop-filter: blur(14px); }
.monitor-nav .nav-link { color: #9ca8ba; }.monitor-nav .nav-link:hover { color: #f5f7fb; }
.eyebrow { color: #7dd3fc; font-size: .72rem; font-weight: 700; letter-spacing: .16em; }
.text-secondary { color: var(--muted) !important; }
.stock-card { background: rgba(19, 29, 46, .88); border: 1px solid var(--line); border-radius: 1rem; box-shadow: 0 1rem 3rem rgba(0,0,0,.16); transition: transform .2s, border-color .2s; }
.stock-card:hover { transform: translateY(-3px); border-color: #496486; }
.ticker { font-size: 1.45rem; font-weight: 800; letter-spacing: .04em; }
.company-name, .updated, .buy-levels span, .score-row span { color: var(--muted); font-size: .82rem; }
.price { font-size: 2.45rem; font-weight: 700; letter-spacing: -.05em; }
.daily { font-size: .9rem; font-weight: 700; padding-bottom: .38rem; }.positive { color: #6ee7b7; }.negative { color: #fda4af; }
.status-pill { border: 1px solid var(--line); border-radius: 2rem; color: #d8e1ee; font-size: .68rem; font-weight: 700; padding: .35rem .6rem; letter-spacing: .08em; }
.status-dot, .signal-dot { display: inline-block; width: .48rem; height: .48rem; margin-right: .3rem; border-radius: 50%; background: #6ee7b7; box-shadow: 0 0 0 .2rem rgba(110,231,183,.1); }
.yellow .status-dot { background: #fcd34d; }.red .status-dot { background: #fb7185; }.critical .status-dot { background: #ef4444; }
.score-row { display: flex; justify-content: space-between; margin-bottom: .45rem; }.score-row strong { font-size: .9rem; }.score-row small { color: var(--muted); font-weight: 400; }
.progress { height: .35rem; background: #243249; }.progress-bar { background: linear-gradient(90deg, #38bdf8, #6ee7b7); }.red .progress-bar, .critical .progress-bar { background: linear-gradient(90deg, #fb7185, #f97316); }
.buy-levels { border-top: 1px solid var(--line); padding-top: 1rem; }.buy-levels span { display: block; font-size: .65rem; letter-spacing: .13em; margin-bottom: .35rem; }.buy-levels strong { font-size: .92rem; color: #dce7f6; }
.updated { border-top: 1px solid var(--line); margin-top: 1rem; padding-top: .85rem; }
.filter-links { display: flex; flex-wrap: wrap; gap: .4rem; }.filter-link { border: 1px solid var(--line); border-radius: 2rem; color: var(--muted); font-size: .76rem; padding: .42rem .72rem; text-decoration: none; }.filter-link:hover, .filter-link.active { background: #1e3850; color: #e4f4ff; border-color: #38799b; }
.news-list { display: grid; gap: .85rem; max-width: 960px; }.news-card, .empty-state { background: rgba(19, 29, 46, .88); border: 1px solid var(--line); border-radius: 1rem; }.news-card { transition: border-color .2s, transform .2s; }.news-card:hover { border-color: #496486; transform: translateX(2px); }.news-ticker { color: #7dd3fc; font-size: .75rem; font-weight: 800; letter-spacing: .1em; }.news-source, .news-date { color: var(--muted); font-size: .78rem; }.news-source { border-left: 1px solid var(--line); padding-left: .55rem; }.news-description { color: #aab7c9; line-height: 1.6; max-width: 780px; }.article-link { color: #7dd3fc; font-size: .85rem; font-weight: 600; text-decoration: none; }.article-link:hover { color: #bae6fd; }.news-severity { border-radius: 2rem; font-size: .62rem; font-weight: 800; padding: .25rem .5rem; letter-spacing: .08em; }.news-severity.yellow { background: rgba(252, 211, 77, .12); color: #fcd34d; }.news-severity.red, .news-severity.critical { background: rgba(251, 113, 133, .12); color: #fb7185; }.empty-state { max-width: 680px; margin: 3rem auto; }
.auth-shell { min-height: calc(100vh - 62px); display: grid; place-items: center; padding: 2rem 1rem; }.auth-card { width: min(100%, 420px); padding: 2.5rem; background: rgba(19, 29, 46, .9); border: 1px solid var(--line); border-radius: 1rem; box-shadow: 0 1rem 3rem rgba(0,0,0,.22); }.auth-card h1 { font-weight: 700; margin: .5rem 0; }.auth-card .form-label { color: #cbd5e1; }.auth-card .form-control { background: #0b1220; border-color: var(--line); color: var(--ink); }.auth-card .form-control:focus { background: #0b1220; color: var(--ink); border-color: #38bdf8; box-shadow: 0 0 0 .2rem rgba(56,189,248,.15); }.monitor-nav form { margin: 0; }.monitor-nav .btn-link { border: 0; }
.portfolio-panel { background: rgba(19, 29, 46, .88); border: 1px solid var(--line); border-radius: 1rem; }.portfolio-total { display: flex; flex-direction: column; align-items: flex-end; }.portfolio-total strong { font-size: 1.65rem; }.portfolio-total span { font-size: .85rem; }.portfolio-stat { border: 1px solid var(--line); border-radius: .7rem; padding: .8rem 1rem; }.portfolio-stat span { display: block; color: var(--muted); font-size: .75rem; }.portfolio-stat strong { font-size: 1.1rem; }.portfolio-table { --bs-table-bg: transparent; --bs-table-color: var(--ink); }.portfolio-table th { color: var(--muted); font-size: .72rem; font-weight: 500; text-transform: uppercase; letter-spacing: .06em; }.portfolio-panel .form-control, .portfolio-panel .form-select { background: #0b1220; border-color: var(--line); color: var(--ink); }
.watchlist-chip { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 2rem; color: #dce7f6; padding: .25rem .55rem .25rem .75rem; font-size: .82rem; }
.event-list { display: grid; gap: .85rem; }.event-card { background: rgba(19, 29, 46, .88); border: 1px solid var(--line); border-radius: 1rem; }.event-card:hover { border-color: #496486; }.event-type { color: #c4b5fd; background: rgba(167, 139, 250, .1); border-radius: 2rem; font-size: .65rem; font-weight: 700; letter-spacing: .06em; padding: .28rem .5rem; text-transform: uppercase; }.event-card form { margin: 0; }
.event-timeline { display: grid; gap: 1.25rem; }.event-day { display: grid; grid-template-columns: 3.75rem 1fr; gap: 1rem; position: relative; }.event-day::before { content: ""; position: absolute; top: 3.7rem; bottom: -1.25rem; left: 1.82rem; border-left: 1px solid #31506c; }.event-day:last-child::before { display: none; }.event-day-marker { display: flex; width: 3.75rem; height: 4.2rem; padding: .35rem; flex-direction: column; align-items: center; justify-content: center; background: #172b40; border: 1px solid #3c7195; border-radius: .8rem; color: #bae6fd; line-height: 1; position: relative; z-index: 1; }.event-day-marker span, .event-day-marker small { font-size: .55rem; font-weight: 800; letter-spacing: .08em; }.event-day-marker strong { color: #fff; font-size: 1.45rem; margin: .18rem 0; }.event-day-items { display: grid; gap: .65rem; min-width: 0; }.event-day-items .event-card { border-radius: .8rem; padding: 1rem !important; }
.event-timeline { gap: 1.5rem; padding: .35rem; background: rgba(19, 29, 46, .55); border: 1px solid var(--line); border-radius: 1.15rem; }.event-day { display: block; }.event-day::before { display: none; }.event-day-marker { width: auto; height: auto; padding: .85rem .9rem .55rem; flex-direction: row; justify-content: flex-start; gap: .45rem; background: transparent; border: 0; border-radius: 0; color: var(--muted); }.event-day-marker span { order: 2; font-size: .68rem; }.event-day-marker strong { order: 1; color: #f5f7fb; font-size: 1.25rem; margin: 0; }.event-day-marker small { order: 3; font-size: .68rem; }.event-day-items { gap: 0; padding: 0 .35rem; }.event-day-items .event-card { padding: .85rem !important; background: rgba(11, 18, 32, .52); border: 0; border-top: 1px solid rgba(73, 100, 134, .35); border-radius: 0; }.event-row { display: flex; align-items: center; gap: .75rem; min-width: 0; }.event-icon { display: grid; flex: 0 0 2.25rem; width: 2.25rem; height: 2.25rem; place-items: center; border-radius: .7rem; background: rgba(56, 189, 248, .14); color: #7dd3fc; font-size: 1.15rem; font-weight: 800; }.event-icon.macro { background: rgba(167, 139, 250, .14); color: #c4b5fd; }.event-copy { display: grid; flex: 1; gap: .25rem; min-width: 0; }.event-copy h3 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.event-date { flex: 0 0 auto; min-width: 5.5rem; padding: 0; align-items: flex-end; background: transparent; border: 0; }.event-date span { color: var(--muted); font-size: .7rem; }.event-date strong { color: #f5f7fb; font-size: .82rem; }.event-details, .event-result { margin: .7rem 0 0 3rem; }.event-source-link { margin-left: 3rem; font-size: .75rem; }
.event-tabs { display: flex; gap: .35rem; border-bottom: 1px solid var(--line); }.event-tab { border-bottom: 2px solid transparent; color: var(--muted); font-weight: 700; padding: .7rem 1rem; text-decoration: none; }.event-tab:hover, .event-tab.active { border-bottom-color: #38bdf8; color: #e4f4ff; }
.event-date { display: flex; min-width: 8.75rem; padding: .4rem .7rem; flex-direction: column; align-items: flex-end; background: rgba(56, 189, 248, .09); border: 1px solid rgba(56, 189, 248, .28); border-radius: .65rem; color: #bae6fd; line-height: 1.2; }.event-date span { font-size: .76rem; font-weight: 700; }.event-date strong { color: #f5f7fb; font-size: 1rem; letter-spacing: .01em; }
.news-severity.positive { background: rgba(110, 231, 183, .12); color: #6ee7b7; }.news-severity.negative { background: rgba(251, 113, 133, .12); color: #fb7185; }.news-severity.mixed { background: rgba(252, 211, 77, .12); color: #fcd34d; }

/* Responsive navigation. The mobile bar stays within thumb reach. */
.monitor-nav-header { display: flex; align-items: center; justify-content: space-between; }
.monitor-nav-links { margin-left: auto; flex-direction: row; align-items: center; gap: 1rem; }
.mobile-bottom-nav { display: none; }

@media (max-width: 1199.98px) {
  .monitor-nav .container { padding-top: .35rem; padding-bottom: .35rem; }
  .monitor-nav-links { display: none; }
  body > main { padding-bottom: 5.75rem !important; }
  .mobile-bottom-nav { display: block; position: fixed !important; top: auto !important; right: 0 !important; bottom: 0 !important; left: 0 !important; z-index: 1030; padding: .45rem .75rem calc(.45rem + env(safe-area-inset-bottom)); background: rgba(11, 18, 32, .94); border-top: 1px solid rgba(73, 100, 134, .5); backdrop-filter: blur(16px); }
  .mobile-bottom-nav-inner { display: grid; grid-template-columns: repeat(5, 1fr); max-width: 560px; margin: 0 auto; }
  .mobile-nav-link { display: flex; min-height: 3.15rem; padding: .25rem .15rem; flex-direction: column; align-items: center; justify-content: center; gap: .15rem; color: var(--muted); font-size: .68rem; font-weight: 600; text-decoration: none; }
  .mobile-nav-link:hover, .mobile-nav-link:focus-visible { color: #f5f7fb; }
  .mobile-nav-icon { height: 1.25rem; color: #7dd3fc; font-size: 1.15rem; line-height: 1.1; }
  .mobile-more { position: relative; }
  .mobile-more summary { list-style: none; cursor: pointer; }
  .mobile-more summary::-webkit-details-marker { display: none; }
  .mobile-more summary:focus-visible { outline: 2px solid #38bdf8; outline-offset: -2px; border-radius: .5rem; }
  .mobile-more-menu { position: absolute; right: .25rem; bottom: calc(100% + .5rem); min-width: 12rem; padding: .4rem; background: #131d2e; border: 1px solid var(--line); border-radius: .75rem; box-shadow: 0 .75rem 2rem rgba(0, 0, 0, .35); }
  .mobile-more-menu .nav-link { display: block; width: 100%; padding: .7rem .75rem; color: #dce7f6; text-align: left; text-decoration: none; }
  .mobile-more-menu .nav-link:hover, .mobile-more-menu .nav-link:focus-visible { background: #1e3850; color: #fff; }
  .mobile-more-menu form { margin: 0; }
  .mobile-more-menu .btn-link { border: 0; }
  .responsive-page-header { flex-direction: column; }
  .responsive-page-header > .btn { align-self: stretch; }
}

@media (max-width: 575.98px) {
  .container { --bs-gutter-x: 1.25rem; }
  main.container { padding-top: 1.25rem !important; padding-bottom: 5.75rem !important; }
  .display-6 { font-size: 2rem; }
  .stock-card, .portfolio-panel, .news-card { border-radius: .8rem; }
  .stock-card, .portfolio-panel, .news-card { padding: 1rem !important; }
  .stock-card .d-flex.align-items-end { align-items: flex-start !important; flex-direction: column; gap: .15rem !important; }
  .price { font-size: 2.15rem; }
  .portfolio-total { align-items: flex-start; }
  .news-card .news-date { width: 100%; margin-left: 0 !important; }
  .news-source { max-width: 100%; overflow-wrap: anywhere; }
  .filter-links { gap: .35rem; }
  .filter-link { padding: .5rem .65rem; }
  .auth-card { padding: 1.5rem; }
  .portfolio-table { min-width: 680px; }
  .table-responsive { margin-right: -.25rem; }
  .portfolio-panel .btn, form > .btn { min-height: 2.75rem; }
}
