/*
 Theme Name: GeneratePress Child - Raúl
 Template: generatepress
 Text Domain: gp-child
 Version: 1.0
*/

/* ================================
   Variables base
   ================================ */
:root{
  --content-gap: 40px; /* igual al padding de .inside-article */
}

/* ================================
   Efecto ruido
   ================================ */
body {
  margin: 0;
  overflow-x: hidden; /* Evita el scroll horizontal */
  position: relative; /* Necesario para que ::before funcione correctamente */
}

body::before {
  content: "";
  position: fixed;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200vh;
  background: transparent url('https://rauldivaine.com/wp-content/uploads/2025/08/noise-transparent-new.png') repeat 0 0;
  background-repeat: repeat;
  animation: bg-animation 0.5s infinite;
  opacity: 0.05;
  pointer-events: none;
  z-index: 99999;
}

@keyframes bg-animation {
  0% { transform: translate(0, 0); }
  10% { transform: translate(-5%, -5%); }
  20% { transform: translate(-10%, 5%); }
  30% { transform: translate(5%, -10%); }
  40% { transform: translate(-5%, 15%); }
  50% { transform: translate(-10%, 5%); }
  60% { transform: translate(15%, 0); }
  70% { transform: translate(0, 10%); }
  80% { transform: translate(-15%, 0); }
  90% { transform: translate(10%, 5%); }
  100% { transform: translate(5, 0); }
}

.grecaptcha-badge {
  visibility: hidden;
  display: none;
}

/* ================================
   Navegación inferior fija
   ================================ */
body { padding-bottom: var(--bottom-nav-h); }
.gp-bottom-nav{ position: fixed; left:0; right:0; bottom:0; z-index:9999; border-top:1px solid var(--base); background:var(--base-3); }
.gp-bottom-nav .inside-navigation{ justify-content: space-around; }
.gp-bottom-nav .main-nav > ul { display:flex !important; flex-direction:row; justify-content:space-around; }

/* ================================
   Sidebar derecha sticky + grid
   ================================ */
@media (min-width:1024px){
  .site-content{
    display:grid;
    grid-template-columns:minmax(0,1fr) 320px;
    column-gap:48px;
    align-items:start;
  }
  .site-content .content-area,
  .widget-area.sidebar,
  .is-left-sidebar,
  .is-right-sidebar{
    width:auto!important; float:none!important; clear:none!important;
  }

  /* 1) Solo un offset: sticky se pega al viewport (WP ya baja todo con el admin bar)
        y damos el "inset" visual con padding igual al contenido */
  .widget-area.sidebar{
    position: sticky;
    top: 0;                                 /* ← sin admin-bar ni gap extra */
    padding-top: 20px;  /* ← mismo padding que .inside-article */
    margin-top: 0;
    align-self: start;
    height: auto;
    margin-bottom: var(--bottom-nav-h,64px);
    padding-right: 8px;
  }

  /* 2) El contenedor interno no añade más espacio (evita duplicar offset) */
  #right-sidebar .inside-right-sidebar{
    padding-top: 0;
    margin-top: 0;
  }

  /* 3) Evita que el primer widget empuje hacia abajo por su margen superior */
  #right-sidebar .inside-right-sidebar > .widget:first-child{
    margin-top: 0;
  }
}

.wp-block-quote {
	    border-left: 5px solid rgba(100, 100, 100, 1)!important;
}

/* ================================
   Responsive sin sidebar
   ================================ */
@media (max-width:1023px){
  .widget-area.sidebar{ display:none !important; }
  .site-content{ display:block; }
  .site-content .content-area{ width:100%!important; float:none!important; clear:none!important; margin:0; max-width:none; }
  .grid-container{ max-width:100%; }
  .separate-containers .inside-article{ padding:32px; }
  .site-main .wp-block-group__inner-container{ max-width:none; margin:0; }
  .entry-content .alignwide,
  body:not(.no-sidebar) .entry-content .alignfull{ margin-left:0; width:100%; max-width:100%; }
}

/* ampliar ancho global si quieres */
@media (min-width:1200px){ .grid-container{ max-width:1320px; } }

/* ====== VISIBILIDAD EN LA SIDEBAR ====== */
.sidebar .ideas-index,
.sidebar .note-meta { display: none; }
.home .sidebar .ideas-index,
.front-page .sidebar .ideas-index { display: block; }
.single .sidebar .note-meta { display: block; }
.page .sidebar .note-meta { display: none; }

/* ================================
   Tema oscuro
   ================================ */
.theme-dark{
  --base-3: #111213;
  --base-2: #0c0d0e;
  --base:   #1d1f22;
  --contrast:   #e7e8ea;
  --contrast-2: #b5b7be;
  --contrast-3: #7a7d86;
}
.theme-dark body{ background-color: var(--base-2); }

/* ================================
   Botón flotante
   ================================ */
