:root {
    --sol-svg-icon-size: 1em;
    /*--sol-svg-icon-size: 22px;*/
}

/* Base: reemplaza cualquier icono de Porto por un SVG de mascara */
/*[class^="porto-icon-"],
[class*=" porto-icon-"] {
    --sol-svg-icon-url: url('../images/icons/fallback.svg');
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--sol-svg-icon-size);
    height: var(--sol-svg-icon-size);
    line-height: 1;
    vertical-align: middle;
}*/

[class^="porto-icon-"],
[class*=" porto-icon-"] {
    --sol-svg-icon-url: url('../images/icons/fallback.svg');
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--sol-svg-icon-size);
    height: var(--sol-svg-icon-size);
    line-height: 1;
    vertical-align: middle;
    /*font-size: 0 !important;*/
}

/*[class^="porto-icon-"]::before,
[class*=" porto-icon-"]::before {
    content: '' !important;
    display: block;
    width: 100%;
    height: 100%;
    background-color: currentColor;
    -webkit-mask-image: var(--sol-svg-icon-url);
    mask-image: var(--sol-svg-icon-url);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    font-family: initial !important;
    font-size: inherit;
    font-style: normal;
    font-weight: normal;
    text-indent: 0;
}*/

[class^="porto-icon-"]::before,
[class*=" porto-icon-"]::before {
    content: '' !important;
    display: block;
    width: 100%;
    height: 100%;
    background-color: currentColor;
    -webkit-mask-image: var(--sol-svg-icon-url);
    mask-image: var(--sol-svg-icon-url);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    font-family: none !important;
    font-size: var(--sol-svg-icon-size) !important;
    font-style: normal;
    font-weight: normal;
    text-indent: 0;
    line-height: 1;
}


.page-header [class^="porto-icon-"],
.page-header [class*=" porto-icon-"],
.header [class^="porto-icon-"],
.header [class*=" porto-icon-"] {
    --sol-svg-icon-size: 25px;
}


/* Evita doble icono en el carrito del header de Porto */
.minicart-wrapper .action.showcart::before,
.header .action.showcart::before,
.page-header .action.showcart::before {
    content: none !important;
    display: none !important;
}


/* Mapeo inicial de iconos comunes */
.porto-icon-search,
.porto-icon-search-1,
.porto-icon-search-4,
.porto-icon-search-5,
.porto-icon-magnifier,
.porto-icon-magnifier-add,
.porto-icon-magnifier-remove {
    --sol-svg-icon-url: url('../images/icons/search.svg');
}

.porto-icon-user-1,
.porto-icon-user-2,
.porto-icon-user-3 {
    --sol-svg-icon-url: url('../images/icons/user.svg');
}

.porto-icon-shopping-cart,
.porto-icon-shopping-basket,
.porto-icon-mini-cart,
.porto-icon-basket,
.porto-icon-bag,
.porto-icon-bag-2,
.porto-icon-bag-3,
.porto-icon-cart-thick,
.porto-icon-cart-thick-1 {
    --sol-svg-icon-url: url('../images/icons/cart.svg');
}

.porto-icon-heart,
.porto-icon-heart-1,
.porto-icon-wishlist,
.porto-icon-wishlist-1,
.porto-icon-wishlist-2 {
    --sol-svg-icon-url: url('../images/icons/heart.svg');
}

.porto-icon-menu,
.porto-icon-menu-button-of-three-lines-outline {
    --sol-svg-icon-url: url('../images/icons/menu.svg');
}

.porto-icon-cancel,
.porto-icon-cancel-1,
.porto-icon-cancel-2,
.porto-icon-cancel-mini {
    --sol-svg-icon-url: url('../images/icons/close.svg');
}

.porto-icon-angle-left,
.porto-icon-left-open,
.porto-icon-left-open-mini,
.porto-icon-left-open-big,
.porto-icon-left-open-huge,
.porto-icon-left-dir,
.porto-icon-long-arrow-alt-left {
    --sol-svg-icon-url: url('../images/icons/chevron-left.svg');
}

