/*
 *  Created by: Cyro
 *
 *  Important: somethings are needed to do like it is here, as we are styling a plugin, we can't change the html since it can get updated.
*/

#contentMainWrapper {
	padding-bottom: 39px;
	z-index: 4;
}

#shoppingCartDefault > div.forward:first-child {
	display: none;
}

/*
 * 	Clean not needed styles
*/
#orderTotal + br,
form + br {
	display: none;
}

/*
 *	.mobile-only = just show things for devices smaller than 843px
 *	.desktop-only = just show things for devices smaller than 843px
*/
.mobile-only {
	display: none;
}

.desktop-only {
	display: block;
}

/* messages */
#messageStackErrors {
	margin-bottom: 15px;
	font-size: 14px;
	line-height: 1.4;
}

.save_for_later_warning {
	color: #a94442;
	background-color: #f2dede;
	border-color: #ebccd1;
	padding: 10px;
}
/*
 * buttons (all)
 * 
 * [1] - doesn't get the same class as the others because it is generated by php, 
 * so we need to add this code here
*/
.btn a,
.btn a:hover,
.qty-btns a, /* 1 */
.qty-btns a:hover,
#cartContentsDisplay .cartProductDisplay a, #cartContentsDisplayLater .cartProductDisplay a,
#cartContentsDisplay .cartQuantity a, #cartContentsDisplayLater .cartQuantity a,
#cartContentsDisplay .cartProductDisplay a:hover, #cartContentsDisplayLater .cartProductDisplay a:hover,
#cartContentsDisplay .cartQuantity a:hover, #cartContentsDisplayLater .cartQuantity a:hover {
	text-decoration: none;
}

.btn--link,
.btn--link a,
.qty-btns a,
#cartContentsDisplay .cartProductDisplay a, #cartContentsDisplayLater .cartProductDisplay a,
#cartContentsDisplay .cartQuantity a, #cartContentsDisplayLater .cartQuantity a,
#coupon_code .button_update:hover  /* 1 */ {
	color: #17607d;
}

.btn--link:hover,
.btn--link a:hover,
.qty-btns a:hover,
#cartContentsDisplay .cartProductDisplay a:hover, #cartContentsDisplayLater .cartProductDisplay a:hover,
#cartContentsDisplay .cartQuantity a:hover, #cartContentsDisplayLater .cartQuantity a:hover {
	color: #17607d;
	opacity: 0.8;
}

.cssButton.icon_update {
	color: #17607d!important;
}

.cssButton.icon_update:hover,
.cssButtonHover.icon_update,
.cssButton.icon_update:focus {
	background-color: #fff!important;
	color: #17607d;
	opacity: 0.8;
}

/*
 * buttons Continue Shopping and Checkout
*/
.btn-container {
	overflow: hidden;
}

.btn-container--bottom {
	margin-bottom: 0;
	margin-top: 30px
}

.btn-container--top {
	margin-bottom: 30px;
}

	.btn-container .btn a {
		height: 31px;
		line-height: 31px;
		padding-left: 0;
	}

	.btn-container .btn a:before {
		display: none;
	}

	/*
	 * [1] = line heigh = 37 (btn height) - 4 (border top and bottom). Necessary because of border-box
	 * 
	 * .button_update might have a different height
	*/
	#coupon_code .button_update,
	.btn-container .btn--primary a {
	    line-height: 20px;
		padding: 5px 8px 5px 8px;
		text-align:left;
		float: right;
		background: #ff6500;
		/*line-height: 33px; /* 1 */
		border:none;
		color: #fff;
		font-size: 14px;
		/*padding: 0 18px;*/
		text-transform: none;
		height: 100%;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	#coupon_code .button_update:hover,
	.btn-container .btn--primary a:hover {
		background: #F6963E;
		color: #fff;
	}

	#coupon_code .button_update,
	.cssButton.button_shipping_estimator {
		background: #808080;
		font-size: 14px;
		padding-right: 14px;
		padding-left: 14px;
	}

	.cssButton.button_shipping_estimator

	#coupon_code .button_update:hover,
	.cssButton.button_shipping_estimator:hover,
	.cssButtonHover.button_shipping_estimatorHover:hover {
		background: #808080;
		opacity: 0.8;
		padding-right: 14px;
		padding-left: 14px;
	}


	.btn-container .btn--link {
		float: left;
	}

	.btn-container .btn--link + .btn--link {
		margin:0 0 0 21px;
		position: relative;
		top: 1px; /* */
	}
		
		.left-arrow,
		.right-arrow {
			position: relative;
			top: 2px;
		}

/*
 * Shopping cart table
 *
 * [1] = overrides color and width that comes from ajax_shopping_cart_overrides
*/
#cartContentsDisplay, #cartContentsDisplayLater,
#cartContentsDisplay tr, #cartContentsDisplayLater tr,
#cartSubTotal,
#otcoupon,
#orderTotal,
#orderTotal .table__subtotal td {
	border: 0; /* 1 */
}

