/*
 * Atlassian Cart Styles
 * File: assets/css/style.css
 */

/*
 * WooCommerce cart — overrides & additions
 * Base styles come from stylesheet.css (Charlie Display/Text fonts,
 * color vars, .atlassian-theme-btn, .atlassian-btn-white-bg, .atlassian-cart-table, .atlassian-total-table-wrapper,
 * .atlassian-sub-row, .atlassian-btn-remove, etc.)
 */

.atlassian-btn-continue {
	margin-top: 20px;
	font-size: 16px;
	line-height: 24px;
	color: #101214;
	font-weight: 400;
	border: 0;
	background: transparent;
	padding: 0;
	height: auto;
}

.atlassian-btn-continue svg {
	margin-right: 10px;
	margin-bottom: -2px;
}
.atlassian-total-table-wrapper {
	background: #F8F8F8;
  padding: 22px 14px 24px;
  border-radius: 20px;
}

#atlassian-cart-area.atlassian-main-cart-page h1 {
	font-size: 20px;
	line-height: 28px;
	font-weight: 700;
	color: #101214;
	font-family: 'Charlie Display';

}
/* 1. Hide WooCommerce quantity +/- stepper buttons */
.atlassian-main-cart-page .input-group-prepend,
.atlassian-main-cart-page .input-group-append,
.atlassian-main-cart-page .quantity .plus,
.atlassian-main-cart-page .quantity .minus {
	display: none !important;
}

/* 2. WooCommerce wraps qty in .quantity — strip its layout so it matches theirs */
.atlassian-main-cart-page .atlassian-cart-table .quantity {
	display: inline-block;
	width: auto;
}

/* 3. Qty input — match their .atlassian-item-qty-input style */
.atlassian-main-cart-page .atlassian-cart-table tbody tr.atlassian-cart-row td .atlassian-item-qty-input,
.atlassian-main-cart-page .atlassian-cart-table tbody tr.atlassian-cart-row td .quantity input.qty {
	width: 56px;
	height: 36px;
	text-align: center;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	font-family: 'Charlie Text', sans-serif;
	border: 2px solid rgba(9, 30, 66, 0.14);
	border-radius: 3px;
	padding: 8px;
	color: #101214;
	background: #fff;
	-moz-appearance: textfield;
}
.atlassian-main-cart-page .atlassian-cart-table tbody tr.atlassian-cart-row td .atlassian-item-qty-input::-webkit-inner-spin-button,
.atlassian-main-cart-page .atlassian-cart-table tbody tr.atlassian-cart-row td .atlassian-item-qty-input::-webkit-outer-spin-button,
.atlassian-main-cart-page .atlassian-cart-table tbody tr.atlassian-cart-row td .quantity input.qty::-webkit-inner-spin-button,
.atlassian-main-cart-page .atlassian-cart-table tbody tr.atlassian-cart-row td .quantity input.qty::-webkit-outer-spin-button {
	-webkit-appearance: none;
}

/* 4. Sub-row qty input */
.atlassian-main-cart-page .atlassian-cart-table tbody tr.atlassian-sub-row td.atlassian-sub-input input.form-control {
	width: 56px;
	-moz-appearance: textfield;
}
.atlassian-main-cart-page .atlassian-cart-table tbody tr.atlassian-sub-row td.atlassian-sub-input input.form-control::-webkit-inner-spin-button,
.atlassian-main-cart-page .atlassian-cart-table tbody tr.atlassian-sub-row td.atlassian-sub-input input.form-control::-webkit-outer-spin-button {
	-webkit-appearance: none;
}

#atlassian-cart-area.atlassian-main-cart-page .atlassian-cart-table td[id^="prod-price-"] {
	width: 160px;
	min-width: 160px;
}

#atlassian-cart-area.atlassian-main-cart-page .atlassian-cart-table td[id^="prod-price-"] #prod-price-new-,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-cart-table td[id^="prod-price-"] .zag-logged-in-sale-price {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
}

#atlassian-cart-area.atlassian-main-cart-page .atlassian-cart-table td[id^="prod-price-"] del,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-cart-table td[id^="prod-price-"] ins {
	display: inline;
	white-space: nowrap;
}

/* 5. WooCommerce page title — use their atlassian-page-title-box h1 style */
#atlassian-checkout-cart #atlassian-page-title {
	padding: 13px;
}
#atlassian-checkout-cart #atlassian-page-title .atlassian-page-title-box h1 {
	font-family: 'Charlie Display', sans-serif;
	font-size: 40px;
	line-height: 32px;
	color: #101214;
	text-align: center;
	margin-bottom: 35px;
}


