/* El outline se apaga solo cuando el foco vino del mouse: con teclado lo
   dibuja :focus-visible (theme.css). Antes era outline: none !important en
   todo, y el sitio no tenia foco visible en ningun control. */
button,
a,
input,
[role="button"] {
    -webkit-tap-highlight-color: transparent;
}

button:focus:not(:focus-visible),
a:focus:not(:focus-visible),
input:focus:not(:focus-visible) {
    outline: none;
}

/* Force transparent backgrounds on all FEDELAN buttons */
.fedelan-header__menu-toggle,
.fedelan-header__mobile-menu,
.fedelan-header__cart-toggle,
.fedelan-mobile-menu__close,
.fedelan-mobile-menu__back-header,
.fedelan-cart-drawer__close,
.fedelan-cart-drawer__qty-btn,
.fedelan-cart-drawer__item-remove,
.fedelan-favorites-drawer__close,
.fedelan-favorites-drawer__item-remove,
.fedelan-compra-rapida__close,
.fedelan-header__favorites-toggle {
    background: none !important;
    background-color: transparent !important;
    -webkit-tap-highlight-color: transparent;
}

.fedelan-header__menu-toggle:hover,
.fedelan-header__menu-toggle:focus,
.fedelan-header__menu-toggle:active,
.fedelan-header__mobile-menu:hover,
.fedelan-header__mobile-menu:focus,
.fedelan-header__mobile-menu:active,
.fedelan-header__cart-toggle:hover,
.fedelan-header__cart-toggle:focus,
.fedelan-header__cart-toggle:active,
.fedelan-mobile-menu__close:hover,
.fedelan-mobile-menu__close:focus,
.fedelan-mobile-menu__close:active,
.fedelan-mobile-menu__back-header:hover,
.fedelan-mobile-menu__back-header:focus,
.fedelan-mobile-menu__back-header:active,
.fedelan-cart-drawer__close:hover,
.fedelan-cart-drawer__close:focus,
.fedelan-cart-drawer__close:active,
.fedelan-cart-drawer__qty-btn:hover,
.fedelan-cart-drawer__qty-btn:focus,
.fedelan-cart-drawer__qty-btn:active,
.fedelan-cart-drawer__item-remove:hover,
.fedelan-cart-drawer__item-remove:focus,
.fedelan-cart-drawer__item-remove:active,
.fedelan-compra-rapida__close:hover,
.fedelan-compra-rapida__close:focus,
.fedelan-compra-rapida__close:active {
    background: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Force header search input to have no border except bottom */
.fedelan-header__search input,
.fedelan-header__search input[type="search"] {
    background: transparent !important;
    background-color: transparent !important;
    padding-left: 0 !important;
    border: 0 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.fedelan-header:hover .fedelan-header__search input,
.fedelan-header--scrolled .fedelan-header__search input {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom-color: rgba(0, 0, 0, 0.3) !important;
}

/* ==========================================================================
   Reset GeneratePress Header
   ========================================================================== */

.site-header,
.main-navigation {
    display: none !important;
}

/* Hide default blog content on home */
body.home .site-content,
body.home #primary,
body.home #secondary,
body.blog .site-content,
body.blog #primary,
body.blog #secondary {
    display: none !important;
}

/* ==========================================================================
   Body padding for fixed header
   ========================================================================== */

body {
    padding-top: var(--fedelan-header-total-height);
}

/* Remove padding on front page where hero carousel exists */
body.home {
    padding-top: 0;
}

/* ==========================================================================
   WordPress Admin Bar Offset
   ========================================================================== */

/* When admin bar is visible (logged in) */
.admin-bar .fedelan-header {
    top: 32px;
}

.admin-bar body {
    padding-top: calc(var(--fedelan-header-total-height) + 32px);
}

/* Mobile admin bar is taller */
@media (max-width: 782px) {
    .admin-bar .fedelan-header {
        top: 46px;
    }

    .admin-bar body {
        padding-top: calc(var(--fedelan-header-total-height) + 46px);
    }
}

/* ==========================================================================
   WooCommerce Toast Messages
   ========================================================================== */

/* El aviso de "agregado al pedido" no se imprime (wc_add_to_cart_message_html
   en inc/woocommerce.php): el drawer ya lo confirma. Los demas avisos de
   exito (guardar la direccion, los datos) si se ven, con el estilo de
   theme.css. Antes un display:none global los escondia a todos. */

/* ==========================================================================
   Paginas de WooCommerce: el contenedor de GeneratePress a lo ancho
   Vale para todas (catalogo, ficha, carrito, checkout, cuenta), por eso vive
   aca y no en archive.css: esa hoja carga solo en el catalogo, y sin este
   bloque el carrito y la cuenta se encogian al ancho de su contenido.
   ========================================================================== */

.woocommerce .site-content,
.woocommerce-page .site-content,
.woocommerce .content-area,
.woocommerce-page .content-area,
.woocommerce .site-main,
.woocommerce-page .site-main,
.woocommerce .container,
.woocommerce-page .container,
.woocommerce .grid-container,
.woocommerce-page .grid-container,
.woocommerce #primary,
.woocommerce-page #primary {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Remove GeneratePress entry styles */
.woocommerce .hentry,
.woocommerce-page .hentry,
.woocommerce article,
.woocommerce-page article {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
}

/* Remove GeneratePress inside-article padding */
.woocommerce .inside-article,
.woocommerce-page .inside-article {
    padding: 0 !important;
}

/* ==========================================================================
   Default Page Layout
   ========================================================================== */

body.page:not(.home):not(.woocommerce-page) .site.grid-container {
    /* Sin el ancho, una pagina corta (Quienes somos) se encoge al ancho de
       su texto y queda flotando en el medio. */
    width: 100%;
    max-width: 1280px;
    padding-left: 24px;
    padding-right: 24px;
}

body.page:not(.home):not(.woocommerce-page) #primary {
    width: 100%;
    float: none;
    margin: 0;
}

body.page:not(.home):not(.woocommerce-page) .site-main {
    padding: 40px 0 72px;
}

body.page:not(.home):not(.woocommerce-page) .inside-article {
    padding: 0;
    background: transparent;
    box-shadow: none;
}

body.page:not(.home):not(.woocommerce-page) .entry-header {
    margin-bottom: 24px;
}

body.page:not(.home):not(.woocommerce-page) .entry-title {
    margin: 0;
    font-family: var(--fedelan-font-primary);
    font-size: clamp(32px, 4vw, 56px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--fedelan-black);
}

body.page:not(.home):not(.woocommerce-page) .entry-content {
    max-width: 920px;
}

body.page:not(.home):not(.woocommerce-page) .entry-content > *:first-child {
    margin-top: 0;
}

@media (max-width: 768px) {
    body.page:not(.home):not(.woocommerce-page) .site.grid-container {
        padding-left: 18px;
        padding-right: 18px;
    }

    body.page:not(.home):not(.woocommerce-page) .site-main {
        padding: 28px 0 56px;
    }
}
