/* =============================================================================
 * IPTVV.NL - WooCommerce checkout / cart / account skin
 * The site header & footer are now the real gk-header / gk-footer (rendered via
 * the child header.php / footer.php), so this file only styles the page BODY to
 * match the premium brand look. Scope: enqueued only on WooCommerce pages.
 * ========================================================================== */
:root{
	--gk-blue:#3A8488;
	--gk-blue-ink:#2f6d70;
	--gk-gold:#D7BF95;
	--gk-ink:#0D1F2C;
	--gk-muted:#5c6b74;
	--gk-line:#e4eaed;
	--gk-bg:#f3f7f7;
	--gk-card:#ffffff;
}

/* --- Page canvas --- */
.woocommerce-checkout,
.woocommerce-cart,
.woocommerce-account{ background:var(--gk-bg); }

.woocommerce-checkout #content .ast-container,
.woocommerce-cart #content .ast-container,
.woocommerce-account #content .ast-container{
	max-width:1180px;
	margin-inline:auto;
	padding:54px 22px 90px;
}

/* --- Page title: branded, with an eyebrow rule --- */
.woocommerce-checkout .entry-header,
.woocommerce-cart .entry-header,
.woocommerce-account .entry-header{ margin-bottom:26px; }
.woocommerce-checkout .entry-title,
.woocommerce-cart .entry-title,
.woocommerce-account .entry-title{
	font-size:clamp(28px,4vw,40px);
	font-weight:800;
	letter-spacing:-.01em;
	color:var(--gk-ink);
	margin:0;
}
.woocommerce-checkout .entry-title::after,
.woocommerce-cart .entry-title::after{
	content:"";
	display:block;
	width:54px;height:4px;border-radius:4px;
	background:var(--gk-blue);
	margin-top:14px;
}

/* --- Coupon / notices --- */
.woocommerce-checkout .woocommerce-form-coupon-toggle,
.woocommerce .woocommerce-info{
	background:#eef5f5;
	border-top:3px solid var(--gk-blue);
	border-radius:10px;
	color:var(--gk-ink);
}
.woocommerce .woocommerce-message{ border-top-color:var(--gk-blue)!important; border-radius:10px; }
.woocommerce-info a,.woocommerce a:not(.button){ color:var(--gk-blue); }

/* --- Two-column checkout: billing left, order summary (sticky card) right --- */
.woocommerce-checkout form.checkout.woocommerce-checkout{ margin:0; }
@media (min-width:880px){
	.woocommerce-checkout form.checkout.woocommerce-checkout{
		display:grid;
		grid-template-columns:minmax(0,1.4fr) minmax(330px,0.9fr);
		column-gap:40px;
	}
	.woocommerce-checkout #customer_details{ grid-column:1; grid-row:1 / span 2; }
	.woocommerce-checkout #order_review_heading{ grid-column:2; grid-row:1; }
	.woocommerce-checkout #order_review{ grid-column:2; grid-row:2; position:sticky; top:24px; }
}

/* --- Cards --- */
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review,
.woocommerce-cart .cart-collaterals .cart_totals,
.woocommerce .woocommerce-order,
.woocommerce-account .woocommerce-MyAccount-content{
	background:var(--gk-card);
	border:1px solid var(--gk-line);
	border-radius:16px;
	padding:26px 26px;
	box-shadow:0 1px 2px rgba(13,31,44,.04),0 10px 30px rgba(13,31,44,.05);
}
/* Fill the grid cells: override Astra's float + 48% width on the columns. */
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review,
.woocommerce-checkout #order_review_heading{ float:none!important; width:100%!important; }
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2{ float:none!important; width:100%!important; }
.woocommerce-checkout #customer_details .col-2{ margin-top:22px; }

/* section headings inside cards */
.woocommerce-checkout h3#order_review_heading{
	font-size:20px;font-weight:800;color:var(--gk-ink);margin:0 0 14px;
	border:0!important;background:transparent!important;padding:0;box-shadow:none;
}
.woocommerce-checkout #order_review{ border:1px solid var(--gk-line)!important; }
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-additional-fields h3,
.woocommerce-checkout #customer_details h3{
	font-size:19px;font-weight:800;color:var(--gk-ink);
	margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--gk-line);
}

