/*
Theme Name:   Mersan Tours Child
Theme URI:    https://mersantours.com
Description:  Tema hijo de Travel Agency (Rara Themes) para Mersan Tours. Contiene únicamente
              personalizaciones propias de Mersan Tours. No modificar el tema padre directamente.
Author:       Mersan Tours
Author URI:   https://mersantours.com
Template:     travel-agency
Version:      0.3.0
Text Domain:  mersan-tours-child

IMPORTANTE — VERIFICAR ANTES DE ACTIVAR:
El valor de "Template:" debe coincidir EXACTAMENTE con el nombre de la carpeta del tema padre
dentro de wp-content/themes/ en el servidor. Si el tema padre "Travel Agency" (Rara Themes) se
instaló con un slug distinto a "travel-agency", cambia esa línea antes de activar este tema,
o WordPress no podrá vincular el tema hijo y el sitio se romperá.

Cómo comprobarlo: Hostinger → Administrador de archivos (o FTP) → wp-content/themes/ → anotar
el nombre exacto de la carpeta del tema padre.
*/

/* ==========================================================================
   SISTEMA DE COLOR — MERSAN TOURS
   Capa 1 (PALETA): los colores en bruto. Solo se usan aquí abajo, en la capa 2.
   Capa 2 (ROLES): qué color lleva cada tipo de elemento. Los componentes
   (botones, iconos, cintas…) SOLO usan roles, nunca hex ni la paleta.
   → Para cambiar el color de un tipo de elemento en todo el sitio,
     cambia su ROL. Para cambiar un tono de marca, cambia la PALETA.
   ========================================================================== */
:root{
  /* ---------- Capa 1: paleta ---------- */
  --mersan-orange:      #F77F00;
  --mersan-orange-dark: #D96C00;
  --mersan-blue:        #0094FF;
  --mersan-blue-dark:   #0077CC;
  --mersan-navy:        #0B2E4A;
  --mersan-sand:        #FFF4E6;
  --mersan-gray-soft:   #F5F6F8;
  --mersan-gray-line:   #DCDCDC;
  --mersan-text:        #4A4A4A;
  --mersan-white:       #FFFFFF;
  --mersan-wa-green:    #25D366;  /* verde oficial de WhatsApp (por si se quiere usar) */

  /* ---------- Capa 2: roles ---------- */
  /* Texto */
  --role-heading:          var(--mersan-navy);
  --role-text:             var(--mersan-text);
  --role-text-muted:       #6B6B6B;
  --role-link:             var(--mersan-orange);

  /* Acentos (líneas bajo títulos, cintas de precio, menú activo) */
  --role-accent:           var(--mersan-orange);
  --role-accent-dark:      var(--mersan-orange-dark);

  /* Botón principal (acción: Descargar, Enviar, Solicitar…) */
  --role-btn-primary-bg:       var(--mersan-orange);
  --role-btn-primary-bg-hover: var(--mersan-orange-dark);
  --role-btn-primary-fg:       var(--mersan-white);

  /* Botón secundario (alternativa: Ver en otra pestaña…) */
  --role-btn-secondary-bg:       var(--mersan-white);
  --role-btn-secondary-fg:       var(--mersan-blue);
  --role-btn-secondary-border:   var(--mersan-blue);
  --role-btn-secondary-bg-hover: var(--mersan-blue);
  --role-btn-secondary-fg-hover: var(--mersan-white);

  /* WhatsApp (botón flotante y botones "Escríbenos por WhatsApp")
     Para el verde oficial: cambia orange → wa-green en las dos primeras líneas. */
  --role-whatsapp-bg:       var(--mersan-orange);
  --role-whatsapp-bg-hover: var(--mersan-orange-dark);
  --role-whatsapp-fg:       var(--mersan-white);

  /* Iconos en círculo (contacto, tarjetas, redes) */
  --role-icon-bg:          var(--mersan-orange);
  --role-icon-fg:          var(--mersan-white);
  --role-icon-alt:         var(--mersan-blue);   /* iconos de línea (✓ de "Por qué viajar…") */

  /* Pie de página */
  --role-footer-bg:        var(--mersan-navy);

  /* Superficies */
  --role-surface-soft:     var(--mersan-gray-soft);
  --role-border:           var(--mersan-gray-line);

  /* Compatibilidad: nombres antiguos que aún usan header.css/footer.css */
  --mersan-color-primary:       var(--role-accent);
  --mersan-color-primary-dark:  var(--role-accent-dark);
  --mersan-color-text:          var(--role-text);
  --mersan-color-text-muted:    var(--role-text-muted);

  /* Tipografía y formas */
  --mersan-font-heading: 'Poppins', sans-serif;
  --mersan-font-body:    'Poppins', sans-serif;
  --mersan-radius-card:  14px;
  --mersan-radius-btn:   8px;
  --mersan-shadow-card:  0 8px 24px rgba(0,0,0,0.08);
}

/* Sustituye el verde del tema padre (Travel Agency define sus colores en :root).
   html:root tiene más especificidad, así gana sin depender del orden de carga. */
html:root{
  --primary-color: var(--role-accent);
  --primary-color-rgb: 247, 127, 0;
  --secondary-color: var(--role-link);
  --secondary-color-rgb: 247, 127, 0;
  --primary-font-color: var(--role-text);
  --heading-font-color: var(--role-heading);

  /* Espaciados que usan bloques ya creados en las páginas y que el tema no define */
  --wp--preset--spacing--64: 64px;
  --wp--preset--spacing--100: 100px;
}

/* Los estilos reales viven en assets/css/custom.css para mantener este
   archivo limpio (WordPress exige que exista y tenga la cabecera de arriba).
   Se carga por separado desde functions.php. */