/* ============================================================
   SeasonHunter — Global Stylesheet
   Brand palette: Signal Green #4ade80 / Amber #f59e0b / Deep Black #08090d
   ============================================================ */

/* ── Sortable table headers (shared by Screener and Deep Dive) ── */
.sort-icon        { margin-left: 0.3rem; font-size: 0.7rem; opacity: 0.4; }
.sort-icon.active { opacity: 1; color: #4ade80; }

/* ── Brand tokens ── */
:root {
    /* Primary */
    --sh-green:       #4ade80;
    --sh-green-dark:  #22c55e;
    --sh-amber:       #f59e0b;
    --sh-amber-dark:  #d97706;
    --sh-black:       #08090d;
    --sh-off-white:   #eceaf3;

    /* Surfaces */
    --sh-surface1:    #0e0f14;
    --sh-surface2:    #12131a;
    --sh-border:      #1a1c26;

    /* Text */
    --sh-muted:       #3a3f55;
    --sh-text-dim:    #9094a8;

    /* Signal extras */
    --sh-blue:        #60a5fa;
    --sh-orange:      #f97316;
    --sh-red:         #f87171;
    --sh-purple:      #a78bfa;

    /* Legacy aliases kept for compatibility */
    --primary-color:   var(--sh-green);
    --secondary-color: var(--sh-amber);
    --success-color:   #28a745;
    --danger-color:    #dc3545;
    --warning-color:   var(--sh-amber);
    --info-color:      var(--sh-blue);
}

/* ── Base ── */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f8f9fa;
}

/* ── Flash messages ── */
.flash-messages {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
    max-width: 400px;
}

.flash-messages .alert {
    margin-bottom: 10px;
    animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
    from { transform: translateX(100%); opacity: 0; }
    to   { transform: translateX(0);    opacity: 1; }
}

/* ── Dashboard cards ── */
.dashboard-card {
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.dashboard-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

/* ── Tables ── */
.table-hover tbody tr:hover {
    background-color: #f1f3f5;
    cursor: pointer;
}

tr:hover    { background-color: #e7f3ff !important; }
tr.selected {
    background-color: #cfe2ff !important;
    font-weight: 500;
    border: 2px solid #4777c0;
}

/* ── Loading spinner ── */
.spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 3px solid rgba(0, 0, 0, 0.1);
    border-top-color: var(--sh-green);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

/* ── Responsive ── */
@media (max-width: 768px) {
    .flash-messages {
        right: 10px;
        left: 10px;
        max-width: none;
    }
}