/* ========================================
   SISTEMA DE BOTÕES UNIFICADO
   Edifício Winston Churchill
   ========================================
   
   Este arquivo centraliza todos os estilos de botões
   do sistema admin, portal do condômino e páginas públicas.
   
   Classes principais (BEM):
   - .btn              → Estilo base do botão
   - .btn--primary     → Vermelho principal
   - .btn--secondary   → Cinza
   - .btn--success     → Verde
   - .btn--danger      → Vermelho escuro
   - .btn--warning     → Amarelo
   - .btn--info        → Azul
   - .btn--outline     → Apenas borda
   - .btn--ghost       → Transparente
   
   Tamanhos:
   - .btn--sm          → Pequeno
   - .btn--lg          → Grande
   
   Botões de ação (tabelas):
   - .btn-action       → Base para ações
   - .btn-action--edit → Editar (azul)
   - .btn-action--delete → Deletar (vermelho)
   - .btn-action--view → Visualizar
   
   Aliases para compatibilidade com código existente.
   
   ======================================== */

/* ==========================================================================
   BASE DO BOTÃO
   ========================================================================== */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.btn:focus {
    outline: none;
}

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

.btn i {
    font-size: 1rem;
}

/* ==========================================================================
   TAMANHOS
   ========================================================================== */

/* Pequeno */
.btn--sm,
.btn-sm {
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
    border-radius: 6px;
}

.btn--sm i,
.btn-sm i {
    font-size: 0.875rem;
}

/* Grande */
.btn--lg,
.btn-lg {
    padding: 0.875rem 1.75rem;
    font-size: 1.0625rem;
    border-radius: 10px;
}

.btn--lg i,
.btn-lg i {
    font-size: 1.125rem;
}

/* Full Width */
.btn--block,
.btn.w-100 {
    width: 100%;
}

/* ==========================================================================
   VARIANTES DE COR (BEM)
   ========================================================================== */

