/* ========================================
   STOCK ANALYSIS DASHBOARD - MODULAR CSS (CLEAN)
   ======================================== */

/* BASE */
.stock-dashboard {
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    min-height: 100vh;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    line-height: 1.6;
    color: var(--text-primary);
    padding: var(--spacing-md);
}

/* LAYOUT */
.stock-dashboard__container { 
    max-width: 1400px; 
    margin: 0 auto; 
    padding: var(--spacing-lg);
    background: rgba(255, 255, 255, 0.7);
    border-radius: var(--radius-2xl);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}
.stock-dashboard__header { 
    text-align: center; 
    margin-bottom: var(--spacing-xl); 
    padding: var(--spacing-xl);
    background: var(--bg-card);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-md);
    border: 1px solid var(--border-light);
    position: relative;
    overflow: hidden;
}
.stock-dashboard__header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--bg-gradient);
    opacity: 0.05;
    z-index: -1;
}
.stock-dashboard__title { 
    font-size: var(--font-size-xxl); 
    font-weight: 700; 
    color: var(--text-primary); 
    margin-bottom: var(--spacing-sm);
    background: var(--bg-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.stock-dashboard__subtitle { 
    font-size: var(--font-size-base); 
    color: var(--text-secondary); 
}

/* FILTER WRAPPER (indhold/styring ligger i komponent-CSS) */
.stock-dashboard__filter-section {
    background: var(--bg-card);
    border-radius: var(--radius-xl);
    margin-bottom: var(--spacing-xl);
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--border-light);
    overflow: visible;
    transition: all var(--transition-normal);
}
.stock-dashboard__filter-section:hover {
    box-shadow: var(--shadow-xl);
    transform: translateY(-2px);
}
.stock-dashboard__filter-header {
    background: var(--bg-gradient);
    color: var(--text-light);
    padding: var(--spacing-lg);
    cursor: pointer;
    transition: background var(--transition-normal);
    user-select: none;
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
}
.stock-dashboard__filter-header:hover { 
    background: var(--bg-gradient-hover); 
    transform: translateY(-1px);
}
.stock-dashboard__filter-title { 
    margin: 0; 
    font-size: var(--font-size-lg); 
    font-weight: 600; 
    display: flex; 
    align-items: center; 
    gap: var(--spacing-sm); 
}
.stock-dashboard__filter-content { 
    max-height: 0; 
    overflow: hidden; 
    transition: max-height var(--transition-slow), padding var(--transition-normal); 
    padding: 0 var(--spacing-xl); 
}
.stock-dashboard__filter-section--expanded .stock-dashboard__filter-content { 
    max-height: 9999px; 
    overflow: hidden; 
    padding: var(--spacing-xl); 
}

/* THRESHOLD CARDS (kun ydre kort; felter/grid ligger i komponent) */
.stock-dashboard__threshold-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem; margin-bottom: 2rem;
}
.stock-dashboard__threshold-card {
    background: var(--bg-card); border-radius: var(--radius-lg); padding: 1.5rem;
    box-shadow: var(--shadow-md); border: 1px solid var(--border-light);
    transition: all var(--transition-normal);
}
.stock-dashboard__threshold-card:hover {
    background: var(--bg-card-hover);
    box-shadow: var(--shadow-lg);
    transform: translateY(-2px);
}
.stock-dashboard__threshold-title { margin: 0 0 1rem; color: var(--text-primary); font-size: 1.1rem; font-weight: 600; }

