/* ===================== */
/* ОСНОВНОЙ РАЗДЕЛИТЕЛЬ */
/* ===================== */

/* Базовый вариант - Стилизованная шкала */
.divider-press {
    height: 8px;
    width: 85%;
    margin: 4rem auto;
    border: none;
    background: linear-gradient(90deg, 
                #273989 0%, 
                #2a4ab3 20%, 
                #3a6ae0 40%, 
                #4a8aff 60%, 
                #3a6ae0 80%, 
                #2a4ab3 100%);
    border-radius: 4px;
    position: relative;
    overflow: visible;
    box-shadow: 0 2px 8px rgba(39, 57, 137, 0.3);
}

/* Основные метки на шкале */
.divider-press::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 18px;
    top: 50%;
    transform: translateY(-50%);
    background-image: repeating-linear-gradient(90deg, 
        transparent, 
        transparent 8.9%, 
        rgba(245, 163, 64, 0.7) 9%, 
        rgba(245, 163, 64, 0.7) 9.5%, 
        transparent 9.6%);
    z-index: 1;
}

/* Акцентные оранжевые индикаторы (как на прессе) */
.divider-press::after {
    content: '';
    position: absolute;
    width: 94%;
    height: 4px;
    top: 50%;
    left: 3%;
    transform: translateY(-50%);
    background: rgba(245, 163, 64, 0.15);
    border-radius: 2px;
}

/* ================================= */
/* ЯРКИЙ ВАРИАНТ С АКЦЕНТНЫМИ КРАЯМИ */
/* ================================= */

.divider-press-bright {
    height: 10px;
    background: linear-gradient(90deg, 
                #f5a340 0%, 
                #ffb862 15%, 
                #273989 30%, 
                #2a4ab3 50%, 
                #273989 70%, 
                #ffb862 85%, 
                #f5a340 100%);
    box-shadow: 0 0 12px rgba(245, 163, 64, 0.4), 
                0 2px 10px rgba(39, 57, 137, 0.3);
}

.divider-press-bright::before {
    background-image: repeating-linear-gradient(90deg, 
        transparent, 
        transparent 8.8%, 
        #ffffff 9%, 
        #ffffff 9.3%, 
        transparent 9.5%);
}

/* =========================== */
/* МИНИМАЛИСТИЧНЫЙ ЯРКИЙ ВАРИАНТ */
/* =========================== */

.divider-press-minimal {
    height: 6px;
    background: linear-gradient(90deg, 
                transparent 0%, 
                #f5a340 20%, 
                #273989 50%, 
                #f5a340 80%, 
                transparent 100%);
    width: 70%;
}

.divider-press-minimal::before {
    height: 12px;
    background-image: repeating-linear-gradient(90deg, 
        transparent, 
        transparent 9.4%, 
        #f5a340 9.5%, 
        #f5a340 9.7%, 
        transparent 9.8%);
}

/* =========================== */
/* АНИМИРОВАННЫЙ ВАРИАНТ (ДОПОЛНИТЕЛЬНО) */
/* =========================== */

.divider-press-animated {
    animation: pulse-glow 3s ease-in-out infinite;
}

@keyframes pulse-glow {
    0%, 100% { 
        box-shadow: 0 2px 8px rgba(39, 57, 137, 0.3);
        opacity: 1;
    }
    50% { 
        box-shadow: 0 2px 15px rgba(245, 163, 64, 0.5);
        opacity: 0.9;
    }
}

/* =========================== */
/* ВАРИАНТ С ИКОНКОЙ В ЦЕНТРЕ */
/* =========================== */

.divider-press-with-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    height: auto;
    gap: 15px;
}

.divider-press-with-icon::before,
.divider-press-with-icon::after {
    content: '';
    flex: 1;
    height: 4px;
    background: linear-gradient(90deg, 
                transparent, 
                #273989 20%, 
                #f5a340 50%, 
                #273989 80%, 
                transparent);
    border-radius: 2px;
    position: static;
    transform: none;
    width: auto;
}

.divider-press-with-icon i {
    color: #f5a340;
    font-size: 1.5rem;
    filter: drop-shadow(0 0 3px rgba(245, 163, 64, 0.5));
}