/* ========================================
   CSS COMPLETO - TEMA PERSONALIZZATO
   Sostituisce arancione con grigio scuro
   Header diversi per Desktop e Mobile
   ======================================== */

#js-product-list-top{
  background-color: #f8fd37 !important;
  color:red;
}
#js-product-list-top .total-products{
  color:red  !important;
}

#js-product-list-top .total-products p {
  color:red  !important;
}
.product-accessories .product-miniature .thumbnail-container .product-thumbnail img {

    height: 281px;
}
.product-accessories .add {
  margin-top:23px !important;
    text-align: center;
}

.category-cover{
  display:none;
}
@media (max-width: 767px) {

  .footer-company,
  .footer-payment {
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin-bottom: 20px !important;
  }

}
/* ========== SOSTITUISCI ARANCIONE CON GRIGIO SCURO OVUNQUE ========== */
.footer-company .footer-title {
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1.1rem;
  margin-bottom: 12px;
}

.company-data {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.7rem;
  line-height: 1.1;
}

.company-data li {
  color: #cccccc;
}

/* Mobile spacing */
@media (max-width: 767px) {
  .company-data {
    padding: 15px 0;
  }
}

/* Titolo bianco */
.footer-payments .footer-title {
  color: #ffffff;
  font-size: 1.1rem;
  margin-bottom: 12px;
}

/* Container icone */
.payment-icons-container {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* Icone */
.payment-icons-container img {
  height: 28px;
  width: auto;
}

/* SOLO MOBILE */
@media (max-width: 767px) {
  .payment-icons-container {
    padding: 15px 0;
  }
}

#custom-text {
  text-align:left;
  }
#index .block-categories {
  margin-top:10px;
  }
.brand-section{
  display:none !important;
}
.image-slider-block{
  text-align:center;
}
/* Links e hover states - GRIGIO SCURO */
a:hover,
a:focus,
a:active {
    color: #333333 !important;
}

