/* Kassen i leieflyten. Bygger på variabler og kort fra rental-flow.css. */
.inplug-flow--checkout .inplug-co {
	max-width: 1200px;
	margin: 0 auto;
	padding: 16px;
}

.inplug-co-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 380px;
	gap: 24px;
	align-items: start;
}

.inplug-co-main {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.inplug-co-card {
	padding: 24px;
}

.inplug-co-heading {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 20px;
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1.2;
}

.inplug-co-num {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	font-size: 15px;
	color: #fff;
	background: var(--inplug-flow-accent);
	border-radius: 50%;
}

/* Felt */
.inplug-co .woocommerce-billing-fields > h3,
.inplug-co .woocommerce-additional-fields > h3 {
	display: none;
}

.inplug-co .woocommerce-billing-fields__field-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 0 16px;
}

.inplug-co .form-row {
	flex: 1 1 100%;
	width: auto;
	float: none;
	margin: 0 0 16px;
	padding: 0;
}

.inplug-co .form-row-first,
.inplug-co .form-row-last {
	flex: 1 1 calc(50% - 8px);
}

.inplug-co .form-row label {
	display: block;
	margin-bottom: 6px;
	font-size: 14px;
	font-weight: 600;
}

.inplug-co .form-row .required {
	color: #c62828;
	text-decoration: none;
}

.inplug-co .form-row .input-text,
.inplug-co .form-row select,
.inplug-co .form-row .select2-selection {
	width: 100%;
	min-height: 52px;
	padding: 12px 14px;
	font-size: 16px; /* 16px hindrer zoom på iOS */
	border: 1px solid #c9c9c9;
	border-radius: 8px;
	background: #fff;
	box-shadow: none;
}

.inplug-co .form-row .input-text:focus,
.inplug-co .form-row select:focus {
	border-color: var(--inplug-flow-accent);
	outline: 3px solid rgba(30, 129, 246, 0.25);
	outline-offset: 0;
}

.inplug-co .form-row.woocommerce-invalid .input-text,
.inplug-co .form-row.woocommerce-invalid select {
	border-color: #c62828;
	background: #fff6f6;
}

.inplug-co .form-row.woocommerce-validated .input-text {
	border-color: #2e7d32;
}

.inplug-co .woocommerce-error,
.inplug-co .woocommerce-message,
.inplug-co .woocommerce-info {
	margin: 0 0 20px;
	border-radius: 8px;
}

/* Betaling */
.inplug-co .wc_payment_methods {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

.inplug-co .wc_payment_methods > li {
	margin: 0 0 10px;
	padding: 14px 16px;
	border: 1px solid var(--inplug-flow-border);
	border-radius: 8px;
}

.inplug-co .wc_payment_methods > li:only-child input[type="radio"] {
	display: none;
}

.inplug-co .wc_payment_methods > li:only-child label {
	margin: 0;
	font-weight: 700;
}

.inplug-co .payment_box {
	margin: 10px 0 0;
	padding: 0;
	font-size: 14px;
	line-height: 1.5;
	background: none;
}

.inplug-co .payment_box::before {
	display: none;
}

.inplug-co .payment_box p {
	margin: 0;
}

.inplug-co .woocommerce-terms-and-conditions-wrapper {
	margin-bottom: 16px;
	font-size: 14px;
}

.inplug-co .woocommerce-privacy-policy-text p {
	margin: 0 0 12px;
	font-size: 13px;
	color: #6b6b6b;
}

.inplug-co .woocommerce-terms-and-conditions {
	max-height: 160px;
	margin-bottom: 12px;
	overflow: auto;
	font-size: 13px;
}

.inplug-co .woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-weight: 400;
}

.inplug-co .woocommerce-form__label-for-checkbox input {
	margin-top: 3px;
}

.inplug-co .inplug-co-submit {
	width: 100%;
	min-height: 60px;
	padding: 0 24px;
	font-size: 18px;
	font-weight: 800;
	color: #fff;
	background: var(--inplug-flow-accent);
	border: 0;
	border-radius: 10px;
	cursor: pointer;
}