/* RESULTS */
.stock-dashboard__results {
    background: var(--bg-card);
    border-radius: var(--radius-xl);
    padding: var(--spacing-xl);
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--border-light);
    overflow-x: auto;
    transition: all var(--transition-normal);
}
.stock-dashboard__results:hover {
    box-shadow: var(--shadow-xl);
}
.stock-dashboard__table { 
    width: 100%; 
    border-collapse: collapse; 
    margin-bottom: 0; 
}
.stock-dashboard__table-header { 
    background: var(--table-header-bg); 
    color: var(--text-light); 
}
.stock-dashboard__table-header th {
    padding: var(--spacing-lg); 
    text-align: left; 
    font-weight: 600;
    text-transform: uppercase; 
    letter-spacing: .5px; 
    border: none;
}
.stock-dashboard__table-body tr { 
    border-bottom: 1px solid var(--border-light); 
    transition: background-color var(--transition-normal); 
}
.stock-dashboard__table-body tr:hover { 
    background-color: var(--table-row-hover); 
}
.stock-dashboard__table-body td { 
    padding: var(--spacing-lg); 
    vertical-align: middle; 
    border: none; 
    position: relative;
    min-height: 60px;
}

/* VALUE INDICATORS */
.stock-dashboard__value { 
    display: flex; 
    align-items: center; 
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: var(--spacing-sm);
    border-radius: var(--radius-sm);
    font-weight: 600;
    transition: all var(--transition-normal);
}
.stock-dashboard__value--good { 
    background: #10b981 !important; 
    color: white !important;
    box-shadow: var(--shadow-sm);
}
.stock-dashboard__value--good:hover {
    background: var(--accent-dark);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}
.stock-dashboard__value--bad { 
    background: #ef4444 !important; 
    color: white !important;
    box-shadow: var(--shadow-sm);
}
.stock-dashboard__value--bad:hover {
    background: #dc2626;
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}
.stock-dashboard__value--neutral { 
    background: #f1f5f9 !important; 
    color: #475569 !important;
    box-shadow: var(--shadow-sm);
}
.stock-dashboard__value--neutral:hover {
    background: var(--bg-tertiary);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}
.stock-dashboard__value-badge { 
    font-size: var(--font-size-xs); 
    padding: var(--spacing-xs) var(--spacing-sm); 
    border-radius: var(--radius-sm); 
    font-weight: 600; 
}
.stock-dashboard__value-badge--good { 
    background: var(--accent-color); 
    color: var(--text-light); 
}
.stock-dashboard__value-badge--bad { 
    background: var(--danger-color); 
    color: var(--text-light); 
}

/* ALERTS */
.stock-dashboard__alert { 
    border-radius: var(--radius-md); 
    padding: var(--spacing-lg); 
    margin-bottom: var(--spacing-lg); 
    border: none; 
    font-weight: 500;
    box-shadow: var(--shadow-sm);
}
.stock-dashboard__alert--danger { 
    background: rgba(239, 68, 68, 0.1); 
    color: #991b1b; 
    border-left: 4px solid var(--danger-color); 
}
.stock-dashboard__alert--info { 
    background: rgba(6, 182, 212, 0.1); 
    color: #0e7490; 
    border-left: 4px solid var(--info-color); 
}

/* ANIMATIONS (bruges af filter content) */
@keyframes slideDown { from { opacity:0; transform: translateY(-20px);} to { opacity:1; transform: none; } }
.stock-dashboard__filter-content { animation: slideDown .3s ease; }

