/*
Theme Name: Kuru Camp Lite
Theme URI: https://example.com/kuru-camp-lite
Author: Cesar A. Mendoza Pimentel
Author URI: https://example.com
Description: Tema básico responsive de una sola columna con bloques de encabezado, slider, noticias, experiencias y pie de página.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kuru-camp-lite
*/

:root {
  --kuru-border-color: #333;
  --kuru-bg-light: #f9f9f9;
  --kuru-bg-dark: #f0f0f0;
  --kuru-text-color: #222;
  --kuru-accent: #0066cc;
  --kuru-font-main: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--kuru-font-main);
  color: var(--kuru-text-color);
}

a {
  color: inherit;
  text-decoration: none;
}

.site {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* HEADER */

.kuru-header {
  width: 100%;
  border-bottom: 1px solid transparent;
}

/* Primera fila: logotipo / menú / redes sociales */

.kuru-topbar,
.kuru-mainbar,
.kuru-footer-bar,
.kuru-bottom-bar {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.kuru-topbar__col,
.kuru-mainbar__col,
.kuru-footer-bar__col {
  flex: 1 1 0;
  border: 1px solid transparent;
  padding: 0.75rem 1rem;
  text-align: center;
  text-transform: uppercase;
  font-size: 0.875rem;
  letter-spacing: 0.05em;
}

/* Segunda fila: logotipo / menú principal / buscar */

.kuru-mainbar__col--menu {
  display: flex;
  align-items: center;
  justify-content: center;
}

.kuru-mainbar__nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  padding: 0;
  margin: 0;
  list-style: none;
}

.kuru-mainbar__search input[type="search"] {
  width: 100%;
  max-width: 260px;
  padding: 0.4rem 0.6rem;
  border: 1px solid transparent;
}

/* SECCIONES PRINCIPALES */

.site-main {
  flex: 1 0 auto;
}

.kuru-section {
  width: 100%;
  border-left: 1px solid transparent;
  border-right: 1px solid transparent;
  border-bottom: 1px solid transparent;
  padding: 2.5rem 1rem;
  text-align: center;
  background: var(--kuru-bg-light);
}

.kuru-section--slider {
  background: #ffffff;
}

.kuru-section--news {
  background: var(--kuru-bg-dark);
}

.kuru-section--experiences {
  background: #ffffff;
}

.kuru-section__title {
  font-size: 1rem;
  text-transform: uppercase;
  margin-bottom: 1.5rem;
  letter-spacing: 0.08em;
}

/* Placeholder de contenido */
.kuru-section__placeholder {
  font-size: 0.9rem;
  opacity:1 !important;
}

/* Para que visualmente los bloques ocupen buena altura en pantallas grandes */
.kuru-section--slider,
.kuru-section--news,
.kuru-section--experiences {
  min-height: 260px;
}

/* FOOTER */

.site-footer {
  flex-shrink: 0;
}

.kuru-footer-bar__col {
  font-size: 0.75rem;
}

.kuru-bottom-bar {
  border: 1px solid transparent;
  border-top: none;
  justify-content: center;
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
}

/* RESPONSIVE */

@media (max-width: 768px) {
  .kuru-topbar__col,
  .kuru-mainbar__col,
  .kuru-footer-bar__col {
    flex: 1 1 100%;
    text-align: center;
  }

  .kuru-section {
    padding: 1.75rem 0.75rem;
  }

  .kuru-section--slider,
  .kuru-section--news,
  .kuru-section--experiences {
    min-height: 200px;
  }
}

@media (min-width: 1200px) {
  .kuru-section--slider,
  .kuru-section--news,
  .kuru-section--experiences {
    min-height: 320px;
  }
}

/* Slider ocupa todo el bloque */
.kuru-section--slider {
  padding: 0;            /* elimina espacios internos */
  min-height: 100%;      /* usa toda la altura del bloque */
  height: auto;
}

/* Contenedor del widget del slider */
.kuru-section--slider .kuru-section__placeholder {
  padding: 0;
  margin: 0;
}

/* Si usas un plugin tipo MetaSlider / SmartSlider */
.kuru-section--slider img,
.kuru-section--slider .metaslider,
.kuru-section--slider .smart-slider {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}



.kuru-topbar--fixed { position:fixed; top:0; left:0; right:0; z-index:999; }
.kuru-mainbar--fixed { position:fixed; left:0; right:0; z-index:998; }
.kuru-has-sticky-topbar .kuru-mainbar { margin-top:3.5rem; }
.kuru-has-sticky-topbar .kuru-mainbar--fixed { top:3.5rem; }
.kuru-has-sticky-topbar .site-main,
.kuru-has-sticky-mainbar .site-main { padding-top:3.5rem; }
.kuru-has-sticky-topbar.kuru-has-sticky-mainbar .site-main { padding-top:7rem; }

@media(max-width:768px){
 .kuru-topbar--fixed, .kuru-mainbar--fixed { position:static; }
 .site-main { padding-top:0 !important; }
}


/* Mejora de espacio para menús fijos - override */
body.kuru-has-sticky-topbar .kuru-mainbar,
body.kuru-has-sticky-topbar .kuru-mainbar--fixed {
  margin-top: 0;
}

body.kuru-has-sticky-topbar .kuru-mainbar--fixed {
  top: auto;
}

body.kuru-has-sticky-topbar .site-main,
body.kuru-has-sticky-mainbar .site-main,
body.kuru-has-sticky-topbar.kuru-has-sticky-mainbar .site-main {
  padding-top: 0;
}

/* Logo menú principal */
.kuru-mainbar__logo .custom-logo {
  max-height:60px;
  height:auto;
  width:auto;
  display:block;
}
.kuru-mainbar__logo {
  display:flex;
  align-items:center;
  justify-content:center;
}

/* Logo PRO: alineación en topbar */
.kuru-topbar__logo .custom-logo {
  max-height: 40px;
  height: auto;
  width: auto;
  display: inline-block;
}
.kuru-topbar__logo {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

/* Widgets en barras de menú */
.kuru-topbar__widgets,
.kuru-mainbar__widgets {
  display:flex;
  align-items:center;
  gap:0.5rem;
}
.kuru-topbar__widgets .widget,
.kuru-mainbar__widgets .widget {
  margin:0;
}

/* Estilo base del título del sitio (personalizable por Customizer) */
.kuru-site-title{
  font-weight:600;
}

/* Slider top override */
.slider-top {
  margin-top:0 !important;
  padding-top:0 !important;
}
body, .site { margin:0; padding:0; }





/* FIX: Sin espacio arriba del slider */
body, .site {
    margin: 0 !important;
    padding: 0 !important;
}
.kuru-section--slider,
.slider-top {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
.kuru-header,
.kuru-topbar,
.kuru-mainbar {
    margin: 0 !important;
    padding-top: 0 !important;
    border: none !important;
    box-shadow: none !important;
}
.site-main {
    margin-top: 0 !important;
}

/* Menú sobre el slider sin franja blanca */
.kuru-header{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index:100;
  background: transparent !important;
  border:none !important;
  box-shadow:none !important;
}
.kuru-topbar,
.kuru-mainbar{
  background: transparent !important;
}

body, .site{
  margin:0 !important;
  padding:0 !important;
}
.kuru-section--slider,
.slider-top{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* Fix margen superior cuando está visible la barra de administración de WordPress */
html {
  margin-top: 0 !important;
}

/* Ocultar solo el slider del área de contenido (no el superior) */
section.kuru-section--slider:not(.slider-top){
  display:none !important;
}

/* Estilos básicos para el contenido dentro de la sección Noticias (páginas) */
.kuru-news-item{
  max-width: 1000px;
  margin: 0 auto 2rem;
}
.kuru-news-item__title{
  font-size: 1.6rem;
  margin-bottom: 1rem;
  text-align: left;
}
.kuru-news-item__content{
  font-size: 1rem;
  line-height: 1.6;
}

/* Este CSS hace que el contenedor se estire al 100% 
   y luego separa el contenido de la izquierda y la derecha */
.copyright-footer {
    display: flex;
    justify-content: space-between; /* Esto empuja el contenido a los extremos */
    width: 100%; /* Asegura que tome todo el ancho disponible */
    padding: 10px 0; /* Opcional: añade un poco de espacio vertical */
}


/* 1. Color Inicial (Gris Oscuro/Plomo Rata) */
.kuru-bottom-bar .design-credit {
    /* Usamos un tono de gris oscuro. Si el color no se ve, 
       es posible que otro estilo esté forzando el texto a ser blanco (#ffffff),
       como el `color: #ffffff;` que vimos en las variables. */
    color: #4F4A4A; 
}

/* 2. Efecto HOVER (Al pasar el mouse) */
.kuru-bottom-bar .design-credit:hover {
    /* El color rojo que quieres aplicar */
    color: red; 
    /* OPCIONAL: Puedes añadir esto para que el cambio de color sea suave */
    transition: color 0.3s ease; 
}}