.inplug-co .inplug-co-submit:hover {
	filter: brightness(0.95);
}

.inplug-co .woocommerce-checkout.processing .inplug-co-submit {
	opacity: 0.6;
}

/* Oppsummering */
.inplug-co-aside {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + 120px);
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.inplug-co-summary {
	padding: 0;
}

.inplug-co-summary > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 20px;
	font-size: 1.1rem;
	font-weight: 800;
	cursor: pointer;
	list-style: none;
}

.inplug-co-summary > summary::-webkit-details-marker {
	display: none;
}

.inplug-co-summary > summary strong {
	font-size: 1rem;
}

.inplug-co-summary > .woocommerce-checkout-review-order {
	padding: 0 20px 20px;
}

.inplug-co-item {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr) auto;
	gap: 12px;
	padding: 0 0 16px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--inplug-flow-border);
}

.inplug-co-item__image img {
	display: block;
	width: 72px;
	height: 72px;
	object-fit: cover;
	border-radius: 8px;
}

.inplug-co-item__name {
	display: block;
	margin-bottom: 4px;
}

.inplug-co-item__total {
	font-weight: 700;
	white-space: nowrap;
}

.inplug-co-item dl.variation {
	margin: 0;
	font-size: 13px;
	line-height: 1.5;
	color: #555;
}

.inplug-co-item dl.variation dt,
.inplug-co-item dl.variation dd {
	display: inline;
	margin: 0;
}

.inplug-co-item dl.variation dt {
	font-weight: 600;
}

.inplug-co-item dl.variation dd {
	margin-right: 0;
}

.inplug-co-item dl.variation dd::after {
	content: "";
	display: block;
}

.inplug-co-item dl.variation dd p {
	display: inline;
	margin: 0;
}

.inplug-co-totals {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
}

.inplug-co-totals th,
.inplug-co-totals td {
	padding: 6px 0;
	font-size: 14px;
	border: 0;
	background: none;
}

.inplug-co-totals th {
	font-weight: 400;
	text-align: left;
}

.inplug-co-totals td {
	text-align: right;
}

.inplug-co-totals .order-total th,
.inplug-co-totals .order-total td {
	padding-top: 14px;
	font-size: 1.25rem;
	font-weight: 800;
	border-top: 1px solid var(--inplug-flow-border);
}

/* Kupong */
.inplug-co-coupon .woocommerce-form-coupon-toggle .woocommerce-info {
	margin: 0;
	padding: 0;
	font-size: 14px;
	background: none;
	border: 0;
}

.inplug-co-coupon .woocommerce-form-coupon-toggle .woocommerce-info::before {
	display: none;
}

.inplug-co-coupon form.checkout_coupon {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 10px 0 0;
	padding: 0;
	border: 0;
}

.inplug-co-coupon form.checkout_coupon p {
	margin: 0;
}

.inplug-co-coupon form.checkout_coupon .form-row-first {
	flex: 1 1 160px;
}

.inplug-co-coupon form.checkout_coupon input.input-text {
	width: 100%;
	min-height: 48px;
	padding: 10px 12px;
	border: 1px solid #c9c9c9;
	border-radius: 8px;
}

.inplug-co-coupon form.checkout_coupon button {
	min-height: 48px;
	border-radius: 8px;
}

.inplug-co-coupon form.checkout_coupon .clear {
	display: none;
}

/* Trygghetspunkter */
.inplug-co-trust {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
}

.inplug-co-trust li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0 0 8px;
}

.inplug-co-trust i {
	color: #2e7d32;
	font-style: normal;
	font-weight: 800;
}

/* Ordrebekreftelse */
.inplug-flow--checkout .woocommerce-order {
	max-width: 760px;
	margin: 0 auto;
	padding: 28px;
	background: #fff;
	border: 1px solid var(--inplug-flow-border);
	border-radius: 12px;
}

.inplug-flow--checkout .woocommerce-notice--success {
	margin: 0 0 20px;
	font-size: 1.4rem;
	font-weight: 800;
}

