/* ===== UNIFIED BUTTON STYLES ===== */

/* Base Button Styles */
.btn {
    display: inline-block;
    padding: 15px 40px;
    font-size: 1rem;
    border-radius: 50px;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: 0.5px;
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
    border: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
}

/* Remove Ripple Effect as it conflicts with this sleek design */
.btn::before {
    display: none !important;
}

/* Universal Button Style (Dark, sleek, transparent) */
.btn,
.btn-primary, .btn.btn-primary,
.btn-outline, .btn.btn-outline, .btn-outline-primary, .btn.btn-outline-primary,
.btn-secondary, .btn.btn-secondary,
.btn-success, .btn.btn-success,
.btn-info, .btn.btn-info,
.btn-warning, .btn.btn-warning,
.btn-danger, .btn.btn-danger,
.btn-light, .btn.btn-light,
.btn-dark, .btn.btn-dark,
form .btn, .contact-form .btn, #my-form-button,
.cta-buttons .btn,
.about-content .btn,
.hero-content .btn {
    background: rgba(255, 255, 255, 0.03) !important;
    color: #f0f6fc !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}

.btn:hover,
.btn-primary:hover, .btn.btn-primary:hover,
.btn-outline:hover, .btn.btn-outline:hover, .btn-outline-primary:hover, .btn.btn-outline-primary:hover,
.btn-secondary:hover, .btn.btn-secondary:hover,
.btn-success:hover, .btn.btn-success:hover,
.btn-info:hover, .btn.btn-info:hover,
.btn-warning:hover, .btn.btn-warning:hover,
.btn-danger:hover, .btn.btn-danger:hover,
.btn-light:hover, .btn.btn-light:hover,
.btn-dark:hover, .btn.btn-dark:hover,
form .btn:hover, .contact-form .btn:hover, #my-form-button:hover,
.cta-buttons .btn:hover,
.about-content .btn:hover,
.hero-content .btn:hover {
    background: #2a2a2a !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4) !important;
}

/* Small Buttons */
.btn-sm,
.btn.btn-sm {
    padding: 10px 25px;
    font-size: 0.9rem;
}

/* Large Buttons */
.btn-lg,
.btn.btn-lg {
    padding: 20px 50px;
    font-size: 1.2rem;
}

/* Responsive */
@media (max-width: 768px) {
    .btn {
        padding: 12px 30px;
        font-size: 0.95rem;
    }
    
    .btn-sm {
        padding: 8px 20px;
        font-size: 0.85rem;
    }
    
    .btn-lg {
        padding: 15px 35px;
        font-size: 1.1rem;
    }
}

@media (max-width: 576px) {
    .btn {
        padding: 10px 25px;
        font-size: 0.9rem;
        width: 100%;
        max-width: 300px;
    }
}

/* Focus States */
.btn:focus,
.btn:active {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(47, 129, 217, 0.3) !important;
}

/* Disabled State */
.btn:disabled,
.btn.disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

.btn:disabled:hover,
.btn.disabled:hover {
    transform: none !important;
    box-shadow: none !important;
}