/*
Theme Name: NotiTrabajos Child
Theme URI: https://notitrabajos.com/
Description: Tema hijo de Astra para NotiTrabajos. Sistema de diseño del rediseño 2026 (Archivo + IBM Plex Sans, paleta azul/lima, componentes de tarjetas, badges y footer).
Author: NotiTrabajos
Template: astra
Version: 1.0.1
Text Domain: notitrabajos-child
*/

/* ============================================================
   NOTITRABAJOS · SISTEMA DE DISEÑO (Fase 1 · estilos globales)
   Tokens tomados del handoff oficial del rediseño.
   ============================================================ */

:root {
  /* Marca */
  --nt-primary: #3F66DA;
  --nt-primary-hover: #2F4FB0;
  --nt-primary-dark: #2A46A0;
  --nt-primary-deep: #1E3480;
  --nt-accent: #DFF700;

  /* Superficies y fondos */
  --nt-page-bg: #EEF0F4;
  --nt-surface: #FFFFFF;
  --nt-surface-2: #EDF1FB;
  --nt-tint-blue: #EAF0FF;
  --nt-footer-bg: #0C0E13;

  /* Texto */
  --nt-ink: #0A1B3D;      /* títulos */
  --nt-body: #26303F;     /* cuerpo */
  --nt-body-2: #0B1220;
  --nt-muted: #5B6472;
  --nt-muted-2: #8792A3;
  --nt-muted-3: #46536A;

  /* Líneas */
  --nt-line: #E3E7EE;
  --nt-line-2: #EEF1F5;
  --nt-line-3: #DDE3EC;

  /* Estados */
  --nt-ok-bg: #E8FBF0;   --nt-ok-text: #0B8A4E;
  --nt-warn-bg: #FFF8E8; --nt-warn-border: #F5E4B8; --nt-warn-text: #7A5B12;

  /* País (texto / tinte) */
  --nt-co: #B45309; --nt-co-tint: #FBF1E3;
  --nt-cl: #1D4ED8; --nt-cl-tint: #EAF0FE;
  --nt-mx: #047857; --nt-mx-tint: #E7F6EF;
  --nt-pe: #BE123C; --nt-pe-tint: #FCE9EE;

  /* Formas */
  --nt-radius-card: 16px;
  --nt-radius-btn: 10px;
  --nt-radius-pill: 999px;
  --nt-shadow-hover: 0 20px 40px -22px rgba(11,18,32,0.35);
  --nt-shadow-soft: 0 1px 2px rgba(11,18,32,0.04);

  /* Layout */
  --nt-container: 1200px;
  --nt-read: 780px;

  /* Tipografía */
  --nt-font-head: "Archivo", system-ui, -apple-system, sans-serif;
  --nt-font-body: "IBM Plex Sans", system-ui, -apple-system, sans-serif;
}

/* ---------- Tipografía base ---------- */
body,
.ast-container,
p, li, span, input, textarea, button, select {
  font-family: var(--nt-font-body);
}

body {
  color: var(--nt-body);
  background: var(--nt-page-bg);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.site-title,
.entry-title,
.widget-title {
  font-family: var(--nt-font-head);
  color: var(--nt-ink);
  letter-spacing: -0.4px;
  text-wrap: balance;
}

h1, .entry-title { font-weight: 900; letter-spacing: -1px; }
h2 { font-weight: 800; letter-spacing: -0.6px; }
h3 { font-weight: 700; }

a { color: var(--nt-primary); text-decoration: none; }
a:hover, a:focus { color: var(--nt-primary-hover); }
::selection { background: #D6E0FB; }

/* ---------- Botones (Astra + genéricos) ---------- */
.wp-block-button__link,
.ast-button,
button.menu-toggle,
input[type="submit"],
.nt-btn {
  font-family: var(--nt-font-body);
  font-weight: 700;
  background: var(--nt-primary);
  color: #fff;
  border: none;
  border-radius: var(--nt-radius-btn);
  padding: 12px 22px;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.wp-block-button__link:hover,
.ast-button:hover,
input[type="submit"]:hover,
.nt-btn:hover {
  background: var(--nt-primary-hover);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 12px 24px -10px rgba(0,0,0,0.4);
}
.nt-btn--accent { background: var(--nt-accent); color: var(--nt-primary-dark); }
.nt-btn--accent:hover { background: #EEFF3B; color: var(--nt-primary-dark); }
.nt-btn--ghost { background: var(--nt-primary-dark); }
.nt-btn--ghost:hover { background: var(--nt-primary-deep); }

/* Botones de Spectra (UAGB) y Astra → azul de marca (gana en especificidad) */
.uagb-post__cta .wp-block-button__link,
.wp-block-uagb-buttons .wp-block-button__link,
.uagb-post__text .wp-block-button__link,
.wp-block-button .wp-block-button__link,
.ast-custom-button,
.ast-button,
.entry-content .wp-block-button__link {
  background-color: var(--nt-primary) !important;
  color: #fff !important;
  border-color: var(--nt-primary) !important;
}
.uagb-post__cta .wp-block-button__link:hover,
.wp-block-uagb-buttons .wp-block-button__link:hover,
.uagb-post__text .wp-block-button__link:hover,
.wp-block-button .wp-block-button__link:hover,
.ast-custom-button:hover,
.ast-button:hover,
.entry-content .wp-block-button__link:hover {
  background-color: var(--nt-primary-hover) !important;
  color: #fff !important;
}

/* ---------- Componente: tarjeta ---------- */
.nt-card {
  background: var(--nt-surface);
  border: 1px solid var(--nt-line);
  border-radius: var(--nt-radius-card);
  box-shadow: var(--nt-shadow-soft);
  overflow: hidden;
  transition: transform .34s cubic-bezier(.2,.7,.2,1), box-shadow .34s ease, border-color .34s ease;
}
.nt-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--nt-shadow-hover);
  border-color: #C6D2EA;
}

/* ---------- Badges / etiquetas ---------- */
.nt-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-weight: 700;
  font-size: 11.5px;
  padding: 3px 9px;
  border-radius: 6px;
}
.nt-badge--ok { background: var(--nt-ok-bg); color: var(--nt-ok-text); }
.nt-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 15px;
  border-radius: var(--nt-radius-pill);
  font-weight: 600;
  font-size: 14px;
  border: 1px solid var(--nt-line);
  background: #fff;
  color: var(--nt-body-2);
  cursor: pointer;
}
.nt-chip.is-active,
.nt-chip[aria-current="true"] {
  background: var(--nt-primary);
  border-color: var(--nt-primary);
  color: #fff;
}

