/* big_calls/assets/app.css — Dark theme timeline styles
   Place this file at: assets/big_calls/app.css
   Dash auto-loads CSS from subdirs of assets/ */

#timeline-scroll-container {
    scrollbar-width: auto;
    -ms-overflow-style: auto;
}

#timeline-scroll-container::-webkit-scrollbar {
    display: block;
    height: 10px;
}

#timeline-scroll-container::-webkit-scrollbar-thumb {
    background: #2f3745;
    border-radius: 999px;
}

#timeline-scroll-container::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.03);
}

#country-filter .Select-control {
    background-color: #1c2026 !important;
    border: 1px solid #3a4150 !important;
    border-radius: 6px !important;
    color: #fff !important;
    min-height: 34px !important;
}

#country-filter .Select-menu-outer,
#country-filter .Select-menu {
    z-index: 4000 !important;
}

/* ── Card hover / open states ─────────────────────────────────────── */

.timeline-card {
    transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.timeline-card:hover {
    transform: translateY(-4px);
    box-shadow:
        0 14px 40px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(255, 255, 255, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.timeline-card:hover .card-read-more {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

.timeline-card-top[open] {
    margin-top: 0 !important;
}

/* ── Summary link styling inside dark cards ────────────────────────── */

.timeline-card a {
    color: #6ea8fe;
    text-decoration: none;
    font-weight: 600;
}

.timeline-card a:hover {
    text-decoration: underline;
    color: #93c5fd;
}

/* ── Markdown inside cards ─────────────────────────────────────────── */

.timeline-card p {
    margin: 0 0 6px 0;
}

.timeline-card b,
.timeline-card strong {
    color: #e8ecf4;
    font-weight: 700;
}

/* ── Category chip hover ───────────────────────────────────────────── */

.category-chip:hover {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}