/* RANKINGS */
.stock-dashboard__results-header { 
    display:flex; 
    justify-content:space-between; 
    align-items:center; 
    margin-bottom: var(--spacing-md); 
    flex-wrap: wrap; 
    gap: var(--spacing-sm); 
}
.stock-dashboard__ranking-controls { 
    display:flex; 
    gap: var(--spacing-sm); 
    align-items:center; 
}
.stock-dashboard__rankings-section { 
    margin-top: var(--spacing-xl); 
    padding: var(--spacing-lg); 
    background: var(--bg-card); 
    border-radius: var(--radius-lg); 
    box-shadow: var(--shadow-md);
    border: 1px solid var(--border-light);
    transition: all var(--transition-normal);
}
.stock-dashboard__rankings-section:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-1px);
}
.stock-dashboard__rankings-title { 
    color: var(--text-primary); 
    font-size: var(--font-size-lg); 
    font-weight: 700; 
    margin: 0; 
}
.stock-dashboard__rankings-subtitle { 
    color: var(--text-secondary); 
    margin-bottom: var(--spacing-md); 
    font-size: var(--font-size-sm); 
}
.stock-dashboard__rankings-table { 
    width:100%; 
    border-collapse: collapse; 
    background: var(--bg-card); 
    border-radius: var(--radius-md); 
    overflow:hidden; 
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-light);
}
.stock-dashboard__table-responsive { overflow-x:auto; }
.stock-dashboard__rankings-table th, .stock-dashboard__rankings-table td { 
    padding: var(--spacing-sm) var(--spacing-md); 
    text-align:left; 
    border-bottom: 1px solid var(--border-light); 
}
.stock-dashboard__rankings-table th { 
    background: var(--table-header-bg); 
    color: var(--text-light); 
    font-weight:700; 
    font-size: var(--font-size-sm); 
}
.stock-dashboard__rankings-table tbody tr:hover { 
    background: var(--table-row-hover); 
    transition: background-color var(--transition-normal);
}
.stock-dashboard__ranking--top { 
    background: rgba(16, 185, 129, 0.08) !important; 
    border-left: 4px solid var(--accent-color);
    border-radius: var(--radius-sm);
}
.stock-dashboard__ranking-position { 
    text-align:center; 
    font-weight:700; 
    width: 72px; 
    color: var(--text-primary);
}
.stock-dashboard__ranking-number { 
    display:inline-block; 
    width:2rem; 
    height:2rem; 
    line-height:2rem; 
    text-align:center; 
    border-radius:50%; 
    background: var(--primary-color); 
    color:#fff; 
    font-size: var(--font-size-sm); 
    font-weight:700;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-normal);
}
.stock-dashboard__ranking-number:hover {
    transform: scale(1.1);
    box-shadow: var(--shadow-md);
}
.stock-dashboard__ranking--top .stock-dashboard__ranking-number { background: var(--accent-color); }
.stock-dashboard__ranking-score { 
    font-weight:700; 
    color: var(--text-primary); 
    text-align:center; 
    min-width: 6rem; 
    padding: var(--spacing-xs) var(--spacing-sm);
    background: var(--bg-tertiary);
    border-radius: var(--radius-sm);
}
.stock-dashboard__ranking-metric { 
    text-align:center; 
    min-width: 8rem; 
    padding: var(--spacing-sm);
    background: var(--bg-tertiary);
    border-radius: var(--radius-sm);
    margin: var(--spacing-xs);
}
.stock-dashboard__ranking-metric-value { 
    font-weight:600; 
    margin-bottom: var(--spacing-xs); 
    color: var(--text-primary);
}
.stock-dashboard__ranking-metric-rank { 
    font-size: var(--font-size-xs); 
    color: var(--text-secondary); 
    background: var(--bg-primary); 
    padding: 2px 6px; 
    border-radius: var(--radius-sm); 
    display:inline-block; 
}
.stock-dashboard__rankings-note { 
    margin-top: var(--spacing-md); 
    text-align:center; 
    color: var(--text-secondary); 
    font-size: var(--font-size-sm); 
}
.stock-dashboard__industry-averages { 
    margin-bottom: var(--spacing-lg); 
    padding: var(--spacing-md); 
    background: var(--bg-card); 
    border-radius: var(--radius-md); 
    border: 1px solid var(--border-light);
    box-shadow: var(--shadow-sm);
}
.stock-dashboard__industry-averages h5 { 
    color: var(--text-primary); 
    margin-bottom: var(--spacing-sm); 
    font-size: var(--font-size-lg); 
    font-weight:700; 
}
.stock-dashboard__averages-grid { 
    display:grid; 
    grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); 
    gap: var(--spacing-sm); 
}
.stock-dashboard__average-item { 
    display:flex; 
    justify-content:space-between; 
    align-items:center; 
    padding: var(--spacing-xs) var(--spacing-sm); 
    background: var(--bg-tertiary); 
    border-radius: var(--radius-sm); 
    border: 1px solid var(--border-light);
    transition: all var(--transition-normal);
}
.stock-dashboard__average-item:hover {
    background: var(--bg-card);
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}
.stock-dashboard__average-label { 
    font-size: var(--font-size-sm); 
    color: var(--text-secondary); 
    font-weight:600; 
}
.stock-dashboard__average-value { 
    font-weight:700; 
    color: var(--text-primary); 
    font-size: var(--font-size-sm); 
}