/* Buttons - GRIGIO SCURO */
.btn-primary,
.btn-primary.focus,
.btn-primary:focus,
.btn-primary:hover {
    background: linear-gradient(135deg, #3d3d3d 0%, #2a2a2a 100%) !important;
    border-color: #333333 !important;
    box-shadow: 
        0 4px 6px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #4a4a4a 0%, #333333 100%) !important;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    transform: translateY(-2px);
}

/* Section title underline - GRIGIO SCURO */
.section-title:after {
    background: linear-gradient(90deg, transparent 0%, #333333 50%, transparent 100%);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Product title hover - GRIGIO SCURO */
#products .product-title a:hover,
.featured-products .product-title a:hover,
.product-accessories .product-title a:hover,
.product-miniature .product-title a:hover {
    color: #333333 !important;
}

#products .products-grid .products .product-item.list-view .product-description .product-title>a:hover {
    color: #333333 !important;
}

/* Product price - GRIGIO SCURO */
#products .product-price-and-shipping,
.featured-products .product-price-and-shipping,
.product-accessories .product-price-and-shipping,
.product-miniature .product-price-and-shipping {
    color: #333333 !important;
    font-weight: 600;
}

/* Product flags NEW - GRIGIO SCURO */
.product-flags li.product-flag.new,
.products-grid .products .product-item .product-flags>li.new,
#products .products-grid .products .product-item .product-flags>li.new {
    background: linear-gradient(135deg, #3d3d3d 0%, #2a2a2a 100%) !important;
    box-shadow: 
        0 2px 4px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

/* All products button - GRIGIO SCURO */
.featured-products .all-products > a,
.all-products > a {
    background: linear-gradient(135deg, #3d3d3d 0%, #2a2a2a 100%) !important;
    border: 1px solid #333333 !important;
}

.featured-products .all-products > a:hover,
.all-products > a:hover {
    background: linear-gradient(135deg, #4a4a4a 0%, #333333 100%) !important;
    transform: translateY(-2px);
}

/* Add to cart buttons - GRIGIO SCURO */
.products-grid .products .product-item .product-miniature .product-description .product-add-cart .add-to-cart,
.btn-primary.add-to-cart {
    background: linear-gradient(135deg, #3d3d3d 0%, #2a2a2a 100%) !important;
    border-color: #333333 !important;
}

.products-grid .products .product-item .product-miniature .product-description .product-add-cart .add-to-cart:hover,
.btn-primary.add-to-cart:hover {
    background: linear-gradient(135deg, #4a4a4a 0%, #333333 100%) !important;
}

/* Slider buttons - GRIGIO SCURO */
.image-slider-block .carousel .carousel-item .caption .caption-description .action.primary {
    background: linear-gradient(135deg, #3d3d3d 0%, #2a2a2a 100%) !important;
    border: 1px solid #333333 !important;
}

.image-slider-block .carousel .carousel-item .caption .caption-description .action.primary:hover {
    background: linear-gradient(135deg, #4a4a4a 0%, #333333 100%) !important;
    transform: translateY(-2px);
}

/* Clear filters - GRIGIO SCURO */
.clear-all-wrapper .btn-tertiary:hover {
    background: #333333 !important;
}

/* Products sort - GRIGIO SCURO */
.products-sort-order .select-list:hover {
    background: #333333 !important;
}

/* ========== MENU NAVIGATION - GRIGIO MEDIO ========== */

.top-navigation-menu {
    float: left;
    width: 100%;
    padding: 0;
    background-color: #676767 !important;
    background: #676767 !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
}

.top-navigation-menu::before {
    display: none;
}

/* ========== BREADCRUMB ========== */

.breadcrumb {
    background: linear-gradient(135deg, #2a2a2a 0%, #1c1c1c 100%);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    padding: 15px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    position: relative;
}

.breadcrumb::after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, #333333 50%, transparent 100%);
}

.breadcrumb ol {
    background: transparent;
    margin: 0;
    padding: 0;
}

.breadcrumb a {
    color: red !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}

.breadcrumb a:hover {
    color: red !important;
    text-shadow: 0 0 8px rgba(255, 255, 255, 0.4);
}

.breadcrumb li {
    color: red !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

/* ========== SUBMENU POPOVER - GRIGIO SCURO ========== */

.popover.sub-menu,
.js-sub-menu,
.popover.sub-menu.collapse,
.popover.sub-menu.collapse.in,
.popover.sub-menu.js-sub-menu,
.popover.sub-menu.js-sub-menu.collapse,
.popover.sub-menu.js-sub-menu.collapse.in,
.collapse.in.sub-menu,
.collapse.in.js-sub-menu {
       box-shadow: 
        0 8px 20px rgba(0, 0, 0, 0.4),
        0 0 0 1px rgba(255, 255, 255, 0.05);
    border: none !important;
}

.popover.sub-menu a,
.popover.sub-menu li,
.js-sub-menu a,
.js-sub-menu li {
    color: #ffffff !important;
}

.popover.sub-menu a:hover,
.js-sub-menu a:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.1) !important;
}

/* ========== DESKTOP (≥768px) ========== */

@media (min-width: 768px) {
    /* Header top - Gradiente BIANCO a GRIGIO SCURO */
    #header .header-top,
    body #header .header-top,
    html body #header .header-top {
        background: linear-gradient(124deg, #e7e7e7  40%, #e7e7e7  71%) !important;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
    }
    
    /* Testo dinamico in base alla posizione */
    #header .header-top .container > div:first-child * {
        color: #333333 !important;
    }
    
    #header .header-top .container > div:last-child * {
        color: #ffffff !important;
    }

    /* Header nav - Gradiente grigio a nero */
    #header .header-nav {
        background: linear-gradient(180deg, #5f5e5e 0%, #3f3f3f 50%, #000000 100%) !important;
        box-shadow: 
            0 3px 6px rgba(0, 0, 0, 0.4),
            inset 0 1px 0 rgba(255, 255, 255, 0.08);
        position: relative;
    }
    
    #header .header-nav::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 2px;
        background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.15) 50%, transparent 100%);
    }
    
    #header .header-nav,
    #header .header-nav * {
        color: #ffffff !important;
    }
    

@media (min-width: 768px) {
    .top-navigation-menu {
        background-color: #676767 !important;
        background: linear-gradient(135deg, #1c4eb5 0%, #1c4eb5 100%) !important;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
    }
}
    /* Menu items */
    #header .main-menu .top-menu > li > a {
        position: relative;
        transition: all 0.3s ease;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
        color: #ffffff !important;
    }
    
    #header .main-menu .top-menu > li:hover > a,
    #header .main-menu .top-menu > li > a:hover {
        color: #ffffff !important;
        background: rgba(0, 0, 0, 0.2) !important;
        text-shadow: 0 0 10px rgba(255, 255, 255, 0.6);
    }
    
    #header .main-menu .top-menu > li.current > a,
    #header .main-menu .top-menu > li > a.active {
        color: #ffffff !important;
        background: rgba(0, 0, 0, 0.3) !important;
        text-shadow: 0 0 12px rgba(255, 255, 255, 0.8);
    }
    
    /* Underline animato - GRIGIO SCURO */
    #header .main-menu .top-menu > li > a::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: linear-gradient(90deg, #333333 0%, #555555 50%, #333333 100%);
        transform: scaleX(0);
        transition: transform 0.3s ease;
        box-shadow: 0 0 8px rgba(51, 51, 51, 0.5);
    }
    
    #header .main-menu .top-menu > li:hover > a::before,
    #header .main-menu .top-menu > li.current > a::before {
        transform: scaleX(1);
    }
    
    /* Submenu desktop */
    #header .main-menu .sub-menu {
        background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
        box-shadow: 
            0 8px 20px rgba(0, 0, 0, 0.3),
            0 0 0 1px rgba(0, 0, 0, 0.1);
        border: none;
    }
    
    #header .main-menu .sub-menu a {
        color: #333333 !important;
        transition: all 0.3s ease;
    }
    
    #header .main-menu .sub-menu a:hover {
        color: #000000 !important;
        background: rgba(51, 51, 51, 0.08) !important;
    }
    
    /* User info e links */
    #header .header-nav .user-info > a {
        color: #ffffff !important;
    }
    
    #header .header-nav .user-info > a:hover {
        color: #ffffff !important;
        text-shadow: 0 0 12px rgba(255, 255, 255, 0.6);
        background: rgba(255, 255, 255, 0.1);
        padding: 5px 10px;
        border-radius: 3px;
    }
    
    #header .header-nav .right-nav #contact-link > a {
        color: #ffffff !important;
    }
    
    #header .header-nav .right-nav #contact-link > a:hover {
        color: #ffffff !important;
        text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
    }
    
    /* Language e Currency selectors */
    #header .language-selector span,
    #header .currency-selector span {
        color: #ffffff !important;
    }
    
    #header .language-selector i,
    #header .currency-selector i {
        color: #ffffff !important;
    }
    
    #header .language-selector:hover,
    #header .currency-selector:hover {
        background: linear-gradient(180deg, rgba(255,255,255,0.1) 0%, transparent 100%);
    }
    
    #header .language-selector .dropdown-menu,
    #header .currency-selector .dropdown-menu {
        background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
        box-shadow: 
            0 8px 20px rgba(0, 0, 0, 0.4),
            0 0 0 1px rgba(0, 0, 0, 0.1);
    }
    
    #header .language-selector .dropdown-item,
    #header .currency-selector .dropdown-item {
        color: #333333 !important;
    }
    
    #header .language-selector .dropdown-item:hover,
    #header .currency-selector .dropdown-item:hover {
        background: rgba(51, 51, 51, 0.08) !important;
        color: #000000 !important;
    }
}

