:root {
  --itemImageSize: 100px;
}
@media (min-width: 600px) {
	:root {
		--itemImageSize: 150px;
	}
}
@media (min-width: 960px) {
	:root {
		--itemImageSize: 200px;
	}
}

/* fix cart.css */
.btn:not([href]):not([type]):not(:disabled):not(.disabled) {cursor: pointer;}


i {font-size:0.75rem;}
span.free {color:#0ba245; font-weight:bold; text-transform: uppercase;}
.deliveryInfo {font-size:0.8rem;}

.max-width-100 {max-width: 210px;}

.hlava { background-color: #fff; box-shadow: 0 3px 8px rgb(0 0 0 / 5%); }
.pomoc { text-align: right; font-weight: bold; line-height: .8em; margin-top: 3px; margin-bottom: 0; }
.pomoc i { font-size: 1.2em; margin-right: 5px; }
.pomoc a { color: #0062bd; text-decoration: underline; font-weight: normal; }

main { background-color: #f3f5f6; padding: 20px 0; position: relative; }

.velike { font-size: 1.7em; }
.tucne { font-weight:bold;}
.pozadi { background-color: #fff; border-radius: 15px; box-shadow: 0 3px 8px rgb(0 0 0 / 7%); }
.max { flex: 0 0 40%; max-width: 40%;  padding-top: 14px;}
.pravysloupec { position: sticky; top: 20px; }

small {font-size: 0.9em;}
span.green {color: #0ba245; font-weight:bold; font-size: 1em;}
.summary small {color:#333e48; font-weight: normal;}
.checkout-table .table.summary td.info {border-style:none; text-align:left; padding-top:0;}

.linka { border-bottom: 2px solid #f7b200 !important; }
.tlac { color: #fff; background-color: #f7b200; border-color: #f7b200; }
.tlac:hover { background-color: #fbca49; border-color: #fbca49; color: #000; }

.navi2 { font-size: 1.5em; text-align: center; }
.navi2>* { margin-right: 35px; color: #a4abb1;}
.navi2 span { color: #FFF; background-color: #d8dbdc; border-radius: 50px; width: 40px; height: 40px; display: inline-block; line-height: 1.9em; text-align: center; margin-right: 5px; }
.navi2 a.aktiv { color: #000; font-weight: bold; display: inline-block !important;}
.navi2 a.aktiv span { font-weight: normal; background-color: #f7b200; box-shadow: 0 2px 4px 0 rgb(0 0 0 / 5%); } 

.tlc { font-size: .975em; background-color: initial; }
.zpet:before { content: "\02FF"; padding-right: 10px; font-size: 2em; vertical-align: bottom; }
.vyhody {margin-left: -6px; margin-top: 17px; line-height: 1.8em; }
.vyhody li { list-style-type: none; }
.vyhody li:before { content: '\e802'; color: #5cb85c; font-family: "fontello"; font-weight: bold; margin-left: -25px; position: absolute; }

#footer { background-color: #fff; }

.blok { max-width: 1460px; margin: 0 auto; }
.blok.zmena { padding: 60px 30px; font-size: 1.4em;}

.leva { margin-right: 30px; float: left; }
.prava { margin-left: 30px; float: right; }

.box { border: 1px solid #E7EAF3; border-radius: 10px; }
.box li { min-width: 265px; color: #333E48; font-size: .775em; font-weight: bold; line-height: 1.4em; text-align: center; display: inline-table; border-right: 1px solid #E7EAF3; padding: 20px 0; padding-left: 40px; position: relative; }
.box > li:last-child { border: none; }
.box span { color: #77838F; font-weight: normal; }

em { color: #f7b200; font-size: 3.3em !important; position: absolute; left: 13px; top: 15px; }
em.zmena { font-size: 4em !important; }

.pata { color: #333e48; font-size: .745em; letter-spacing: .3px; line-height: 1.4em; margin-top: 35px; }
.pata .leva { margin-top: 2px; }
.pata a { color: #333e48; text-decoration: none; }
.pata a:hover { text-decoration: underline; }
.paticka li { font-size: .945em; display: inline-block; margin-left: 12px; }
.paticka a { color: #7c7c7c; text-decoration: none; }
.paticka a:hover { color: #333; text-decoration: none; }

.uprava {max-width:1160px;}

.loader {
	display: inline-block;
	margin: 10px;
  border: 4px solid #f3f3f3; /* Light grey */
  border-top: 4px solid #3498db; /* Blue */
  border-bottom: 4px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 32px;
  height: 32px;
  animation: spin 1s linear infinite;
}
button .loader {
	vertical-align: sub;
	margin:0 1em 0 0;
	border: 3px solid #f3f3f3;
	border-top-color: #333e48;
	border-bottom-color: #333e48;
	width: 24px;
	height: 24px;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


/* novy kosik */
.items {
	background-color: #fff;
	border-radius: 15px;
	box-shadow: 0 3px 8px rgb(0 0 0 / 7%);
	padding: 1rem;
}
.itemCont {
	display: grid;
	grid-template-columns: var(--itemImageSize) 1fr;
	gap: 1rem;
	margin-bottom: 2rem;
}
.itemImage {width: 100%; text-align: center; max-height: var(--itemImageSize);}
.itemImage img {max-width: 100%; max-height: 100%;}
.itemContent {
	display: grid;
	align-content: center;
	gap: 1rem;
}
.itemAmount {display:flex; gap: 1rem; align-items: center;}
.itemAmount input {max-width: 2rem; text-align: center;}
.itemAmount .icon-trash-empty {font-size:20px;}
.itemTotal {
	justify-self: end; 
	display: flex; 
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
	align-content: center;
	gap: 1rem;
	margin-top: 1rem;
}
.cena {font-size:1.5rem;}

@media (min-width: 600px) {
	.itemContent {grid-template-columns: 1fr 1fr;}
}
@media (min-width: 960px) {
	.itemContent {grid-template-columns: 4fr 6fr;}
	.itemContRight {display: grid; grid-template-columns: 1fr 1fr;}
}

.summaryCont table.summary {border-collapse: separate; border-spacing: 1rem 0.5rem; margin: 0;}
.summaryCont table.summary td {padding: 0;}
@media (min-width: 768px) {
	.summaryCont {min-width:23rem; margin: -0.5rem 1rem;}
}

.cart-table .table tbody tr td { vertical-align: middle;}
.colDelete { text-align: left !important; }
.colDelete a { color: black; font-size: 19px; background-color: #eef2f6; padding: 1px 9px; border-radius: 25px; }
.colDelete a:hover { color: #fff; background-color: #ff1100; transition: all 0.2s ease-in-out; }
.cart-table .table thead th { color: #000; }
.navi2 { margin-bottom: 49px; }
.width-122 { margin: 0 auto; }
.tlac { padding: 15px 34px !important; letter-spacing: .4px; word-spacing: 1px; line-height: 1.2em; }
.w-xl-80 { width: 90% !important; }
.cart-table .table td.colAmount { width: 180px; }
.font-size-20 { font-size: 1.4em; }
.font-size-25 { font-size: 1.6em; }
.alert-primary { margin-top: 30px; margin-bottom: 10px; }
.checkout-table .table td:last-child { text-align: right; padding-right: 0 !important; }

.thumb {box-shadow: 1px 1px 4px rgb(0 0 0 / 60%); background-color: white; padding: 0 !important;}
.thumb.type6 {box-shadow: 2px 2px 3px rgb(0 0 0 / 60%);}

div.freeShip {border-top: 1px solid #dddddd; margin-bottom:10px;}
div.freeShip p {font-weight:bold; color: #0ba245; margin:20px 0 5px 0; font-size: 1rem;}
div.freeShip i {font-size: 1.2rem; margin-right: 0.3em;}
div.freeShip progress[value] {
	appearance: none; width: 70%; height: 14px; 
	border-radius: 7px; background-color: white; border:2px solid #0ba245;
}
div.freeShip progress[value]::-webkit-progress-bar {border-radius: 7px; background-color: white;}
div.freeShip progress[value]::-moz-progress-bar {border-radius: 7px; background-color: #0ba245; transition: width 0.5s ease-out;}
div.freeShip progress[value]::-webkit-progress-value {border-radius: 7px; background-color: #0ba245; transition: width 0.5s ease-out;}

div.couponInputCont {display: flex; align-items: center; margin: 0 0 1rem 1rem;}

/* oprava BS formů */
.invalid-feedback {font-size: 100%;}
.u-has-error .form-label + .form-control, .u-has-error .input-group, .u-has-error .form-control:first-child:last-child {
	box-shadow: none;
}

.skrtnuta {text-decoration-line: line-through; color: gray;}
.sleva {color:white; background-color: #0ba245; padding: 0 0.25em;}

.table td.va-middle {vertical-align: middle;}

/*.deliveryTable td:nth-child(3) { width: 70px !important; }
.deliveryTable td:nth-child(4) { width: 92px; }*/
.deliveryTable tr.trhover * {cursor: pointer;}
.deliveryTable .subTypesArrow {font-size:1.4em; line-height:1em;}
.deliveryTable .subTypesArrow::before {width:auto; margin-left:.1em; margin-right:0em;}
.subTypesCollapse {position: relative; transition: height 250ms; margin:15px -180px -15px -15px;}
.subTypes img {max-height: 36px; max-width: 70px;}
.subTypes td:nth-child(3) {vertical-align: middle;}

.tdradio {width:2rem;}
.shield {color: #0ba245 !important;}
.shield:before {content: "\f132"; font-family: "fontello"; padding-right: 0.5rem; font-size: 1rem; vertical-align: middle; }
.pointer {cursor:pointer;}

/* responzivne -------------------------------------------------------------- */

@media (max-width: 1199px) {
.logo { width: 9.375rem !important; }
.posun { display: flex; overflow-x: auto; overflow-y: hidden; }
}

@media (max-width: 991px) {
.max { flex: 0 0 100%; max-width: 100%; padding: 0; padding-top: 20px; }
.cart-table .table td.colAmount { width: 145px; }
.w-xl-80 { width: 80% !important; }
.cart-table .table td { font-size: 1.1em; line-height: 1.4em; }
.colDelete { width: 50px !important; }
.checkout-table .table th, .checkout-table .table td { padding-left: 30px; }
.checkout-table .table td:last-child { text-align: right; padding-right: 30px !important; }
.max-width-100 { max-width: 120px; }
}

@media (max-width: 767px) {
.blok.zmena { font-size: 1.4em; padding: 45px 30px; padding-bottom: 25px; }
.pata { height: 100%; }
.pata .leva, .pata .prava { float: none; text-align: center; margin: 0; }
.pata .prava { margin-top: -25px; margin-left: -52px; }
.cart-table .table tr td { display: table-cell; }
.cart-table .table tr td.colPrice { display: none !important; }
.width-122 { margin: initial; }
.w-xl-80 { width: 100px !important; }
.cart-table .table tr { padding-top: 5px; }
.btn-primary-dark-w { margin-bottom: 10px !important; }
.max { margin-bottom: -16px !important; }
.checkout-table .table th, .checkout-table .table td { padding-left: 18px; }
.checkout-table .table td:last-child { text-align: right; padding-right: 20px !important; }
.alert-primary i { margin-left: -10px; margin-right: 10px !important; }
.subTypesCollapse {margin-right:-110px;}
.max-width-100 { max-width: 190px; }
}

@media (max-width: 540px) {
.logo img { width: 175px; padding-top: 5px; }
.hlava .leva { margin-right: 0; }
.max-width-100 { max-width: 150px; }
}

@media (max-width: 475px) {
.pozadi { padding: 30px 20px; }
.pozadi.col-lg-7 { margin: 0 15px; }
.cart-table .table tr td { display: flex; }
.tlac { font-size: 1.15em; letter-spacing: initial; word-spacing: initial; padding: 15px 15px !important; }
.blok.zmena { padding: 45px 15px; }
.px-4.max { padding: 1em !important; }
.max { margin-bottom: -14px !important; }
.deliveryTable td { padding-right: 5px; }
.deliveryTable .ReactCollapse--content { margin-right: -80px; }
.subTypesCollapse {margin-right:-97px;}
.max-width-100 { max-width: 210px; }
}

@media (max-width: 350px) {
.slogo { width: 8rem !important; }
.spomoc i { display: none; }
#header .row { display: block; }
#header img { width: 166px !important; text-align: center; margin: 0 auto; display: block; margin-top: -10px; margin-bottom: 18px; }
#header .text-right { width: initial; text-align: center !important; }
#header .icon-user-o { display: none; }
.pomoc { text-align: center; line-height: 1em; margin-right: -14px; }
.u-header__navbar-brand-center { display: initial; }
.navbar { display: initial; }
.navi2 { margin-top: -15px; margin-bottom: 35px; }
.px-4 { padding: .8rem !important; padding-bottom: 25px !important; }
.deliveryTable td { padding-left: 10px; }
.deliveryTable .ReactCollapse--content { margin-right: -75px; }
.alert-primary i { display: none; }
.max-width-100 { max-width: 100%; }
}

/* Balikovna a PPL ParcelShop - vyber pobocky ------------------------------------------------ */

div.balCont {z-index: 999999; position: fixed; -webkit-backface-visibility: hidden; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3);}
div.balWrapper {
	position: fixed; top: 15px; left: 15px; right: 15px; bottom: 15px; max-width:750px;
	margin: 0 auto; z-index: 999; padding: 15px; 
	box-shadow: 0 2px 10px rgba(0,0,0,.2); font-family: "Open Sans", sans-serif; background: rgb(255, 255, 255); color: rgb(85, 85, 85);
}
div.balHeader {
	overflow: auto; display: flex; justify-content: space-between; align-items: center; 
	padding-bottom: 15px; margin-bottom: 10px; border-bottom: 1px solid #f3f3f3;
}

div.balHeader>div {width: 33.33%;}
div.balContent div.balList {position: absolute; bottom: 15px; top: 140px; overflow-y: auto; left: 15px; right: 15px; padding-right:15px; font-size:13px;}
div.balContent div.balList > div {border-top:1px solid #ced4da; padding:0.75em 0; cursor:pointer;}
div.balContent div.balList > div.active {background-color:#ddd;}
div.balContent div.balList > div:first-child {border-top-style:none;}
div.balContent div.balList > div span {background-color:#fff680;}

div.balContent div.balDetail { position:absolute; bottom:15px; top:70px; left:15px; right:15px; padding-top:15px; background-color:white; z-index:10;}
div.balContent div.balDetail h1, div.balContent div.balDetail h2 {font-size:15px; font-weight:bold; margin-top:15px;}
div.balContent div.balDetail p {margin:0; font-size:13px;}
div.balContent div.balDetail td {font-size:13px; padding:0 0 3px 0;}

div.balCont.Balikovna div.balWrapper {max-width:none;}
div.balCont.Balikovna div.balContent {position:fixed; top:100px; bottom:30px; left:30px; right:30px;}
div.balCont.Balikovna div.balContent iframe {width:100%; height:100%; border-style:none;}

@media (max-width: 375px) {
	div.balCont.Balikovna div.balWrapper {max-width:none; top:0px; bottom:0px; left:0px; right:0px;}
	div.balCont.Balikovna div.balContent {position:fixed; top:70px; bottom:0px; left:0px; right:0px;}
}
