/* =====================================================
   ESTILOS GLOBALES DE BOTONES
   Aplicable en toda la plataforma
   ===================================================== */

/* ======== BOTONES SECUNDARIOS PROFESIONALES ======== */
.btn-secundario {
    padding: 0.85rem 1.4rem !important;
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%) !important;
    border: none !important;
    color: white !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    font-size: 0.85rem !important;
    font-weight: 800 !important;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    width: 100% !important;
    gap: 0.5rem !important;
    min-height: 42px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

/* Específico para <a> tags */
a.btn-secundario {
    padding: 0.85rem 1.4rem !important;
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%) !important;
    border: none !important;
    color: white !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    font-size: 0.85rem !important;
    font-weight: 800 !important;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    width: 100% !important;
    gap: 0.5rem !important;
    min-height: 42px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

a.btn-secundario:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(0, 123, 255, 0.4) !important;
    background: linear-gradient(135deg, #0056b3 0%, #003d82 100%) !important;
    color: white !important;
}

a.btn-secundario:active {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.25) !important;
}

/* Efecto ripple */
.btn-secundario::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 0 !important;
    height: 0 !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.3) !important;
    transform: translate(-50%, -50%) !important;
    transition: width 0.5s, height 0.5s !important;
    z-index: 1 !important;
}

.btn-secundario:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(0, 123, 255, 0.4) !important;
    background: linear-gradient(135deg, #0056b3 0%, #003d82 100%) !important;
}

.btn-secundario:hover::before {
    width: 300px !important;
    height: 300px !important;
}

.btn-secundario:active {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.25) !important;
}

/* ======== VARIANTES DE BOTONES ======== */

/* Botón primario */
.btn-primary {
    padding: 0.85rem 1.4rem !important;
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%) !important;
    border: none !important;
    color: white !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    font-weight: 800 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3) !important;
}

.btn-primary:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(0, 123, 255, 0.4) !important;
    background: linear-gradient(135deg, #0056b3 0%, #003d82 100%) !important;
}

/* Botón success */
.btn-success {
    padding: 0.85rem 1.4rem !important;
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%) !important;
    border: none !important;
    color: white !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    font-weight: 800 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(40, 167, 69, 0.3) !important;
}

.btn-success:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(40, 167, 69, 0.4) !important;
    background: linear-gradient(135deg, #20c997 0%, #17a2b8 100%) !important;
}

/* Botón danger */
.btn-danger {
    padding: 0.85rem 1.4rem !important;
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%) !important;
    border: none !important;
    color: white !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    font-weight: 800 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.3) !important;
}

.btn-danger:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(220, 53, 69, 0.4) !important;
    background: linear-gradient(135deg, #c82333 0%, #a71d2a 100%) !important;
}

/* Estados deshabilitados */
.btn:disabled,
.btn-primary:disabled,
.btn-success:disabled,
.btn-danger:disabled,
.btn-secundario:disabled {
    background: #ccc !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    transform: none !important;
}