/**
* 2007-2021 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
*  @author    PrestaShop SA <contact@prestashop.com>
*  @copyright 2007-2021 PrestaShop SA
*  @license   http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*
* Don't forget to prefix your containers with your own identifier
* to avoid any conflicts with others containers.
*/

@media only screen and (max-width: 600px) {
	.kbaparent {}
}
.kbaparent {
	height: auto;
	background-color: #4d5f72;
	background-image: linear-gradient( to right, #4d5f72, #757d85fa);
}
.kbaparent {
	padding-left: 2rem;
	padding-right: 2rem;
	padding-top: 20px;
	margin-bottom: 6px;
}
.kbaparent>ul {
	list-style-type: none;
	/* grid styles */
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	grid-gap: 1rem;
	align-items: center;
}
.kbaparent>ul>li {
	border: 1px solid transparent;
	border-radius: .3rem;
}
.kba-select {
	width: 95%;
	height: 42px;
}
.kba-input {
	height: 42px;
	max-width: 150px;
}
.kbaparent>ul>li input {
	width: 80%;
	height: 40px;
}
#sel2 {
	max-width: 140px;
}
.kbaparent>ul>li>figure {
	/*max-height: 80px;
  /*overflow: hidden;*/
	border-top-left-radius: .3rem;
	border-top-right-radius: .3rem;
	position: relative;
}
.kbaparent>ul>li>figure>img {
	width: 100%;
}
.kbaparent>ul>li>figure>figcaption {
	/*position: absolute;*/
	bottom: 0;
	background-color: rgba(74, 4, 42, .7);
	width: 100%;
}
.kbaparent>ul>li>figure>figcaption>h3 {
	color: white;
	padding: .75rem;
	font-size: 1.25rem;
}
.kba-btn-garage-slct, .kba-btn-garage-delete {
	border: none;
	border-radius: 4px;
	color: #fff;
	background-repeat: no-repeat;
	background-position: right 24px center;
}
.kba-btn-garage-delete {
	background-color: #DB3412;
	padding: 2px 7px 2px 7px;
}
.kba-btn-garage-slct {
	background-color: #5DBB4F;
	padding: 2px 8px 2px 8px;
}
.kba-btn, .kba-btn-garage {
	border: none;
	background-color: #DB3412;
	padding: 12px 44px 12px 22px;
	border-radius: 4px;
	color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7.41' height='12' viewBox='0 0 7.41 12'%3E%3Cpath d='M10,6,8.59,7.41,13.17,12,8.59,16.59,10,18l6-6Z' transform='translate(-8.59 -6)' fill='%23fff'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 24px center;
}
.kba-btn:hover, .kba-btn-garage:hover, .kba-btn-garage-slct:hover, .kba-btn-garage-delete:hover, .kba-btn-garage-clear:hover {
	color: revert !important;
	cursor: pointer;
}
.kba-btn:focus, .kba-btn-garage {
	outline: 1px #0000006e solid;
	border-radius: 4px;
}
.kba_selected_text {
	color: white;
}
/*grage*/
.kba-garage-list {
	display: none;
	position: absolute;
	background-color: #f1f1f1;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 9;
	min-height: 100px;
	padding: 4px 4px 4px 4px;
	left: -40px;
}
.kba-grid {
	display: grid;
	grid-template-rows: 2rem auto 15px;
	grid-template-columns: 13rem auto;
	row-gap: 3px;
	column-gap: 4px;
	height: 100%;
	max-height: 70px;
	background-color: #c1c0c03b;
	padding-left: 4px;
	padding-right: 4px;
}
#item-0 {
	grid-row-start: 1;
	grid-column-start: 2;
	grid-row-end: 2;
	grid-column-end: 3;
	display: flex;
	align-items: center;
}
#item-1 {
	grid-row-start: 2;
	grid-column-start: 2;
	grid-row-end: 3;
	grid-column-end: 3;
	display: flex;
	align-items: center;
}
#item-2 {
	grid-row-start: 1;
	grid-column-start: 1;
	grid-row-end: 3;
	grid-column-end: 2;
	font-size: 14px;
	display: flex;
	align-items: center;
}


.kba-load {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 60px;
  height: 60px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
	position: absolute;
	z-index: 9;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}