/* 7. Font assignments — Charlie Display for headings, Charlie Text for everything else */
#atlassian-cart-area.atlassian-main-cart-page,
#atlassian-cart-area.atlassian-main-cart-page p,
#atlassian-cart-area.atlassian-main-cart-page a,
#atlassian-cart-area.atlassian-main-cart-page span,
#atlassian-cart-area.atlassian-main-cart-page td,
#atlassian-cart-area.atlassian-main-cart-page th,
#atlassian-cart-area.atlassian-main-cart-page label,
#atlassian-cart-area.atlassian-main-cart-page input,
#atlassian-cart-area.atlassian-main-cart-page button,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-item-name,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-item-no,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-btn-remove,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-btn-continue,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-shipto-btn,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-total-text,
#atlassian-cart-area.atlassian-main-cart-page .subtotal,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-total-text-label p,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-sub-row td {
	font-family: 'Charlie Text', sans-serif !important;
}

#atlassian-cart-area.atlassian-main-cart-page .atlassian-total-text-label {
	padding-left: 0px;
}

#atlassian-cart-area.atlassian-main-cart-page .cart_item .atlassian-btn-remove {
	position: absolute;
	right: 0;
	bottom: 30px;
	font-size: 14px;
	font-weight: 400;
	line-height: 21px;
	text-align: left;
	color: #787A7D;
	display: flex;
	align-items: center;
}

.single-product div.product .summary .price ins,
.single-product div.product .summary .price .zag-logged-in-sale-price ins {
	color: #d63638 !important;
	text-decoration: none !important;
}

.zag-logged-in-sale-price ins {
	text-decoration: none !important;
}

.woocommerce-cart:not(.raven-cart-wiget-cart-page) .woocommerce button.button,
.woocommerce-cart:not(.raven-cart-wiget-cart-page) .woocommerce button.button:disabled,
.woocommerce-cart:not(.raven-cart-wiget-cart-page) .woocommerce button.button:disabled[disabled] {
	padding: 8px 24px !important;
	font-family: Charlie Text !important;
}

#atlassian-cart-area.atlassian-main-cart-page .atlassian-shipto-btn {
	margin-left: 0;
	width: 100%;
	transform: rotate(0deg);
	opacity: 1;
	border-radius: 40px;
	padding: 8px 24px;
	font-family: Charlie Text;
	font-weight: 600;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0px;
	text-align: center;
	background-color: #1868DB;
	color: white;
	border: none;
}

#atlassian-cart-area.atlassian-main-cart-page .atlassian-shipto-btn:hover {
	background-color: #123263;
}

.atlassian-td-total {
	position: relative;
}

#atlassian-total {
	border: none;
}

#atlassian-cart-area.atlassian-main-cart-page h1,
#atlassian-cart-area.atlassian-main-cart-page h2,
#atlassian-cart-area.atlassian-main-cart-page h3,
#atlassian-cart-area.atlassian-main-cart-page h4,
#atlassian-cart-area.atlassian-main-cart-page h5,
#atlassian-cart-area.atlassian-main-cart-page h6,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-page-title-box h1,
#atlassian-cart-area.atlassian-main-cart-page .atlassian-total-table-box h1 {
	font-family: 'Charlie Display', sans-serif !important;
}

.atlassian-total-table .atlassian-total-text-label, .atlassian-total-table .atlassian-total-amount {
	font-size: 16px;
	font-weight: 600;
	font-family: 'Charlie Text';
	line-height: 24px;
	color: #101214;
}

.atlassian-total-table .atlassian-total-amount {
	text-align:right;
}

.woocommerce .woocommerce-order,
.woocommerce .woocommerce-order * {
	font-family: 'Charlie Display', sans-serif !important;
}

.woocommerce ul.order_details li {
	font-family: 'Charlie Display', sans-serif !important;
}

.woocommerce .cart_totals .shop_table :not(button):not(input):not(.button):not(.select2-selection__rendered):not(.form-row),
.woocommerce .woocommerce-table--order-details tbody,
.woocommerce .woocommerce-table--order-details tfoot,
.woocommerce .woocommerce-table--order-details a,
.woocommerce .woocommerce-order-overview,
.woocommerce .woocommerce-order > p,
.woocommerce .woocommerce-customer-details address,
.woocommerce-order-received .woocommerce-customer-details address {
	font-family: 'Charlie Display', sans-serif !important;
}

.woocommerce .woocommerce-form-coupon :not(button):not(input):not(.button):not(.woocommerce-notice),
.woocommerce .woocommerce-checkout-payment :not(button):not(input):not(.button):not(.woocommerce-notice),
.woocommerce-checkout .woocommerce .woocommerce-form-coupon :not(button):not(input):not(.button):not(.woocommerce-notice),
.woocommerce-checkout .woocommerce .woocommerce-checkout-payment :not(button):not(input):not(.button):not(.woocommerce-notice) {
	font-family: 'Charlie Display', sans-serif !important;
}

#payment .wc_payment_method label {
	font-family: 'Charlie Display', sans-serif !important;
}

#payment #place_order {
	height: auto !important;
}
