/*########################################## 
* General css swiper products for Virtuemart 
* Design by WebDesign - sites-design.com 
* Copyright 2025 WebDesign 
* Licensed for WebDesign 
* Developer : http://www.sites-design.com 
###########################################*/    

    .swiper {width: 100%; height: 100%;}
    .swiper-slide {text-align: center; display: flex; justify-content: center; align-items: center;}
    .swiper-slide img {display: block; width: 100%; height: 100%; object-fit: cover;} 
	.modal .product-relacionados {display: none;} 
/* ----  \\\\\\\\ ----- */

.moduletable.horizontal {display: inline-block; width: 100%; margin: 0 0 30px; padding: 0; border: 0;}   
.moduletable.horizontal.related {margin: 20px 0;} 
.moduletable.horizontal .vmheader {margin: 0;}      
.moduletable.horizontal .vmgroup.horizontal, .moduletable.horizontal .vmproduct.horizontal {display: inline-grid; margin: 0 auto; width: 100%; max-width: 1520px;}   
.moduletable.horizontal h2 {background: #f5f5f5; font-weight: 200; font-family: "Open Sans", sans-serif; max-width: 1380px; color: #777; margin: 0 auto 10px; padding: 4px 0; text-align: center; text-transform: uppercase;}  
.moduletable.horizontal .swiper-wrapper {border-bottom: 0; padding: 0;}   
.product-relacionados .swiper.mySwiper.swiper-initialized.swiper-horizontal {border-bottom: 0;} 
  /* ----  -- ----- */
  
.horizontal .swiper-slide {margin-bottom: 10px;} 
.horizontal .swiper-slide div.spacer {background: #fff; width: 100%; margin: 5px auto; padding: 5px 2% 4px; border: 1px solid #E9E9E9;}    
.horizontal .span3.product-field.product-field-type-M, .vmgroup .product-field-desc, .login-lpvp {display: none;}      
.horizontal .vm-customfields-wrap {margin: 0 0 2px; position: relative;}       
.horizontal .addtocart-area .product-fields {background: rgba(255, 255, 255, 0.85); position: relative; width: 98%; margin: -12px 1% 0;}     
.horizontal .product-fields .product-field {float: none; margin: 0; padding: 2px 0; text-align: center; width: 100%;}      

.horizontal div.spacer {background: #fff; width: 98%; height: 130px; margin: 0 auto; padding: 5px 1%; border: 1px solid #eee;}      
.horizontal div.spacer table:hover {cursor: grab;} 

  .horizontal .PricesalesPrice.vm-display.vm-price-value {font-size: 18px; color: #97CE03; font-weight: 700; margin-top: 0; position: relative; z-index: 1;} 
  .horizontal div.titulo {text-overflow: ellipsis; word-wrap: break-word; overflow: hidden; height: auto;} 
  .horizontal .titulo a {color: #777; letter-spacing: -0.25px;} 
  .horizontal .titulo a:hover {color: #4B7670; text-decoration: none;} 
  .horizontal div.imagem {display: inline-block; width: 98%; padding: 0 1% 0 0;} 
  .horizontal .imagem img {height: auto; max-width: 98% !important; max-height: 120px !important; margin: auto; width: auto;}       
  .horizontal .imagem .img-orig {background: #fff; width: 98%; height: 120px; text-align: center; margin: 0 auto;}     
  .horizontal .imagem .img-adic {background: #fff; position: absolute; left: 0; z-index: 1; width: 30%; height: 120px; margin: 0; filter: alpha(opacity=0); opacity: 0;} 
  .horizontal .imagem .img-adic:hover {filter: alpha(opacity=100);  opacity: 1;} 
  .horizontal .imagem .img-adic:hover img {max-height: 120px !important;} 
  .horizontal .imagem .img-adic img:hover {margin: auto;}  
  .horizontal .desc p {margin: 0;} 
  
.horizontal .product-price .vm-price-desc {color: #999;}
.horizontal .product-price span.PricesalesPrice {color: #777;}        
.horizontal .PricesalesPrice.vm-display.vm-price-value span.PricesalesPrice, .horizontal span.PricepriceWithoutTax, 
.horizontal span.PricepriceWithoutTax, .vmgroup.horizontal span.PricediscountedPriceWithoutTax {color: #333 !important; font-size: 16px !important; line-height: 1; font-weight: 700; margin: 2px auto;}  
.horizontal .PricediscountAmount.vm-display.vm-price-value .vm-price-desc {margin: 0 0 0 -50px;}    
.horizontal span.vm-price-desc {display: inline-block; font-size: 12px; font-weight: 400; color: #777; margin-right: 4px;}   

.horizontal .PricebasePriceWithTax.vm-display.vm-price-value {display: none; margin: 0;}    
.horizontal a.modal.notify.modal_link.cboxElement {color: #777; font-size: 12px;}   
.horizontal .product-fields .product-field {border: 0; padding: 0; border-radius: 0;}   
.horizontal .product-fields-title-wrapper strong {font-size: 12px; font-weight: 400;}  
.horizontal .product-fields-title-wrapper {display: inline;}   
.horizontal .inline-control-group {display: inline-flex !important;}    
.horizontal .PricesalesPrice.vm-display.vm-price-value {display: block; text-align: left; margin: 0; padding: 0;}
.horizontal .price-crossed div.PricebasePriceWithTax .PricebasePriceWithTax {display: none; font-size: 17px;}   
.horizontal .swiper-slide a.ask-a-question.bold {border-radius: 0; font-weight: 400; line-height: 15px;} 
.horizontal .custom_promo {font-size: 9px; font-family: Arial;} 
.horizontal .price-crossed {position: relative; margin: 0; line-height: 1;}
.horizontal .percentagem {margin: 0; position: absolute; top: 5px; left: 5px; right: auto; z-index: 3; background: rgba(187,154,43,0.7); font-size: 12px; padding: 5px 3px; min-width: 35px; border-radius: 50%; border: 2px dotted #fff;}
.horizontal .PricediscountAmount.vm-display.vm-price-value {margin: 0;}   
.horizontal .notificar {margin-top: 2px; border: 1px solid #ddd; padding: 0 5px; text-align: center; line-height: 1;}   

.link {border: 1px solid #ddd; padding: 0 5px; text-align: center;} 
.link a {background-image: url('ico-ver_1.png'); background-repeat: no-repeat; background-position: left center; background-size: auto 12px; color: #333; line-height: 18px; padding: 0 0 0 20px;} 
.link a:hover {background-image: url('ico-ver_hover.png'); color: #4B7670; text-decoration: none;} 
/* ---************ --- */

.swiper-button-next, .swiper-button-prev {opacity: 0;} 
.swiper:hover .swiper-button-next, .swiper:hover .swiper-button-prev {opacity: 1;} 
.horizontal .swiper-button-next::after, .horizontal .swiper-button-prev::after {font-size: 36px; color: #BB9A2B;} 
.swiper-button-next:hover, .swiper-button-prev:hover, 
.swiper-button-next:hover::after, .swiper-button-prev:hover::after {color: #4B7670 !important;} 

@media (min-width: 1201px) and (max-width: 1980px) {
	.horizontal h2 {font-size: 28px;}  
}  
	
@media (min-width: 981px) and (max-width: 1200px) {
	.horizontal h2 {font-size: 24px;}  
} 

@media (min-width: 769px) and (max-width: 980px) {
	.horizontal h2 {font-size: 22px; letter-spacing: 0;}  
}    
	
@media (max-width: 768px) {
	.horizontal h2 {font-size: 20px;}  
	.horizontal .swiper-button-next::after, .horizontal .swiper-button-prev::after {font-size: 26px;} 
}      

@media (max-width: 480px) {
   .moduletable.horizontal.related {margin: 10px 0;} 
   .moduletable.horizontal {margin: 0;} 
   .horizontal .swiper-slide div.spacer {padding: 5px 1% 0;} 
   .horizontal .imagem .img-orig, .horizontal .imagem .img-adic {height: 120px;} 
   .horizontal .imagem img {max-height: 120px !important;} 
   .horizontal .desc {font-size: 12px !important; line-height: 13px !important;}
   .horizontal div.titulo {font-size: 14px !important; line-height: 17px !important; max-height: 35px; display: block;}
   .horizontal .PricesalesPrice.vm-display.vm-price-value span.PricesalesPrice, .horizontal span.PricepriceWithoutTax, 
   .horizontal span.PricepriceWithoutTax, .vmgroup.horizontal span.PricediscountedPriceWithoutTax {font-size: 15px !important; letter-spacing: -0.5px;} 
   .link a {font-size: 14px;} 
   .horizontal .swiper-button-next::after, .horizontal .swiper-button-prev::after {font-size: 24px; letter-spacing: 0;} 
}