/* ============================================
   LEGAL CORE - Variables y Estilos Base
   Meloopets Child Theme
   ============================================ */

/* ============================================
   VARIABLES CSS
   ============================================ */
:root {
    /* Colores principales */
    --legal-primary: #FF6B35;
    --legal-primary-light: #FFE8E0;
    --legal-primary-dark: #E55A2B;
    
    /* Colores de texto */
    --legal-text-primary: #1F2937;
    --legal-text-secondary: #6B7280;
    --legal-text-light: #9CA3AF;
    
    /* Fondos */
    --legal-bg-white: #FFFFFF;
    --legal-bg-light: #F9FAFB;
    --legal-bg-gray: #F3F4F6;
    
    /* Bordes */
    --legal-border: #E5E7EB;
    --legal-border-light: #F3F4F6;
    
    /* Acentos */
    --legal-success: #10B981;
    --legal-info: #3B82F6;
    --legal-warning: #F59E0B;
    
    /* Spacing */
    --legal-spacing-xs: 8px;
    --legal-spacing-sm: 12px;
    --legal-spacing-md: 16px;
    --legal-spacing-lg: 24px;
    --legal-spacing-xl: 32px;
    --legal-spacing-2xl: 48px;
    --legal-spacing-3xl: 64px;
    
    /* Tipografía */
    --legal-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --legal-font-size-base: 16px;
    --legal-line-height-base: 1.8;
    --legal-line-height-headings: 1.3;
    
    /* Tamaños de fuente */
    --legal-font-xs: 13px;
    --legal-font-sm: 14px;
    --legal-font-md: 16px;
    --legal-font-lg: 18px;
    --legal-font-xl: 20px;
    --legal-font-2xl: 24px;
    --legal-font-3xl: 30px;
    --legal-font-4xl: 36px;
    
    /* Font weights */
    --legal-font-normal: 400;
    --legal-font-medium: 500;
    --legal-font-semibold: 600;
    --legal-font-bold: 700;
    
    /* Ancho máximo */
    --legal-max-width: 800px;
    --legal-max-width-wide: 1000px;
    
    /* Border radius */
    --legal-radius-sm: 6px;
    --legal-radius-md: 8px;
    --legal-radius-lg: 12px;
    
    /* Shadows */
    --legal-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --legal-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --legal-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

/* ============================================
   CONTENEDOR PRINCIPAL
   ============================================ */
.ct-container-full .legal-page,
body.legal-page {
    font-family: var(--legal-font-family);
    color: var(--legal-text-primary);
    background-color: var(--legal-bg-white);
}

.ct-container-full article.page.type-page,
.ct-container-full article.page.type-page *,
body.legal-page article.page *,
body.legal-page .entry-content * {
    font-family: var(--legal-font-family);
}

/* Article principal */
.ct-container-full article.page.type-page,
body.legal-page article.page.type-page {
    max-width: 100%;
    margin: 0 auto;
}

/* Hero Section */
.ct-container-full .legal-page .hero-section,
body.legal-page .hero-section.is-width-constrained {
    background-color: var(--legal-primary);
    padding: var(--legal-spacing-xl) var(--legal-spacing-lg);
    margin-top: var(--legal-spacing-xl);
    margin-bottom: var(--legal-spacing-2xl);
    border-radius: var(--legal-radius-lg);
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.15);
}

/* Entry Content - Contenedor principal del texto */
.ct-container-full article.page .entry-content.is-layout-constrained,
body.legal-page article.page .entry-content {
    max-width: var(--legal-max-width);
    margin: 0 auto;
    padding: 0 var(--legal-spacing-lg) var(--legal-spacing-3xl);
    background-color: var(--legal-bg-white);
}

/* ============================================
   ELEMENTOS BASE
   ============================================ */

/* Links */
.ct-container-full article.page .entry-content a,
body.legal-page article.page .entry-content a {
    color: var(--legal-primary);
    text-decoration: underline;
    text-decoration-color: var(--legal-primary-light);
    text-underline-offset: 3px;
    transition: all 0.2s ease;
}

.ct-container-full article.page .entry-content a:hover,
body.legal-page article.page .entry-content a:hover {
    color: var(--legal-primary-dark);
    text-decoration-color: var(--legal-primary);
}

.ct-container-full article.page .entry-content a:focus,
body.legal-page article.page .entry-content a:focus {
    outline: 2px solid var(--legal-primary);
    outline-offset: 2px;
    border-radius: 2px;
}

/* Strong/Bold */
.ct-container-full article.page .entry-content strong,
.ct-container-full article.page .entry-content b,
body.legal-page article.page .entry-content strong,
body.legal-page article.page .entry-content b {
    font-weight: var(--legal-font-bold);
    color: var(--legal-text-primary);
}

/* Emphasis */
.ct-container-full article.page .entry-content em,
.ct-container-full article.page .entry-content i,
body.legal-page article.page .entry-content em,
body.legal-page article.page .entry-content i {
    font-style: italic;
    color: var(--legal-text-secondary);
}

/* ============================================
   UTILIDADES
   ============================================ */

/* Badge de última actualización */
.legal-last-updated {
    display: inline-block;
    padding: var(--legal-spacing-xs) var(--legal-spacing-md);
    background-color: var(--legal-bg-light);
    border: 1px solid var(--legal-border);
    border-radius: var(--legal-radius-md);
    font-size: var(--legal-font-sm);
    color: var(--legal-text-secondary);
    margin-bottom: var(--legal-spacing-xl);
}

.legal-last-updated svg {
    width: 14px;
    height: 14px;
    vertical-align: middle;
    margin-right: var(--legal-spacing-xs);
}

/* Highlight box */
.legal-highlight {
    background-color: var(--legal-primary-light);
    border-left: 4px solid var(--legal-primary);
    padding: var(--legal-spacing-lg);
    margin: var(--legal-spacing-xl) 0;
    border-radius: var(--legal-radius-md);
}

.legal-highlight p:last-child {
    margin-bottom: 0;
}

/* Info box */
.legal-info-box {
    background-color: var(--legal-bg-light);
    border: 1px solid var(--legal-border);
    border-radius: var(--legal-radius-lg);
    padding: var(--legal-spacing-lg);
    margin: var(--legal-spacing-xl) 0;
}

/* Divider */
.legal-divider {
    height: 1px;
    background-color: var(--legal-border-light);
    margin: var(--legal-spacing-2xl) 0;
    border: none;
}