/*
 Theme Name:   Gramoflor Ibérica Child Theme
 Theme URI:    https://gramoflor-iberica.es
 Description:  Child theme de Hello Elementor para Gramoflor Ibérica — Sustratos y soluciones para el cultivo profesional.
 Author:       PlaneaWeb
 Author URI:   https://planeaweb.com
 Template:     hello-elementor
 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:  gramoflor-iberica-child
 Requires at least: 6.0
 Tested up to: 6.7
 Requires PHP: 7.4
*/

/* ==========================================================================
   Gramoflor Ibérica — Custom Styles
   ========================================================================== */

/* Variables CSS personalizadas */
:root {
    --gramoflor-green: #2E7D32;
    --gramoflor-green-light: #4CAF50;
    --gramoflor-green-dark: #1B5E20;
    --gramoflor-earth: #5D4037;
    --gramoflor-earth-light: #8D6E63;
    --gramoflor-sand: #F5F0E8;
    --gramoflor-white: #FFFFFF;
    --gramoflor-dark: #212121;
    --gramoflor-gray: #757575;
}
.mgl-root {margin-bottom:20px !important;}
/* Tipografía base */
/*body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--gramoflor-dark);
}*/

/* Links */
a {
    color: var(--gramoflor-green);
    transition: color 0.3s ease;
}

a:hover,
a:focus {
    color: var(--gramoflor-green-dark);
}

.elementor-widget-breadcrumbs #breadcrumbs span{
    font-family: 'Roboto', Sans-serif !important;
    font-weight: 300 !important;
    font-size: 14px;
}

/* Scroll suave */
html {
    scroll-behavior: smooth;
}

/* Mejoras de accesibilidad */
*:focus-visible {
    outline: 2px solid var(--gramoflor-green);
    outline-offset: 2px;
}

/* Imágenes responsive */
img {
    max-width: 100%;
    height: auto;
}

/* ==========================================================================
   Personalizaciones adicionales aquí abajo
   ========================================================================== */
.section-divider {
    position: relative;
}

.section-divider::before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 15px;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: top center;
    pointer-events: none;
}
.sd-normal::before {
    top: 0;
    transform: translateY(-10px);
    background-image: url('/wp-content/uploads/2026/02/grunge_wall_top.png');
}

.sd-light::before {
    top: 0;
    transform: translateY(-10px);
    background-image: url('/wp-content/uploads/2026/03/light_grunge_wall_top.png');
}

.sd-dark::before {
    top: 0;
    transform: translateY(-10px);
    background-image: url('/wp-content/uploads/2026/03/dark_grunge_wall_top.png');
}

@media (max-width: 800px) {
	.sd-normal::before, .sd-light::before, .sd-dark::before {transform: translateY(-3px) !important;}	
}

.lista-num {
  list-style: none;
  counter-reset: lista-num-counter;
  padding: 0;
}

.lista-num li {
  counter-increment: lista-num-counter;
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding: 20px 0;
  border-bottom: 1px solid #e0e0e0;
}
.lista-num li em {display: contents !important;}

.lista-num li::before {
  content: counter(lista-num-counter);
  background-color: #4a9e4a;
  color: white;
  font-weight: bold;
  font-size: 16px;
  min-width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
	margin-right:10px;
}

@media (max-width: 767px) {
    .lista-num ol {
        padding-left: 0;
    }
	.lista-num li {
  gap: 5px;
	}
}

/* ============================================
   GRAMOFLOR - Estilos para artículos de blog
   ============================================ */

/* Resaltado de datos y cifras importantes */
.highlight-data {
    background-color: #e8f5e2;
    color: #1e4d14;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 3px;
}

/* Resaltado de beneficios y mensajes positivos */
.highlight-good {
    background-color: #3a7d2c;
    color: #ffffff;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 3px;
}

/* Caja informativa destacada */
.note-info {
    background-color: #f0f7ed;
    border-left: 4px solid #3a7d2c;
    border-radius: 4px;
    padding: 16px 20px;
    margin: 24px 0;
    color: #333333;
    font-size: 0.97em;
    line-height: 1.6;
}

.note-info strong {
    color: #1e4d14;
}

/* Lista personalizada con viñetas verdes */
.custom-list {
    list-style: none;
    padding-left: 0;
    margin: 16px 0;
}