.inplug-flow--checkout .woocommerce-order-overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 12px;
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}

.inplug-flow--checkout .woocommerce-order-overview li {
	margin: 0;
	padding: 12px 14px;
	font-size: 13px;
	background: var(--inplug-flow-bg);
	border: 0;
	border-radius: 8px;
}

.inplug-flow--checkout .woocommerce-order-overview li strong {
	display: block;
	margin-top: 4px;
	font-size: 15px;
}

/* Mobil: oppsummeringen øverst, ett kolonne */
@media (max-width: 959px) {
	.inplug-co-grid {
		grid-template-columns: 1fr;
	}

	.inplug-co-aside {
		position: static;
		order: -1;
	}

	.inplug-co-card {
		padding: 18px;
	}

	.inplug-co-item {
		grid-template-columns: 56px minmax(0, 1fr) auto;
	}

	.inplug-co-item__image img {
		width: 56px;
		height: 56px;
	}
}

/* Antall (alltid 1 for leie) trenger ikke vises i oppsummeringen. */
.inplug-co-item dl.variation .variation-Quantity {
	display: none;
}

/* Blocksy gjør alle form.ct-woocommerce-checkout til et rutenett med to kolonner (fra 1000px). Skjemaet vårt er
   én kolonne med kortene under hverandre, og oppsummeringen ligger i en egen kolonne ved siden av. */
.inplug-co .inplug-co-main.ct-woocommerce-checkout {
	display: flex;
	flex-direction: column;
	gap: 20px;
	grid-template-columns: none;
}

.inplug-co .inplug-co-main .ct-customer-details {
	display: block;
}

/* Rekkefølgen styres med CSS, siden WooCommerce sin land-script flytter om på feltene etter landets mal. */
.inplug-co #billing_first_name_field { order: 1; }
.inplug-co #billing_last_name_field  { order: 2; }
.inplug-co #billing_email_field      { order: 3; }
.inplug-co #billing_phone_field      { order: 4; }
.inplug-co #billing_country_field    { order: 5; }
.inplug-co #billing_address_1_field  { order: 6; }
.inplug-co #billing_postcode_field   { order: 7; }
.inplug-co #billing_city_field       { order: 8; }
.inplug-co #billing_state_field      { order: 9; }

/* Halve felt fra tablet og opp (WooCommerce sin land-script bytter klassene, så bredden settes på felt-id). */
@media (min-width: 600px) {
	.inplug-co #billing_first_name_field,
	.inplug-co #billing_last_name_field,
	.inplug-co #billing_email_field,
	.inplug-co #billing_phone_field,
	.inplug-co #billing_postcode_field,
	.inplug-co #billing_city_field {
		flex: 1 1 calc(50% - 8px);
		width: auto;
		float: none;
	}
}

@media (max-width: 599px) {
	.inplug-co .woocommerce-billing-fields__field-wrapper .form-row {
		flex-basis: 100%;
		width: 100%;
		float: none;
	}
}

/* Temaet gjør alle knapper svarte og runde: bestillingsknappen skal følge flyten (som «Fortsett»-knappen). */
.inplug-co #payment #place_order.inplug-co-submit {
	min-height: 60px;
	padding: 0 24px !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	color: #fff !important;
	background: var(--inplug-flow-accent) !important;
	border: 0 !important;
	border-radius: 10px !important;
}

/* Større skjermer: rom for innholdet og klistret oppsummering under toppbaren (som nå også har fremdrift). */
@media (min-width: 960px) {
	.inplug-co-grid {
		grid-template-columns: minmax(0, 1fr) minmax(340px, 400px);
		gap: 32px;
	}

	.inplug-co-aside {
		top: calc(var(--wp-admin--admin-bar--height, 0px) + 150px);
	}
}

/* Blocksy legger en egen, sticky ramme rundt betalingsdelen (.ct-order-review). Kortet vårt er rammen. */
.inplug-co .ct-order-review {
	position: static;
	align-self: auto;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
}

/* Varekortet i oppsummeringen: bilde og tekst på linjen, prisen under teksten (smal kolonne). */
.inplug-co-item {
	grid-template-columns: 64px minmax(0, 1fr);
}

