/*
 * Storefront base — shared type + color tokens
 * Poppins is the default UI font across all storefront pages
 * (same as cart / checkout). Icon fonts are preserved separately.
 */

:root {
    --sf-ink: #1c2328;
    --sf-muted: #667077;
    --sf-line: #e4e8ea;
    --sf-surface: #ffffff;
    --sf-wash: #f3f6f4;
    --sf-accent: #4dae65;
    --sf-accent-hover: #3f9a56;
    --sf-danger: #b42318;
    --sf-radius: 16px;
    --sf-shadow: 0 18px 40px rgba(28, 35, 40, 0.07);
    --sf-font: Poppins, sans-serif;
}

html,
body,
.page-wrapper,
.main,
.sidebar-shop,
.header,
.footer,
.mobile-menu-container,
.mobile-menu,
.sticky-navbar {
    font-family: var(--sf-font);
    color: var(--sf-ink);
}

/* Porto utility classes — keep brand font, do not fall back to Open Sans */
.font1,
.font2,
.font4,
.page-wrapper .font1,
.page-wrapper .font2,
.page-wrapper .font4 {
    font-family: var(--sf-font) !important;
}

.page-wrapper h1,
.page-wrapper h2,
.page-wrapper h3,
.page-wrapper h4,
.page-wrapper h5,
.page-wrapper h6,
.page-wrapper p,
.page-wrapper label,
.page-wrapper input,
.page-wrapper select,
.page-wrapper textarea,
.page-wrapper button,
.page-wrapper .btn,
.page-wrapper .nav-link,
.page-wrapper .section-title,
.page-wrapper .product-title,
.page-wrapper .product-category,
.page-wrapper .product-price,
.page-wrapper .old-price,
.page-wrapper .breadcrumb,
.page-wrapper .widget-title,
.page-wrapper .toolbox,
.page-wrapper .toolbox label,
.page-wrapper .form-control,
.page-wrapper .pagination,
.page-wrapper .products-count,
.page-wrapper .category-content h3,
.page-wrapper .category-content span,
.page-wrapper .product-category-panel .section-title h2,
.page-wrapper .product-default .category-list,
.page-wrapper .sidebar-shop .widget-title,
.page-wrapper .sidebar-shop .product-widget .product-title,
.page-wrapper .sidebar-product .widget.widget-product-categories .widget-title,
.page-wrapper .widget-block h5,
.page-wrapper .widget-info h4,
.page-wrapper .product-widgets-container .product-title,
.page-wrapper .product-single-tabs .nav.nav-tabs .nav-link,
.page-wrapper .category-banner .coupon-sale-text {
    font-family: var(--sf-font) !important;
}

/* Header / All Categories / mega menu / mobile nav */
.header,
.header a,
.header .btn,
.header .form-control,
.header select,
.header .cart-subtotal,
.header .cart-price,
.header-top,
.header-top a,
.header-top h4,
.header-top .info-box,
.header-top .info-box h4,
.header-top .header-dropdown,
.header-top .header-dropdown > a,
.header-top .header-menu a,
.header-search-form,
.header-search-results,
.header-search-results a,
.main-nav,
.main-nav a,
.menu-depart,
.menu-depart > a,
.menu-depart .menu,
.menu-depart .menu > li > a,
.menu-depart .megamenu,
.menu-depart .megamenu a,
.menu-depart .nolink,
.menu-depart .submenu,
.menu-depart .submenu a,
.menu,
.menu > li > a,
.megamenu,
.megamenu a,
.megamenu .nolink,
.submenu,
.submenu a,
.mobile-nav,
.mobile-nav a,
.mobile-menu,
.mobile-menu a,
.mobile-menu .nolink,
.sidebar-shop .cat-list,
.sidebar-shop .cat-list a,
.sidebar-shop .cat-list span {
    font-family: var(--sf-font) !important;
}
/* -------------------------------------------------------------------------
 * Icon fonts — must win over Poppins on glyph pseudo-elements
 * Porto demo icons, Font Awesome, Simple Line Icons, category toggles
 * ------------------------------------------------------------------------- */

[class^="icon-"]::before,
[class*=" icon-"]::before,
.page-wrapper [class^="icon-"]::before,
.page-wrapper [class*=" icon-"]::before,
.mobile-menu [class^="icon-"]::before,
.mobile-menu [class*=" icon-"]::before,
.sticky-navbar [class^="icon-"]::before,
.sticky-navbar [class*=" icon-"]::before,
.toggle::before,
.page-wrapper .toggle::before,
.sidebar-shop .toggle::before,
.cat-list .toggle::before,
.mmenu-btn::after,
.sf-with-ul::after,
.menu-depart > a::after,
.select-custom::after,
.breadcrumb-item::before,
.header-dropdown > a::after {
    font-family: "porto" !important;
    font-style: normal !important;
    font-weight: normal !important;
}

.page-wrapper .fas::before,
.page-wrapper .fa::before,
.mobile-menu .fas::before,
.fas::before,
.fa::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
}

.page-wrapper .far::before,
.far::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 400 !important;
}

.page-wrapper .fab::before,
.fab::before {
    font-family: "Font Awesome 5 Brands" !important;
    font-weight: 400 !important;
}

[class^="sicon-"]::before,
[class*=" sicon-"]::before,
.page-wrapper [class^="sicon-"]::before,
.page-wrapper [class*=" sicon-"]::before {
    font-family: simple-line-icons !important;
    font-style: normal !important;
    font-weight: normal !important;
}

/* Category filter expand/collapse arrows */
.sidebar-shop .cat-list .toggle {
    font-family: "porto" !important;
}

.sidebar-shop .cat-list .toggle::before {
    font-family: "porto" !important;
    content: "\e81b";
}

.sidebar-shop .cat-list a.collapsed > .toggle::before,
.sidebar-shop .cat-list .collapsed span.toggle::before {
    content: "\e81c";
}