/*
Theme Name: Emplearme Premium
Theme URI: https://emplear.me/
Author: Antigravity AI
Author URI: https://emplear.me/
Description: Tema premium diseñado a medida para emplear.me. Cuenta con integración avanzada de WP Job Manager y BuddyPress, diseño ultra rápido enfocado en SEO y estética moderna y responsiva.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: emplearme
*/

/* ==========================================================================
   1. VARIABLES Y DISEÑO DEL SISTEMA (CSS VARIABLES)
   ========================================================================== */
:root {
    /* Colores */
    --color-primary: #048dde;
    --color-primary-hover: #0372b5;
    --color-primary-light: rgba(4, 141, 222, 0.1);
    --color-secondary: #001d2d;
    --color-dark-bg: #0b151b;
    --color-light-bg: #f8fafc;
    --color-card-bg: #ffffff;
    --color-text-main: #1e293b;
    --color-text-muted: #64748b;
    --color-border: #e2e8f0;
    
    /* Tipografías */
    --font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    
    /* Sombras y Bordes */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-full: 9999px;
    
    /* Transiciones */
    --transition-fast: all 0.2s ease;
    --transition-normal: all 0.3s ease;
}

/* Reset básico y estilos base */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.6;
    color: var(--color-text-main);
    background-color: var(--color-light-bg);
    -webkit-font-smoothing: antialiased;
}

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: var(--transition-fast);
}

a:hover {
    color: var(--color-primary-hover);
}

/* Clases utilitarias de contenedor */
.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}