/*
 * PulseGT combined cart + checkout module.
 * Layout: CSS grid on form.checkout; the AJAX-refreshed review fragment uses
 * display:contents so its two panels (summary, shipping) slot into the grid.
 */

/* ---------------------------------------------------------------- layout */

form.pulse-checkout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	/* the 1fr filler row absorbs surplus height when the left column grows
	   (e.g. expanded billing address), keeping shipping/payment separated by the gap only */
	grid-template-areas:
		"summary summary"
		"details shipping"
		"details payment"
		"details ."
		"help    .";
	grid-template-rows: auto auto auto 1fr auto;
	gap: 45px 40px;
	align-items: start;
	margin-top: 60px;
	margin-bottom: 80px;
}

form.pulse-checkout #order_review,
form.pulse-checkout .pulse-review {
	display: contents;
}

/* blockUI overlays inside a display:contents element position against the page — hide them */
.pulse-review > .blockUI {
	display: none !important;
}

form.pulse-checkout > .woocommerce-NoticeGroup,
form.pulse-checkout > .woocommerce-error,
form.pulse-checkout > .woocommerce-message,
form.pulse-checkout > .woocommerce-info {
	grid-column: 1 / -1;
}

.pulse-notices {
	/* same content width as form.checkout (theme rule: max-width 1170px, centered) */
	max-width: 1170px;
	width: 100%;
	float: none !important;
	margin: 40px auto 0 auto !important;
}

.pulse-notices:empty {
	display: none;
}

.pulse-notices > * + * {
	margin-top: 15px;
}

.pulse-summary { grid-area: summary; position: relative; }
.pulse-shipping-panel { grid-area: shipping; }
form.pulse-checkout #customer_details { grid-area: details; float: none; width: auto; }
form.pulse-checkout #payment { grid-area: payment; }
.pulse-help-box { grid-area: help; }

/* ---------------------------------------------------------------- panels */

.pulse-panel,
form.pulse-checkout #customer_details {
	border: 1px solid #657881;
	padding: 45px 45px 40px 45px;
	background-color: rgba(10, 14, 16, 0.35);
}

.pulse-panel-heading {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 0 0 35px 0;
	padding: 0 0 22px 0;
	border-bottom: 1px solid #657881;
	color: #fff;
}

.pulse-panel-heading small {
	font-size: 16px;
	font-weight: 200;
	font-style: normal;
	color: #fff;
}

.pulse-panel-heading span {
	font-size: 25px;
	font-weight: 700;
	font-style: italic;
	color: #fff;
}

/* ------------------------------------------------------- customer details */

form.pulse-checkout #customer_details {
	display: flex;
	flex-direction: column;
}

.pulse-contact-fields { order: 1; }
.pulse-shipping-address { order: 2; margin-top: 45px; }
.pulse-address-toggles { order: 3; margin-top: 10px; }
.pulse-billing-address { order: 4; margin-top: 45px; }

.pulse-hidden-control { display: none !important; }

.pulse-fields-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5px 40px;
}

.pulse-fields-grid p.form-row {
	margin: 0 0 10px 0;
	padding: 0;
	width: auto;
	float: none;
}

.pulse-fields-grid #billing_email_field,
.pulse-fields-grid #shipping_country_field,
.pulse-fields-grid #billing_country_field,
.pulse-fields-grid #shipping_company_field,
.pulse-fields-grid #billing_company_field,
.pulse-fields-grid #shipping_address_1_field,
.pulse-fields-grid #billing_address_1_field {
	grid-column: 1 / -1;
}

/* entered values: flush left, thin — beats .page-id-43 .checkout input */
form.pulse-checkout .pulse-fields-grid input.input-text,
form.pulse-checkout .pulse-fields-grid select {
	font-weight: 300 !important;
	font-size: 15px !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	text-align: left !important;
}

body.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
	font-weight: 300;
	font-size: 15px;
	padding-left: 0;
}

/* --------------------------------------------------------- toggle switches */

.pulse-toggle-row {
	margin: 9px 0 0 0 !important;
}

.pulse-toggle-row label.checkbox,
.pulse-address-toggles label.checkbox,
.pulse-order-note label.checkbox {
	position: relative;
	display: block;
	padding-left: 62px !important;
	min-height: 24px;
	color: #fff;
	font-size: 15px;
	font-weight: 300;
	cursor: pointer;
}