/* ========== MOBILE (≤767px) ========== */

@media (max-width: 767px) {
    /* Header top - Gradiente BLU/VIOLA */
    body #header .header-top, 
    html body #header .header-top {
        background: linear-gradient(135deg, #1c4eb5 0%, #1c4eb5 100%) !important;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
    }
   
    /* Header nav - GRIGIO CHIARO */
    #header .header-nav {
        background-color: #ebebeb !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }
    
    #header .header-nav * {
        color: #333333 !important;
    }
    
    /* Menu navigation */
    .top-navigation-menu {
        background-color: #676767 !important;
    }
    
    /* Search input - Testo NERO */
    .header-top .search-widget form input[type="text"],
    #header .header-top .search-widget form input[type="text"] {
        color: #000000 !important;
    }
    
    .header-top .search-widget form input[type="text"]::placeholder,
    .header-top .search-widget form input[type="text"]:-ms-input-placeholder,
    .header-top .search-widget form input[type="text"]::-ms-input-placeholder {
        color: #000000 !important;
        opacity: 0.7;
    }
    
    /* Cart e search icons */
    #header .header-nav .material-icons {
        color: #333333 !important;
    }
    
    /* Breadcrumb mobile */
    .breadcrumb {
        padding: 10px 0;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }
}
@media (max-width: 767px) {
    #mobile_top_menu_wrapper .top-menu a[data-depth="0"] {
        color: WHITE;
        padding: 12px 0;
    }
}
    #mobile_top_menu_wrapper .popover.sub-menu, #mobile_top_menu_wrapper .js-sub-menu, #mobile_top_menu_wrapper .collapse.in {
    background: trasparent !important;
}
    #mobile_top_menu_wrapper .top-menu a[data-depth="0"]:hover {
        color: #ffffff !important;
        background: linear-gradient(135deg, #1c4eb5 0%, #1c4eb5 100%) !important;
    }
    
    #mobile_top_menu_wrapper .top-menu .sub-menu {
        background: #f8f8f8;
    }
    
    #mobile_top_menu_wrapper .top-menu .sub-menu ul[data-depth="1"]>li a {
        color: #666666 !important;
    }
    
    #mobile_top_menu_wrapper .top-menu .sub-menu ul[data-depth="1"]>li a:hover {
        color: #1c4eb5 !important;
        background: rgba(28, 78, 181, 0.1) !important;
    }
  
    #mobile_top_menu_wrapper .popover.sub-menu a,
    #mobile_top_menu_wrapper .js-sub-menu a {
        color: #ffffff !important;
    }
    
    #mobile_top_menu_wrapper .popover.sub-menu a:hover,
    #mobile_top_menu_wrapper .js-sub-menu a:hover {
        background: rgba(255, 255, 255, 0.15) !important;
    }
}

