/* ===== СИСТЕМА КНОПОК ===== */

/* Базовые стили для всех кнопок */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 16px 40px;
    text-decoration: none;
    text-align: center;
    border-radius: 150px;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    min-height: auto;
    box-sizing: border-box;
    border: 2px solid transparent;
}

.btn:disabled {
    cursor: not-allowed;
    pointer-events: none;
}

/* Маленькая кнопка */
.btn-sm { 
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 12px 30px;
    text-decoration: none;
    text-align: center;
    border-radius: 150px;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    min-height: auto;
    box-sizing: border-box;
    border: 2px solid transparent;
}

/* ===== ОСНОВНЫЕ КНОПКИ ===== */

/* Бордовая кнопка с белым текстом */
.btn-primary-burgundy {
    background: var(--color-burgundy);
    color: var(--color-white);
    border: none;
}

.btn-primary-burgundy:hover {
    background: var(--color-hover-burgundy);
}

.btn-primary-burgundy:disabled {
    background: #E9E9E9;
    color: #A8A8A8;
}

/* Зеленая кнопка с белым текстом */
.btn-primary-green {
    background: var(--color-primary);
    color: var(--color-white);
    border: none;
}

.btn-primary-green:hover {
    background: var(--color-hover-green);
}

.btn-primary-green:disabled {
    background: #E9E9E9;
    color: #A8A8A8;
}

/* Белая кнопка с черным текстом */
.btn-primary-white {
    background: var(--color-white);
    color: var(--color-text-main);
    border: none;
}

.btn-primary-white:hover {
    background: var(--color-bg-button-white);
}

.btn-primary-white:disabled {
    background: #E9E9E9;
    color: #A8A8A8;
}

/* Черная кнопка с белым текстом */
.btn-primary-black {
    background: var(--color-text-main);
    color: var(--color-white);
    border: none;
}

.btn-primary-black:hover {
    background: #424242;
}

.btn-primary-black:disabled {
    background: #E9E9E9;
    color: #A8A8A8;
}

/* Кнопка "Войти" */
.btn-primary-green-shield {
    background: var(--color-bg-button-login);
    color: var(--color-text-main);
    border: none;
}

.btn-primary-green-shield:hover {
    background: var(--color-white);
    color: var(--color-text-main);
}

.btn-primary-green-shield:disabled {
    background: #E9E9E9;
    color: #A8A8A8;
}

/* ===== ВТОРОСТЕПЕННЫЕ КНОПКИ ===== */

/* Второстепенная кнопка с белым фоном и зеленой обводкой */
.btn-secondary {
    background: var(--color-white);
    color: var(--color-primary);
    border: 2px solid var(--color-primary);
}

.btn-secondary:hover {
    background: var(--color-bg-button-secondary);
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-secondary:disabled {
    background: #E9E9E9;
    color: #A8A8A8;
}

/* Белая кнопка с бордовым текстом без обводки */
.btn-secondary-burgundy {
    background: var(--color-white);
    color: var(--color-burgundy);
    border: none;
}

.btn-secondary-burgundy:hover {
    background: var(--color-bg-burgundy-shield);
    color: var(--color-burgundy);
}

.btn-secondary-burgundy:disabled {
    background: #E9E9E9;
    color: #A8A8A8;
}



/* ===== АДАПТИВНОСТЬ ===== */

@media screen and (max-width: 768px) {
    .btn {
        padding: 20px 40px;
    }
    
    .btn-sm {
        padding: 10px 24px;
    }
}

@media screen and (max-width: 480px) {
    .btn {
        padding: 18px 32px;
    }
    
    .btn-sm {
        padding: 8px 20px;
    }
}