/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 6,000+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.12.5.1774007749
Updated: 2026-03-20 12:55:49

*/

.wpr-column-slider-no{
    padding-top: 0 !important;
}

/*============FOOTER==========*/
/* Corregir el espacio gigante en el footer de Astra para tablets y móviles */
@media (max-width: 921px) {
  .ast-builder-footer-grid-columns.ast-builder-grid-row {
    /* Cambiamos las 3 columnas fijas por una distribución que se adapte al contenido */
    grid-template-columns: 1fr !important; 
    gap: 20px; /* Controla el espacio vertical entre los distintos bloques del footer */
  }

  .site-footer-section {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}

/* --- UNIFICACIÓN DEL FOOTER RESPONSIVE (A partir de 923px hacia abajo) --- */
@media (max-width: 923px) {
  
  .ast-builder-footer-grid-columns.ast-builder-grid-row {
    grid-template-columns: 1fr !important;
    gap: 30px !important; 
  }

  .site-footer-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
  }

  .mi-contacto, .contacto-widget {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

}


/* --- ESTILOS GENERALES (Escritorio y Tablet) --- */
.site-footer-primary-section-1{
    padding-left: 30px;
}
.contacto-widget {
  color: #000000;
  font-family: sans-serif;
  font-size: 15px;
  line-height: 1.4;
  display: flex;
  flex-direction: column;
  align-items: flex-start; /* Alineado a la izquierda en pantallas grandes */
}

.contacto-item {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  width: 100%; /* Ocupa el ancho para poder alinearse bien */
}

.contacto-item:last-child {
  margin-bottom: 0; /* Quita el margen al último elemento */
}

.contacto-item i {
  color: #0056b3;
  width: 20px;
  text-align: center;
}

.contacto-item a {
  color: inherit;
  text-decoration: none;
}

.contacto-item .email-link {
  color: #0056b3;
  text-decoration: underline;
}

/* --- RESPONSIVE (Móvil) --- */
@media (max-width: 767px) {
  .contacto-widget {
    align-items: center; /* Centra todo el bloque en móvil */
  }

  .contacto-item {
    justify-content: center; /* Centra el contenido (icono + texto) internamente */
    text-align: center;
  }
}

/*=======LOGIN======*/
div.form-logo {
    display: flex !important;
    flex-direction: column !important; /* Alinea los elementos uno debajo de otro si hay más de uno */
    justify-content: center !important; /* Centrado vertical (si el div tiene altura) */
    align-items: center !important;    /* Centrado horizontal (lo que buscas) */
    text-align: center !important;     /* Por si hay texto plano suelto */
}

/* Por si el logo es una imagen con un ancho fijo que bloquea el comportamiento */
div.form-logo img {
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
}


/*El tiempo*/
.weather_description{
  font-size: 18px !important;
}

/* ==========================================================================
   1. MÓVILES (Por defecto)
   ========================================================================== */
/* Aquí no usamos Grid. Todo se apila uno debajo de otro de forma natural */
.main_wrap {
    display: flex;
    flex-direction: column;
    gap: 15px; 
}

/* ==========================================================================
   2. PANTALLAS GRANDES (768px o más)
   ========================================================================== */
@media (min-width: 768px) {
    .main_wrap {
        display: grid;
        grid-template-columns: 1fr 1fr; /* Dos columnas iguales */
        gap: 20px;
    }

    /* Fila 1: El título ocupa todo el ancho */
    .weather_title {
        grid-column: 1 / span 2; 
        grid-row: 1;             
    }

    /* Fila 2 (Izquierda): Bloque central */
    .weather_center_wrap {
        grid-column: 1;
        grid-row: 2;             
    }

    /* Fila 3 (Izquierda): Descripción abajo del bloque central */
    .weather_description {
        grid-column: 1;
        grid-row: 3;             
    }

    /* Columna Derecha: Se alinea en la fila 2 (al lado de weather_center_wrap) */
    .weather_days_wrap {
        grid-column: 2;
        grid-row: 2 / span 2;    /* Abarca la altura de las filas 2 y 3 */
        align-self: start;       /* Se pega arriba para nivelarse con la izquierda */
    }
}