/* ========== CART BADGE ========== */

#header #_desktop_cart .header .cart-products-count {
    background: linear-gradient(135deg, #555555 0%, #333333 100%) !important;
    box-shadow: 
        0 2px 4px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: #ffffff !important;
}

/* ========== SEARCH BAR ========== */

.search-widget form input[type="text"] {
    background: linear-gradient(135deg, #ffffff 0%, #f0f0f0 100%);
    box-shadow: 
        inset 0 2px 4px rgba(0, 0, 0, 0.1),
        0 1px 2px rgba(255, 255, 255, 0.5);
    border: 1px solid #d0d0d0;
    color: #333333 !important;
    transition: all 0.3s ease;
}

.search-widget form input[type="text"]:focus {
    background: #ffffff;
    box-shadow: 
        0 0 0 3px rgba(51, 51, 51, 0.1),
        inset 0 2px 4px rgba(0, 0, 0, 0.05);
    border-color: #333333;
}
   #wrapper .breadcrumb {     background: #f8ff00;
    padding: 10px;
}
.product-price, .tax-shipping-delivery-label{
  text-align:center;
}

#products .products-grid .products .product-item {
    margin-bottom: 0;
    border: 1px solid #e7e7e7;
}

.footer-bottom{
  display:none !important;
}
#product h1 {
  
    text-align: center;
    margin-top: 14px;
    font-size: 190%;

  
}

 .block-categories {
    border: 1px solid #b3b3b3;
    padding: 13px;
    background-color: #fbfbfb;
}

#footer .footer-container {
    background: linear-gradient(135deg, #1c4eb5 0%, #1c4eb5 100%) !important;
 
}
 .product-container .product-description{
    border: 1px solid #b1b1b1;
    padding: 18px;
    border-radius: 10px;
    background-color: #f7f7f7;
    box-shadow: 1px black;
}
.js-top-menu-bottom{
    background: #ffffff;
    padding: 13px;
    border-radius: 24px;
}
#product-availability .alert {
    margin-top:10px;
}


/* ========== RESPONSIVE ========== */

@media (max-width: 991px) {
    #header .header-top,
    #header .header-nav,
    .top-navigation-menu {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    }
}

/* ========== FINE CSS ========== */