/* Primary - Vermelho principal do site */
.btn--primary {
    background-color: var(--primary, #c8102e);
    border-color: var(--primary, #c8102e);
    color: #ffffff;
}

.btn--primary:hover:not(:disabled),
.btn--primary:focus:not(:disabled) {
    background-color: var(--primary-dark, #a00d25);
    border-color: var(--primary-dark, #a00d25);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(200, 16, 46, 0.25);
}

.btn--primary:active:not(:disabled) {
    transform: translateY(0);
}

/* Secondary - Cinza */
.btn--secondary {
    background-color: #6c757d;
    border-color: #6c757d;
    color: #ffffff;
}

.btn--secondary:hover:not(:disabled),
.btn--secondary:focus:not(:disabled) {
    background-color: #5a6268;
    border-color: #545b62;
    color: #ffffff;
}

/* Success - Verde */
.btn--success {
    background-color: #059669;
    border-color: #059669;
    color: #ffffff;
}

.btn--success:hover:not(:disabled),
.btn--success:focus:not(:disabled) {
    background-color: #047857;
    border-color: #047857;
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.25);
}

/* Danger - Vermelho */
.btn--danger {
    background-color: #dc2626;
    border-color: #dc2626;
    color: #ffffff;
}

.btn--danger:hover:not(:disabled),
.btn--danger:focus:not(:disabled) {
    background-color: #b91c1c;
    border-color: #b91c1c;
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.25);
}

/* Warning - Amarelo */
.btn--warning {
    background-color: #f59e0b;
    border-color: #f59e0b;
    color: #1f2937;
}

.btn--warning:hover:not(:disabled),
.btn--warning:focus:not(:disabled) {
    background-color: #d97706;
    border-color: #d97706;
    color: #1f2937;
}

/* Info - Azul */
.btn--info {
    background-color: var(--info, #457b9d);
    border-color: var(--info, #457b9d);
    color: #ffffff;
}

.btn--info:hover:not(:disabled),
.btn--info:focus:not(:disabled) {
    background-color: #3a6780;
    border-color: #3a6780;
    color: #ffffff;
}

/* Light - Cinza claro */
.btn--light {
    background-color: #f3f4f6;
    border-color: #e5e7eb;
    color: #374151;
}

.btn--light:hover:not(:disabled),
.btn--light:focus:not(:disabled) {
    background-color: #e5e7eb;
    border-color: #d1d5db;
    color: #1f2937;
}

/* Outline - Apenas borda (vermelho) */
.btn--outline {
    background-color: transparent;
    border-color: var(--primary, #c8102e);
    color: var(--primary, #c8102e);
}

.btn--outline:hover:not(:disabled),
.btn--outline:focus:not(:disabled) {
    background-color: var(--primary, #c8102e);
    color: #ffffff;
}

/* Outline Secondary */
.btn--outline-secondary {
    background-color: transparent;
    border-color: #6c757d;
    color: #6c757d;
}

.btn--outline-secondary:hover:not(:disabled),
.btn--outline-secondary:focus:not(:disabled) {
    background-color: #6c757d;
    color: #ffffff;
}

/* Ghost - Transparente */
.btn--ghost {
    background-color: transparent;
    border-color: transparent;
    color: var(--primary, #c8102e);
}

.btn--ghost:hover:not(:disabled),
.btn--ghost:focus:not(:disabled) {
    background-color: rgba(200, 16, 46, 0.1);
}

/* Link - Parece um link */
.btn--link {
    background-color: transparent;
    border-color: transparent;
    color: var(--primary, #c8102e);
    text-decoration: underline;
    padding: 0;
}

.btn--link:hover:not(:disabled),
.btn--link:focus:not(:disabled) {
    color: var(--primary-dark, #a00d25);
}

/* ==========================================================================
   BOTÕES DE AÇÃO (TABELAS ADMIN)
   ========================================================================== */

.btn-action {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
    background: transparent;
}

.btn-action i {
    font-size: 1rem;
}

/* Ação - Visualizar */
.btn-action--view {
    color: var(--info, #457b9d);
}

.btn-action--view:hover,
.btn-action--view:focus {
    color: #3a6780;
    background: rgba(69, 123, 157, 0.1);
    text-decoration: none;
}

/* Ação - Editar */
.btn-action--edit {
    color: var(--info, #457b9d);
}

.btn-action--edit:hover,
.btn-action--edit:focus {
    color: #3a6780;
    background: rgba(69, 123, 157, 0.1);
    text-decoration: none;
}

/* Ação - Deletar */
.btn-action--delete {
    color: #dc2626;
}

.btn-action--delete:hover,
.btn-action--delete:focus {
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.1);
    text-decoration: none;
}

.btn-action--delete.disabled,
.btn-action--delete:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

/* Ação - Aprovar */
.btn-action--approve {
    color: #059669;
}

.btn-action--approve:hover,
.btn-action--approve:focus {
    color: #047857;
    background: rgba(5, 150, 105, 0.1);
    text-decoration: none;
}

/* Ação - Rejeitar */
.btn-action--reject {
    color: #dc2626;
}

.btn-action--reject:hover,
.btn-action--reject:focus {
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.1);
    text-decoration: none;
}

/* ==========================================================================
   BOTÃO ICON (APENAS ÍCONE)
   ========================================================================== */

.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 8px;
    background: #f3f4f6;
    color: #6b7280;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-icon:hover {
    background: #e5e7eb;
    color: #374151;
}

.btn-icon--sm {
    width: 28px;
    height: 28px;
    font-size: 0.875rem;
}

.btn-icon--lg {
    width: 44px;
    height: 44px;
    font-size: 1.25rem;
}

/* ==========================================================================
   ALIASES PARA COMPATIBILIDADE
   Mantém funcionando o código existente sem modificação
   ========================================================================== */

/* Alias: btn-primary (usado em vários arquivos) */
.btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: var(--primary, #c8102e);
    border-color: var(--primary, #c8102e);
    color: #ffffff;
}

.btn-primary:hover:not(:disabled),
.btn-primary:focus:not(:disabled) {
    background-color: var(--primary-dark, #a00d25);
    border-color: var(--primary-dark, #a00d25);
    color: #ffffff;
    text-decoration: none;
}

/* Alias: btn-secondary */
.btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: #6c757d;
    border-color: #6c757d;
    color: #ffffff;
}

.btn-secondary:hover:not(:disabled),
.btn-secondary:focus:not(:disabled) {
    background-color: #5a6268;
    border-color: #545b62;
    color: #ffffff;
    text-decoration: none;
}

/* Alias: btn-success */
.btn-success {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: #059669;
    border-color: #059669;
    color: #ffffff;
}

.btn-success:hover:not(:disabled),
.btn-success:focus:not(:disabled) {
    background-color: #047857;
    border-color: #047857;
    color: #ffffff;
    text-decoration: none;
}

/* Alias: btn-danger */
.btn-danger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: #dc2626;
    border-color: #dc2626;
    color: #ffffff;
}

.btn-danger:hover:not(:disabled),
.btn-danger:focus:not(:disabled) {
    background-color: #b91c1c;
    border-color: #b91c1c;
    color: #ffffff;
    text-decoration: none;
}

/* Alias: btn-warning */
.btn-warning {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: #f59e0b;
    border-color: #f59e0b;
    color: #1f2937;
}

.btn-warning:hover:not(:disabled),
.btn-warning:focus:not(:disabled) {
    background-color: #d97706;
    border-color: #d97706;
    color: #1f2937;
    text-decoration: none;
}

/* Alias: btn-info */
.btn-info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: var(--info, #457b9d);
    border-color: var(--info, #457b9d);
    color: #ffffff;
}

.btn-info:hover:not(:disabled),
.btn-info:focus:not(:disabled) {
    background-color: #3a6780;
    border-color: #3a6780;
    color: #ffffff;
    text-decoration: none;
}

/* Alias: btn-outline */
.btn-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 2px solid var(--primary, #c8102e);
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: transparent;
    color: var(--primary, #c8102e);
}

.btn-outline:hover:not(:disabled),
.btn-outline:focus:not(:disabled) {
    background-color: var(--primary, #c8102e);
    color: #ffffff;
    text-decoration: none;
}

/* Alias: btn-gray (usado em admin-noticias) */
.btn-gray {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: #ffffff;
    color: #374151;
}

.btn-gray:hover:not(:disabled),
.btn-gray:focus:not(:disabled) {
    background-color: #f3f4f6;
    border-color: #9ca3af;
    text-decoration: none;
}

/* Alias: btn-green (usado em algumas páginas) */
.btn-green {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: #059669;
    border-color: #059669;
    color: #ffffff;
}

.btn-green:hover:not(:disabled),
.btn-green:focus:not(:disabled) {
    background-color: #047857;
    border-color: #047857;
    color: #ffffff;
    text-decoration: none;
}

/* Alias: btn-blue (usado em admin-noticias) */
.btn-blue {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: all 0.2s ease;
    background-color: var(--info, #457b9d);
    border-color: var(--info, #457b9d);
    color: #ffffff;
}

.btn-blue:hover:not(:disabled),
.btn-blue:focus:not(:disabled) {
    background-color: #3a6780;
    border-color: #3a6780;
    color: #ffffff;
    text-decoration: none;
}

/* Alias: btn-acao (usado em admin-users) */
.btn-acao {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
    background: transparent;
}

/* Alias: btn-editar (usado em admin-users) */
.btn-editar {
    color: var(--info, #457b9d);
}

.btn-editar:hover,
.btn-editar:focus,
.btn-editar:active {
    color: #3a6780;
    background: rgba(69, 123, 157, 0.1);
    text-decoration: none;
}

/* Alias: btn-deletar (usado em admin-users) */
.btn-deletar {
    color: #dc2626;
}

.btn-deletar:hover,
.btn-deletar:focus,
.btn-deletar:active {
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.1);
    text-decoration: none;
}

.btn-deletar.disabled,
.btn-deletar:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

/* Alias: btn-edit (usado em admin-noticias/galeria) */
.btn-edit {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
    background: transparent;
    color: var(--info, #457b9d);
}

.btn-edit:hover,
.btn-edit:focus,
.btn-edit:active {
    color: #3a6780;
    background: rgba(69, 123, 157, 0.1);
    text-decoration: none;
}

/* Alias: btn-delete (usado em admin-noticias/galeria) */
.btn-delete {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
    background: transparent;
    color: #dc2626;
}

.btn-delete:hover,
.btn-delete:focus,
.btn-delete:active {
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.1);
    text-decoration: none;
}

/* ==========================================================================
   RESPONSIVIDADE
   ========================================================================== */

@media (max-width: 576px) {
    .btn {
        padding: 0.5rem 1rem;
        font-size: 0.875rem;
    }

    .btn--lg,
    .btn-lg {
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
    }

    .btn-action {
        padding: 4px 8px;
        font-size: 0.8125rem;
    }
}