/**
 * OptionFinder - Scanner Styles: UNDERLYING
 * 
 * Diese Datei enth&auml;lt NUR Styles f&uuml;r Spalten der Kategorie "Underlying":
 * - Ticker/Symbol mit Firmenname
 * - Company Name
 * - Sektor-Filter mit Checkboxen
 * - Market Cap Filter
 * - Spaltenbreiten f&uuml;r Sektor/Company
 * 
 * NICHT hier: Layout, Tabellen-Basis, andere Kategorien
 * 
 * @package OptionFinder_Member_Area
 * @version 3.0.0
 * @since 3.0.0 - Aufgeteilt aus dashboard-starter.css
 * 
 * @see dashboard-starter-base.css f&uuml;r Grundstruktur
 */

/* =====================================================
   NAME-CELL (Ticker + Firmenname) für Options-Scanner
   Nutzt Scanner-Variablen (scoped auf .ofma-dashboard)
   mit Fallback-Werten für Robustheit
   ===================================================== */
.ofma-scanner__table .name-cell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    min-width: 0;
    max-width: 100%;
}

.ofma-scanner__table .name-cell__actions {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.ofma-scanner__table .action-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 4px;
    color: var(--of-text-muted, #94a3b8);
    cursor: pointer;
    transition: all 0.15s;
}

.ofma-scanner__table .action-icon:hover {
    background: var(--of-bg-subtle, #f1f5f9);
    color: var(--of-accent-violet, #8b5cf6);
}

.ofma-scanner__table .action-icon--watchlist.active {
    color: var(--of-accent-teal, #14b8a6);
}

.ofma-scanner__table .action-icon--watchlist.active svg {
    fill: var(--of-accent-teal, #14b8a6);
}

.ofma-scanner__table .name-cell__info {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.ofma-scanner__table .name-cell__ticker {
    font-weight: var(--of-font-weight-semibold, 600);
    color: var(--of-accent-teal, #14b8a6);
    font-size: var(--of-font-size-md, 13px);
}

.ofma-scanner__table .name-cell__company {
    font-size: var(--of-font-size-sm, 11px);
    font-weight: var(--of-font-weight-regular, 400);
    color: var(--of-text-muted, #94a3b8);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* =====================================================
   SEKTOR-FILTER mit Checkboxen
   ===================================================== */
.filter-sector-colors {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    max-height: 280px;
    overflow-y: auto;
    padding-right: 0.25rem;
}

/* Sektor-Filter: Labels linksb&uuml;ndig */
.filter-sector-colors .filter-color-option {
    justify-content: flex-start;
    text-align: left;
}

.filter-sector-colors .filter-color-option__label {
    text-align: left;
}

.filter-sector-colors .filter-color-option__count {
    margin-left: auto;
    text-align: right;
}

/* =====================================================
   MARKET CAP FILTER
   ===================================================== */

/* Market Cap Filter ohne Farbkaestchen */
.filter-color-option--no-swatch {
    padding-left: 0;
}

.filter-color-option--no-swatch .filter-color-option__label {
    margin-left: 8px;
}

/* Color Option Basis (wird auch von anderen Filtern genutzt) */
.filter-color-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0;
    font-size: 0.8125rem;
    cursor: pointer;
}

.filter-color-option input[type="checkbox"] {
    width: 14px;
    height: 14px;
    cursor: pointer;
}

.filter-color-option__swatch {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 3px;
    flex-shrink: 0;
}

.filter-color-option__label {
    flex: 1;
    color: var(--ofma-color-slate-600);
}

.filter-color-option__range {
    font-size: 0.75rem;
    color: var(--ofma-color-slate-400);
}

.filter-color-option__count {
    font-size: 0.75rem;
    color: var(--ofma-color-slate-500);
    margin-left: auto;
    font-weight: 500;
}

/* =====================================================
   SPALTENBREITEN - UNDERLYING
   ===================================================== */

/* Sektor-Spalte Header */
.ofma-scanner__table th[data-col="sector"] {
    min-width: 240px !important;
}

/* Company Name Spalte breiter */
.ofma-scanner__table th[data-col="company_name"] {
    min-width: 180px !important;
}

/* =====================================================
   MARKET CAP FILTER SWATCHES
   ===================================================== */
.filter-marketcap__options {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* =====================================================
   DARK MODE - UNDERLYING
   ===================================================== */
[data-theme="dark"] .filter-color-option__label {
    color: var(--ofma-color-slate-300);
}

[data-theme="dark"] .filter-color-option__count {
    color: var(--ofma-color-slate-400);
}

/* =====================================================
   MARKET CAP FILTER SWATCHES
   ===================================================== */
.filter-color-option__swatch--mcap-micro {
    background: #9ca3af;
}

.filter-color-option__swatch--mcap-small {
    background: #60a5fa;
}

.filter-color-option__swatch--mcap-mid {
    background: #34d399;
}

.filter-color-option__swatch--mcap-large {
    background: #a78bfa;
}

.filter-color-option__swatch--mcap-mega {
    background: #fbbf24;
}

/* =====================================================
   ALARME-FILTER (v4.40.0)
   ===================================================== */
.filter-alerts {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-alerts__checkbox {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    cursor: pointer;
    font-size: 0.8125rem;
}

.filter-alerts__checkbox input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.filter-alerts__label {
    color: var(--ofma-color-slate-700);
    text-align: left;
}

.filter-alerts__count {
    color: var(--ofma-color-slate-500);
    font-size: 0.75rem;
}

.filter-alerts__hint {
    font-size: 0.6875rem;
    color: var(--ofma-color-primary);
    margin-top: 0.5rem;
    padding: 0.375rem 0.5rem;
    background: rgba(20, 184, 166, 0.08);
    border-radius: var(--ofma-radius-sm);
    line-height: 1.4;
    text-align: left;
}

.filter-alerts__hint-icon {
    font-size: 0.75rem;
    margin-right: 0.25rem;
}

[data-theme="dark"] .filter-alerts__label {
    color: var(--ofma-color-slate-300);
}

[data-theme="dark"] .filter-alerts__count {
    color: var(--ofma-color-slate-400);
}

[data-theme="dark"] .filter-alerts__hint {
    background: rgba(20, 184, 166, 0.1);
    color: var(--ofma-color-primary-light, #5eead4);
}