.pulse-toggle-row label.checkbox input,
.pulse-address-toggles label.checkbox input,
.pulse-order-note label.checkbox input {
	display: none !important;
}

.pulse-toggle-row label.checkbox::before,
.pulse-address-toggles label.checkbox::before,
.pulse-order-note label.checkbox::before {
	content: '';
	position: absolute;
	width: 50px;
	height: 22px;
	border: 1px solid #44545c;
	border-radius: 30px;
	left: 0;
	top: 0;
	transition: ease-in-out 0.3s;
}

.pulse-toggle-row label.checkbox::after,
.pulse-address-toggles label.checkbox::after,
.pulse-order-note label.checkbox::after {
	content: '';
	position: absolute;
	width: 20px;
	height: 20px;
	background: #55666e;
	border-radius: 30px;
	left: 1px;
	top: 1px;
	transition: ease-in-out 0.3s;
}

.pulse-toggle-row label.checkbox.active::after,
.pulse-address-toggles label.checkbox.active::after,
.pulse-order-note label.checkbox.active::after {
	left: 29px;
	background: #92da3d;
}

/* ----------------------------------------------------------- order summary */

.pulse-summary__items {
	list-style: none;
	margin: 0;
	padding: 0;
}

.pulse-summary__item {
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 18px 0;
	border-bottom: 1px solid #3c4a52;
}

.pulse-summary__thumb {
	position: relative;
	flex: 0 0 58px;
	width: 58px;
	height: 58px;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.pulse-summary__thumb img {
	max-width: 90%;
	max-height: 90%;
	width: auto !important;
	height: auto;
	object-fit: contain;
}

.pulse-summary__badge {
	position: absolute;
	top: -7px;
	right: -7px;
	z-index: 2;
	min-width: 18px;
	height: 18px;
	padding: 0 4px;
	background: #92da3d;
	color: #fff;
	border-radius: 50%;
	font-size: 11px;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
}

.pulse-summary__name {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.pulse-summary__name strong {
	color: #fff;
	font-size: 17px;
	font-style: italic;
	font-weight: 700;
	text-transform: uppercase;
}

.pulse-summary__capacity {
	color: #b2dd51;
	font-size: 14px;
	font-style: italic;
	font-weight: 300;
}

.pulse-summary__qty.quantity {
	display: flex !important;
	align-items: center;
	justify-content: center;
	gap: 2px;
	border: 1px solid #657881 !important;
	padding: 2px 6px;
	flex: 0 0 auto;
	width: 96px !important;
	height: 34px !important;
	position: static !important;
}

.pulse-summary__qty .qty {
	width: 34px !important;
	height: 26px !important;
	margin: 0 !important;
	border: 0 !important;
	background: transparent !important;
	color: #fff !important;
	text-align: center;
	font-size: 15px;
	font-style: italic;
	float: none !important;
	padding: 0 !important;
	box-shadow: none !important;
}

/* beats .page-id-43 .checkout input which forces a bottom border and margin */
.pulse-summary .pulse-summary__qty input.qty {
	border: 0 !important;
	border-bottom: 0 !important;
	margin: 0 !important;
	height: 26px !important;
	line-height: 26px !important;
	padding: 0 !important;
}

.pulse-summary__qty button.minus,
.pulse-summary__qty button.plus {
	display: flex !important;
	align-items: center;
	justify-content: center;
	position: static !important;
	width: 22px !important;
	height: 22px !important;
	border: 0 !important;
	background: transparent !important;
	color: #62737b !important;
	font-size: 16px !important;
	font-weight: 400;
	line-height: 1 !important;
	padding: 0 !important;
	cursor: pointer;
	transition: color 0.2s;
}

.pulse-summary__qty button.minus:hover,
.pulse-summary__qty button.plus:hover {
	color: #92da3d !important;
}

.pulse-summary__price {
	flex: 0 0 auto;
	min-width: 110px;
	text-align: right;
	color: #fff;
	font-size: 17px;
	font-weight: 700;
	font-style: italic;
}

.pulse-summary__price .woocommerce-Price-amount {
	color: #fff !important;
}

.pulse-summary__remove {
	display: flex !important;
	align-items: center;
	justify-content: center;
	flex: 0 0 24px;
	width: 24px !important;
	height: 24px !important;
	border: 1px solid #44545c !important;
	border-radius: 50%;
	background: transparent !important;
	color: #8aa0aa !important;
	font-size: 14px !important;
	line-height: 1 !important;
	padding: 0 0 2px 0 !important;
	margin: 0 !important;
	cursor: pointer;
	transition: 0.2s;
}

.pulse-summary__remove:hover {
	border-color: #e05d5d !important;
	color: #e05d5d !important;
}

/* coupon */

.pulse-summary__coupon {
	display: flex;
	align-items: center;
	gap: 45px;
	margin: 35px 0 15px 0;
	padding-top: 20px;
	border-top: 1px solid #3c4a52;
}

.pulse-summary__coupon input {
	flex: 0 1 260px;
	max-width: 260px;
	height: unset !important;
	padding: 0 0 50px 0 !important;
	margin: 0 !important;
	font-size: 15px;
}

.pulse-summary__coupon input::placeholder {
	color: #8aa0aa !important;
	font-size: 14px;
	font-weight: 300;
}

/* totals */

.pulse-summary__totals {
	margin-top: 25px;
	border-top: 1px solid #657881;
	padding-top: 10px;
}

.pulse-summary__row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 8px 0;
	color: #fff;
	font-size: 15px;
	font-weight: 300;
}

.pulse-summary__row .woocommerce-Price-amount {
	font-style: italic;
	font-weight: 700;
}

.pulse-summary__row em {
	font-style: italic;
	font-weight: 700;
}

.pulse-summary__row.order-total {
	margin-top: 10px;
	border-top: 1px solid #657881;
	padding-top: 16px;
}

.pulse-summary__row.order-total span:first-child {
	color: #92da3d;
	font-weight: 700;
	font-style: italic;
	font-size: 17px;
}

.pulse-summary__row.order-total .woocommerce-Price-amount {
	color: #92da3d !important;
	font-size: 21px;
}

.pulse-summary__row.cart-discount .woocommerce-remove-coupon {
	color: #e05d5d;
	margin-left: 10px;
	font-size: 13px;
}

/* --------------------------------------------------------- shipping panel */

.pulse-shipping-table {
	width: 100%;
	border: 0 !important;
	margin: 0 !important;
}

.pulse-shipping-table th {
	display: none !important;
}

.pulse-shipping-table td {
	border: 0 !important;
	padding: 0 !important;
	width: 100%;
}

.pulse-shipping-table .woocommerce-shipping-totals {
	display: block;
}

.pulse-shipping-methods__notice,
.pulse-shipping-panel__none {
	color: #9fb0b8;
	font-size: 15px;
	font-weight: 300;
}

.pulse-shipping-panel #shipping_method {
	gap: 12px;
}