.inplug-co-item__image img {
	width: 64px;
	height: 64px;
}

.inplug-co-item__total {
	grid-column: 2;
	margin-top: -6px;
}

.inplug-co-item dl.variation dt {
	margin-right: 4px;
}

@media (max-width: 959px) {
	.inplug-co-item {
		grid-template-columns: 72px minmax(0, 1fr) auto;
	}

	.inplug-co-item__image img {
		width: 72px;
		height: 72px;
	}

	.inplug-co-item__total {
		grid-column: auto;
		margin-top: 0;
	}
}

@media (max-width: 599px) {
	.inplug-co-item {
		grid-template-columns: 56px minmax(0, 1fr) auto;
	}

	.inplug-co-item__image img {
		width: 56px;
		height: 56px;
	}
}

/* Trinn for trinn: uten JavaScript (ingen data-step) vises alt, og trinnknappene skjules. */
.inplug-co-next,
.inplug-co-recap {
	display: none;
}

.inplug-co[data-step="1"] [data-co-step="3"],
.inplug-co[data-step="3"] [data-co-step="1"] {
	display: none;
}

.inplug-co[data-step="1"] #customer_details .inplug-co-next {
	display: block;
	margin-top: 8px;
}

.inplug-co[data-step="3"] .inplug-co-recap {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 20px;
	padding: 14px 16px;
	font-size: 14px;
	line-height: 1.5;
	background: var(--inplug-flow-bg);
	border-radius: 8px;
}

.inplug-co-recap__text span {
	display: block;
}

.inplug-co-recap__text span:first-child {
	font-weight: 700;
}

.inplug-co .inplug-co-continue {
	width: 100%;
	min-height: 60px;
	padding: 0 24px !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	color: #fff !important;
	background: var(--inplug-flow-accent) !important;
	border: 0 !important;
	border-radius: 10px !important;
	cursor: pointer;
}

.inplug-co .inplug-co-edit {
	flex-shrink: 0;
	padding: 0 !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	color: var(--inplug-flow-accent) !important;
	text-decoration: underline;
	background: none !important;
	border: 0 !important;
	cursor: pointer;
}

/* Fjern vare fra bestillingen */
.inplug-co-item {
	position: relative;
}

.inplug-co .inplug-co-remove {
	grid-column: 2;
	justify-self: start;
	margin: -4px 0 0;
	padding: 0 !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	color: #6b6b6b !important;
	text-decoration: underline;
	background: none !important;
	border: 0 !important;
	cursor: pointer;
}

.inplug-co .inplug-co-remove:hover {
	color: #c62828 !important;
}

.inplug-co .inplug-co-remove:disabled {
	cursor: wait;
	opacity: 0.6;
}

@media (max-width: 959px) {
	.inplug-co .inplug-co-remove {
		grid-column: 2 / 4;
	}
}

/* Trinn 2 «Din bestilling»: oppsummeringen er hovedinnholdet, i en smalere, sentrert kolonne. */
.inplug-co-order-only {
	display: none;
}

.inplug-co[data-step="2"] .inplug-co-order-only {
	display: block;
}

.inplug-co[data-step="2"] .inplug-co-grid {
	grid-template-columns: minmax(0, 760px);
	justify-content: center;
}

.inplug-co[data-step="2"] form.inplug-co-main {
	display: none;
}

.inplug-co[data-step="2"] .inplug-co-aside {
	position: static;
	order: 0;
}

.inplug-co[data-step="2"] .inplug-co-summary > summary {
	display: none;
}

.inplug-co[data-step="2"] .inplug-co-summary > .woocommerce-checkout-review-order {
	padding-top: 20px;
}

.inplug-co-order-actions {
	display: none;
}

.inplug-co[data-step="2"] .inplug-co-order-actions {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 12px;
}

.inplug-co-order-actions .inplug-co-edit {
	align-self: center;
}

.inplug-co[data-step="2"] .inplug-co-heading.inplug-co-order-only {
	display: flex;
}