/* Investor portal - small layer on top of Bootswatch Yeti. Light theme only. */

:root,
html {
    color-scheme: light only;
}

body.app-body {
    background: #f6f7f9;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.app-main { flex: 1 0 auto; }
.app-footer { background: #fff; }

/* Yeti's "secondary" is a very light grey - make grey badges readable */
.badge.bg-secondary { background-color: #6c757d !important; color: #fff; }

/* soft badges for transaction types */
.badge[class*="badge-soft-"] { font-weight: 600; padding: .45em .65em; }
.badge-soft-success   { background: #e3f4ea; color: #2c7a4b; }
.badge-soft-danger    { background: #fdebe7; color: #b8280f; }
.badge-soft-warning   { background: #fdf1dc; color: #9a5f00; }
.badge-soft-info      { background: #e2f3f9; color: #1f7a96; }
.badge-soft-primary   { background: #dff2f8; color: #00698a; }
.badge-soft-secondary { background: #ececec; color: #555; }

/* cards */
.card { border-color: #e3e6ea; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.card-header { background: #fff; font-weight: 600; }
.card-header .bi { color: #008cba; }

/* KPI tiles */
.kpi { height: 100%; }
.kpi .kpi-label { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: #6c757d; }
.kpi .kpi-value { font-size: 1.55rem; font-weight: 600; line-height: 1.2; }
.kpi .kpi-sub { font-size: .8rem; }
.kpi-icon { font-size: 1.6rem; opacity: .85; }

/* tables */
.table > :not(caption) > * > * { vertical-align: middle; }
.table thead th { white-space: nowrap; font-size: .82rem; text-transform: uppercase; letter-spacing: .03em; color: #555; background: #fafbfc; }
.num, .table td.num, .table th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.table tfoot td, .table tfoot th { font-weight: 600; background: #fafbfc; }
.table-hover > tbody > tr:hover > * { background-color: #f1f9fc; }
div.dt-container .dt-search input,
div.dt-container .dt-length select { border-radius: 4px; }
div.dt-container { padding-top: .25rem; }
div.dt-container .row.mt-2 { margin-top: .75rem !important; }
table.dataTable > tbody > tr { cursor: default; }
table.dataTable td { font-size: .92rem; }

/* forms */
.form-label { font-weight: 600; font-size: .9rem; margin-bottom: .25rem; }
.form-label.required::after { content: " *"; color: #f04124; }
.form-text { font-size: .8rem; }
.form-section-title { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: #6c757d; font-weight: 700; margin: 1.25rem 0 .75rem; }
.input-group-text { background: #f6f7f9; }

/* navbar */
.app-navbar .navbar-brand { letter-spacing: .01em; }
.app-navbar .dropdown-menu { border-color: #e3e6ea; box-shadow: 0 6px 18px rgba(0, 0, 0, .12); }

/* White dropdown menus (Yeti paints them blue inside a .bg-primary navbar) */
.navbar.app-navbar .dropdown-menu { background-color: #fff; color: #333; }
.navbar.app-navbar .dropdown-menu .dropdown-item,
.navbar.app-navbar .dropdown-menu .dropdown-item:focus { color: #333; background-color: transparent; }
.navbar.app-navbar .dropdown-menu .dropdown-item:hover,
.navbar.app-navbar .dropdown-menu .dropdown-item.active { color: #008cba; background-color: #eef8fc; }
.navbar.app-navbar .dropdown-menu .dropdown-item .bi { color: #008cba; }
.navbar.app-navbar .dropdown-menu .dropdown-divider { border-top-color: #e3e6ea; }
.navbar.app-navbar .dropdown-menu .dropdown-header { color: #6c757d; }

.notif-menu { width: 340px; max-width: 92vw; }
.notif-unread { background: #eef8fc; }
.market-dot { font-size: .55rem; vertical-align: middle; }
.market-regular { color: #7ee2a0; }
.market-pre, .market-post { color: #ffd37a; }
.market-closed { color: #ff9b8b; }

/* login */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1.5rem; background: linear-gradient(160deg, #e9f6fb 0%, #f6f7f9 55%); }
.login-card { width: 100%; max-width: 430px; }
.login-brand { font-size: 1.35rem; font-weight: 600; color: #008cba; }

/* stocks */
.stock-logo { width: 32px; height: 32px; object-fit: contain; border-radius: 6px; background: #fff; border: 1px solid #e3e6ea; }
.stock-logo-lg { width: 56px; height: 56px; }
.stock-logo-ph { width: 32px; height: 32px; border-radius: 6px; background: #e9f6fb; color: #008cba; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .8rem; }
.price-big { font-size: 2.2rem; font-weight: 600; line-height: 1; }
.flash-up { animation: flashUp 1.2s ease-out; }
.flash-down { animation: flashDown 1.2s ease-out; }
@keyframes flashUp { from { background: #cdeed9; } to { background: transparent; } }
@keyframes flashDown { from { background: #fbd5cd; } to { background: transparent; } }
.range-bar { position: relative; height: 6px; background: #e3e6ea; border-radius: 3px; min-width: 90px; }
.range-bar > span { position: absolute; top: -3px; width: 4px; height: 12px; background: #008cba; border-radius: 2px; }

/* journal lines */
.journal-table input, .journal-table select { min-width: 90px; }
.journal-table .col-acct { min-width: 260px; }

/* misc */
.text-mono { font-family: SFMono-Regular, Menlo, Consolas, monospace; font-size: .85em; }
.diff-old { background: #fdebe7; }
.diff-new { background: #e3f4ea; }
pre.json { background: #f6f7f9; border: 1px solid #e3e6ea; border-radius: 4px; padding: .6rem .8rem; max-height: 260px; overflow: auto; font-size: .8rem; white-space: pre-wrap; word-break: break-all; }
.empty-state { text-align: center; padding: 2.5rem 1rem; color: #6c757d; }
.empty-state .bi { font-size: 2.4rem; color: #b8c2cc; }
.clickable { cursor: pointer; }

@media (max-width: 575.98px) {
    .kpi .kpi-value { font-size: 1.25rem; }
    .page-actions { width: 100%; }
}

/* print */
@media print {
    .app-navbar, .app-footer, .no-print, .page-actions, .btn, .dt-search, .dt-length, .dt-paging, .dt-info { display: none !important; }
    body.app-body { background: #fff; }
    .card { box-shadow: none; border: 1px solid #ccc; }
    .container-xxl { max-width: 100% !important; }
    a { color: inherit; text-decoration: none; }
}

/* Wide tables scroll inside their card instead of spilling out (DataTables 2 container) */
.dt-container { overflow-x: auto; }