/*
 * Theme Name:  SportwayShop SF Child
 * Theme URI:   http://www.monkey-theatre.com/themes/sportwayshop-sf-child
 * Author:      Monkey Theatre Studio (MNK)
 * Author URI:  http://www.monkey-theatre.com
 * Template:    storefront
 * Description: v2.3.2 (08/04/2026) Aggiunta icona My Account nella nav bar desktop.
 * Version:     2.3.2
 * Text Domain: mnklang
 * Requires PHP: 8.1
 * License:     GNU General Public License v2 or later
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 */

/* ==========================================================================
   0. LOCAL FONTS — Roboto (body) + Passion One (headings)
   ========================================================================== */

/* Roboto — Variable font, latin-ext */
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 100%;
	font-display: swap;
	src: url('./assets/fonts/Roboto-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Roboto — Variable font, latin */
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 100%;
	font-display: swap;
	src: url('./assets/fonts/Roboto-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Passion One Bold — latin-ext */
@font-face {
	font-family: 'Passion One';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('./assets/fonts/PassionOne-Bold-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Passion One Bold — latin */
@font-face {
	font-family: 'Passion One';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('./assets/fonts/PassionOne-Bold-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   0b. GLOBAL TYPOGRAPHY
   ========================================================================== */

body,
button,
input,
select,
textarea {
	font-family: 'Roboto', sans-serif;
}

h1, h2, h3, h4, h5, h6,
.woocommerce div.product .product_title,
.site-title {
	font-family: 'Passion One', cursive;
	font-weight: 700;
}

/* ==========================================================================
   0c. WC NOTICES — sopra l'header
   ========================================================================== */

.mnk-notices-topbar {
	width: 100%;
}

.mnk-notices-topbar:empty {
	display: none;
}

.mnk-notices-topbar .woocommerce-message,
.mnk-notices-topbar .woocommerce-error,
.mnk-notices-topbar .woocommerce-info {
	margin: 0;
	border-radius: 0;
	padding: 12px 24px;
	display: flex;
	align-items: center;
	gap: 8px;
}

/* Icona prima del testo: inline, non sovrapposta */
.mnk-notices-topbar .woocommerce-message::before,
.mnk-notices-topbar .woocommerce-error::before,
.mnk-notices-topbar .woocommerce-info::before {
	position: static !important;
	flex-shrink: 0;
	margin: 0 !important;
}

/* Link dentro gli avvisi — testo semplice, non bottone, allineato a destra */
.mnk-notices-topbar .woocommerce-message a.button,
.mnk-notices-topbar .woocommerce-info a.button,
.mnk-notices-topbar .woocommerce-error a.button {
	margin-left: auto !important;
	background: none !important;
	border: none !important;
	color: #ffffff !important;
	text-decoration: underline !important;
	padding: 0 !important;
	font-size: inherit !important;
	font-weight: 600 !important;
	border-radius: 0 !important;
}

.mnk-notices-topbar .woocommerce-message a.button:hover,
.mnk-notices-topbar .woocommerce-info a.button:hover,
.mnk-notices-topbar .woocommerce-error a.button:hover {
	background: none !important;
	color: rgba(255, 255, 255, 0.8) !important;
}

/* ==========================================================================
   1. TOP BAR — sfondo bianco, testo nero, check rossi
   ========================================================================== */

.mnk-topbar {
	background-color: #ffffff;
	color: #333333;
	font-size: 14px;
	line-height: 1.4;
	border-bottom: 1px solid #e5e5e5;
}

.mnk-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 10px;
	padding-bottom: 10px;
}

.mnk-topbar__messages {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	margin-right: auto;
}

.mnk-topbar__msg {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

/* Red checkmark before each message */
.mnk-topbar__msg::before {
	content: "\2714";
	color: #e30613;
	font-size: 13px;
	font-weight: 700;
}

.mnk-topbar__msg a {
	color: #333333;
	text-decoration: none;
}

.mnk-topbar__msg a:hover {
	color: #e30613;
}

.mnk-topbar__separator {
	color: #cccccc;
}

.mnk-topbar__social {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-left: auto;
}

.mnk-topbar .mnk-topbar__social-link {
	color: #000000;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 4px;
	transition: color 0.2s ease;
}

.mnk-topbar .mnk-topbar__social-link:hover {
	color: #e30613;
}

/* ==========================================================================
   1b. SITE HEADER — reset padding
   ========================================================================== */

.site-header {
	padding-top: 0;
	padding-bottom: 0;
	border-bottom: 0;
	margin-bottom: 0;
}

/* ==========================================================================
   2. LOGO AREA — sfondo bianco, logo centrato
   ========================================================================== */

.mnk-logo-area {
	background-color: #ffffff;
	padding: 2em 0;
	text-align: center;
}

.mnk-logo-area__logo {
	display: inline-block;
}

.mnk-logo-area__logo a {
	display: block;
}

.mnk-logo-area__logo .custom-logo-link img {
	width: 400px !important;
	max-width: 100% !important;
	height: auto;
}

.mnk-logo-area__placeholder {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 400px;
	height: 120px;
	background-color: #eeeeee;
	border: 2px dashed #cccccc;
	color: #999999;
	font-family: monospace;
	font-size: 14px;
	text-decoration: none;
}

.mnk-logo-area__placeholder:hover {
	background-color: #e5e5e5;
	color: #666666;
}

/* ==========================================================================
   3. NAVIGATION BAR — sfondo rosso, testo bianco, uppercase
   ========================================================================== */

.storefront-primary-navigation {
	background-color: #e30613 !important;
	border-bottom: none;
}

.storefront-primary-navigation .col-full {
	display: flex;
	align-items: center;
}

.storefront-primary-navigation nav.main-navigation {
	flex: 1;
}

.main-navigation ul.menu > li > a,
.main-navigation ul.nav-menu > li > a {
	color: #ffffff !important;
	padding: 14px 18px;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.3px;
}

.main-navigation ul.menu > li > a:hover,
.main-navigation ul.nav-menu > li > a:hover {
	color: rgba(255, 255, 255, 0.8) !important;
}

.main-navigation ul.menu li.current-menu-item > a,
.main-navigation ul.nav-menu li.current-menu-item > a {
	color: #ffffff !important;
	font-weight: 700;
	box-shadow: inset 0 -3px 0 0 #ffffff;
}

/* Sub-menus */
.main-navigation ul.menu ul,
.main-navigation ul.nav-menu ul {
	background-color: #ffffff;
	border: 1px solid #e5e5e5;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.main-navigation ul.menu ul a,
.main-navigation ul.nav-menu ul a {
	color: #333333 !important;
	text-transform: none;
	font-weight: 400;
}

.main-navigation ul.menu ul a:hover,
.main-navigation ul.nav-menu ul a:hover,
.main-navigation ul.menu ul li.current-menu-item > a,
.main-navigation ul.nav-menu ul li.current-menu-item > a {
	background-color: #e30613 !important;
	color: #ffffff !important;
}

/* ==========================================================================
   4. ACCOUNT & CART ICONS (NAV BAR) — bianco su rosso
   ========================================================================== */

/* Social icons in nav bar: visibili solo su mobile (vedi @media) */
.mnk-nav-social {
	display: none;
}

/* Storefront cart link override */
.storefront-primary-navigation .site-header-cart > li > a {
	color: #ffffff !important;
}

.site-header-cart .cart-contents {
	color: #ffffff !important;
}

.site-header-cart .cart-contents:hover {
	color: rgba(255, 255, 255, 0.8) !important;
}

.site-header-cart .cart-contents .count {
	background-color: transparent;
	color: #ffffff !important;
	font-weight: 700;
	border: none;
	text-decoration: none;
}

/* My Account icon — desktop nav bar */
.mnk-header-account {
	display: flex;
	align-items: center;
	padding: 0 12px;
	color: #ffffff !important;
	text-decoration: none;
	height: 100%;
}

.mnk-header-account:hover {
	color: rgba(255, 255, 255, 0.8) !important;
}

.mnk-header-account.current {
	opacity: 0.7;
}

/* Mini-cart dropdown: allineato a destra con il contenuto */
.site-header-cart .widget_shopping_cart {
	width: 450px;
	right: 0;
	left: auto !important;
	z-index: 9999;
}

.site-header-cart:not(:hover) .widget_shopping_cart {
	display: none !important;
}

/* Hide default Storefront site-branding (fallback safety) */
.site-header .site-branding {
	display: none;
}

/* ==========================================================================
   4b. BREADCRUMB — sfondo grigio, attaccato alla nav bar
   ========================================================================== */

.storefront-breadcrumb {
	background-color: #eeeeee;
	margin-top: 0;
	margin-bottom: 4em;
	padding: 12px 0;
	border-bottom: 1px solid #e0e0e0;
}

.storefront-breadcrumb .col-full {
	padding-top: 0;
	padding-bottom: 0;
}

.storefront-breadcrumb .woocommerce-breadcrumb,
.storefront-breadcrumb .breadcrumb-trail {
	margin: 0;
	padding: 0;
	font-size: 14px;
	color: #999999;
}

.storefront-breadcrumb .woocommerce-breadcrumb a,
.storefront-breadcrumb .breadcrumb-trail a {
	color: #999999;
	text-decoration: underline;
}

.storefront-breadcrumb .woocommerce-breadcrumb a:hover,
.storefront-breadcrumb .breadcrumb-trail a:hover {
	color: #e30613;
}

/* ==========================================================================
   4c. FULL-WIDTH LAYOUT — no sidebar, no search
   ========================================================================== */

/* Content takes full width (no sidebar) */
.content-area,
.right-sidebar .content-area,
.left-sidebar .content-area,
.storefront-full-width-content .content-area {
	width: 100%;
	float: none;
	margin-left: 0;
	margin-right: 0;
}

/* Hide WooCommerce products header when shop title is disabled */
.mnk-hide-shop-header .woocommerce-products-header {
	display: none;
}

/* Hide any residual sidebar or search form */
.widget-area.shop-sidebar,
#secondary,
.storefront-product-search,
.widget_product_search,
.widget_search,
.search-form,
.woocommerce-product-search {
	display: none !important;
}

/* ==========================================================================
   4d. LINK COLOR — rosso ufficiale al posto del viola WooCommerce
   ========================================================================== */

a,
.woocommerce a,
.woocommerce-page a,
.storefront-breadcrumb a,
.entry-content a,
.page a,
.woocommerce-MyAccount-content a,
.woocommerce-order-details a,
.woocommerce-table a {
	color: #e30613;
}

a:hover,
.woocommerce a:hover,
.woocommerce-page a:hover {
	color: #c10510;
}

/* WooCommerce buttons & accents */
.woocommerce .woocommerce-message a.button,
.woocommerce .woocommerce-info a.button {
	color: #e30613;
}

.woocommerce-message,
.woocommerce-info {
	border-top-color: #e30613;
}

.woocommerce-message::before,
.woocommerce-info::before {
	color: #e30613;
}

/* ==========================================================================
   4d-bis. PAGE TITLES — uppercase centrato
   ========================================================================== */

.entry-title {
	text-transform: uppercase;
	text-align: center;
}

/* ==========================================================================
   4e. BUTTONS — blu #393973 base, rosso #e30613 hover
   ========================================================================== */

button:not(.mnk-faq__question),
input[type="submit"],
.button,
.wp-block-button__link,
.wp-element-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit,
.woocommerce .cart .button,
.woocommerce .checkout-button,
.storefront-breadcrumb a.button {
	background-color: #393973 !important;
	color: #ffffff !important;
	border-color: #393973 !important;
	border-radius: .3888888889rem !important;
}

button:not(.mnk-faq__question):hover,
input[type="submit"]:hover,
.button:hover,
.wp-block-button__link:hover,
.wp-element-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit:hover,
.woocommerce .cart .button:hover,
.woocommerce .checkout-button:hover {
	background-color: #e30613 !important;
	color: #ffffff !important;
	border-color: #e30613 !important;
}

/* Outline button variant */
.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent !important;
	color: #393973 !important;
	border: 2px solid #393973 !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: #e30613 !important;
	color: #ffffff !important;
	border-color: #e30613 !important;
}

/* ==========================================================================
   4e-bis. ONSALE BADGE — verde scuro, posizionato sopra immagine
   ========================================================================== */

/* Contenitore prodotto: position relative per il badge */
ul.products li.product,
.wc-block-grid__product,
.mnk-product-card {
	position: relative;
}

/* Wrapper immagine: position relative per contenere il badge */
ul.products li.product .attachment-woocommerce_thumbnail,
ul.products li.product > a,
.wc-block-grid__product .wc-block-grid__product-image,
.mnk-product-card__image-link {
	position: relative;
	display: block;
}

/* Badge "In offerta!" — verde scuro su immagine, angolo sinistro alto */
.onsale,
.wc-block-grid__product-onsale {
	position: absolute !important;
	top: 8px !important;
	left: 8px !important;
	right: auto !important;
	bottom: auto !important;
	z-index: 2;
	background-color: #1a7a2e !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 4px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	padding: 4px 10px !important;
	line-height: 1.4 !important;
	margin: 0 !important;
}

/* ==========================================================================
   4e-ter. "Visualizza carrello" — testo link verde, non bottone
   ========================================================================== */

ul.products li.product a.added_to_cart,
.mnk-product-card a.added_to_cart {
	background: none !important;
	border: none !important;
	color: #1a7a2e !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	text-decoration: underline !important;
	padding: 0 !important;
	margin-top: 6px !important;
	display: inline-block !important;
}

ul.products li.product a.added_to_cart:hover,
.mnk-product-card a.added_to_cart:hover {
	background: none !important;
	color: #145f23 !important;
}

/* ==========================================================================
   4e-quater. CART — quantity buttons + remove link
   ========================================================================== */

/* Quantity +/- buttons: grigio chiaro con testo nero */
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	background-color: #f0f0f0 !important;
	color: #000000 !important;
	border-color: #e0e0e0 !important;
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:hover {
	background-color: #e5e5e5 !important;
	color: #000000 !important;
}

/* "Rimuovi articolo" — text link, non bottone */
.wc-block-cart-item__remove-link {
	background: none !important;
	border: none !important;
	color: #e30613 !important;
	font-size: 14px !important;
	text-decoration: underline !important;
	padding: 0 !important;
	cursor: pointer;
}

.wc-block-cart-item__remove-link:hover {
	background: none !important;
	color: #c10510 !important;
}

/* ==========================================================================
   4f. PAGINATION — centrata, pagina attiva rossa
   ========================================================================== */

.woocommerce nav.woocommerce-pagination {
	text-align: center !important;
	display: flex !important;
	justify-content: center !important;
	width: 100% !important;
	float: none !important;
	clear: both !important;
	margin-bottom: 5em !important;
}

.woocommerce nav.woocommerce-pagination ul {
	display: inline-flex !important;
	justify-content: center !important;
	border: none !important;
}

.woocommerce nav.woocommerce-pagination ul li {
	border: none !important;
	overflow: visible !important;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	padding: 8px 14px !important;
	color: #333333 !important;
	background: #f5f5f5 !important;
	border: 1px solid #e0e0e0 !important;
	border-radius: .3888888889rem !important;
	margin: 0 3px !important;
}

.woocommerce nav.woocommerce-pagination ul li a:hover {
	background-color: #e30613 !important;
	color: #ffffff !important;
	border-color: #e30613 !important;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
	background-color: #e30613 !important;
	color: #ffffff !important;
	border-color: #e30613 !important;
}

/* ==========================================================================
   4g. SINGLE PRODUCT — prezzo e variazioni
   ========================================================================== */

.single-product div.product p.price,
.single-product div.product span.price {
	text-align: center !important;
	margin: 1.41575em 0 2.83em !important;
}

.single-product div.product p.price .woocommerce-Price-amount,
.single-product div.product span.price .woocommerce-Price-amount {
	font-size: 1.5em;
	font-weight: 700;
	color: #000000;
}

.single-product div.product p.price .woocommerce-Price-currencySymbol,
.single-product div.product span.price .woocommerce-Price-currencySymbol {
	font-size: .6667em;
	font-weight: 400;
}

/* --- Variazioni (label + select) --- */

.woocommerce div.product .variations label {
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
}

.woocommerce div.product .variations select {
	padding: 10px 14px;
	font-size: 15px;
	min-width: 260px;
	border: 2px solid #e0e0e0;
	border-radius: .3888888889rem;
	background-color: #ffffff;
	color: #333333;
	transition: border-color 0.2s ease;
}

.woocommerce div.product .variations select:focus {
	border-color: #0f834d;
	outline: none;
}

/* ==========================================================================
   4g-bis. RELATED PRODUCTS — titolo uppercase, griglia 4 colonne
   ========================================================================== */

.related.products > h2 {
	position: relative;
	padding-top: 24px;
}

.related.products > h2::before {
	content: '';
	display: block;
	width: 100%;
	height: 4px;
	margin-top: 50px;
	margin-bottom: 70px;
	background: linear-gradient(to right, #393973 50%, #e30613 50%);
	border-radius: 2px;
}

.related.products > h2 {
	text-transform: uppercase;
}

.related.products ul.products li.product {
	display: flex !important;
	flex-direction: column !important;
}

.related.products ul.products li.product a.woocommerce-LoopProduct-link {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.related.products ul.products li.product a.button,
.related.products ul.products li.product a.add_to_cart_button {
	margin-top: auto !important;
}

/* ==========================================================================
   4h. PRODUCT NOTES — avvisi configurabili da Theme Options
   ========================================================================== */

.mnk-product-note {
	padding: 12px 16px;
	margin-bottom: 12px;
	border-radius: 4px;
	font-size: 14px;
	line-height: 1.5;
}

.mnk-product-note a {
	font-weight: 700;
	text-decoration: underline;
}

/* ==========================================================================
   Topbar — animazione rotante messaggi (2 messaggi, 5s ciascuno, ciclo 10s)
   ========================================================================== */

@keyframes mnk-topbar-show-1 {
	0%, 44%  { opacity: 1; }
	50%, 94% { opacity: 0; }
	100%     { opacity: 1; }
}

@keyframes mnk-topbar-show-2 {
	0%, 44%  { opacity: 0; }
	50%, 94% { opacity: 1; }
	100%     { opacity: 0; }
}

/* ==========================================================================
   5. MOBILE (< 768px)
   ========================================================================== */

@media screen and (max-width: 768px) {

	/* Top bar: singolo messaggio rotante */
	.mnk-topbar__inner {
		justify-content: center;
		text-align: center;
	}

	.mnk-topbar__messages {
		position: relative;
		width: 100%;
		height: 1.5em;
		overflow: hidden;
		margin-right: 0;
	}

	.mnk-topbar__separator {
		display: none;
	}

	.mnk-topbar__msg {
		display: flex;
		position: absolute;
		inset: 0;
		justify-content: center;
		animation: mnk-topbar-show-1 10s linear infinite;
	}

	.mnk-topbar__msg:nth-child(3) {
		animation-name: mnk-topbar-show-2;
	}

	.mnk-topbar {
		font-size: 12px;
	}

	/* Logo area: 300x90 su mobile */
	.mnk-logo-area {
		padding: 4px 0;
		text-align: center;
	}

	.mnk-logo-area__logo .custom-logo-link img {
		width: 300px !important;
		max-width: 100% !important;
		max-height: 90px;
		width: auto;
		height: auto;
	}

	.mnk-logo-area__placeholder {
		width: 300px;
		height: 90px;
		font-size: 12px;
	}

	/* Handheld footer bar (bottom navigation) — rosso */
	.storefront-handheld-footer-bar {
		background-color: #e30613 !important;
	}

	.storefront-handheld-footer-bar ul li a,
	.storefront-handheld-footer-bar ul li a::before {
		color: #ffffff !important;
	}

	.storefront-handheld-footer-bar ul li a:hover {
		background-color: rgba(255, 255, 255, 0.15);
	}

	/* Override customizer white bg — tutti gli item devono essere trasparenti (eredita rosso dalla barra) */
	.storefront-handheld-footer-bar ul li > a {
		background-color: transparent !important;
	}

	/* Hover specifici: rosso per my-account, blu per cart */
	.storefront-handheld-footer-bar ul li.my-account > a:hover {
		background-color: #e30613 !important;
	}

	.storefront-handheld-footer-bar ul li.cart > a:hover {
		background-color: #2d3561 !important;
	}

	/* Hide cart and account icon from nav bar on mobile */
	.storefront-primary-navigation .site-header-cart,
	.mnk-header-account {
		display: none;
	}

	/* Hide top bar social icons on mobile — moved to nav bar */
	.mnk-topbar__social {
		display: none;
	}

	/* Nav bar col-full: position context for social icons overlay.
	   Block layout so nav can be full-width (dropdown will extend full screen).
	   Reset Storefront's mobile margins (margin-left/right: 1.41575em) that cause side gaps. */
	.storefront-primary-navigation .col-full {
		position: relative;
		display: block;
		padding: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		max-width: 100% !important;
		box-sizing: border-box;
		min-height: 54px;
	}

	/* Social icons: absolutely positioned over the left of the nav bar.
	   Out of normal flow so nav (and its dropdown) spans 100% width. */
	.mnk-nav-social {
		position: absolute;
		left: 0;
		top: 0;
		height: 54px;
		display: flex;
		align-items: center;
		padding: 0 16px;
		gap: 14px;
		z-index: 10;
	}

	.mnk-nav-social a {
		color: #ffffff;
		display: flex;
		align-items: center;
		opacity: 0.9;
	}

	.mnk-nav-social a:hover {
		opacity: 1;
	}

	/* Main nav: full-width block (Storefront floats hamburger right, handheld-navigation clears it) */
	.storefront-primary-navigation nav#site-navigation.main-navigation {
		display: block;
		width: 100%;
	}

	/* ---- Hamburger: Storefront already floats it right — we just style it ---- */
	.storefront-primary-navigation button.menu-toggle {
		float: right !important;
		background-color: transparent !important;
		color: #ffffff !important;
		border: none !important;
		box-shadow: none !important;
		max-width: none;
		height: 54px;
		padding: 0 42px 0 10px;
		font-family: 'Roboto', sans-serif;
		font-size: 13px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.5px;
		position: relative;
	}

	.storefront-primary-navigation button.menu-toggle:hover {
		background-color: rgba(255, 255, 255, 0.1) !important;
		background-image: none;
	}

	/* Hamburger lines: white, RIGHT of text */
	.storefront-primary-navigation button.menu-toggle::before,
	.storefront-primary-navigation button.menu-toggle::after,
	.storefront-primary-navigation button.menu-toggle span::before {
		background-color: #ffffff !important;
		left: auto;
		right: 1em;
	}

	/* ---- Dropdown: Storefront's clear:both on .handheld-navigation already places it below button.
	   Set gray background — full-width since nav is 100% wide. ---- */
	.main-navigation .handheld-navigation {
		background-color: #f0f0f0 !important;
	}

	.main-navigation .handheld-navigation ul {
		background-color: #f0f0f0 !important;
		margin: 0;
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
	}

	/* Dropdown items: Roboto 700, uppercase, 13px — same as desktop menu */
	.main-navigation .handheld-navigation ul li a {
		color: #000000 !important;
		background-color: transparent !important;
		padding: 13px 20px !important;
		font-family: 'Roboto', sans-serif;
		font-size: 13px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.3px;
		display: block;
	}

	/* li: flex row (link + chevron side by side), wraps so sub-menu takes its own full row */
	.main-navigation .handheld-navigation ul li {
		display: flex !important;
		flex-wrap: wrap;
		align-items: stretch;
		border-bottom: 1px solid #d0d0d0;
	}

	/* link: grows to fill the row beside the chevron */
	.main-navigation .handheld-navigation ul li > a {
		flex: 1 1 auto;
	}

	/* Hover / active */
	.main-navigation .handheld-navigation ul li a:hover,
	.main-navigation .handheld-navigation ul li.current-menu-item > a {
		color: #e30613 !important;
		background-color: #e8e8e8 !important;
	}

	/* Sub-menu: full-width row below the link+chevron pair (flex item with wrap) */
	.main-navigation .handheld-navigation ul .sub-menu {
		flex: 0 0 100%;
		width: 100%;
		background-color: #e8e8e8 !important;
		box-shadow: none;
	}

	.main-navigation .handheld-navigation ul .sub-menu li {
		border-bottom: 1px solid #d8d8d8;
	}

	.main-navigation .handheld-navigation ul .sub-menu li a {
		color: #333333 !important;
		padding: 12px 20px 12px 32px !important;
		font-size: 13px;
		font-weight: 400;
		text-transform: none;
		letter-spacing: 0;
	}

	.main-navigation .handheld-navigation ul .sub-menu li a:hover {
		color: #e30613 !important;
		background-color: #dadada !important;
	}

	/* ---- Dropdown toggle chevron: flex item (not absolute), resets global button styles ---- */
	.main-navigation .handheld-navigation ul li .dropdown-toggle {
		position: static !important;  /* override Storefront's position:absolute */
		flex: 0 0 auto;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		background-color: transparent !important;
		background-image: none !important;
		border-top: none !important;
		border-right: none !important;
		border-bottom: none !important;
		border-left: 1px solid #d0d0d0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		color: #666666 !important;
		padding: 0 16px !important;
		min-width: 48px;
		width: auto !important;
		line-height: 1 !important;
	}

	.main-navigation .handheld-navigation ul li .dropdown-toggle::after {
		border-top-color: #666666 !important;
	}
}

/* ==========================================================================
   6. TABLET (768px - 1024px)
   ========================================================================== */

@media screen and (min-width: 769px) and (max-width: 1024px) {

	.mnk-topbar {
		font-size: 13px;
	}

	.main-navigation ul.menu > li > a,
	.main-navigation ul.nav-menu > li > a {
		padding: 12px 12px;
		font-size: 12px;
	}

	.mnk-logo-area {
		padding: 5px 0;
	}
}

/* ==========================================================================
   6. FOOTER — custom 2-row layout
   ========================================================================== */

/* Override Storefront site-footer — border-top: none !important perché
   Storefront inietta border-top via customizer (wp_add_inline_style p.130). */
.site-footer {
	background-color: #f5f5f5;
	border-top: none !important;
	padding: 40px 0 0;
}

/* Row 1: 4 colonne (2fr 3fr 2fr 3fr) */
.mnk-footer__grid--main {
	display: grid;
	grid-template-columns: 2fr 3fr 2fr 3fr;
	gap: 32px;
	padding-bottom: 32px;
}

/* Row 2: 3 colonne (5fr 4fr 3fr) */
.mnk-footer__grid--secondary {
	display: grid;
	grid-template-columns: 5fr 4fr 3fr;
	gap: 32px;
	padding-bottom: 40px;
}

/* Section titles */
.mnk-footer__section-title {
	font-family: 'Roboto', sans-serif;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #333333;
	margin: 0 0 16px;
	padding: 0;
	line-height: 1.3;
}

/* Divisore riga 1 / riga 2 */
.mnk-footer__divider {
	border: none;
	border-top: 1px solid #e0e0e0;
	margin: 0 0 32px;
}

/* Logo colonna */
.mnk-footer__col--logo .custom-logo {
	max-height: 80px;
	width: auto;
}

.mnk-footer__logo-placeholder {
	display: inline-block;
	color: #999999;
	font-size: 12px;
	text-decoration: none;
}

/* Orari servizio clienti */
.mnk-footer__hours {
	margin: 0 0 6px;
	font-size: 13px;
	line-height: 1.5;
	display: flex;
	gap: 8px;
}

.mnk-footer__day {
	font-weight: 700;
	color: #333333;
}

.mnk-footer__time {
	color: #555555;
}

/* Contatti (tel/email) */
.mnk-footer__contact {
	margin: 4px 0;
	font-size: 13px;
}

.mnk-footer__contact a {
	color: #333333;
	text-decoration: none;
	transition: color 0.2s ease;
}

.mnk-footer__contact a:hover {
	color: #e30613;
}

/* Social icons nel footer — override colore topbar */
.mnk-footer__social-icons {
	display: flex;
	gap: 12px;
	align-items: center;
}

.mnk-footer__social-icons .mnk-topbar__social-link {
	color: #e30613;
	width: 32px;
	height: 32px;
}

.mnk-footer__social-icons .mnk-topbar__social-link svg {
	width: 24px;
	height: 24px;
}

.mnk-footer__social-icons .mnk-topbar__social-link:hover {
	color: #c10510;
}

/* Menu footer (Serve aiuto? / Informazioni) */
.mnk-footer__menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mnk-footer__menu li {
	margin-bottom: 8px;
}

.mnk-footer__menu li a {
	color: #333333;
	font-size: 13px;
	text-decoration: none;
	transition: color 0.2s ease;
}

.mnk-footer__menu li a:hover {
	color: #e30613;
}

/* Immagini spedizioni / pagamenti */
.mnk-footer__img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* Copyright bar — sfondo trasparente, testo scuro */
.mnk-footer__copyright {
	padding: 14px 0;
}

.mnk-footer__copyright-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.mnk-footer__copyright-text,
.mnk-footer__copyright-agency {
	font-size: 12px;
	color: #555555;
	line-height: 1.4;
}

.mnk-footer__copyright-agency a {
	color: #555555;
	text-decoration: underline;
}

.mnk-footer__copyright-agency a:hover {
	color: #e30613;
}

.mnk-footer__heart {
	color: #e30613;
	display: inline-block;
	vertical-align: middle;
	margin: 0 2px;
	position: relative;
	top: -1px;
}

/* --- Footer mobile (≤ 768px) --- */
@media screen and (max-width: 768px) {

	.site-footer {
		padding: 24px 0 0;
	}

	.mnk-footer__grid--main,
	.mnk-footer__grid--secondary {
		grid-template-columns: 1fr;
		gap: 0;
		padding-bottom: 0;
	}

	/* Colonna logo nascosta su mobile */
	.mnk-footer__col--logo {
		display: none;
	}

	.mnk-footer__col {
		border-bottom: 1px solid #e0e0e0;
	}

	/* Titolo sezione: clickable accordion trigger */
	.mnk-footer__section-title {
		cursor: pointer;
		padding: 14px 36px 14px 0;
		margin: 0;
		position: relative;
	}

	/* Icona +/− dopo il titolo */
	.mnk-footer__section-title::after {
		content: '+';
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		font-size: 20px;
		font-weight: 400;
		line-height: 1;
		color: #666666;
	}

	.mnk-footer__section-title--open::after {
		content: '\2212'; /* − */
	}

	/* Contenuto espanso: padding bottom */
	.mnk-footer__section-content {
		padding-bottom: 14px;
	}

	/* Nascondi divisore su mobile */
	.mnk-footer__divider {
		display: none;
	}

	/* Copyright bar: centrata in colonna */
	.mnk-footer__copyright-inner {
		flex-direction: column;
		text-align: center;
		gap: 6px;
	}
}

/* --- Footer tablet (769px – 1024px) --- */
@media screen and (min-width: 769px) and (max-width: 1024px) {

	.mnk-footer__grid--main {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px;
	}

	.mnk-footer__grid--secondary {
		grid-template-columns: repeat(3, 1fr);
		gap: 24px;
	}
}

/* =============================================
   WPC Product Bundles — Grid layout fix
   ============================================= */

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product .woosb-title {
	overflow: hidden;
}

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product .variations_form {
	width: 100%;
	overflow: hidden;
}

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product .variations_form .variations {
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
}

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product .variations_form .variations .variation {
	display: block !important;
	width: auto !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	margin: 5px 0 0 0 !important;
	padding: 0 !important;
	border: none !important;
	text-align: center !important;
}

.woosb-products .woosb-product .variations_form .variations .variation .label {
	margin-top: 25px;
}

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product .variations_form .variations .variation .label label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	display: block;
	text-align: center;
	margin-bottom: 4px;
}

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product .variations_form .variations .variation .select,
.woosb-products[class*="woosb-products-layout-grid"] .woosb-product .variations_form .variations .variation .value {
	text-align: center !important;
}

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product .variations_form .variations .variation .select select,
.woosb-products[class*="woosb-products-layout-grid"] .woosb-product .variations_form .variations .variation .value select {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	font-size: 12px;
	box-sizing: border-box !important;
	padding: 6px 8px !important;
	border: 1px solid #e0e0e0 !important;
	border-radius: 3px !important;
	background-color: #fff !important;
	background-image: none !important;
	-webkit-appearance: menulist !important;
	-moz-appearance: menulist !important;
	appearance: menulist !important;
}

/* Card: bordo grigio di default, verde quando variazione selezionata */
.woosb-products[class*="woosb-products-layout-grid"] .woosb-product {
	border-color: #e0e0e0 !important;
	transition: border-color 0.2s ease;
}

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product:hover {
	border-color: #e0e0e0 !important;
}

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product.woosb-product--selected {
	border-color: #0f834d !important;
}

.woosb-products[class*="woosb-products-layout-grid"] .woosb-product.woosb-product--selected:hover {
	border-color: #0f834d !important;
}

/* =============================================
   Bottoni checkout: verde (#0f834d)
   ============================================= */

/* Carrello (blocco WC) — "Procedi con l'ordine" */
.wc-block-cart__submit-button,
.wc-block-cart__submit-container .wc-block-components-button,
.wc-block-components-checkout-place-order-button,
.woocommerce-cart .wc-block-components-button:not(.is-link) {
	background-color: #0f834d !important;
	color: #fff !important;
}

.wc-block-cart__submit-button:hover,
.wc-block-cart__submit-button:focus,
.wc-block-cart__submit-container .wc-block-components-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.woocommerce-cart .wc-block-components-button:not(.is-link):hover,
.woocommerce-cart .wc-block-components-button:not(.is-link):focus,
.woocommerce-cart .wc-block-components-button:not(.is-link):active {
	background-color: #0a6b3e !important;
	color: #fff !important;
}

/* Carrello classico (shortcode) — "Procedi con l'ordine" */
.woocommerce .cart-collaterals .wc-proceed-to-checkout a.checkout-button {
	background-color: #0f834d !important;
	border-color: #0f834d !important;
	color: #fff !important;
}

.woocommerce .cart-collaterals .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce .cart-collaterals .wc-proceed-to-checkout a.checkout-button:focus {
	background-color: #0a6b3e !important;
	border-color: #0a6b3e !important;
	color: #fff !important;
}

/* Minicart widget — "Pagamento" */
.widget a.button.checkout {
	background-color: #0f834d !important;
	color: #fff !important;
}

.widget a.button.checkout:hover,
.widget a.button.checkout:focus {
	background-color: #0a6b3e !important;
	color: #fff !important;
}