/* --- Form fields --- */
.woocommerce form .form-row label{ font-weight:600;color:var(--gk-ink);font-size:14px;margin-bottom:6px; }
.woocommerce form .form-row{ margin:0 0 16px; padding:0; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container--default .select2-selection--single,
.woocommerce #order_comments{
	width:100%;
	border:1px solid #cdd8dc;
	border-radius:10px;
	padding:12px 14px;
	min-height:48px;
	font-size:15px;
	background:#fff;
	box-shadow:none;
	transition:border-color .15s,box-shadow .15s;
}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered{ line-height:24px;padding:0; }
.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow{ top:10px; }
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce .select2-container--default.select2-container--focus .select2-selection--single,
.woocommerce .select2-container--default.select2-container--open .select2-selection--single{
	border-color:var(--gk-blue);
	outline:none;
	box-shadow:0 0 0 3px rgba(58,132,136,.16);
}
.woocommerce form .form-row .required{ color:var(--gk-blue);text-decoration:none; }

/* --- Order review table --- */
.woocommerce-checkout #order_review table.shop_table{ border:0;margin:0; }
.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td{
	border-top:1px solid var(--gk-line);padding:14px 0;color:var(--gk-ink);
}
.woocommerce-checkout #order_review table.shop_table thead th{ border:0;padding-top:0;color:var(--gk-muted);font-size:13px;text-transform:uppercase;letter-spacing:.04em; }
.woocommerce-checkout #order_review .order-total th,
.woocommerce-checkout #order_review .order-total td{ font-size:19px;font-weight:800; }
.woocommerce-checkout #order_review .cart_item td{ font-size:15px; }

/* --- Payment box --- */
.woocommerce-checkout #payment{
	background:#f7fafa;border:1px solid var(--gk-line);border-radius:12px;margin-top:8px;
}
.woocommerce-checkout #payment ul.payment_methods{ border:0;padding:18px 18px 4px; }
.woocommerce-checkout #payment div.payment_box{ background:#eef5f5;color:var(--gk-muted);border-radius:8px; }
.woocommerce-checkout #payment div.payment_box::before{ border-bottom-color:#eef5f5; }
.woocommerce-checkout #payment .place-order{ padding:8px 18px 20px; }
.woocommerce-checkout #payment .woocommerce-privacy-policy-text{ padding:0 18px;font-size:13px;color:var(--gk-muted); }

/* --- Buttons: brand teal pill --- */
#place_order,
.woocommerce #payment #place_order,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button{
	background:var(--gk-blue);
	border:1px solid var(--gk-blue);
	color:#fff;
	border-radius:999px;
	font-weight:700;
	font-size:16px;
	padding:15px 26px;
	width:100%;
	box-shadow:0 8px 20px rgba(58,132,136,.25);
	transition:background .15s,transform .05s;
	text-transform:none;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
#place_order{ width:100%; }
#place_order:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover{ background:var(--gk-blue-ink);border-color:var(--gk-blue-ink); }
#place_order:active{ transform:translateY(1px); }

/* --- Trust line under the order summary --- */
.woocommerce-checkout #order_review::after{
	content:"🔒  Veilig afrekenen · iDEAL · Direct geactiveerd · Geen contract";
	display:block;
	margin-top:16px;
	padding-top:16px;
	border-top:1px solid var(--gk-line);
	font-size:13px;
	color:var(--gk-muted);
	text-align:center;
	line-height:1.5;
}

/* --- Headings on cart/account --- */
.woocommerce h1,.woocommerce h2,.woocommerce h3{ color:var(--gk-ink); }

/* --- Login / account forms get the card + field treatment too --- */
.woocommerce-account .woocommerce form.login,
.woocommerce-account .woocommerce form.register{
	background:var(--gk-card);border:1px solid var(--gk-line);border-radius:16px;padding:26px;
	box-shadow:0 10px 30px rgba(13,31,44,.05);
}

