/**Styling zobrazeni skladovych zasob u produktu */ 
@media all and (max-width: 900px){
    .woo-cart-add-extra-product-containter{
        width: 100%!important;
        /*border-style: none!important;*/

    }
    .kosik{
        display: none!important;
    }

    #addon-price{
        min-width: 45px;
        padding: 0px 2px 0px 0px;
    }

    #woo-cart-add-extra-product-containter > div > div.prod-img.blok > div > img{
        padding: 2px!important;
        width:55px!important;
    }

    .blok{
        padding: 2px!important;
    }

    .mnozstvi{
        margin-right: 15px;
        margin-left: 15px;
    }

    .addon-cena{
        font-size: 1rem!important;
    }
}

.woo-cart-add-extra-product-containter[data-show="no"]{
    display: none;
}

.woo-cart-add-extra-product-containter{
	margin-top: 20px;
    padding: 10px 10px; 
	border-radius: 10px;
    border-width: 1px; 
    border-style: solid; 
    border-color: var(--sections-border-color,#d5d8dc);/*#ebebeb; */
    margin-bottom: 2em;
    
    /*width: 48%;*/
   /* float: right;*/

}

.woo-cart-add-extra-product-containter h2{
    font-size: 1.2rem!important;
    padding: 0.7em 1em;
    margin: 0 -20px 20px;    
   /* background-color: #fbfbfb;   */ 
   /* border-bottom: 1px solid #ebebeb;*/
}

.extend-cart{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}
.blok{
   padding: 10px;
}

.mnozstvi{
    height: 33px;
    width: 120px;
    min-width:100px ;
    background: #FFF;
    border: 1px solid #ebebeb;
    /*border-radius: 25px;*/
    display: flex;
    align-items: center;
    justify-content: center;
    /*box-shadow: 0 5px 10px rgba(0,0,0,0.2);*/

}

.mnozstvi span{
    width: 120px;
    text-align: center;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
}

.mnozstvi span.num{
    font-size: 1rem;
    border-right: 2px solid rgba(0, 0, 0, 0.2);
    border-left: 2px solid rgba(0, 0, 0, 0.2);
    pointer-events: none;
}

.napoveda{
    font-size: 1rem;
    text-decoration-style: dotted;
    text-decoration-line: underline;
    text-decoration-color: #dd9933;
    cursor: pointer;
}

.addon-cena{
    font-size: 1.2rem;
    color: #7fb069;
}


.sleva {
    color: red!important;
    font-size: 0.7rem;
    position: relative;
  }
  .sleva:before {
    position: absolute;
    content: "";
    left: 0;
    top: 50%;
    right: 0;
    border-top: 1px solid;
    border-color: black;
    
    -webkit-transform:rotate(-5deg);
    -moz-transform:rotate(-5deg);
    -ms-transform:rotate(-5deg);
    -o-transform:rotate(-5deg);
    transform:rotate(-5deg);
  }

/* Popup container - can be anything you want */
.popup {
    position: relative;
    display: inline-block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }

  /* Popup table */
  .spare-parts-table{
    font-size: 0.8rem;
  }

  .spare-parts-table{
    background-color: #555;
  }

  .spare-parts-table th, td{
    padding: 2px 15px 2px 15px;
    
  }
  
  /* The actual popup */
  .popup .popuptext {
    visibility: hidden;
    width: 300px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 0;
    position: absolute;
    z-index: 1;
    bottom: 1%;
    /*left: 50%;*/
    margin-left: -80px;
  }

  .popup .popuptext2 {
    visibility: hidden;
    width: 100px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 0;
    position: absolute;
    z-index: 1;
    bottom: 1%;
    /*left: 50%;*/
    margin-left: -80px;
  }
  
 
  /* Toggle this class - hide and show the popup */
  .popup .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s;

  }
  
  /* Add animation (fade in the popup) */
  @-webkit-keyframes fadeIn {
    from {opacity: 0;} 
    to {opacity: 1;}
  }
  
  @keyframes fadeIn {
    from {opacity: 0;}
    to {opacity:1 ;}
  }

 .popup .signup-response{
  visibility: visible;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: #FF0000;
    margin-top: 20px;
    
     animation:signup-response 0.5s 1;
    -webkit-animation:signup-response 0.5s 1;
    animation-fill-mode: forwards;
    
    animation-delay:2s;
    -webkit-animation-delay:1s; /* Safari and Chrome */
    -webkit-animation-fill-mode: forwards;
    
} 

@keyframes signup-response{
    from {opacity :1;}
    to {opacity :0;}
}

@-webkit-keyframes signup-response{
    from {opacity :1;}
    to {opacity :0;}
}


  

.single{
    
  margin:2px;
  padding: 0px 4px 0px 4px;
  border-radius:4px;
  
    
}


  /** zobrazeni product description u composite product */
  .popis{
    /*border-top: 1px dashed grey;*/
    padding: 5px 0px;
  }

  .popis h4{
    font-weight: 600;
    padding-bottom: 3px ;
  }