.theme-toggle{
  position: fixed;
  top: 16px; right: 16px;
  z-index: 10000;
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px;
  border-radius: 999px;
  border: 1px solid var(--base);
  background: var(--base-3);
  color: var(--contrast);
  cursor: pointer;
}
.theme-toggle:hover,
.theme-toggle:focus-visible{
  outline: none;
  box-shadow: 0 0 0 2px rgba(0,0,0,.1);
}
.theme-dark .theme-toggle svg path{ opacity: .95; }
.theme-toggle svg{ display:block; }
html.admin-bar .theme-toggle{ top: calc(16px + 32px); }
@media (max-width: 782px){
  html.admin-bar .theme-toggle{ top: calc(16px + 46px); }
}
.theme-dark .theme-toggle svg circle {
  filter: drop-shadow(0 0 6px var(--accent));
}
body,
.site,
.site-header,
.site-info,
.inside-article,
.widget-area.sidebar,
.gp-bottom-nav,
.main-navigation,
.grid-container,
.entry-content,
.widget,
.footer-widgets {
  transition:
    background-color .5s ease,
    color .5s ease,
    border-color .5s ease,
    box-shadow .5s ease,
    fill .5s ease,
    stroke .5s ease;
}
.theme-toggle {
  transition:
    background-color .35s ease,
    color .35s ease,
    border-color .35s ease,
    transform .25s ease;
}
.theme-toggle--pulse { animation: toggle-pop .18s ease; }
@keyframes toggle-pop {
  0% { transform: scale(.92); }
  60% { transform: scale(1.05); }
  100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition: none !important;
    animation: none !important;
  }
}

/* ================================
   Estilo de la fecha en fractales
   ================================ */
.sb-fractales-recent-updated .fractales-updated {
  font-size: 0.85em;
  color: var(--gp-color-text-light, #777);
  margin-top: 2px;
  display: block;
  line-height: 1.3;
}

/* ================================
   Listados Blog & Fractales
   ================================ */
.rd-list {
  margin: 2rem 0;
  padding: 0;
}
.rd-item { margin-bottom: 2rem; }
.rd-title {
  font-size: 1.2rem;
  line-height: 1.3;
  margin: 0 0 0.4rem 0;
}
.rd-list-meta {
  font-size: 0.95rem;
  line-height: 1.5;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0.2rem 0 0;
}
.rd-meta-piece { white-space: nowrap; }
.rd-meta-sep { margin: 0 0.2rem; }
.rd-blog-list__pagination {
  margin-top: 2rem;
  font-size: 1rem;
}
.rd-blog-list__pagination ul {
  display: flex;
  gap: 0.8rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.rd-fractales-list {
  margin: 0;
  padding-left: 1.2em;
}

.rd-ecos-list {
  margin: 0;
  padding-left: 1.2em;
}
.rd-fractales-item { margin-bottom: 1.5rem; }

/* Árbol jerárquico de categorías (sidebar del blog) */
.rd-cat-tree{ margin:.4rem 0 .4rem 1.1rem; padding:0; list-style:disc; }
.rd-cat-tree .rd-cat-tree{ margin-top:.25rem; }
.rd-cat-tree li{ margin:.25rem 0; }
.rd-cat-count{ opacity:.7; font-size:.9em; }

.comment-content {
    border: 1px solid rgba(100, 100, 100, 1)!important;
}

.depth-1.parent>.children {
    border-bottom: 1px solid rgba(100, 100, 100, 1)!important;
}

.comment .children {
    border-left: 1px solid rgba(100, 100, 100, 1)!important;
}

#toc-list { margin-left: 1.2rem; }
#toc-list ol { margin:.35rem 0 0 1.1rem; }  /* sangría de subniveles */
#toc-list li { margin:.15rem 0; }

/* Escala de títulos solo en el contenido */
.entry-content h2,
.entry-content h3,
.entry-content h4{
  line-height: 1.25;
  margin-top: 1.4em;
  margin-bottom: .6em;
}

/* H2 > H3 > H4, fluidos */
.entry-content h2{
  font-size: clamp(1.6rem, 1.1rem + 1.6vw, 2.2rem);
}
.entry-content h3{
  font-size: clamp(1.3rem, 1.0rem + 1.0vw, 1.8rem);
}
.entry-content h4{
  font-size: clamp(1.1rem, 0.95rem + 0.6vw, 1.4rem);
}

.ext-domain-hint {
  font-size: 0.65em;
  opacity: .75;
  white-space: nowrap;
  font-family: "Segoe UI Symbol", "Arial Unicode MS", sans-serif;
}

.rd-item h2{
	font-size: 1.2rem;
}

/* H1 del post (título principal) */
article.post .entry-header .entry-title {
  font-size: clamp(1.8rem, 2.2vw + 1rem, 2.6rem);
  line-height: 1.2;
  margin-bottom: 0.6em;
}

/* H2 dentro del contenido (incluye los Gutenberg .wp-block-heading) */
article.post .entry-content h2,
article.post .entry-content .wp-block-heading {
  font-size: clamp(1.2rem, 1.2vw + 0.9rem, 1.6rem);
  line-height: 1.3;
  margin: 1.6em 0 0.6em;
}

/* H3 dentro del contenido */
article.post .entry-content h3 {
  font-size: clamp(1.05rem, 1vw + 0.7rem, 1.35rem);
  line-height: 1.4;
  margin: 1.4em 0 0.5em;
}

/* Asegura que <strong> no cambie de tamaño en ningún sitio */
.entry-content strong,
.sidebar strong {
  font-size: inherit!important;
  line-height: inherit;
}
/* Opción 2: mantén 700 pero compénsalas un pelín (opcional) */
.entry-content strong { letter-spacing: 0.003em; }
.entry-content strong { font-weight: 600; }

  .sb-ecos-meta .rd-ecos-rating{margin:1rem 0 .25rem}
  .sb-ecos-meta .rd-ecos-rating-val{margin:.25rem 0 1rem}