/* ---------- Aviso antifraude ---------- */
.nt-notice {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--nt-warn-bg);
  border: 1px solid var(--nt-warn-border);
  border-radius: 14px;
  padding: 15px 18px;
  color: var(--nt-warn-text);
  font-size: 14.5px;
  line-height: 1.5;
}

/* ---------- Acentos por país ---------- */
.nt-co { color: var(--nt-co); } .nt-co-bg { background: var(--nt-co-tint); }
.nt-cl { color: var(--nt-cl); } .nt-cl-bg { background: var(--nt-cl-tint); }
.nt-mx { color: var(--nt-mx); } .nt-mx-bg { background: var(--nt-mx-tint); }
.nt-pe { color: var(--nt-pe); } .nt-pe-bg { background: var(--nt-pe-tint); }

/* ---------- Contenedor de lectura (artículos) ---------- */
.single .entry-content,
.nt-read {
  max-width: var(--nt-read);
  margin-left: auto;
  margin-right: auto;
}
.single .entry-content { font-size: 17px; line-height: 1.72; color: var(--nt-body); }
.single .entry-content h2 { font-size: 24px; margin: 30px 0 12px; }

/* ---------- Footer oscuro ---------- */
.site-footer,
.ast-small-footer,
footer.site-footer {
  background: var(--nt-footer-bg) !important;
  color: #A9B2C6;
}
.site-footer a { color: #A9B2C6; }
.site-footer a:hover { color: var(--nt-accent); }

/* ---------- Animaciones (respeta reduce-motion) ---------- */
@keyframes nt-reveal { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
.nt-reveal { opacity: 0; }
.nt-reveal.is-in { animation: nt-reveal .6s cubic-bezier(.2,.7,.2,1) both; }

@keyframes nt-livepulse {
  0%   { box-shadow: 0 0 0 0 rgba(223,247,0,0.7); }
  70%  { box-shadow: 0 0 0 9px rgba(223,247,0,0); }
  100% { box-shadow: 0 0 0 0 rgba(223,247,0,0); }
}
.nt-live-dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--nt-accent);
  animation: nt-livepulse 1.6s ease-out infinite;
}

@keyframes nt-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.nt-marquee { display: flex; width: max-content; animation: nt-marquee 28s linear infinite; }
.nt-marquee:hover { animation-play-state: paused; }

@media (prefers-reduced-motion: reduce) {
  .nt-reveal, .nt-live-dot, .nt-marquee { animation: none !important; opacity: 1 !important; transform: none !important; }
}

/* ---------- Cabecera (override del Header Builder de Astra) ---------- */
/* Barra superior */
.ast-above-header-bar,
.ast-above-header-wrap {
  background-color: var(--nt-primary-dark) !important;
}
.ast-above-header-bar a,
.ast-above-header-bar .ast-builder-social-element { color: #DBE4FB !important; }

/* Barra principal de la cabecera */
.ast-primary-header-bar,
.main-header-bar,
.site-primary-header-wrap,
.ast-mobile-header-wrap .ast-primary-header-bar {
  background-color: var(--nt-primary) !important;
  border-bottom: 1px solid rgba(255,255,255,0.18) !important;
}

/* Enlaces del menú principal en blanco, hover/actual en lima */
.ast-primary-header-bar .main-header-menu a,
.ast-primary-header-bar .ast-nav-menu a {
  color: #EFF3FE !important;
}
.ast-primary-header-bar .main-header-menu a:hover,
.ast-primary-header-bar .main-header-menu .current-menu-item > a,
.ast-primary-header-bar .main-header-menu .current-menu-ancestor > a {
  color: var(--nt-accent) !important;
}

/* Submenús desplegables: fondo blanco, texto oscuro */
.ast-primary-header-bar .main-header-menu .sub-menu {
  background-color: #fff !important;
  border: 1px solid var(--nt-line) !important;
  box-shadow: 0 18px 40px -16px rgba(11,18,32,0.4) !important;
}
.ast-primary-header-bar .main-header-menu .sub-menu a { color: var(--nt-ink) !important; }
.ast-primary-header-bar .main-header-menu .sub-menu a:hover { color: var(--nt-primary) !important; background: #F2F4F8 !important; }

/* Iconos sociales y buscador de la cabecera en claro */
.ast-primary-header-bar .header-social-item,
.ast-primary-header-bar .ast-icon { color: #EFF3FE !important; }

/* Botón/hamburguesa móvil */
.ast-mobile-menu-trigger-minimal { color: #fff !important; }

/* ---------- Ajustes responsive ---------- */
@media (max-width: 921px) {
  h1, .entry-title { font-size: 38px; }
}
@media (max-width: 544px) {
  h1, .entry-title { font-size: 31px; }
}