/*
 * Theme Name:  Almacén Child
 * Description: Tema hijo de GeneratePress para el sitio Almacén
 * Template:    generatepress
 * Version:     1.0
 * Author:      Roberto Negro
 */


/* ═══════════════════════════════════════════════════════════════════
   00 — TOKENS DE DISEÑO
   ═══════════════════════════════════════════════════════════════════ */

:root {
  --alm-bg:              #faf9f6;
  --alm-ink:             #201d19;
  --alm-ink2:            #6b6259;
  --alm-ink3:            #aeaaa4;
  --alm-rule:            #e6e3dc;
  --alm-tag-pajaros:     #f4ecc8;
  --alm-tag-otros:       #dcefd8;
  --alm-tag-reflexiones: #eaeae8;
  --alm-lora:            'Lora', Georgia, serif;
  --alm-serif:           'Source Serif 4', Georgia, serif;

  /* Sobreescribir variables de color de GeneratePress */
  --gen-background-color:        var(--alm-bg);
  --gen-header-background-color: var(--alm-bg);
  --gen-footer-background-color: var(--alm-bg);
  --gen-footer-bar-background:   var(--alm-bg);
}


/* ═══════════════════════════════════════════════════════════════════
   01 — GLOBAL / BODY
   ═══════════════════════════════════════════════════════════════════ */

body {
  background-color: var(--alm-bg);
  color:            var(--alm-ink);
  font-family:      var(--alm-serif);
  font-size:        16.5px;
  font-weight:      300;
  line-height:      1.82;
  -webkit-font-smoothing: antialiased;
}

/* Eliminar sombras y bordes del contenedor GP */
.site-content,
#content,
.grid-container {
  box-shadow: none !important;
}

/* Sin padding extra en #primary */
#primary { padding: 0 !important; }


/* ═══════════════════════════════════════════════════════════════════
   02 — CABECERA Y NAVEGACIÓN
   (los estilos críticos de fondo y layout van inline en header.php)
   ═══════════════════════════════════════════════════════════════════ */

/* Wordmark */
.site-wordmark {
  font-family:     var(--alm-lora);
  font-size:       17px;
  font-weight:     400;
  color:           var(--alm-ink);
  letter-spacing:  -0.01em;
  text-decoration: none;
}
.site-wordmark:hover { color: var(--alm-ink); }

/* Ítems de navegación — sin fondo en ningún estado */
.nav-primary .nav-menu > li,
.nav-primary .nav-menu > li > a,
#site-navigation .nav-menu > li,
#site-navigation .nav-menu > li > a,
body .main-navigation ul li,
body .main-navigation ul li a {
  background:       none !important;
  background-color: transparent !important;
}

.nav-primary .nav-menu > li > a,
#site-navigation .nav-menu > li > a {
  font-family:     var(--alm-serif) !important;
  font-size:       12.5px !important;
  font-weight:     400 !important;
  color:           var(--alm-ink2) !important;
  letter-spacing:  0.01em;
  text-decoration: none !important;
  padding:         0 !important;
  background:      none !important;
}

.nav-primary .nav-menu > li > a:hover {
  color:      var(--alm-ink) !important;
  background: none !important;
}

.nav-primary .nav-menu > li.current-menu-item > a,
.nav-primary .nav-menu > li.current_page_item > a {
  color:          var(--alm-ink) !important;
  border-bottom:  1px solid var(--alm-ink);
  padding-bottom: 1px !important;
}

/* Campo de búsqueda */
.header-search {
  display:       flex;
  align-items:   center;
  gap:           6px;
  border-bottom: 1px solid var(--alm-rule);
  padding-bottom: 2px;
}

.header-search input[type="search"] {
  font-family: var(--alm-serif);
  font-size:   12.5px;
  color:       var(--alm-ink3);
  background:  none;
  border:      none;
  outline:     none;
  box-shadow:  none;
  padding:     0;
  width:       70px;
}

.header-search input[type="search"]::placeholder { color: var(--alm-ink3); }
.menu-toggle { display: none; }


/* ═══════════════════════════════════════════════════════════════════
   03 — ÍNDICE (front-page y category)
   ═══════════════════════════════════════════════════════════════════ */

/* Cabecera de año — 20% más grande, sin línea, más espacio superior */
.almacen-year-header {
  font-family:    var(--alm-serif);
  font-size:      20px;
  font-weight:    400;
  color:          var(--alm-ink3);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding-top:    20px;   /* con los 10px del padding-bottom de la última entrada
                             = 30px total entre entrada y año siguiente (1.5× los
                             20px entre entradas del mismo año) */
  padding-bottom: 10px;
  border-top:     none;   /* sin línea separadora */
  margin-bottom:  0;
  margin-top:     10px;   /* refuerzo del espacio extra */
}

/* Fila de entrada — sin separadores */
.almacen-entry-row {
  display:       flex;
  align-items:   flex-start;
  gap:           16px;
  padding:       10px 0;
  border:        none;
  margin-bottom: 0;
  background:    none;
  box-shadow:    none;
}