/**
zobrazeni vlastnosti u composite product
*/
.vlastnosti{
    border-top: 1px dashed grey;
    padding: 5px;
    border-radius: 0px;
    
}

.vlastnosti h4{
  font-weight: 600;
}

.vlastnosti-inner{
  display: flex;
  justify-content: flex-start;
  padding: 5px 0px;
  flex-wrap: wrap;
}

.rozmery, .vaha, .poznamka{
  padding: 5px 5px 0px 5px;
  border-radius: 5px;
  margin-right: 5px;
  margin-bottom: 5px;
  background-color: #f5f5f5; 
}

.vlastnosti-title{
  font-size: 0.8rem;
  line-height: 0.8;
  font-weight: 700;
}

/** 
Uprava bloku se zaskrtavacim "pridat do kosiku"
*/
.bundled_product_optional_checkbox{
      margin-top: 5px!important;    
      padding: 5px 10px!important;
      border-radius: 5px;
      box-shadow: rgb(0 0 0 / 16%) 0px 1px 4px;
      width: 100%;
      cursor: pointer;
      /*text-align: center;*/
}

.bundled_product_optional_checkbox:active{

  box-shadow: rgb(0 0 0 / 16%) 0px 1px 1px;
}
/*
.bundled_product_optional_checkbox:hover{
  box-shadow: rgb(0 0 0 / 26%) 0px 1px 5px;
}
*/

/** Uprava bloku u bundled product, aby se zobrazoval v jednom sloupci*/

.bundled_product_summary{
  flex-direction: column;
}

/**
div, ktery v sobe zobrazi kompatibilni boxy
*/
  .boxy-dropdown{
    cursor: pointer;
    border-top: 1px dashed grey;
    margin-bottom: 5px;
    padding-top: 5px;
   /* margin-top:5px;*/
  }

  .boxy{
    color:white;
    display: flex;     
    font-size: 0.7rem;
    flex-wrap: wrap;
    border-radius: 0px;
    padding: 0px 5px 5px 5px;
    margin-bottom: 5px;
    display:none;
    /*cursor:help;*/
}


.boxy h4{
  font-weight: 600;
  padding-bottom: 3px;
}

.boxy-nejsou{
  color:black; 
  font-size:0.8rem; 
  font-style:italic; 
  cursor:default;
}

.boxy[data-visible="no"]{
  display: none;
}

.bundled_item_optional[data-viditelne="ano"]{
  display: flex!important;
}

.bundled_item_optional[data-viditelne="ne"]{
  display: none!important;
}

/**
Filtrovaci kontejner na strance bundle
*/
.filtrovani-kontejner{
  text-align: center;
  border-radius: 10px;
  padding: 10px;
}

.filtrovaci-kontejner-kompatibilni-boxy{
  display: none;
}


.filtrovaci-kontejner-inner{
  display: flex;
  flex-flow: wrap;
  justify-content: center;
  
}

.filtrovani-polozka{
  padding: 5px 10px 0px 10px;
  color: #555;

}


/**Upravy css composite produktu */

.bundled_product_excerpt.product_excerpt > p{
    color: black;
    display: none;
  }

  .summary-add-to-cart-form-composite {
    background-color: #eeefef;
    border: 2px solid grey;
    border-radius: 5px;
    margin-bottom: 20px;
    padding: 20px!important;
  }

  .bundled_product_images.images > figure > a > img{
    border-radius: 10px;
  }

  #product-39986 > div.woocommerce-tabs.wc-tabs-wrapper{
    display: none;
  }

  .composite_form{

    padding-right: 4px!important;
  }


.summary_element_content{
  border-radius: 5px;
}
.composite_wrap{
  text-align: center;
  background: white;
  padding: 20px;
  border-radius: 5px;
  margin-left: 20px;
  margin-right: 20px;

}

.composite_wrap > div.composite_button {

  display: flex;
  justify-content: center;
  align-items: center;

}

.composite_wrap > div.composite_button > button{
  padding: 20px 40px!important;
  background-color: #7fb069!important;
  color:white!important;
  
}

.composite_wrap > div.composite_button > div{
  margin-bottom: 0px!important;
  margin-right: 10px!important;
  
}

.composite_wrap > div.composite_button > button:hover{
  background-color: #729E5F!important;
  color:white!important;
  
}

/*
a.page_button.next{
  background: white;
    padding: 5px 15px;
    border-radius: 5px;
}
*/


/**Animace buttonu */
.mybutton--loading::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  top: 25%;
  left: 3px;
  
  bottom: 0;
  
  border: 4px solid transparent;
  border-top-color: #ffffff;
  border-radius: 50%;
  animation: mybutton-loading-spinner 1s ease infinite;
}

@keyframes mybutton-loading-spinner {
  from {
    transform: rotate(0turn);
  }

  to {
    transform: rotate(1turn);
  }
}

/*UPrava single page*/