.porto-icon-angle-right,
.porto-icon-right-open,
.porto-icon-right-open-mini,
.porto-icon-right-open-big,
.porto-icon-right-open-huge,
.porto-icon-right-dir,
.porto-icon-long-arrow-alt-right,
.porto-icon-arrow-right-solid,
.porto-icon-long-arrow-right,
.porto-icon-arrow-forward-right {
    --sol-svg-icon-url: url('../images/icons/chevron-right.svg');
}

.porto-icon-angle-up,
.porto-icon-up-open,
.porto-icon-up-open-mini,
.porto-icon-up-open-big,
.porto-icon-up-open-huge,
.porto-icon-up-dir,
.porto-icon-long-arrow-alt-up {
    --sol-svg-icon-url: url('../images/icons/chevron-up.svg');
}

.porto-icon-angle-down,
.porto-icon-down-open,
.porto-icon-down-open-mini,
.porto-icon-down-open-big,
.porto-icon-down-open-huge,
.porto-icon-down-dir,
.porto-icon-long-arrow-alt-down,
.porto-icon-down-1 {
    --sol-svg-icon-url: url('../images/icons/chevron-down.svg');
}

.porto-icon-phone,
.porto-icon-phone-1,
.porto-icon-phone-2,
.porto-icon-phone-call,
.porto-icon-callin {
    --sol-svg-icon-url: url('../images/icons/phone.svg');
}

.porto-icon-mail,
.porto-icon-mail-alt-1,
.porto-icon-envelope,
.porto-icon-envolope {
    --sol-svg-icon-url: url('../images/icons/mail.svg');
}

.porto-icon-location,
.porto-icon-map-location,
.porto-icon-direction {
    --sol-svg-icon-url: url('../images/icons/location.svg');
}

.porto-icon-home {
    --sol-svg-icon-url: url('../images/icons/home.svg');
}

.porto-icon-clock,
.porto-icon-clock-1 {
    --sol-svg-icon-url: url('../images/icons/clock.svg');
}

.porto-icon-ok,
.porto-icon-ok-1,
.porto-icon-check-circle,
.porto-icon-check-circle-1,
.porto-icon-check-circle-2,
.porto-icon-check-solid {
    --sol-svg-icon-url: url('../images/icons/check.svg');
}