.custom-list li {
    position: relative;
    padding-left: 28px;
    margin-bottom: 10px;
    color: #333333;
    line-height: 1.6;
}

.custom-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 7px;
    width: 10px;
    height: 10px;
    background-color: #3a7d2c;
    border-radius: 50%;
}

/* CTA final de artículo */
.cta-articulo {
    background-color: #1e4d14;
    border-radius: 6px;
    padding: 28px 32px;
    margin: 40px 0 20px;
    text-align: center;
    color: #ffffff;
}

.cta-articulo p {
    color: #ffffff;
    font-size: 1.05em;
    margin-bottom: 16px;
}

.cta-articulo a {
    display: inline-block;
    background-color: #3a7d2c;
    color: #ffffff !important;
    font-weight: 700;
    padding: 12px 28px;
    border-radius: 4px;
    text-decoration: none;
    transition: background-color 0.2s ease;
}

.cta-articulo a:hover {
    background-color: #2e6122;
}

/* Sidebar por debajo del menú */
#lateral {
    --z-index: 10 !important;
}

/* Dropdown del menú siempre por encima */
.elementor-nav-menu--dropdown {
    z-index: 9999 !important;
}

/****************************************************************************************/
* ============================================
   Sufijo "EUR" en el campo Pretensiones salariales
   ============================================ */
.elementor-field-group-salario {
    position: relative;
}
.elementor-field-group-salario input {
    padding-right: 55px !important;
}
.elementor-field-group-salario::after {
    content: "EUR";
    position: absolute;
    right: 15px;
    bottom: 14px;
    color: #4a4a4a;
    font-size: 15px;
    pointer-events: none;
}

/* ============================================
   Bandera de España en el campo Teléfono
   ============================================ */
.elementor-field-group-telefono {
    position: relative;
}
.elementor-field-group-telefono input[type="tel"] {
    padding-right: 50px !important;
}
.elementor-field-group-telefono::after {
    content: "";
    position: absolute;
    right: 15px;
    bottom: 12px;
    width: 24px;
    height: 16px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 750 500'><rect width='750' height='500' fill='%23AA151B'/><rect width='750' height='250' y='125' fill='%23F1BF00'/></svg>");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 2px;
    pointer-events: none;
}
/*************************************************************************************************/
/* ============================================
   Zona drag & drop personalizada — campo CV
   ============================================ */
.elementor-field-group-cv {
    position: relative;
}

/* Caja visual con borde discontinuo + icono de nube */
.elementor-field-group-cv::before {
    content: "";
    position: absolute;
    top: 30px;          /* hueco para la etiqueta "Documentación aportada *" */
    left: 0;
    right: 0;
    height: 140px;
    background-color: #fff;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='44' height='34' viewBox='0 0 24 18' fill='none' stroke='%239ca3af' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'><path d='M18 10h-1.26A8 8 0 109 20h9a5 5 0 000-10z'/></svg>");
    background-repeat: no-repeat;
    background-position: center 30px;
    border: 1px dashed #c8c8c8;
    border-radius: 4px;
    transition: border-color .2s, background-color .2s;
    z-index: 1;
    pointer-events: none;
}

/* Texto de ayuda — se inyecta vía JS */
.gfi-upload-helper {
    position: absolute;
    top: 130px;         /* debajo del icono */
    left: 0;
    right: 0;
    text-align: center;
    color: #6b7280;
    font-size: 14px;
    z-index: 1;
    pointer-events: none;
    padding: 0 15px;
}
.gfi-upload-helper a {
    color: #2e7d32;     /* TODO: poner el verde corporativo Gramoflor */
    font-weight: 700;
    text-decoration: underline;
}

/* Estado: arrastrando archivo encima */
.elementor-field-group-cv.is-dragging::before {
    border-color: #2e7d32;
    background-color: #f4faf3;
}

/* Estado: archivo ya seleccionado */
.elementor-field-group-cv.has-file::before {
    border-style: solid;
    border-color: #2e7d32;
}
.elementor-field-group-cv.has-file .gfi-upload-helper {
    color: #2e7d32;
    font-weight: 600;
    word-break: break-word;
}

/* Input nativo transparente encima — capta clics y drops */
.elementor-field-group-cv input[type="file"] {
    position: relative;
    width: 100%;
    height: 140px;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}