/**
 * header.css
 *
 * Estilos del header completo: pre-header, header principal, logo,
 * branding, search wrapper, menú principal y controles de navegación.
 *
 * Extraído y consolidado desde laseme.css.
 */
:root,
[data-theme="dark"] {
    --theme-switcher-active-color: var(--ds-laseme-tertiary-color-hover);
}

header section {
    padding: 0;
}

/* =============================================================================
   PRE-HEADER
   ============================================================================= */

#pre-header {
    top: 0;
    left: 0;
    width: 100%;
    z-index: 13;
    position: absolute;
    background-color: #333;
    color: var(--ds-laseme-grey);
}

.logged-in #pre-header {
    padding-top: 64px;
}

#pre-header-inside {
    display: none;
    position: relative;
    z-index: 13;
    padding: 40px 0 0 0;
}


/* =============================================================================
   HEADER TOP — Barra superior
   ============================================================================= */

#header-top {
    background-color: #fff;
    border-bottom: 1px solid #EBEBEB;
}

#full-width-wrapper .block,
#header-top .block,
#main-navigation .block,
#banner .block {
    margin-bottom: 0;
}

.path-listing-search #header-top {
    display: none;
}


/* =============================================================================
   HEADER PRINCIPAL — #header
   ============================================================================= */

#header {
    background-color: var(--ds-laseme-pure-color);
    position: relative;
    z-index: 99;
    width: 100%;
    border-bottom: 0 solid var(--ds-laseme-primary-color);
}

#header:after {
    content: "";
    height: 10px;
    width: 100%;
    left: 0;
    bottom: -10px;
    position: absolute;
   background: var(--ds-laseme-primary-color);
}


/* =============================================================================
   MAIN MENU WRAPPER
   ============================================================================= */

#main-menu-wrapper {
    background: var(--ds-laseme-primary-color);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.4);
}


/* =============================================================================
   LOGO — #logo
   ============================================================================= */

#logo {
    text-align: center;
    z-index: 10;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

#logo img {
    display: none !important;
    max-height: 3.7rem;
    width: auto;
    object-fit: contain;
}

#logo img.logo-default {
    display: inline-block !important;
}

/* Cambio de logo según el tema */
[data-theme="dark"] #logo img.logo-default {
    display: none !important;
}

[data-theme="dark"] #logo img.logo-white {
    display: inline-block !important;
}


#logo img:hover {
    opacity: 0.8;
    filter: alpha(opacity=80);
}

/* Logo transition (transición suave al hacer scroll) */
.logo {
    transition: opacity 0.3s ease;
}


/* =============================================================================
   SITE BRANDING — Nombre y eslogan del sitio
   ============================================================================= */

.site-branding-link {
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
}

.site-branding-link .site-name {
    color: black;
}

.site-branding-link .site-name:hover {
    color: #222;
}

#site-name a {
    font-size: 38px;
    font-weight: 700;
    line-height: 1em;
    margin: 0 0 10px;
    color: #444444;
    display: block;
}

#site-name a:hover {
    text-decoration: none;
    opacity: 0.8;
    filter: alpha(opacity=80);
}

#site-slogan {
    color: #999;
    font-size: 13px;
    font-weight: 300;
    line-height: 150%;
    margin: 10px 0 10px 0;
}

/* =============================================================================
   HEADER ACTIONS
   ============================================================================= */

.region-header-actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    margin: 0;
}

.region-header-actions>* {
    width: auto;
    padding-left: 0;
}

#block-laseme-selector-tema-dropdown {
    display: block;
}

#block-laseme-selector-tema-bar {
    display: none;
}

@media (max-width: 991px) {
    #block-laseme-selector-tema-dropdown {
        display: none;
    }

    #block-laseme-selector-tema-bar {
        display: block;
    }
}

/* =============================================================================
   TOP HEADER FORM — Formulario de búsqueda en el banner superior
   Este bloque está desactivado por ahora.
   ============================================================================= */