/* Algunos iconos base de Magento (Luma/Blank) renderizados en SVG */
.action.showcart:before,
.action.search:before,
.minicart-wrapper .action.showcart:before,
.block-search .action.search:before,
.action.towishlist:before,
.action.tocompare:before,
.action.delete:before,
.action.edit:before,
.checkout-index-index .action-auth-toggle:before,
.opc-progress-bar-item._active:before {
    content: '' !important;
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.action.showcart:before,
.minicart-wrapper .action.showcart:before {
    -webkit-mask-image: url('../images/icons/cart.svg');
    mask-image: url('../images/icons/cart.svg');
}

.action.search:before,
.block-search .action.search:before {
    -webkit-mask-image: url('../images/icons/search.svg');
    mask-image: url('../images/icons/search.svg');
}

.action.towishlist:before {
    -webkit-mask-image: url('../images/icons/heart.svg');
    mask-image: url('../images/icons/heart.svg');
}

.action.tocompare:before {
    -webkit-mask-image: url('../images/icons/compare.svg');
    mask-image: url('../images/icons/compare.svg');
}

.action.delete:before {
    -webkit-mask-image: url('../images/icons/trash.svg');
    mask-image: url('../images/icons/trash.svg');
}

.action.edit:before {
    -webkit-mask-image: url('../images/icons/edit.svg');
    mask-image: url('../images/icons/edit.svg');
}

.checkout-index-index .action-auth-toggle:before,
.opc-progress-bar-item._active:before {
    -webkit-mask-image: url('../images/icons/check.svg');
    mask-image: url('../images/icons/check.svg');
}


/* ================================
   ICONOS CUSTOM SOLOPTICAL
   Uso recomendado:
   <span class="sol-icon sol-icon--buscar" aria-hidden="true"></span>
   <span class="sol-icon sol-icon--bolsa" aria-hidden="true"></span>
   También disponible como variable: style="--sol-svg-icon-url:url('../images/icons/custom/icono_buscar.svg')"
================================ */

.sol-icon {
    --sol-svg-icon-size: 20px;
    --sol-svg-icon-url: url('../images/icons/fallback.svg');
    display: inline-block;
    width: var(--sol-svg-icon-size);
    height: var(--sol-svg-icon-size);
    vertical-align: middle;
    background-color: currentColor;
    -webkit-mask-image: var(--sol-svg-icon-url);
    mask-image: var(--sol-svg-icon-url);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    flex: 0 0 auto;
}

.sol-icon--sm { --sol-svg-icon-size: 16px; }
.sol-icon--md { --sol-svg-icon-size: 20px; }
.sol-icon--lg { --sol-svg-icon-size: 24px; }
.sol-icon--xl { --sol-svg-icon-size: 32px; }

.sol-icon--circle-atc { --sol-svg-icon-url: url('../images/icons/custom/iconcircle_atc.svg'); }
.sol-icon--circle-devoluciones { --sol-svg-icon-url: url('../images/icons/custom/iconcircle_devoluciones.svg'); }
.sol-icon--circle-enviogratis { --sol-svg-icon-url: url('../images/icons/custom/iconcircle_enviogratis.svg'); }
.sol-icon--circle-pagoseguro { --sol-svg-icon-url: url('../images/icons/custom/iconcircle_pagoseguro.svg'); }
.sol-icon--alerta { --sol-svg-icon-url: url('../images/icons/custom/icono_alerta.svg'); }
.sol-icon--atencioncliente { --sol-svg-icon-url: url('../images/icons/custom/icono_atencioncliente.svg'); }
.sol-icon--basura { --sol-svg-icon-url: url('../images/icons/custom/icono_basura.svg'); }
.sol-icon--bolsa { --sol-svg-icon-url: url('../images/icons/custom/icono_bolsa.svg'); }
.sol-icon--buscar { --sol-svg-icon-url: url('../images/icons/custom/icono_buscar.svg'); }
.sol-icon--calendario { --sol-svg-icon-url: url('../images/icons/custom/icono_calendario.svg'); }
.sol-icon--catalogo { --sol-svg-icon-url: url('../images/icons/custom/icono_catalogo.svg'); }
.sol-icon--chat { --sol-svg-icon-url: url('../images/icons/custom/icono_chat.svg'); }
.sol-icon--comparar1 { --sol-svg-icon-url: url('../images/icons/custom/icono_comparar1.svg'); }
.sol-icon--comparar2 { --sol-svg-icon-url: url('../images/icons/custom/icono_comparar2.svg'); }
.sol-icon--comparar3 { --sol-svg-icon-url: url('../images/icons/custom/icono_comparar3.svg'); }
.sol-icon--comparar4 { --sol-svg-icon-url: url('../images/icons/custom/icono_comparar4.svg'); }
.sol-icon--corazon { --sol-svg-icon-url: url('../images/icons/custom/icono_corazon.svg'); }
.sol-icon--cross { --sol-svg-icon-url: url('../images/icons/custom/icono_cross.svg'); }
.sol-icon--destacado { --sol-svg-icon-url: url('../images/icons/custom/icono_destacado.svg'); }
.sol-icon--devolver { --sol-svg-icon-url: url('../images/icons/custom/icono_devolver.svg'); }
.sol-icon--editar1 { --sol-svg-icon-url: url('../images/icons/custom/icono_editar1.svg'); }
.sol-icon--editar2 { --sol-svg-icon-url: url('../images/icons/custom/icono_editar2.svg'); }
.sol-icon--envio { --sol-svg-icon-url: url('../images/icons/custom/icono_envio.svg'); }
.sol-icon--enviorapido { --sol-svg-icon-url: url('../images/icons/custom/icono_enviorapido.svg'); }
.sol-icon--filtros1 { --sol-svg-icon-url: url('../images/icons/custom/icono_filtros1.svg'); }
.sol-icon--filtros2 { --sol-svg-icon-url: url('../images/icons/custom/icono_filtros2.svg'); }
.sol-icon--flecha-abajo { --sol-svg-icon-url: url('../images/icons/custom/icono_flecha_abajo.svg'); }
.sol-icon--flecha-arriba { --sol-svg-icon-url: url('../images/icons/custom/icono_flecha_arriba.svg'); }
.sol-icon--flecha-derecha { --sol-svg-icon-url: url('../images/icons/custom/icono_flecha_derecha.svg'); }
.sol-icon--flecha-izquierda { --sol-svg-icon-url: url('../images/icons/custom/icono_flecha_izquierda.svg'); }
.sol-icon--gafas { --sol-svg-icon-url: url('../images/icons/custom/icono_gafas.svg'); }
.sol-icon--home { --sol-svg-icon-url: url('../images/icons/custom/icono_home.svg'); }
.sol-icon--info { --sol-svg-icon-url: url('../images/icons/custom/icono_info.svg'); }
.sol-icon--lentilla1 { --sol-svg-icon-url: url('../images/icons/custom/icono_lentilla1.svg'); }
.sol-icon--lentilla2 { --sol-svg-icon-url: url('../images/icons/custom/icono_lentilla2.svg'); }
.sol-icon--mail { --sol-svg-icon-url: url('../images/icons/custom/icono_mail.svg'); }
.sol-icon--menu { --sol-svg-icon-url: url('../images/icons/custom/icono_menu.svg'); }
.sol-icon--reloj { --sol-svg-icon-url: url('../images/icons/custom/icono_reloj.svg'); }
.sol-icon--sonido1 { --sol-svg-icon-url: url('../images/icons/custom/icono_sonido1.svg'); }
.sol-icon--sonido2 { --sol-svg-icon-url: url('../images/icons/custom/icono_sonido2.svg'); }
.sol-icon--tarjeta { --sol-svg-icon-url: url('../images/icons/custom/icono_tarjeta.svg'); }
.sol-icon--telefono1 { --sol-svg-icon-url: url('../images/icons/custom/icono_telefono1.svg'); }
.sol-icon--telefono2 { --sol-svg-icon-url: url('../images/icons/custom/icono_telefono2.svg'); }
.sol-icon--tick { --sol-svg-icon-url: url('../images/icons/custom/icono_tick.svg'); }
.sol-icon--tienda { --sol-svg-icon-url: url('../images/icons/custom/icono_tienda.svg'); }
.sol-icon--tiendaonline { --sol-svg-icon-url: url('../images/icons/custom/icono_tiendaonline.svg'); }
.sol-icon--ubicacion { --sol-svg-icon-url: url('../images/icons/custom/icono_ubicacion.svg'); }
.sol-icon--usuario { --sol-svg-icon-url: url('../images/icons/custom/icono_usuario.svg'); }

/* Alias útiles */
.sol-icon--cart { --sol-svg-icon-url: url('../images/icons/custom/icono_bolsa.svg'); }
.sol-icon--bag { --sol-svg-icon-url: url('../images/icons/custom/icono_bolsa.svg'); }
.sol-icon--search { --sol-svg-icon-url: url('../images/icons/custom/icono_buscar.svg'); }
.sol-icon--user { --sol-svg-icon-url: url('../images/icons/custom/icono_usuario.svg'); }
.sol-icon--heart { --sol-svg-icon-url: url('../images/icons/custom/icono_corazon.svg'); }
.sol-icon--phone { --sol-svg-icon-url: url('../images/icons/custom/icono_telefono1.svg'); }
.sol-icon--mail { --sol-svg-icon-url: url('../images/icons/custom/icono_mail.svg'); }
.sol-icon--location { --sol-svg-icon-url: url('../images/icons/custom/icono_ubicacion.svg'); }
.sol-icon--menu { --sol-svg-icon-url: url('../images/icons/custom/icono_menu.svg'); }
.sol-icon--home { --sol-svg-icon-url: url('../images/icons/custom/icono_home.svg'); }
.sol-icon--compare { --sol-svg-icon-url: url('../images/icons/custom/icono_comparar1.svg'); }
.sol-icon--trash { --sol-svg-icon-url: url('../images/icons/custom/icono_basura.svg'); }
.sol-icon--edit { --sol-svg-icon-url: url('../images/icons/custom/icono_editar1.svg'); }
.sol-icon--check { --sol-svg-icon-url: url('../images/icons/custom/icono_tick.svg'); }
.sol-icon--tiendafisica { --sol-svg-icon-url: url('../images/icons/custom/icono_tiendafisica.svg');}