#shipping_method li {
	padding: 0 0 13px 0;
}

.pulse-shipping-panel #shipping_method li label {
	display: flex !important;
	justify-content: space-between !important;
	align-items: center;
	gap: 15px;
	width: 100%;
}

.pulse-shipping-panel #shipping_method li label .woocommerce-Price-amount {
	white-space: nowrap;
}

/* epaka point-picker rows: flush left with the method name (label padding = 72px) */
#shipping_method li p.form-row {
	margin: 0 0 0 72px !important;
	padding: 0 !important;
	width: auto;
	text-align: left;
}

#epaka_paczkomat_opis {
	margin-top: 20px !important;
	cursor: pointer;
	text-align: left !important;
}

/* ---------------------------------------------------------- payment panel */

form.pulse-checkout #payment {
	background-color: rgba(10, 14, 16, 0.35) !important;
	border: 1px solid #657881 !important;
	border-radius: 0 !important;
	float: none !important;
	width: auto !important;
}

.wc_payment_methods {
	list-style: none;
	margin: 0 !important;
	padding: 0 !important;
}

.wc_payment_methods li {
	position: relative;
	padding: 0 0 11px 0;
	margin: 0 0 11px 0 !important;
	list-style: none;
}

.wc_payment_methods li > label {
	position: relative;
	display: block;
	padding-left: 62px !important;
	color: #fff !important;
	font-size: 19px !important;
	font-style: italic !important;
	font-weight: 400;
	cursor: pointer;
}

.wc_payment_methods li > input.input-radio {
	display: none;
}

.wc_payment_methods li > label::before {
	content: '';
	position: absolute;
	width: 50px;
	height: 22px;
	border: 1px solid #44545c;
	border-radius: 30px;
	left: 0;
	top: 2px;
	transition: ease-in-out 0.3s;
}