/* Thumbnail */
.entry-thumb {
  width:       64px;
  min-width:   64px;
  height:      64px;
  flex-shrink: 0;
  overflow:    hidden;
  border-radius: 6px;
  margin-top:  2px;
}
.entry-thumb img {
  width:       100%;
  height:      100%;
  object-fit:  cover;
  display:     block;
  border-radius: 6px;
  filter:      grayscale(1);
}
.entry-thumb--empty {
  width:     64px;
  min-width: 64px;
  height:    64px;
  flex-shrink: 0;
}

/* Título en el índice */
.almacen-entry-row .entry-title {
  font-family: var(--alm-lora);
  font-size:   17px;
  font-weight: 400;
  color:       var(--alm-ink);
  line-height: 1.28;
  margin:      0;
}
.almacen-entry-row .entry-title a {
  color:           var(--alm-ink);
  text-decoration: none;
}
.almacen-entry-row .entry-title a:hover { color: var(--alm-ink2); }

/* Resumen opcional */
.entry-excerpt {
  font-family: var(--alm-serif);
  font-size:   13px;
  font-weight: 300;
  color:       var(--alm-ink2);
  line-height: 1.6;
  margin:      4px 0 0;
}

/* Cabecera de categoría */
.almacen-cat-header {
  font-family:    var(--alm-lora);
  font-size:      22px;
  font-weight:    400;
  color:          var(--alm-ink);
  letter-spacing: -0.01em;
  padding-top:    32px;
  padding-bottom: 24px;
}


/* ═══════════════════════════════════════════════════════════════════
   04 — ETIQUETAS DE CATEGORÍA
   ═══════════════════════════════════════════════════════════════════ */

.almacen-tag {
  font-family:     var(--alm-serif);
  font-size:       10.5px;
  font-weight:     400;
  letter-spacing:  0.04em;
  color:           var(--alm-ink2);
  padding:         2px 8px;
  display:         inline-block;
  border-radius:   0;
  text-decoration: none;
  white-space:     nowrap;
  line-height:     1.6;
}
.almacen-tag.tag-pajaros     { background: var(--alm-tag-pajaros); }
.almacen-tag.tag-otros       { background: var(--alm-tag-otros); }
.almacen-tag.tag-reflexiones { background: var(--alm-tag-reflexiones); }


/* ═══════════════════════════════════════════════════════════════════
   05 — ARTÍCULO INDIVIDUAL
   ═══════════════════════════════════════════════════════════════════ */

/* Título */
.single .entry-title,
h1.entry-title {
  font-family:    var(--alm-lora) !important;
  font-size:      40px !important;
  font-weight:    400 !important;
  color:          var(--alm-ink) !important;
  line-height:    1.13 !important;
  letter-spacing: -0.03em;
  margin-top:     12px !important;
  margin-bottom:  12px !important;
}

/* Meta */
.entry-meta {
  font-family: var(--alm-serif);
  font-size:   12px;
  color:       var(--alm-ink3);
  display:     flex;
  gap:         14px;
  flex-wrap:   wrap;
  margin-bottom: 36px;
}

/* Cuerpo */
.entry-content p {
  font-family:   var(--alm-serif);
  font-size:     16.5px;
  font-weight:   300;
  color:         var(--alm-ink);
  line-height:   1.82;
  margin-bottom: 22px;
}

.category-reflexiones .entry-content p {
  font-size:   17px;
  line-height: 1.84;
  margin-bottom: 26px;
}

/* Headings */
.entry-content h2 {
  font-family:    var(--alm-lora);
  font-size:      24px;
  font-weight:    400;
  color:          var(--alm-ink);
  line-height:    1.3;
  letter-spacing: -0.02em;
  margin:         40px 0 16px;
}

.entry-content h3 {
  font-family:    var(--alm-serif);
  font-size:      13px;
  font-weight:    500;
  color:          var(--alm-ink3);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin:         36px 0 12px;
}

.entry-content a {
  color:                  var(--alm-ink);
  text-decoration:        underline;
  text-decoration-color:  var(--alm-rule);
  text-underline-offset:  3px;
}
.entry-content a:hover { text-decoration-color: var(--alm-ink2); }


/* ═══════════════════════════════════════════════════════════════════
   06 — IMÁGENES Y PIE DE FOTO
   ═══════════════════════════════════════════════════════════════════ */

.entry-content img,
.entry-content .wp-block-image img {
  display:       block;
  max-width:     820px;
  width:         100%;
  height:        auto;
  border-radius: 0 !important;
  margin-bottom: 9px;
}

.entry-content figcaption,
.entry-content .wp-element-caption {
  font-family:   var(--alm-serif);
  font-size:     12.5px;
  font-style:    italic;
  color:         var(--alm-ink3);
  line-height:   1.55;
  margin-bottom: 30px;
}

.entry-content figure { margin: 0; }

.category-reflexiones .entry-content img {
  filter: grayscale(1);
}


/* ═══════════════════════════════════════════════════════════════════
   07 — BLOQUE TAXONÓMICO
   ═══════════════════════════════════════════════════════════════════ */

