/**
 * Unified Button System
 * Унифицированная система кнопок для сайта Berloga
 * BEM Methodology
 */

/* === БАЗОВЫЕ СТИЛИ КНОПОК === */
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--accent-text-font-family, 'Nunito', sans-serif);
    font-size: 20px;
    font-weight: 700;
    text-decoration: none;
    border-radius: 10px;
    padding: 15px 30px;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    min-width: 200px;
}

/* === ОСНОВНАЯ КНОПКА === */
.button--primary {
    background-color: var(--berloga-magenta);
    color: var(--berloga-white);
}

.button--primary:hover {
    background-color: #930639;
    /* Темнее на 10% */
    transform: translateY(-2px);
}

.button--primary:active {
    transform: translateY(0);
}

/* === ДОПОЛНИТЕЛЬНАЯ КНОПКА === */
.button--secondary {
    background-color: var(--berloga-dark-blue);
    color: var(--berloga-white);
}

.button--secondary:hover {
    background-color: #2d4b6b;
    /* Темнее на 10% */
    transform: translateY(-2px);
}

.button--secondary:active {
    transform: translateY(0);
}

/* === ВСПОМОГАТЕЛЬНАЯ КНОПКА === */
.button--outline {
    background-color: transparent;
    color: var(--berloga-blue);
    border: 2px solid var(--berloga-blue);
}

.button--outline:hover {
    border-color: #3e8fa1;
    /* Темнее на 10% */
    color: #3e8fa1;
    transform: translateY(-2px);
}

.button--outline:active {
    transform: translateY(0);
}

/* === РАЗМЕРЫ === */
.button--sm {
    font-size: 14px;
    font-weight: 400;
    padding: 5px 25px;
    min-width: auto;
    height: 28px;
    border-radius: 10px;
}

/* === OUTLINE NEUTRAL (тонкая рамка, нейтральный текст) === */
.button--outline-neutral {
    background-color: transparent;
    color: var(--berloga-text);
    border: 1px solid var(--berloga-blue);
}

.button--outline-neutral:hover {
    transform: translateY(-2px);
}

.button--outline-neutral:active {
    transform: translateY(0);
}

/* Ссылки-кнопки: переопределение цвета */
a.button--outline-neutral {
    color: var(--berloga-text) !important;
}

/* === МОБИЛЬНЫЕ СТИЛИ === */
@media (max-width: 768px) {
    .button {
        font-size: 16px;
        padding: 12px 24px;
        min-width: 160px;
        width: -webkit-fill-available;
    }
}

/* === СПЕЦИФИЧНЫЕ ПЕРЕОПРЕДЕЛЕНИЯ === */
/* Для ссылок-кнопок */
a.button {
    text-decoration: none;
}

a.button--primary {
    color: var(--berloga-white) !important;
}

a.button--secondary {
    color: var(--berloga-white) !important;
}

a.button--outline {
    color: var(--berloga-blue) !important;
}

a.button--outline:hover {
    color: #3e8fa1 !important;
}

/* Отключение стандартных стилей кнопок WordPress */
.button:focus {
    outline: none;
    box-shadow: none;
}