/* 
   Versão: 2.2.1 - BTOS Premium Button System (DNA Edition)
   Status: ESTABILIZADO - Contraste e Acessibilidade Aprimorados
   Objetivo: Interação de alta performance e feedback visual refinado.
*/

/* ==========================================================================
   1. BOTÃO PRIMÁRIO (BTOS Primary) - O "Call to Action" Principal
   ========================================================================== */
.btn-btos-primary {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.9rem 2.2rem;
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text-white) !important;
    
    /* Gradiente Profundo BTOS - Foco em Contraste */
    background: linear-gradient(135deg, var(--color-primary-bs) 0%, #0a248a 100%);
    
    /* Borda Orgânica e Premium */
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    
    cursor: pointer;
    text-decoration: none;
    overflow: hidden;
    transition: var(--btn-transition-premium);
    box-shadow: var(--shadow-dna-md);
    outline: none;
    white-space: nowrap;
}

/* Sky Highlight (Brilho fixo no topo para profundidade) */
.btn-btos-primary::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.3), transparent);
    z-index: 1;
}

/* Shine Effect (Raio de luz animado no hover) */
.btn-btos-primary::after {
    content: "";
    position: absolute;
    top: 0;
    left: -150%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        120deg,
        transparent,
        rgba(255, 255, 255, 0.15),
        transparent
    );
    transition: all 0.6s ease;
}

/* Estados do Botão Primário */
.btn-btos-primary:hover {
    background: linear-gradient(135deg, var(--color-primary-darker) 0%, #1332bc 100%);
    transform: translateY(-3px);
    box-shadow: var(--shadow-hover);
    border-color: rgba(255, 255, 255, 0.4);
}

.btn-btos-primary:hover::after {
    left: 150%;
    transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1);
}

.btn-btos-primary:active {
    transform: translateY(-1px) scale(0.98);
    box-shadow: var(--shadow-dna-sm);
    filter: brightness(0.9);
}

/* ==========================================================================
   2. BOTÃO SECUNDÁRIO (BTOS Outline) - Ações de Apoio
   ========================================================================== */
.btn-btos-secondary {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.85rem 2.1rem;
    background: #ffffff;
    color: var(--color-primary-bs) !important;
    border: 2px solid var(--color-primary-bs);
    font-weight: 700;
    border-radius: 20px;
    cursor: pointer;
    text-decoration: none;
    transition: var(--btn-transition-premium);
    white-space: nowrap;
}

.btn-btos-secondary:hover {
    background: var(--color-bg-subtle-blue);
    transform: translateY(-2px);
    box-shadow: var(--shadow-dna-sm);
    border-color: var(--color-primary-bs-darker);
}

.btn-btos-secondary:active {
    transform: translateY(0) scale(0.98);
    background: rgba(19, 50, 188, 0.1);
}

/* ==========================================================================
   3. VARIANTES DE TAMANHO (Sincronizadas com o Grid)
   ========================================================================== */

/* Pequeno (Ações Rápidas / Tabelas / Footer de Modais) */
.btn-sm {
    padding: 0.5rem 1.2rem !important;
    font-size: 0.8rem !important;
    border-radius: 12px !important;
}

/* Largo (Hero CTA / Landing Pages / Login) */
.btn-btos-lg {
    padding: 1.2rem 3rem !important;
    font-size: 1.1rem !important;
    border-radius: 22px !important;
}

/* Especial: Botão Enterprise (Borda Suave) */
.btn-btos-enterprise {
    background-color: #ffffff;
    color: var(--color-primary-bs) !important;
    border: 2px solid #cbd5e1;
    font-weight: 700;
}

.btn-btos-enterprise:hover {
    border-color: var(--color-primary-bs);
    background-color: var(--color-bg-subtle-blue);
}

/* ==========================================================================
   4. ESTADOS ESPECIAIS (RIGOR DE CONTRASTE)
   ========================================================================== */
.btn-btos-primary:disabled,
.btn-btos-secondary:disabled,
.btn-btos-enterprise:disabled {
    background: #e2e8f0 !important; /* Cinza sólido firme */
    color: #64748b !important;      /* Texto escuro para legibilidade */
    border: 1px solid #cbd5e1 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important; /* Remove grayscale para evitar borrão */
    opacity: 0.7;
}

/* Botão de Ícone (Circular/Quadrado sem texto) */
.icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    border-radius: 8px;
    border: 1px solid var(--border-color-default);
    background: #ffffff;
    cursor: pointer;
    transition: var(--transition-fast);
}

.icon-btn:hover {
    background: var(--color-bg-light);
    border-color: var(--color-primary-bs);
    color: var(--color-primary-bs);
}

.icon-btn.btn-xs {
    padding: 2px 6px;
    font-size: 0.75rem;
}