/* Sticky kolonner for Rang + Ticker */
.rank-sticky-1 { 
    position: sticky; 
    left: 0; 
    background: var(--bg-card); 
    z-index: 2; 
    box-shadow: 2px 0 4px rgba(0, 0, 0, 0.1);
}
.rank-sticky-2 { 
    position: sticky; 
    left: 90px; 
    background: var(--bg-card); 
    z-index: 2; 
    box-shadow: 2px 0 4px rgba(0, 0, 0, 0.1);
}

/* Ekstra styling for bedre visning */
.stock-dashboard__rankings-table thead th {
    position: sticky; 
    top: 0; 
    z-index: 1; /* Fast header ved horisontal scroll */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* UTILITIES */
.stock-dashboard__text-center { text-align:center; }
.stock-dashboard__text-left { text-align:left; }
.stock-dashboard__text-right { text-align:right; }
.stock-dashboard__mb-0 { margin-bottom:0; }
.stock-dashboard__mb-1 { margin-bottom: var(--spacing-sm); }
.stock-dashboard__mb-2 { margin-bottom: var(--spacing-md); }
.stock-dashboard__mb-3 { margin-bottom: var(--spacing-lg); }
.stock-dashboard__mt-0 { margin-top:0; }
.stock-dashboard__mt-1 { margin-top: var(--spacing-sm); }
.stock-dashboard__mt-2 { margin-top: var(--spacing-md); }
.stock-dashboard__mt-3 { margin-top: var(--spacing-lg); }
.stock-dashboard__d-none { display:none; }
.stock-dashboard__d-block { display:block; }
.stock-dashboard__d-flex { display:flex; }
.stock-dashboard__d-grid { display:grid; }

/* PRINT */
@media print {
    .stock-dashboard__filter-section,
    .stock-dashboard__loading-overlay,
    .stock-dashboard__threshold-actions { display:none; }
    .stock-dashboard__results { 
        box-shadow:none; 
        border: 1px solid var(--border-dark); 
    }
    .stock-dashboard__table-header th { 
        background: var(--text-primary) !important; 
        color: var(--text-light) !important; 
    }
}

/* RESPONSIVE */
@media (max-width: 1200px) {
    .stock-dashboard__threshold-grid { 
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); 
    }
}
@media (max-width: 768px) {
    .stock-dashboard__container { 
        padding: var(--spacing-md); 
        margin: var(--spacing-sm);
    }
    .stock-dashboard__threshold-grid { 
        grid-template-columns: 1fr; 
    }
    .stock-dashboard__table-header th, .stock-dashboard__table-body td { 
        padding: var(--spacing-md); 
        font-size: var(--font-size-sm); 
    }
    .stock-dashboard__results-header { 
        flex-direction: column; 
        align-items: stretch; 
    }
    .stock-dashboard__ranking-controls { 
        justify-content: center; 
    }
    .stock-dashboard__rankings-table { 
        font-size: var(--font-size-xs); 
    }
    .stock-dashboard__rankings-table th, .stock-dashboard__rankings-table td { 
        padding: var(--spacing-xs); 
    }
}
@media (max-width: 480px) {
    .stock-dashboard__title { 
        font-size: var(--font-size-xl); 
    }
    .stock-dashboard__container {
        margin: var(--spacing-xs);
        padding: var(--spacing-sm);
    }
}