/* ===== 2026-10-25 checkout polish ===== */
/* Coupon toggle: a quiet dashed affordance instead of a loud teal bar */
.woocommerce-checkout .woocommerce-form-coupon-toggle{
	background:#fff!important;border:1px dashed #cdd8dc!important;border-radius:10px!important;margin-bottom:22px;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info{
	background:transparent!important;border:0!important;padding:13px 18px!important;margin:0!important;
	color:var(--gk-muted)!important;font-size:14px;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before{ display:none!important; }
form.checkout_coupon.woocommerce-form-coupon{ border:1px solid var(--gk-line)!important;border-radius:12px;background:#fff;padding:22px!important;margin-bottom:22px; }
/* Totaal: brand emphasis + stronger divider */
.woocommerce-checkout #order_review .order-total th,
.woocommerce-checkout #order_review .order-total td{ border-top:2px solid var(--gk-line)!important; }
.woocommerce-checkout #order_review .order-total td .woocommerce-Price-amount{ color:var(--gk-blue-ink); }
/* Optional-field hint muted */
.woocommerce form .form-row label .optional{ color:var(--gk-muted);font-weight:400; }
/* Mobile: comfortable spacing between stacked cards */
@media (max-width:781px){ .woocommerce-checkout #order_review_heading{ margin-top:24px; } }

/* ===== checkout design pass 2 (2026-10-25) ===== */
/* Reassuring intro + trust pills above the form */
.gk-co-intro{ margin:0 0 24px; }
.gk-co-intro__lead{ font-size:16px; line-height:1.6; color:var(--gk-muted); margin:0 0 16px; max-width:72ch; }
.gk-co-intro__lead strong{ color:var(--gk-ink); }
.gk-co-pills{ list-style:none; display:flex; flex-wrap:wrap; gap:10px; margin:0; padding:0; }
.gk-co-pills li{ display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--gk-line); border-radius:999px; padding:8px 15px; font:600 13.5px/1 'Inter',sans-serif; color:var(--gk-blue-ink); box-shadow:0 1px 2px rgba(13,31,44,.04); }
.gk-co-pills li::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--gk-blue); flex:none; }

/* "Inclusief" value recap in the order summary */
.gk-co-incl{ margin:18px 0 2px; padding:18px 0 2px; border-top:1px solid var(--gk-line); }
.gk-co-incl__t{ margin:0 0 12px; font:700 12px/1 'Inter',sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--gk-muted); }
.gk-co-incl__list{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.gk-co-incl__list li{ position:relative; padding-left:28px; font-size:14.5px; color:#30363d; line-height:1.4; }
.gk-co-incl__list li::before{ content:""; position:absolute; left:6px; top:2px; width:6px; height:11px; border:solid var(--gk-blue); border-width:0 2px 2px 0; transform:rotate(45deg); }

/* Totaal: subtle teal highlight strip */
.woocommerce-checkout #order_review .order-total th,
.woocommerce-checkout #order_review .order-total td{ background:rgba(58,132,136,.06); padding-top:16px!important; padding-bottom:16px!important; }
.woocommerce-checkout #order_review .order-total th{ border-radius:10px 0 0 10px; padding-left:14px!important; }
.woocommerce-checkout #order_review .order-total td{ border-radius:0 10px 10px 0; padding-right:14px!important; }

/* Order summary heading: branded eyebrow feel */
.woocommerce-checkout h3#order_review_heading{ font-size:20px; font-weight:800; margin-bottom:16px; }

/* Security note under the summary (replaces the generic trust line; pills cover value now) */
.woocommerce-checkout #order_review::after{ content:"🔒  Beveiligde betaling · je gegevens worden versleuteld verzonden"; }

/* Payment box: cleaner, lighter */
.woocommerce-checkout #payment{ background:#fff; }
.woocommerce-checkout #payment ul.payment_methods{ padding:4px 0 0; border:0; }
.woocommerce-checkout #payment div.payment_box{ background:#f3f8f8; margin-top:10px; font-size:13.5px; }