#orderTotal .table__subtotal td {
	border-style: solid;
}

#cartContentsDisplay, #cartContentsDisplayLater {
	border-top-width: 2px;
	
}

#cartContentsDisplay, #cartContentsDisplayLater, 
#cartContentsDisplay .cartProductDisplay a, #cartContentsDisplayLater .cartProductDisplay a,
#cartContentsDisplay .cartQuantity a, #cartContentsDisplayLater .cartQuantity a  {
	font-size: 15px;
}

.cartQuantity .icon_remove, #cartContentsDisplay .cartQuantity a, #cartContentsDisplayLater .cartQuantity a{
	font-size: 12px !important;
}

.save_for_later {
	font-size: 12px;
	text-decoration: none;
}

.save_for_later_title{
	margin-top: 10%;
}

/* #cartContentsDisplayLater .tableHeading th{
	background: #999999;
} */

table#cartContentsDisplayLater {
    width: 70%;
    border: #e6e6e6 1px solid;
}
	#cartContentsDisplay tr td, #cartContentsDisplayLater tr td,
	#cartContentsDisplay tr th, #cartContentsDisplayLater tr th {
		padding-left: 15px;
		padding-right: 15px;
	}

	/*
	 *	Heading
	*/
	#cartContentsDisplay .tableHeading th {
		font-size: 16px;
		font-family: 'ProximaNova-Bold', Arial, Helvetica, sans-serif;
		background-color: #fff;
		color: #333333;
		text-transform: none;
		border-top: 4px solid #2c6796;
		border-bottom: 1px solid #2c6796;
	}

		#cartContentsDisplay tr #scTotalHeading, #cartContentsDisplayLater tr #scTotalHeading {
			padding-left: 0;
			padding-right: 0;
		}
 
 	/*
 	 * #cartContentsDisplay tr td.cartTotalDisplay is here because 
 	 * we need to overrides its properties that come from ajax_shopping_cart.css
 	*/
	#cartContentsDisplay tr td,
	#cartContentsDisplay tr td.cartTotalDisplay  {
		padding-bottom: 30px !important;
		padding-top: 30px !important;
	}

	#cartContentsDisplayLater tr td, #cartContentsDisplayLater tr td.cartTotalDisplay{
		padding-bottom: 15px !important;
		padding-top: 15px !important;
	}

	table tbody td {
		border-top: 0;
		border-bottom: 1px solid #e6e6e6;
	}
	
	/* 
	 *  Image column
	*/
	#cartContentsDisplay tr td.productImage, #cartContentsDisplayLater tr td.productImage {
		width: 1%;
	}

	#cartContentsDisplay .productImage {
		padding-left: 0;
	}

		span.cartImage {
			margin-right: 0;	
		}

		#cartContentsDisplay .productImage a img, #cartContentsDisplayLater .productImage a img {
			display: block;
			height: 75px !important;
			width: auto !important;
			max-width: 75px;
			max-height: 75px;
			margin: 0 auto;
			overflow: hidden;
		}

	/* 
	 *  Item column
	*/
	.cartProductDisplay {
		line-height: 1em;
	}

	.cartProductDisplay .btn--link {
		display: block;
		margin-top: 30px;
	}

	.cartAttribsList {
		margin: 5px 0 0 15px !important;
	}
		
		.cartAttribsList ul {
			list-style: disc;	
		}
		
			.cartAttribsList li + li {
				margin-top: 12px;
			}

	#cartContentsDisplay .cartProdTitle, #cartContentsDisplayLater .cartProdTitle {
		font-size: 15px;
		line-height: 1.3;
	}

	/* 
	 *  Quantity column
	*/
	.cartQuantity input[type="submit"], .cartQuantity button {
		margin-bottom: 0;
	}

	#cartContentsDisplay .cartQuantity input[type="text"], #cartContentsDisplayLater .cartQuantity input[type="text"] {
		border-color: #b3b3b3;
		height: 30px;
		width: 58px !important;
		margin-bottom: 12px;
		font-size: 15px;
	}

	.cartQuantity .markProductOutOfStock {
		display: inline-block;
		padding: 0 0 7px;
	}

	.msg-backorder,
	.qty-btns + .alert {
		color: rgb(252, 0, 0) !important;
		font-size: 12px;
		margin-bottom: 5px;
		margin-top: -4px;
		clear: both;
		display: block;
	}

		.msg-backorder br {
			display: block;
		}