.almacen-taxonomy {
  border-left:   2.5px solid var(--alm-tag-pajaros);
  padding-left:  18px;
  margin-bottom: 44px;
}

.almacen-taxonomy .taxo-row {
  font-family: var(--alm-serif);
  font-size:   13px;
  color:       var(--alm-ink2);
  line-height: 2.1;
  display:     block;
}

.almacen-taxonomy .taxo-key {
  font-size:      10.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color:          var(--alm-ink3);
  font-weight:    400;
  font-style:     normal;
  margin-right:   8px;
}


/* ═══════════════════════════════════════════════════════════════════
   08 — PULLQUOTE / BLOCKQUOTE
   ═══════════════════════════════════════════════════════════════════ */

.entry-content blockquote,
.entry-content .wp-block-quote {
  border-top:    1px solid var(--alm-tag-pajaros) !important;
  border-bottom: 1px solid var(--alm-tag-pajaros) !important;
  border-left:   none !important;
  border-right:  none !important;
  padding:       24px 0 !important;
  margin:        36px 0 !important;
  background:    none !important;
}

.entry-content blockquote p,
.entry-content .wp-block-quote p {
  font-family:    var(--alm-lora);
  font-size:      21px;
  font-style:     italic;
  color:          var(--alm-ink);
  line-height:    1.5;
  letter-spacing: -0.01em;
  font-weight:    400;
  margin-bottom:  0 !important;
}


/* ═══════════════════════════════════════════════════════════════════
   09 — PAGINACIÓN
   ═══════════════════════════════════════════════════════════════════ */

.pagination, .page-numbers {
  display:     flex;
  align-items: center;
  gap:         6px;
  padding-top: 40px;
}

.page-numbers a,
.page-numbers span {
  font-family:     var(--alm-serif);
  font-size:       12.5px;
  color:           var(--alm-ink2);
  width:           28px;
  height:          28px;
  display:         flex;
  align-items:     center;
  justify-content: center;
  text-decoration: none;
  background:      transparent;
  border-radius:   0;
}

.page-numbers .current {
  background-color: var(--alm-tag-pajaros) !important;
  color:            var(--alm-ink) !important;
}


/* ═══════════════════════════════════════════════════════════════════
   10 — NAVEGACIÓN ANTERIOR / SIGUIENTE
   ═══════════════════════════════════════════════════════════════════ */

.post-navigation {
  padding-top:    28px;
  border-top:     1px solid var(--alm-rule);
  display:        flex;
  justify-content: space-between;
  align-items:    flex-start;
}

.post-navigation .nav-previous .nav-label,
.post-navigation .nav-next .nav-label {
  display:        block;
  font-family:    var(--alm-serif);
  font-size:      10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color:          var(--alm-ink3);
  margin-bottom:  4px;
}

.post-navigation .nav-previous a,
.post-navigation .nav-next a {
  font-family:     var(--alm-lora);
  font-size:       14.5px;
  font-weight:     400;
  color:           var(--alm-ink2);
  text-decoration: none;
  display:         block;
  line-height:     1.4;
}
.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover { color: var(--alm-ink); }

.post-navigation .nav-next { text-align: right; }


/* ═══════════════════════════════════════════════════════════════════
   11 — SEPARADORES
   ═══════════════════════════════════════════════════════════════════ */

hr, .entry-content hr {
  border:     none;
  border-top: 1px solid var(--alm-rule);
  margin:     32px 0;
}


/* ═══════════════════════════════════════════════════════════════════
   12 — OCULTAR ELEMENTOS DE GP QUE NO USAMOS
   ═══════════════════════════════════════════════════════════════════ */

.ast-breadcrumbs,
.generate-breadcrumbs,
.breadcrumb-trail,
.widget-area,
.sidebar,
#sidebar-primary       { display: none !important; }

/* Meta de GP en el loop (fecha, categoría, etc.) */
.entry-meta .posted-on,
.entry-meta .cat-links,
.entry-meta .byline,
.entry-header .entry-meta,
.entry-footer          { display: none !important; }

/* Eliminar cualquier borde que GP añada al footer */
body .site-footer,
body #colophon,
body .alm-footer {
  border-top:    none !important;
  border-bottom: none !important;
  box-shadow:    none !important;
}


/* ═══════════════════════════════════════════════════════════════════
   13 — RESPONSIVE — MÓVIL (≤ 767px)
   ═══════════════════════════════════════════════════════════════════ */

@media (max-width: 767px) {

  .almacen-index { padding: 16px 20px 48px 20px !important; }

  .almacen-entry-row .entry-title { font-size: 14.5px !important; }

  .single .entry-title, h1.entry-title {
    font-size: 28px !important;
    letter-spacing: -0.02em;
  }

  .entry-content blockquote p,
  .entry-content .wp-block-quote p { font-size: 18px; }

  .post-navigation {
    flex-direction: column;
    gap: 24px;
  }
  .post-navigation .nav-next { text-align: left; }

  .menu-toggle { display: flex !important; }
}