/**
 * 🎯 SISTEMA UNIFICADO DE CHECKOUT - ESTILOS CSS
 * Controla la visibilidad de campos según el modo (simplificado vs empresarial)
 */

/* 📄 MODO SIMPLIFICADO: Ocultar campos empresariales por defecto */
.erp-ai-hidden-in-simple {
    display: none !important;
    opacity: 0;
    visibility: hidden;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    transition: all 0.3s ease;
}

/* 📧 CAMPOS SIEMPRE VISIBLES (como el email) */
.erp-ai-always-visible {
    display: block !important;
    opacity: 1;
    visibility: visible;
}

/* 🏢 MODO EMPRESARIAL: Mostrar todos los campos cuando se activa */
body.erp-ai-modo-empresarial .erp-ai-hidden-in-simple {
    display: block !important;
    opacity: 1;
    visibility: visible;
    height: auto;
    margin: 0 0 1em 0;
    padding: initial;
    overflow: visible;
}

/* 🎯 CHECKOUT SIMPLIFICADO: Estilo para cuando está activo */
body.erp-ai-checkout-simplificado-activo .erp-ai-hidden-in-simple {
    display: none !important;
    opacity: 0;
    visibility: hidden;
}

/* ✨ TRANSICIONES SUAVES */
.woocommerce-checkout .form-row {
    transition: opacity 0.3s ease, transform 0.3s ease;
}

/* 🔧 CAMPOS ESPECÍFICOS PARA DEBUGGING */
.field-telefono.erp-ai-hidden-in-simple,
.field-tipo-factura.erp-ai-hidden-in-simple,
.field-tipo-persona.erp-ai-hidden-in-simple,
.field-nombre-completo.erp-ai-hidden-in-simple {
    /* Aplicar reglas de ocultación específicas */
    display: none !important;
}

/* 📱 RESPONSIVE: Mantener funcionalidad en móviles */
@media (max-width: 768px) {
    .erp-ai-hidden-in-simple {
        display: none !important;
    }
    
    body.erp-ai-modo-empresarial .erp-ai-hidden-in-simple {
        display: block !important;
    }
}

/* 🎨 ESTILOS ADICIONALES PARA EL CHECKBOX */
#erp_ai_require_fiscal_document,
#erp_ai_require_fiscal_document_billing {
    transform: scale(1.3);
    margin-right: 10px;
}

/* 📋 CONTENEDOR DEL CHECKBOX */
#erp-ai-checkbox-container {
    background: #f8f9fa;
    border: 2px solid #dee2e6;
    border-radius: 8px;
    padding: 15px;
    margin: 15px 0;
}

#erp-ai-checkbox-container:hover {
    border-color: #007cba;
    background: #e7f3ff;
}

/* ✅ ESTADO MARCADO DEL CHECKBOX */
input[type="checkbox"]:checked + label,
#erp-ai-checkbox-container:has(input:checked) {
    background: #d4edda;
    border-color: #28a745;
}

/* 🏷️ LABELS DE CAMPOS OBLIGATORIOS EN MODO EMPRESARIAL */
body.erp-ai-modo-empresarial .form-row.erp-ai-hidden-in-simple label .required {
    color: #dc3545;
    font-weight: bold;
}