/*
 *	Total/subtotal/Coupon
*/
#cartSubTotal,
#otcoupon,
#ottotal {
	padding: 21px 0;
}

#cartContentsDisplay .cartUnitDisplay, #cartContentsDisplayLater .cartUnitDisplay,
#cartContentsDisplay .cartTotalDisplay, #cartContentsDisplayLater .cartTotalDisplay,
#cartSubTotal,
#ottotal,
#otcoupon {
	font-size: 15px;
	line-height: 1.2;
}

#orderTotal {
	border-style: solid;
	overflow: hidden;
	border-collapse: collapse;
	width: 100%;
}

#orderTotal .table__subtotal {
	border-top: 1px solid #e6e6e6;
}

#orderTotal .table__subtotal-total {
	font-family: 'ProximaNova-Bold', Arial, Helvetica, sans-serif;
}

	#orderTotal td {
		text-align: right;
		padding: 15px 0
	}

	.table__subtotal td:first-child {
		width: 90%;
	}
	
	#orderTotal .table__subtotal.is__applyed td,
	#orderTotal .table__subtotal.is__applyed + tr td {
		border-bottom: none;
		white-space: nowrap;
	}

	#orderTotal .table__subtotal:last-child td {
		border-bottom: none;
		padding-left: 10px;
	}

	.table__subtotal-total + .table__subtotal-total {
		display: none !important;
	}

/*
 * 	Coupon
 *
 *  [1] = same value as #cartSubTotal .totalBox (you will find it on ajax_shopping_cart.css)
*/
#coupon_code {
	background: transparent;
	float: left !important;
	height: auto;
	line-height: normal;
	overflow: hidden;
	margin: 0;
	padding: 0; /* 1 */
	width: 100%;
}
	
	#coupon_code .button_update,
	#coupon_code #promotion_code {
		float: left;
		height: 30px;
		width: auto;
	}

	#coupon_code .button_update {
		line-height: 27px;
	}

	#coupon_code #promotion_code {
		border: 1px solid #b3b3b3 !important;
		height: 30px !important;
		margin: 0 10px 0 0;
		padding: 0 9px;
		width: 138px;
		font-size: 13px;
	}

#coupon_code + #otcoupon {
	padding-top: 0;
	color: rgb(206, 33, 33);
	clear: both;
}

	#messageStackErrorCoupon [class*="messageStack"] {
		padding: 9px !important;
    	margin-top: 41px;
	}

#ottotal {
	border: 0;
	margin: 0;
}

		.cart__section {
			font-size: 15px;
			font-family: 'ProximaNova-Bold', Arial, Helvetica, sans-serif;
			display: none;
		}

.btn-container .btn a:before {
	border-color: transparent #17607d transparent transparent;
}

.btn-container--bottom .btn + .btn a:before {
	content: none;
}

#PPECbutton {
    margin-top: 0;
    margin-right: 21px;
    float: right;
}