.wc_payment_methods li > label::after {
	content: '';
	position: absolute;
	width: 20px;
	height: 20px;
	background: #55666e;
	border-radius: 30px;
	left: 1px;
	top: 3px;
	transition: ease-in-out 0.3s;
}

.wc_payment_methods li > label.active::after {
	left: 29px;
	background: #92da3d;
}

.wc_payment_methods li > label img {
	max-height: 26px;
	width: auto;
	margin-left: 8px;
	vertical-align: middle;
}

/* specificity beats pulse/css/blog.css: .wc_payment_methods.payment_methods.methods li div { padding: 72px !important } */
.wc_payment_methods.payment_methods.methods li div.payment_box {
	padding: 0 !important;
}

.payment_box {
	margin: 12px 0 0 72px !important;
	padding: 0 !important;
	background: transparent !important;
	color: #9fb0b8 !important;
	font-size: 14px !important;
	font-weight: 300;
	line-height: 1.6;
	text-align: left !important;
}

.payment_box p {
	text-align: left !important;
	margin: 0 0 8px 0;
}

.payment_box::before {
	display: none !important;
}

.payment_box img {
	max-height: 30px;
	width: auto;
	margin: 8px 8px 0 0;
	display: inline-block;
}

/* order note */

.pulse-order-note {
	margin: 10px 0 0 0;
	padding-top: 5px;
}

.pulse-order-note__field {
	margin: 15px 0 0 0 !important;
}

.pulse-order-note__field textarea {
	width: 100%;
	min-height: 80px;
	background: transparent;
	border: 1px solid #44545c !important;
	color: #fff !important;
	font-size: 15px;
	font-weight: 300;
	padding: 12px;
}

/* consent + place order */

form.pulse-checkout .place-order {
	margin-top: 25px;
	padding: 0 !important;
}

.pulse-consent {
	color: #fff;
	font-size: 14px;
	font-weight: 300;
	line-height: 1.6;
	margin: 0 0 22px 0;
}

.pulse-consent a {
	color: #fff !important;
	text-decoration: none !important;
	font-weight: 600;
}

button.pulse-place-order,
form.pulse-checkout #place_order {
	display: block;
	width: 100%;
	border: 0 !important;
	border-radius: 0 !important;
	background: #92da3d !important;
	color: #fff !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	font-style: italic;
	text-transform: uppercase;
	padding: 18px 30px !important;
	cursor: pointer;
	clip-path: polygon(18px 0, 100% 0, calc(100% - 18px) 100%, 0 100%);
	transition: background 0.3s;
}

button.pulse-place-order::after,
form.pulse-checkout #place_order::after {
	content: '\27F6';
	margin-left: 18px;
	font-style: normal;
	font-size: 24px;
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	transform: translateY(-6px);
}

button.pulse-place-order:hover,
form.pulse-checkout #place_order:hover {
	background: #a5ec4e !important;
}

/* coupon button shares the skewed style, muted teal */

button.pulse-apply-coupon {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 18px;
	border: 0 !important;
	border-radius: 0 !important;
	background: #7fa3ad !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	font-style: italic;
	text-transform: uppercase;
	height: 54px;
	align-self: center;
	padding: 0 36px !important;
	cursor: pointer;
	clip-path: polygon(11px 0, 100% 0, calc(100% - 11px) 100%, 0 100%);
	transition: background 0.3s;
	flex: 0 0 auto;
}

button.pulse-apply-coupon::after {
	content: '\27F6';
	font-style: normal;
	font-size: 21px;
	line-height: 1;
	display: inline-block;
	transform: translateY(-3px);
}

button.pulse-apply-coupon:hover {
	background: #93b7c1 !important;
}

/* ---------------------------------------------------------------- help box */

.pulse-help-box {
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 10px 0;
}

.pulse-help-box__icon {
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	background: url('img/phone-call.png') no-repeat center / contain;
}

