/* =========================================================
   TER PREMIUM CONTENT ORIGIN
   Clear visual separation for Stock / DLC / Mod cars.
   TER red remains reserved for selected cars.
   ========================================================= */

.content-type-legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;

    margin: 0 0 14px;
    padding: 10px 12px;

    border: 1px solid #2b2b2b;
    background: #0b0b0b;
}

.content-type-legend-label {
    color: #8a8a8a;
    font-size: 10px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.content-type-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    color: #bdbdbd;
    font-size: 10px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.content-type-legend-swatch {
    width: 18px;
    height: 9px;

    border: 1px solid #444;
    background: #0d0d0d;
}

.content-type-legend-swatch.stock {
    border-color: #444;
    background: #0d0d0d;
}

.content-type-legend-swatch.dlc {
    border-color: #4f7f98;
    background: #10232d;
}

.content-type-legend-swatch.mod {
    border-color: #765087;
    background: #26182d;
}

.event-car-option.content-stock {
    border-left: 3px solid #333;
}

.event-car-option.content-dlc {
    border-color: #365b6d;
    border-left: 3px solid #5e9cba;
    background:
        linear-gradient(
            90deg,
            #10232d 0%,
            #0b151b 36%,
            #090d10 100%
        );
}

.event-car-option.content-mod {
    border-color: #5f426a;
    border-left: 3px solid #9364a7;
    background:
        linear-gradient(
            90deg,
            #26182d 0%,
            #17101b 36%,
            #0e0a10 100%
        );
}

.event-car-option.content-dlc:hover {
    border-color: #6da7c2;
    border-left-color: #8dc6df;
    background:
        linear-gradient(
            90deg,
            #15303d 0%,
            #0d1c23 40%,
            #0a0f12 100%
        );
}

.event-car-option.content-mod:hover {
    border-color: #9369a2;
    border-left-color: #b17fc1;
    background:
        linear-gradient(
            90deg,
            #32203b 0%,
            #1e1523 40%,
            #100c12 100%
        );
}

.event-car-option.content-dlc .event-car-copy small {
    color: #8fc0d8;
}

.event-car-option.content-mod .event-car-copy small {
    color: #bd93c9;
}

.event-car-option.content-stock .event-car-copy small {
    color: #777;
}

/* A selected car still uses TER red as the primary selection signal,
   while the underlying content tint remains visible. */
.event-car-option.content-stock:has(input:checked),
.event-car-option.content-dlc:has(input:checked),
.event-car-option.content-mod:has(input:checked) {
    border-color: var(--red);
    border-left-color: var(--red);
}

.event-car-option.content-stock:has(input:checked) {
    background: #171010;
}

.event-car-option.content-dlc:has(input:checked) {
    background:
        linear-gradient(
            90deg,
            #241112 0%,
            #13252e 42%,
            #0b1216 100%
        );
}

.event-car-option.content-mod:has(input:checked) {
    background:
        linear-gradient(
            90deg,
            #241112 0%,
            #28182e 42%,
            #130d15 100%
        );
}