/*
 *	Responsive
*/
@media only screen and (max-width: 980px) {
	/*
	 *	Hide items hidden for small screens
	*/
	.desktop-only {
		display: none;
	}

	#middle-column-wrapper,
	#navBreadCrumb {
		padding: 0;
	}
	
	/* hiddne */
	#youMayAlsoLike {
		display: none;
	}

	#coupon_code #promotion_code {
		max-width: 160px;
	}

	#coupon_code {
		max-width: 100%;
	}

	#orderTotal .table__subtotal.mb__only {
		display: none;
	}

	#orderTotal .table__subtotal .dk__only,
	#orderTotal .table__subtotal.is__applyed .dk__only  {
		display: table-cell;
	}
}

@media only screen and (max-width: 843px) {
	#cartContentsDisplay tr.rowOdd, #cartContentsDisplayLater tr.rowOdd {
		background: #f8f8f8;
	}

	#cartContentsDisplay tr td, #cartContentsDisplayLater tr td,
	#cartContentsDisplay tr td.cartTotalDisplay, #cartContentsDisplayLater tr td.cartTotalDisplay {
	    padding: 5px 0 0 !important;
	    border: none;
	}

	#cartContentsDisplay .cartQuantity {
		padding-top: 8px !important;
	}

	.cartQuantity button {
		display: inline-block;
	}

}

@media only screen and (max-width: 950px) {

	.btn-container .btn--link + .btn--link {
		display: block;
		clear: left;
		text-align: left;
		margin-left: 0;
		margin-top: 10px;
	}

	#messageStackErrors {
		font-size: 12px;
	}

	/* buttons */
	#PPECbutton {
		margin-right: 0;
		clear: right;
	}

	#orderTotal tr td:first-child {
		padding-right: 0;
	}

	#orderTotal .table__subtotal:first-child {
		border-bottom: 1px solid #e6e6e6;
		margin-bottom: -1px;
	}

	#orderTotal .table__subtotal.mb__only {
		display: table-row;
	}

	#orderTotal .table__subtotal .dk__only,
	#orderTotal .table__subtotal.is__applyed .dk__only  {
		display: none;
	}
}

@media only screen and (max-width: 600px) {
	
	/*
	 *	Show items hidden for big screens
	*/
	.mobile-only {
		display: none !important;
		font-size: 15px;
		color: #333;
		font-weight: bold;
		margin-bottom: 15px;
	}
	
	/*
	 *	Table
	*/
	

		/*
		 *	Image item
		*/
		#cartContentsDisplay tr td.productImage, #cartContentsDisplayLater tr td.productImage {
			padding-right: 0 !important;
			width: 100px !important
		}

		/*
		 *	Quantity
		*/
		#cartContentsDisplay tr td .qty-btns, #cartContentsDisplayLater tr td .qty-btns {
			padding-top: 0 !important
		}

	/*
	 *	Coupon code
	*/
	#coupon_code {
		margin-top: 0 !important;
		text-align: left;
	}

}

@media only screen and (max-width: 480px) {

	/*
	 * Coupon
	*/
	#coupon_code {
		float: none !important;
		padding-left: 0;
	}

		#coupon_code #promotion_code {
			width: 100%
		}

		/*#coupon_code #promotion_code {
			border: 1px solid #333 !important;
			height: 30px;
		}*/


	/*#cartSubTotal .lineTitle,
	#otcoupon .lineTitle,
	#ottotal .lineTitle {
		float: left;
		text-align: left;
		width: 135px
	}

	#cartSubTotal .totalBox,
	#otcoupon .totalBox,
	#ottotal .totalBox {
		float: none;
		text-align: left;
		width: auto;
	}

		#coupon_code .button_update {
			float: none;
		}

		#coupon_code #promotion_code {
			float: left;
			width: 105px
		}*/

}

@media only screen and (max-width: 458px) {

	#coupon_code #promotion_code {
	    max-width: 61%;
	    margin-right: 0;
	}

	#coupon_code .button_update {
		display: block;
	    margin-top: 0;
	    width: 35% !important;
	    float: right;
	}

	#orderTotal .table__subtotal .dk__only {
		display: table-cell;
		width: 0;
  		overflow: hidden;
    	font-size: 0px;
	}
}