.pulse-help-box__text {
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.pulse-help-box__text strong {
	color: #fff;
	font-size: 17px;
	font-style: italic;
	text-transform: uppercase;
}

.pulse-help-box__text strong a {
	color: #3fc1f0 !important;
	text-decoration: none;
}

.pulse-help-box__text > span {
	color: #92da3d;
	font-size: 14px;
	font-style: italic;
}

/* ------------------------------------------------------------ misc cleanup */

/* Woo appends "(optional)" hints — labels carry their own Polish hints */
form.pulse-checkout .optional {
	display: none !important;
}

/* our consent line replaces the stock privacy-policy paragraph */
form.pulse-checkout .woocommerce-privacy-policy-text {
	display: none !important;
}

/* P24 failure notice retry button (order-pay page) */
body.woocommerce-checkout .woocommerce-error a.pulse-p24-retry {
	display: inline-block !important;
	float: none !important;
	width: auto !important;
	height: auto !important;
	margin-top: 14px;
	background: #92da3d !important;
	color: #14210b !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-style: italic;
	font-size: 14px !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	text-decoration: none !important;
	padding: 10px 24px !important;
	clip-path: polygon(9px 0, 100% 0, calc(100% - 9px) 100%, 0 100%);
}

/* ------------------------------------------------------------- slim header */

body.woocommerce-checkout .pulse-checkout-header-note {
	text-align: right;
	padding: 15px 0;
	color: #8aa0aa;
	font-size: 14px;
	font-style: italic;
}

body.woocommerce-checkout .pulse-checkout-header-note strong {
	color: #92da3d;
}

body.woocommerce-checkout .navbar .koszyk {
	display: none !important;
}

/* ----------------------------------------------------- notices / empty cart */

body.woocommerce-checkout .woocommerce-info,
body.woocommerce-checkout .woocommerce-message,
body.woocommerce-checkout .woocommerce-error {
	position: relative;
	border: 1px solid #657881;
	background: rgba(10, 14, 16, 0.6);
	color: #fff;
	padding: 25px 30px 25px 62px;
	font-size: 16px;
	font-weight: 300;
	list-style: none;
}

body.woocommerce-checkout .woocommerce-info::before,
body.woocommerce-checkout .woocommerce-message::before,
body.woocommerce-checkout .woocommerce-error::before {
	left: 26px;
	top: 27px;
}

body.woocommerce-checkout .woocommerce-error li {
	list-style: none;
	margin: 4px 0;
}

body.woocommerce-checkout .woocommerce-info a,
body.woocommerce-checkout .woocommerce-error a,
body.woocommerce-checkout .woocommerce-message a {
	color: #92da3d !important;
	display: inline-block !important;
}

/* ------------------------------------------------------------- empty cart */

.pulse-empty-cart {
	max-width: 680px;
	margin: 90px auto 110px auto;
	padding: 70px 50px;
	border: 1px solid #657881;
	background-color: rgba(10, 14, 16, 0.35);
	text-align: center;
}

.pulse-empty-cart__icon {
	display: block;
	width: 64px;
	height: 64px;
	margin: 0 auto 25px auto;
	background-color: #92da3d;
	-webkit-mask: url('img/koszyk.png') no-repeat center / contain;
	mask: url('img/koszyk.png') no-repeat center / contain;
}

.pulse-empty-cart h2 {
	margin: 0 0 12px 0;
	color: #fff;
	font-size: 25px;
	font-style: italic;
	font-weight: 700;
}

.pulse-empty-cart p {
	margin: 0 0 35px 0;
	color: #9fb0b8;
	font-size: 16px;
	font-weight: 300;
}

a.pulse-empty-cart__btn {
	display: inline-block;
	background: #92da3d !important;
	color: #fff !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	font-style: italic;
	text-transform: uppercase;
	text-decoration: none !important;
	padding: 15px 45px !important;
	clip-path: polygon(14px 0, 100% 0, calc(100% - 14px) 100%, 0 100%);
	transition: background 0.3s;
}

a.pulse-empty-cart__btn::after {
	content: '\27F6';
	margin-left: 14px;
	font-style: normal;
}

a.pulse-empty-cart__btn:hover {
	background: #a5ec4e !important;
}

/* ------------------------------------------------------------- responsive */

@media (max-width: 1150px) {
	form.pulse-checkout {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"summary"
			"details"
			"shipping"
			"payment"
			"help";
		gap: 35px;
	}
}

@media (max-width: 640px) {
	.pulse-panel,
	form.pulse-checkout #customer_details {
		padding: 28px 20px;
	}

	.pulse-fields-grid {
		grid-template-columns: 1fr;
	}

	.pulse-summary__item {
		flex-wrap: wrap;
		gap: 14px;
	}

	.pulse-summary__name {
		flex-basis: calc(100% - 90px);
	}

	.pulse-summary__price {
		min-width: 0;
	}

	.pulse-summary__coupon {
		flex-direction: column;
		align-items: stretch;
	}

	.pulse-summary__coupon input {
		max-width: none;
	}
}
