/* CE Header Responsive 2.3.0. Supports production + staging CE header 14020101.
   Widgets detected by function in JS, not by Creative Elements data-id.
   Scope to one header; original mobile at <=767px untouched. */
@media screen and (min-width: 768px) {
  #header .desktop-header-wrapper .elementor-14020101 {
    --cehr-css-version: '2.3.0';
    --cehr-gap: clamp(9px, 1vw, 20px);
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .elementor-top-section.headerbuilder {
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .elementor-top-section.headerbuilder > .elementor-container {
    max-width: 1540px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 16px clamp(14px, 2vw, 30px) 14px !important;
    box-sizing: border-box !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .elementor-row.cehr-grid {
    display: grid !important;
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    grid-template-columns: minmax(180px, 1fr) minmax(170px, min(32vw, 440px)) max-content 38px 43px !important;
    grid-template-areas: 'logo query account support cart' 'menu menu menu menu menu' !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    column-gap: var(--cehr-gap) !important;
    row-gap: clamp(10px, 1.4vw, 20px) !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }
  /* Flatten only the two columns that contain the visible desktop header.
     Two additional builder columns contain an auxiliary nav and custom code;
     they must NOT become anonymous grid cells. Keep them in the DOM. */
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid > [data-cehr-column='brand'],
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid > [data-cehr-column='controls'],
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid > [data-cehr-column='brand'] > .elementor-column-wrap,
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid > [data-cehr-column='controls'] > .elementor-column-wrap,
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid > [data-cehr-column='brand'] > .elementor-column-wrap > .elementor-widget-wrap,
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid > [data-cehr-column='controls'] > .elementor-column-wrap > .elementor-widget-wrap {
    display: contents !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid > [data-cehr-column='aux'] {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  /* Neutralize the original negative and percentage margins of main widgets only. */
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid [data-cehr-role] {
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    float: none !important;
    transform: none !important;
    align-self: center !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid [data-cehr-role] > .elementor-widget-container {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    min-width: 0 !important;
    transform: none !important;
  }
  /* Logo */
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='logo'] {
    grid-area: logo !important;
    justify-self: start !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='logo'] .header_logo,
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='logo'] .logo-link-wrap {
    max-width: 100% !important;
    width: max-content !important;
    margin: 0 !important;
    text-align: left !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='logo'] img.logo {
    display: block !important;
    width: clamp(185px, 19vw, 335px) !important;
    height: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  /* Category navigation occupies its own second row, below the brand. */
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='menu'] {
    grid-area: menu !important;
    justify-self: stretch !important;
    z-index: 8 !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='menu'] .pk-menu-horizontal,
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='menu'] #top-menu {
    /* Neutraliza margenes de Alysum. En tablet la navegacion desplegable conserva su anchura. */
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  /* No se aplican estilos sobre #top-menu > li.level-1 o sus enlaces.
     Los colores, fondos, bordes, paddings, animaciones y hovers son
     propiedad del tema Alysum (assets/css/custom.css) y de pk_menu. */
  @media (min-width: 1025px) {
    #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='menu'] #top-menu {
      display: flex !important;
      flex-flow: row wrap !important;
      column-gap: clamp(6px, .75vw, 12px) !important;
      row-gap: 8px !important;
      align-items: center !important;
      justify-content: flex-start !important;
      overflow: visible !important;
    }
    #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='menu'] .icon_menu {
      display: none !important;
    }
  }
  /* 2.3.0: pestañas compactas. No cambiamos los estilos visuales de los enlaces.
     Selector más específico que la versión 2.1.1: también funciona si el CSS
     anterior sigue pegado en el Custom CSS del builder/tema. */
  @media (min-width: 1025px) {
    #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid [data-cehr-role='menu'].elementor-widget-pkmenu .pk-menu-horizontal {
      display: flex !important;
      width: fit-content !important;
      max-width: 100% !important;
      min-width: 0 !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
      justify-content: flex-start !important;
    }
    #header .desktop-header-wrapper .elementor-14020101.cehr-active .cehr-grid [data-cehr-role='menu'].elementor-widget-pkmenu #top-menu {
      display: flex !important;
      width: fit-content !important;
      max-width: 100% !important;
      min-width: 0 !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
      flex-flow: row wrap !important;
      justify-content: flex-start !important;
      align-items: center !important;
      column-gap: clamp(6px, .75vw, 12px) !important;
      row-gap: 8px !important;
      overflow: visible !important;
    }
  }
  /* Search text + actual search widget deliberately overlap in ONE grid area.
     This is the approved UI: underline and magnifier on the right edge. */
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='query'] {
    grid-area: query !important;
    align-self: center !important;
    justify-self: stretch !important;
    z-index: 1 !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='query'] #linea-buscador {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 6px 43px 7px 1px !important;
    box-sizing: border-box !important;
    border: none !important;
    border-bottom: 1px solid #6f6257 !important;
    color: #999 !important;
    font-size: clamp(13px, 1vw, 16px) !important;
    font-weight: 300 !important;
    line-height: 24px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-align: left !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='search'] {
    grid-area: query !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    justify-self: end !important;
    align-self: center !important;
    z-index: 5 !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='search'] .elementor-search {
    text-align: right !important;
    margin: 0 !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='search'] .elementor-search__toggle {
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
    cursor: pointer !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='search'] .elementor-search__toggle i {
    font-size: 25px !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
    transform: none !important;
  }
  /* Account */
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='account'] {
    grid-area: account !important;
    justify-self: center !important;
    z-index: 3 !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='account'] .pkheaderitems,
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='account'] .pkheaderitems > ul {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    width: max-content !important;
    max-width: 100% !important;
    gap: 0 !important;
    list-style: none !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='account'] #pk_myaccount,
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='account'] #pk_myaccount a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 38px !important;
    white-space: nowrap !important;
  }
  /* Assistance: override position:absolute inline from HTML widget. */
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='support'] {
    grid-area: support !important;
    justify-self: center !important;
    z-index: 3 !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='support'] a.btn-assist {
    display: inline-flex !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 36px !important;
    height: 40px !important;
    justify-content: center !important;
    align-items: center !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='support'] .btn-assist img {
    display: block !important;
    width: 26px !important;
    height: 26px !important;
    max-width: 100% !important;
    object-fit: contain !important;
  }
  /* Shopping cart */
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='cart'] {
    grid-area: cart !important;
    justify-self: center !important;
    z-index: 4 !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='cart'] .elementor-cart__toggle {
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    min-height: 40px !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='cart'] .elementor-cart__toggle > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='cart'] .elementor-cart__toggle .elementor-button-text {
    display: none !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='cart'] .elementor-cart__toggle .elementor-button-icon {
    color: #818a91 !important;
    font-size: 23px !important;
    position: relative !important;
    padding: 0 !important;
    margin: 0 !important;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  #header .desktop-header-wrapper .elementor-14020101.cehr-active { --cehr-gap: 10px; }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .elementor-row.cehr-grid {
    grid-template-columns: minmax(170px,1fr) minmax(165px,30vw) max-content 36px 43px !important;
    row-gap: 15px !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='menu'] .icon_menu {
    display: flex !important;
    position: relative !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
    padding: 4px !important;
    cursor: pointer !important;
  }
}
@media screen and (min-width:768px) and (max-width:829px) {
  #header .desktop-header-wrapper .elementor-14020101.cehr-active { --cehr-gap: 7px; }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active .elementor-row.cehr-grid {
    grid-template-columns: minmax(155px,1fr) minmax(155px,27vw) max-content 34px 40px !important;
  }
  #header .desktop-header-wrapper .elementor-14020101.cehr-active [data-cehr-role='logo'] img.logo {
    width: 185px !important;
  }
}