section.region-top-header-form {
    background: var(--ds-laseme-primary-color);
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

section.region-top-header-form .views-exposed-form {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
    max-width: 1320px;
    margin: 0;
    padding: 16px 8px;
}

section.region-top-header-form .views-exposed-form form div {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: flex-start;
    justify-content: space-between;
}

section.region-top-header-form h2 {
    color: var(--ds-laseme-white);
    margin: 0px;
    padding: 0 24px;
    position: relative;
    border-right: 1px solid var(--ds-laseme-white);
    font-size: 20px;
}

section.region-top-header-form h2::after,
section.region-top-header-form h2::before {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

section.region-top-header-form h2::after {
    margin-left: 20px;
}

section.region-top-header-form h2::before {
    border-color: rgba(110, 219, 248, 0);
    border-left-color: #fff;
    border-width: 5px;
    margin-top: -5px;
    margin-left: 0px;
}

@media screen and (max-width: 991px) {
    section.region-top-header-form .views-exposed-form {
        flex-direction: column;
    }

    section.region-top-header-form h2 {
        border-right: none;
        border-bottom: 1px solid var(--ds-laseme-white);
    }

    section.region-top-header-form h2::before {
        border: none;
    }
}

section.region-top-header-form form .form-item {
    position: relative;
    background: var(--ds-laseme-white);
    border: 1px solid var(--ds-laseme-almost-white);
    border-radius: 12px;
    margin-bottom: 0;
    min-width: 200px;
    flex-grow: 1;
}

section.region-top-header-form label {
    display: none;
}

section.region-top-header-form .form-item-ref-catastral:before,
section.region-top-header-form .form-item-field-entidad-value:before,
section.region-top-header-form .form-item-field-municipio-target-id:before {
    font-family: 'Font Awesome 5 Free';
    color: #666;
    position: absolute;
    top: 8px;
    left: 14px;
    font-weight: 900;
    display: inline-block;
    z-index: 3;
    pointer-events: none;
}

/** OCULTAMOS ENTIDAD POR AHORA. ELIMINAR ESTO CUANDO SE IMPLEMENTE BIEN!! */
section.region-top-header-form .form-item-field-entidad-value {
    display: none;
}

section.region-top-header-form .form-item-ref-catastral:before {
    content: "\f002";
}

section.region-top-header-form .form-item-field-entidad-value:before {
    content: "\f002";
}

section.region-top-header-form .form-item-field-municipio-target-id:before {
    content: "\f3c5";
}

section.region-top-header-form .form-item-field-municipio-target-id {
    max-width: 100%;
}

section.region-top-header-form .views-exposed-form input[type="text"] {
    height: 40px;
    line-height: 40px;
    padding-left: 40px;
    background: transparent;
    border: none;
    border-radius: 12px;
    margin-bottom: 0;
    width: 100%;
    color: #000;
    box-shadow: none;
}

section.region-top-header-form .chosen-container-single .chosen-single {
    background: transparent;
    border: none;
    box-shadow: none;
    display: block;
    height: 40px;
    line-height: 40px;
    padding-left: 40px;
    border-radius: 12px;
    color: #333;
}

section.region-top-header-form .chosen-container-single .chosen-single div {
    display: none;
}

section.region-top-header-form .chosen-container-multi .chosen-choices {
    background: transparent;
    border: none;
    box-shadow: none;
    min-height: 1rem;
    padding-left: 40px;
    color: #333;
    padding-top: 5px;
}

section.region-top-header-form .chosen-container {
    width: 100%;
}

section.region-top-header-form .form-actions {
    margin: 0;
}

section.region-top-header-form .form-submit {
    margin: 0;
    padding: 0 30px;
    height: 40px;
    line-height: normal;
    background: var(--ds-laseme-secondary-color);
    border: 1px solid var(--ds-laseme-secondary-color);
    color: #000;
    border-radius: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

section.region-top-header-form .form-submit:hover {
    background: var(--ds-laseme-secondary-color-hover);
    border-color: var(--ds-laseme-secondary-color-hover);
    color: var(--ds-laseme-text-on-dark-color);
}

section.region-top-header-form #edit_field_poligono_industrial_target_id_chosen {
    border: none;
}


/* =============================================================================
   NAV MODULE CONTROLS — Selector de tema y hamburguesa
   ============================================================================= */

.nav-module-controls {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

#header .navbar-toggler {
    border: none;
    background: transparent;
    padding: 8px;
    margin-left: 15px;
    cursor: pointer;
    display: none;
    /* Oculto por defecto */
    align-items: center;
    justify-content: center;
    color: var(--ds-laseme-primary-color);
    transition: color 0.3s ease, transform 0.3s ease;
    text-decoration: none;
}

@media (max-width: 991px) {
    #header .navbar-toggler {
        display: flex;
        /* Visible solo en móviles */
    }
}

.navbar-toggler-icon {
    background-image: none;
    display: inline-block;
    width: auto;
    height: auto;
}

.navbar-toggler-icon::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: "\F0C9";
    font-size: 1.2rem;
    color: var(--ds-laseme-primary-color);
    transition: all 0.3s ease;
}

.navbar-toggler:hover {
    color: var(--ds-laseme-secondary-color);
}

.navbar-toggler:focus {
    outline: none;
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before {
    content: "\f00d";
    color: var(--ds-laseme-secondary-color);
}

@media screen and (max-width: 991px) {
    nav.navbar {
        padding-bottom: 16px;
    }

    .nav-module-controls {
        display: flex;
        align-items: center;
        gap: 5px;
    }
}

/**
 * Theme switcher override
 */
[data-theme="dark"] .theme-toggle-pill {
    --theme-switcher-bg: var(--ds-laseme-pure-color-background);
    --theme-switcher-border: var(--ds-laseme-pure-color-border);
}

[data-theme="dark"] .theme-toggle-slider {
    --theme-switcher-slider-bg: var(--ds-laseme-pure-color-hover);
}