/* financial-indicators.css - Standardized styles for financial indicators */

/* Base styles for all indicators */
.indicator-buy,
.indicator-sell,
.indicator-hold {
    display: inline-block;
    font-weight: 600;
    padding: 3px 6px;    /* Reduced padding */
    border-radius: var(--ga-radius-sm);
    white-space: nowrap;
    font-size: 0.85rem;  /* Smaller font size for desktop */
}

/* Buy/positive indicator */
.indicator-buy {
    color: var(--ga-color-success-legacy);
    background-color: rgba(56, 161, 105, 0.1);
}

/* Sell/negative indicator */
.indicator-sell {
    color: var(--ga-color-danger);
    background-color: rgba(229, 62, 62, 0.1);
}

/* Hold/neutral indicator */
.indicator-hold {
    color: #ed8936;
    background-color: rgba(237, 137, 54, 0.1);
}

/* Indicator variants */
.indicator-buy.no-bg,
.indicator-sell.no-bg,
.indicator-hold.no-bg {
    background-color: transparent;
}

.indicator-buy.bold,
.indicator-sell.bold,
.indicator-hold.bold {
    font-weight: 700;
}

.indicator-buy.large,
.indicator-sell.large,
.indicator-hold.large {
    font-size: 1rem;     /* Reduced from 1.1em */
    padding: 4px 8px;    /* Reduced padding */
}

.indicator-buy.compact,
.indicator-sell.compact,
.indicator-hold.compact {
    padding: 2px 4px;    /* Reduced padding */
    font-size: 0.8rem;   /* Smaller font size */
}

/* Responsive adjustments */
@media screen and (max-width: 768px) {
    .indicator-buy,
    .indicator-sell,
    .indicator-hold {
        padding: 2px 4px;    /* Even smaller padding for mobile */
        font-size: 0.75rem;  /* Smaller font size for mobile */
    }

    .indicator-buy.large,
    .indicator-sell.large,
    .indicator-hold.large {
        font-size: 0.85rem;  /* Smaller large font for mobile */
        padding: 3px 6px;    /* Reduced padding */
    }

    .indicator-buy.compact,
    .indicator-sell.compact,
    .indicator-hold.compact {
        padding: 1px 3px;    /* Minimal padding for compact on mobile */
        font-size: 0.7rem;   /* Very small font for compact on mobile */
    }
}