/*
Theme Name: ISMX IA
Theme URI: 
Author: Alejandro
Author URI: 
Description: Tema para AgentesClick usando Arquitectura Virtual Componentizada y Bootstrap 5.3
Version: 1.0
License: 
License URI: 
Text Domain: ismx-ia
Tags: 
*/

:root {
    /* Paleta Premium Basada en #01579b */
    --ismx-primary: #01579b;       /* Deep Ocean Blue (Logo) */
    --ismx-primary-dark: #003c6c;  /* Variante más oscura para hovers */
    --ismx-primary-light: #4f83cc; /* Variante más clara */
    
    --ismx-secondary: #ffb300;     /* Dorado/Ámbar elegante (contraste) */
    --ismx-secondary-dark: #c68400;

    --ismx-dark: #1e293b;          /* Texto principal oscuro, no negro puro */
    --ismx-gray: #64748b;          /* Textos secundarios */
    --ismx-light: #f8fafc;         /* Fondos grises súper claros */
    --ismx-white: #ffffff;

    /* Tipografía Global */
    --ismx-font-family: 'Outfit', system-ui, -apple-system, sans-serif;
    --ismx-font-headings: 'Yanone Kaffeesatz', sans-serif;
    --ismx-font-logo: 'Marcellus SC', serif;
}

/* ==========================================================================
   Sobreescritura Global de Bootstrap y Base
   ========================================================================== */
body {
    font-family: var(--ismx-font-family);
    color: var(--ismx-dark);
    background-color: var(--ismx-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--ismx-font-headings);
    font-weight: 700;
    color: var(--ismx-primary);
    letter-spacing: -0.02em;
}

/* Títulos con Yanone Kaffeesatz (como es condensada, ocupan ser un poco más grandes) */
h1, .h1 { font-size: clamp(2.5rem, 5vw, 4.5rem) !important; }
h2, .h2 { font-size: clamp(2rem, 4vw, 3.5rem) !important; }
h3, .h3 { font-size: clamp(1.75rem, 3vw, 2.5rem) !important; }
h4, .h4 { font-size: clamp(1.5rem, 2vw, 2rem) !important; }
h5, .h5 { font-size: clamp(1.25rem, 1.5vw, 1.5rem) !important; }
h6, .h6 { font-size: 1.1rem !important; }

/* Specific styles for the brand/logo */
.navbar-brand {
    font-family: 'Marcellus SC', serif !important;
    font-size: clamp(1.8rem, 5vw, 2.3rem); /* Escala dinámicamente: max 2.3rem, min 1.8rem en celulares muy pequeños */
    color: var(--ismx-primary) !important;
    display: inline-flex;
    align-items: center;
    font-weight: 400; 
    letter-spacing: 0.5px;
    
    /* TRUCO: Como Marcellus no tiene Bold nativo, simulamos grosor fino */
    -webkit-text-stroke: 0.4px var(--ismx-primary);
    text-stroke: 0.4px var(--ismx-primary);
}

.navbar-brand img {
    height: 45px;
    margin-right: 12px;
}

a {
    color: var(--ismx-primary);
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}

a:hover {
    color: var(--ismx-secondary);
}

/* Clases Utilitarias para la Paleta (Compatibles con nombres de Bootstrap) */
.text-primary { color: var(--ismx-primary) !important; }
.text-primary-light { color: var(--ismx-primary-light) !important; }
.text-secondary { color: var(--ismx-secondary) !important; }
.bg-primary { background-color: var(--ismx-primary) !important; }
.bg-secondary { background-color: var(--ismx-secondary) !important; }
.bg-light { background-color: var(--ismx-light) !important; }
.hover-white { transition: color 0.2s ease; }
.hover-white:hover { color: #ffffff !important; }

.btn-primary {
    background-color: var(--ismx-primary);
    border-color: var(--ismx-primary);
    font-weight: 500;
    padding: 0.5rem 1.5rem;
    border-radius: 8px; /* Bordes ligeramente redondeados para look premium */
    transition: all 0.3s ease;
}

.btn-primary:hover, .btn-primary:focus {
    background-color: var(--ismx-primary-dark);
    border-color: var(--ismx-primary-dark);
    box-shadow: 0 4px 12px rgba(1, 87, 155, 0.3);
    transform: translateY(-1px);
}

.btn-secondary {
    background-color: var(--ismx-secondary);
    border-color: var(--ismx-secondary);
    color: var(--ismx-dark);
    font-weight: 500;
    padding: 0.5rem 1.5rem;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.btn-secondary:hover, .btn-secondary:focus {
    background-color: var(--ismx-secondary-dark);
    border-color: var(--ismx-secondary-dark);
    color: #fff;
    box-shadow: 0 4px 12px rgba(255, 179, 0, 0.3);
    transform: translateY(-1px);
}

/* ==========================================================================
   Contenedor Principal al 95% de Ancho
   ========================================================================== */
.container,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
    max-width: 95% !important;
}