@media only screen and (max-width: 380px) {
	/*
	 *	Buttons
	*/
	.btn-container .btn--link,
	.btn-container .btn--primary a {
		display: block;
		float: none;
		text-align: center;
	}

	.btn-container .btn--link + .btn--link {
		text-align: center;
	}

	#PPECbutton {
	    margin-right: 0;
	    clear: right;
	    float: none;
	    margin-top: 24px;
	    text-align: center;
	}

}

/* fancybox */
.fancybox-lock {
  overflow: hidden !important;
}

  body .fancybox-skin {
  	background: #fff;
    border-radius: 0;
  }

  body .fancybox-inner {
    width: auto !important;
    padding: 15px 21px;
  }

  @media only screen and (max-width: 630px) {
  	body .fancybox-type-iframe {
  		max-width: 90%;
  	}
  }

	#cartContentsDisplay .product-price.cartUnitDisplay {
		display:revert;
	}
	#cartContentsDisplay .product-price.cartUnitDisplay .productSpecialPrice {
		display:block;
		margin-left:0px;
	}

/* STRIN-2194: cart a11y - contrast, underlines, focus (WCAG AA) */
#coupon_code .button_update,
.btn-container .btn--primary a,
.btn-container .btn--primary a:visited {
	background: #c44d00;
	color: #ffffff;
}

#coupon_code .button_update:hover,
.btn-container .btn--primary a:hover,
.btn-container .btn--primary a:focus {
	background: #a84200;
	color: #ffffff;
}

.cssButton.button_shipping_estimator,
.cssButton.button_shipping_estimator:hover,
.cssButtonHover.button_shipping_estimatorHover:hover {
	background: #5a5a5a;
	color: #ffffff;
}

.btn--link,
.btn--link a,
.qty-btns a,
#cartContentsDisplay .cartProductDisplay a,
#cartContentsDisplayLater .cartProductDisplay a,
#cartContentsDisplay .cartQuantity a,
#cartContentsDisplayLater .cartQuantity a,
.save_for_later {
	color: #123a56;
	text-decoration: underline;
}

.btn--link:hover,
.btn--link a:hover,
.qty-btns a:hover,
#cartContentsDisplay .cartProductDisplay a:hover,
#cartContentsDisplayLater .cartProductDisplay a:hover,
#cartContentsDisplay .cartQuantity a:hover,
#cartContentsDisplayLater .cartQuantity a:hover,
.save_for_later:hover {
	color: #0d2c40;
	text-decoration: underline;
}

/* Beat sitewide .cssButton:not(.small_edit) { background #b34700 !important } */
input.cssButton.icon_update:not(.small_edit),
input.cssButton.icon_update:not(.small_edit):hover,
input.cssButton.icon_update:not(.small_edit):focus,
.cssButton.icon_update:not(.small_edit),
.cssButton.icon_update:not(.small_edit):hover,
.cssButtonHover.icon_update:not(.small_edit),
.cssButton.icon_update:not(.small_edit):focus {
	background: none !important;
	background-color: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: #123a56 !important;
	cursor: pointer;
	display: inline !important;
	font-size: inherit !important;
	font-weight: normal !important;
	height: auto !important;
	line-height: inherit !important;
	margin: 0 !important;
	min-height: 0 !important;
	opacity: 1 !important;
	padding: 0 !important;
	text-decoration: underline !important;
	width: auto !important;
}

/* Qty + Update on one row; Remove | Save on the next */
.cart-qty-row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.cart-qty-row input[type="text"],
.cart-qty-row input[name="cart_quantity[]"] {
	margin-bottom: 0 !important;
}

.cart-qty-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	clear: both;
	margin-top: 8px;
}

.cart-qty-actions .icon_remove,
.cart-qty-actions .save_for_later {
	margin: 0;
	line-height: 1.2;
}

.cart-qty-actions__sep {
	display: inline-block;
	width: 1px;
	height: 1em;
	margin: 0 10px;
	background-color: #123a56;
	vertical-align: middle;
}

#cartContentsDisplay input[name="cart_quantity[]"]:focus,
#cartContentsDisplayLater input[name="cart_quantity[]"]:focus,
.btn-container a:focus-visible,
.qty-btns a:focus-visible {
	outline: 2px solid #123a56;
	outline-offset: 2px;
}