/* ==========================================================================
   Darkul Fashion — checkout.css (cart, checkout, my account, order tracking)
   Replaces WooCommerce's own stylesheets, which the theme disables.
   ========================================================================== */

/* ---------- Form fields ---------- */

.woocommerce form .form-row,
.d-track .form-row {
	margin: 0 0 14px;
}

.woocommerce form .form-row label,
.d-track .form-row label {
	display: block;
	margin-bottom: 6px;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--c-ink);
}

.woocommerce form .form-row .required {
	color: var(--c-sale);
	text-decoration: none;
}

.woocommerce form .form-row .optional {
	display: none;
}

.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
	width: 100%;
	min-height: 50px;
	padding: 12px 14px;
	border: 1.5px solid var(--c-line);
	border-radius: var(--radius-sm);
	background: var(--c-white);
	font-size: 1rem; /* 16px avoids iOS zoom on focus */
}

.woocommerce form .form-row select {
	padding-right: 36px;
	height: 50px;
}

.woocommerce form .form-row textarea {
	min-height: 90px;
}

.input-text:focus,
.woocommerce form .form-row select:focus {
	outline: none;
	border-color: var(--c-ink);
}

.woocommerce form .form-row.woocommerce-invalid .input-text,
.woocommerce form .form-row.woocommerce-invalid select {
	border-color: var(--c-sale);
}

.checkout-inline-error-message {
	display: flex;
	gap: 6px;
	align-items: flex-start;
	margin: 6px 0 0;
	color: var(--c-sale-ink);
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.4;
}

.checkout-inline-error-message::before {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	margin-top: 1px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E") center / contain no-repeat;
}

.woocommerce form .form-row.woocommerce-validated .input-text {
	border-color: var(--c-success);
}

.woocommerce-input-wrapper {
	display: block;
}

.form-row-first,
.form-row-last {
	width: 100%;
}

@media (min-width: 768px) {
	.col2-set .form-row-first,
	.col2-set .form-row-last {
		display: inline-block;
		width: calc(50% - 8px);
		vertical-align: top;
	}

	.col2-set .form-row-first {
		margin-right: 12px;
	}
}

.woocommerce-form__label-for-checkbox {
	display: flex !important;
	align-items: center;
	gap: 8px;
	font-weight: 400 !important;
}

/* Country is fixed to Bangladesh: WooCommerce prints it as text. */
#billing_country_field {
	display: none;
}

/* ---------- Tables ---------- */

.shop_table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95rem;
}

.shop_table th,
.shop_table td {
	padding: 14px 10px;
	border-bottom: 1px solid var(--c-line);
	text-align: left;
	vertical-align: middle;
}

.shop_table thead th {
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--c-muted);
}

/* ---------- Cart ---------- */

.woocommerce-cart .woocommerce {
	display: grid;
	gap: 24px;
}

@media (min-width: 1024px) {
	.woocommerce-cart .woocommerce {
		grid-template-columns: minmax(0, 1fr) 380px;
		align-items: start;
	}

	.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper,
	.woocommerce-cart .woocommerce > .cross-sells {
		grid-column: 1 / -1;
	}
}

.woocommerce-cart-form .product-thumbnail img {
	width: 72px;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	border-radius: var(--radius-sm);
}

.woocommerce-cart-form .product-name a {
	font-weight: 600;
	text-decoration: none;
}

.woocommerce-cart-form .variation {
	display: flex;
	flex-wrap: wrap;
	gap: 0 6px;
	margin: 4px 0 0;
	font-size: 0.85rem;
	color: var(--c-muted);
}

.woocommerce-cart-form .variation dd,
.woocommerce-cart-form .variation p {
	margin: 0;
}

.woocommerce-cart-form .product-remove a {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	font-size: 0; /* WooCommerce prints "×"; draw a proper icon instead */
	text-decoration: none;
	color: var(--c-muted);
}

.woocommerce-cart-form .product-remove a::before {
	content: "";
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3'/%3E%3C/svg%3E") center / contain no-repeat;
}

.woocommerce-cart-form .product-remove a:hover {
	background: var(--c-sale-tint);
	color: var(--c-sale);
}

.woocommerce-cart-form .quantity .qty {
	width: 72px;
	height: 44px;
	border: 1.5px solid var(--c-line);
	border-radius: var(--radius-sm);
	text-align: center;
}

.woocommerce-cart-form .actions {
	padding-top: 16px;
}

.woocommerce-cart-form .coupon {
	display: flex;
	gap: 8px;
	margin-bottom: 12px;
}

.woocommerce-cart-form .coupon .input-text {
	min-height: 44px;
	max-width: 220px;
}

.woocommerce-cart-form button[name="update_cart"] {
	background: var(--c-white);
	color: var(--c-ink);
	border-color: var(--c-line);
}

/* Responsive cart table (replaces woocommerce-smallscreen.css) */
@media (max-width: 767px) {
	.woocommerce-cart-form .shop_table_responsive thead {
		display: none;
	}

	.woocommerce-cart-form .shop_table_responsive tr {
		display: grid;
		grid-template-columns: 80px 1fr auto;
		gap: 4px 12px;
		padding: 14px 0;
		border-bottom: 1px solid var(--c-line);
	}

	.woocommerce-cart-form .shop_table_responsive td {
		padding: 0;
		border: 0;
	}

	.woocommerce-cart-form td.product-name::before,
	.woocommerce-cart-form td.product-remove::before,
	.woocommerce-cart-form td.product-thumbnail::before {
		display: none;
	}

	.woocommerce-cart-form .product-thumbnail {
		grid-row: 1 / span 4;
	}

	.woocommerce-cart-form .product-remove {
		grid-column: 3;
		grid-row: 1;
	}

	.woocommerce-cart-form .product-name {
		grid-column: 2;
		grid-row: 1;
	}

	.woocommerce-cart-form .product-price,
	.woocommerce-cart-form .product-quantity,
	.woocommerce-cart-form .product-subtotal {
		grid-column: 2 / -1;
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: 0.9rem;
	}

	.woocommerce-cart-form td[data-title]::before {
		content: attr(data-title);
		color: var(--c-muted);
	}

	.woocommerce-cart-form td.actions {
		grid-column: 1 / -1;
		display: block;
	}

	.woocommerce-cart-form td.actions::before {
		display: none;
	}
}

.cart-collaterals,
.woocommerce-checkout-review-order {
	padding: 20px;
	border-radius: var(--radius);
	background: var(--c-surface);
}

.cart_totals h2,
#order_review_heading {
	margin-bottom: 12px;
	font-size: 1.15rem;
}

.cart_totals .shop_table th,
.cart_totals .shop_table td {
	padding-inline: 0;
}

.cart_totals .shop_table th {
	width: 40%;
	padding-right: 16px;
}

.cart_totals .shop_table td {
	text-align: right;
}

.cart_totals .order-total,
.woocommerce-checkout-review-order-table .order-total {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--c-ink);
}

#shipping_method {
	list-style: none;
	margin: 0;
	padding: 0;
}

#shipping_method li {
	display: flex;
	align-items: center;
	gap: 6px;
}

.woocommerce-shipping-destination {
	margin: 4px 0 0;
	font-size: 0.8rem;
	color: var(--c-muted);
}

.wc-proceed-to-checkout {
	margin-top: 16px;
}

.checkout-button {
	display: flex;
	width: 100%;
	min-height: 56px;
	font-size: 1.1rem;
}

.cart-empty {
	justify-content: center;
	font-size: 1.1rem;
}

.return-to-shop {
	text-align: center;
}

.cross-sells > h2 {
	font-size: 1.2rem;
	margin-bottom: 16px;
}

/* ---------- Checkout ---------- */

.woocommerce-checkout form.checkout {
	display: grid;
	gap: 24px;
}

/* Cartline funnel steps lay out their own form (selector, fields, summary), so the two columns stay off them. */
@media (min-width: 1024px) {
	.woocommerce-checkout:not(.cartline-step) form.checkout {
		grid-template-columns: minmax(0, 1fr) 420px;
		align-items: start;
	}

	.woocommerce-checkout:not(.cartline-step) #order_review_heading {
		display: none;
	}

	.woocommerce-checkout:not(.cartline-step) #order_review {
		grid-column: 2;
		grid-row: 1 / span 3;
		position: sticky;
		top: calc(var(--header-h) + 60px);
	}

	/* Left column only: spanning both columns pushed it (and the fields) below the sticky summary. */
	.woocommerce-checkout:not(.cartline-step) form.checkout > .woocommerce-NoticeGroup {
		grid-column: 1;
	}
}

.woocommerce-checkout .col2-set {
	display: block;
}

.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3 {
	margin-bottom: 16px;
	font-size: 1.15rem;
}

.woocommerce-checkout .woocommerce-shipping-fields {
	display: none;
}

.woocommerce-form-coupon-toggle .woocommerce-info {
	background: var(--c-highlight);
	border-color: var(--c-accent-soft);
}

.showcoupon {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-weight: 600;
}

.checkout_coupon {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 20px;
}

.checkout_coupon p {
	margin: 0;
}

.checkout_coupon .form-row-first {
	flex: 1;
}

.checkout_coupon .clear {
	display: none;
}

.woocommerce-checkout-review-order-table .product-name {
	font-weight: 500;
}

.woocommerce-checkout-review-order-table .product-quantity {
	color: var(--c-muted);
}

.woocommerce-checkout-review-order-table .variation {
	margin: 2px 0 0;
	font-size: 0.85rem;
	color: var(--c-muted);
	font-weight: 400;
}

.woocommerce-checkout-review-order-table .variation dt,
.woocommerce-checkout-review-order-table .variation dd,
.woocommerce-checkout-review-order-table .variation p {
	display: inline;
	margin: 0;
}

#payment {
	margin-top: 16px;
}

#payment .payment_methods {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
}

#payment .payment_methods > li {
	padding: 14px;
	border: 1.5px solid var(--c-line);
	border-radius: var(--radius-sm);
	background: var(--c-white);
}

#payment .payment_methods > li + li {
	margin-top: 8px;
}

#payment .payment_methods label {
	font-weight: 600;
	cursor: pointer;
}

#payment .payment_box {
	margin-top: 8px;
	font-size: 0.9rem;
	color: var(--c-muted);
}

#payment .payment_box p {
	margin: 0;
}

.woocommerce-privacy-policy-text {
	font-size: 0.8rem;
	color: var(--c-muted);
}

#place_order {
	width: 100%;
	min-height: 58px;
	font-size: 1.15rem;
}

.blockUI.blockOverlay {
	background: rgb(255 255 255 / 0.6) !important;
}

/* Thank you */
.woocommerce-order {
	max-width: 760px;
}

.woocommerce-thankyou-order-received {
	padding: 20px;
	border-radius: var(--radius);
	background: var(--c-success-tint);
	color: var(--c-success);
	font-size: 1.2rem;
	font-weight: 700;
}

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

.woocommerce-order-overview li {
	padding: 12px;
	border: 1px solid var(--c-line);
	border-radius: var(--radius-sm);
	font-size: 0.85rem;
	color: var(--c-muted);
}

.woocommerce-order-overview strong {
	display: block;
	margin-top: 4px;
	font-size: 1rem;
	color: var(--c-ink);
}

.d-thankyou-track {
	margin: 16px 0 24px;
}

/* ---------- My account ---------- */

.woocommerce-account .woocommerce {
	display: grid;
	gap: 24px;
}

@media (min-width: 1024px) {
	.woocommerce-account.logged-in .woocommerce {
		grid-template-columns: 240px minmax(0, 1fr);
		align-items: start;
	}
}

.woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}

@media (min-width: 1024px) {
	.woocommerce-MyAccount-navigation ul {
		flex-direction: column;
	}
}

.woocommerce-MyAccount-navigation a {
	display: block;
	padding: 10px 14px;
	border-radius: var(--radius-sm);
	text-decoration: none;
	font-weight: 500;
	background: var(--c-surface);
}

.woocommerce-MyAccount-navigation .is-active a {
	background: var(--c-ink);
	color: var(--c-white);
}

.woocommerce-form-login,
.woocommerce-form-register {
	max-width: 440px;
	padding: 24px;
	border: 1px solid var(--c-line);
	border-radius: var(--radius);
}

.u-columns.col2-set {
	display: grid;
	gap: 24px;
}

@media (min-width: 768px) {
	.u-columns.col2-set {
		grid-template-columns: 1fr 1fr;
	}
}

/* ---------- Order tracking ---------- */

.d-track {
	max-width: 560px;
}

.d-track__form {
	padding: 24px;
	margin-bottom: 20px;
	border: 1px solid var(--c-line);
	border-radius: var(--radius);
}

.d-track__result {
	padding: 24px;
	border-radius: var(--radius);
	background: var(--c-surface);
}

.d-track__head {
	display: flex;
	align-items: start;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 24px;
}

.d-track__head h2 {
	margin: 0 0 4px;
	font-size: 1.25rem;
}

.d-track__head p {
	margin: 0;
	color: var(--c-muted);
	font-size: 0.9rem;
}

.d-track__status {
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--c-ink);
	color: var(--c-white);
	font-size: 0.85rem;
	font-weight: 600;
	white-space: nowrap;
}

.d-track__status--completed {
	background: var(--c-success);
}

.d-track__status--cancelled,
.d-track__status--failed,
.d-track__status--refunded {
	background: var(--c-sale);
}

.d-timeline {
	display: grid;
	grid-auto-columns: minmax(0, 1fr);
	grid-auto-flow: column;
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
	counter-reset: step;
}

.d-timeline__step {
	position: relative;
	text-align: center;
	font-size: 0.85rem;
	color: var(--c-muted);
}

.d-timeline__step::before {
	content: "";
	position: absolute;
	top: 11px;
	left: -50%;
	width: 100%;
	height: 3px;
	background: var(--c-line);
}

.d-timeline__step:first-child::before {
	display: none;
}

.d-timeline__dot {
	position: relative;
	display: block;
	width: 24px;
	height: 24px;
	margin: 0 auto 8px;
	border: 3px solid var(--c-line);
	border-radius: 50%;
	background: var(--c-white);
}

.d-timeline__step.is-done,
.d-timeline__step.is-current {
	color: var(--c-ink);
	font-weight: 600;
}

.d-timeline__step.is-done::before,
.d-timeline__step.is-current::before {
	background: var(--c-success);
}

.d-timeline__step.is-done .d-timeline__dot {
	border-color: var(--c-success);
	background: var(--c-success);
}

.d-timeline__step.is-current .d-timeline__dot {
	border-color: var(--c-cta);
	background: var(--c-cta);
	box-shadow: 0 0 0 5px var(--c-accent-soft);
}

.d-track__cancelled {
	color: var(--c-sale);
	font-weight: 600;
}

.d-track__items {
	margin: 0;
	padding: 16px 0 0;
	list-style: none;
	border-top: 1px solid var(--c-line);
}

.d-track__items li {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 4px 0;
	font-size: 0.92rem;
}

/* ---------- Delivery area (checkout) ---------- */

.delivery-area {
	margin-top: 4px;
}

.delivery-area__label {
	margin: 0 0 8px;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--c-ink);
}

.delivery-area__label .required {
	color: var(--c-sale);
	text-decoration: none;
}

.delivery-area__options {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.delivery-option {
	position: relative;
	cursor: pointer;
}

.delivery-option input {
	position: absolute;
	opacity: 0;
	inset: 0;
	margin: 0;
	cursor: pointer;
}

.delivery-option__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	height: 100%;
	padding: 14px 14px 14px 44px;
	border: 2px solid var(--c-line);
	border-radius: var(--radius);
	background: var(--c-white);
	transition: border-color 0.15s, background-color 0.15s;
}

.delivery-option__body::before {
	content: "";
	position: absolute;
	top: 16px;
	left: 14px;
	width: 20px;
	height: 20px;
	border: 2px solid var(--c-line);
	border-radius: 50%;
	background: var(--c-white);
	transition: border 0.15s;
}

.delivery-option__name {
	font-weight: 700;
	color: var(--c-ink);
}

.delivery-option__price {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--c-cta);
}

.delivery-option:hover .delivery-option__body {
	border-color: var(--c-ink);
}

.delivery-option input:checked + .delivery-option__body {
	border-color: var(--c-cta);
	background: var(--c-highlight);
}

.delivery-option input:checked + .delivery-option__body::before {
	border: 6px solid var(--c-cta);
}

.delivery-option input:focus-visible + .delivery-option__body {
	outline: 2px solid var(--c-cta);
	outline-offset: 2px;
}

.delivery-area.is-invalid .delivery-option__body {
	border-color: var(--c-sale);
	animation: shake 0.3s;
}

/* The buttons above replace WooCommerce's radios; the order table only shows the picked rate. */
.has-delivery-area #shipping_method input {
	display: none;
}

.has-delivery-area #shipping_method li:not(:has(input:checked)) {
	display: none;
}

.has-delivery-area.delivery-pending .woocommerce-shipping-totals td > *,
.has-delivery-area.delivery-pending .order-total td > * {
	display: none;
}

.has-delivery-area.delivery-pending .woocommerce-shipping-totals td::after,
.has-delivery-area.delivery-pending .order-total td::after {
	content: attr(data-pending);
	font-size: 0.85rem;
	color: var(--c-cta);
	font-weight: 600;
}

/* ---------- Password show/hide (WooCommerce adds the button; its CSS is disabled) ---------- */

.password-input {
	position: relative;
	display: block;
}

.password-input .input-text {
	padding-right: 52px;
}

.show-password-input {
	position: absolute;
	top: 50%;
	right: 3px;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: var(--radius-sm);
	background: none;
	color: var(--c-muted);
	transform: translateY(-50%);
	cursor: pointer;
}

.show-password-input::before {
	content: "";
	width: 20px;
	height: 20px;
	background: currentColor;
	-webkit-mask: var(--eye) center / contain no-repeat;
	mask: var(--eye) center / contain no-repeat;
	--eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.show-password-input.display-password::before {
	--eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3l18 18M10.6 5.1A10.4 10.4 0 0 1 12 5c6.5 0 10 7 10 7a17 17 0 0 1-3.2 4.1M6.6 6.6A17 17 0 0 0 2 12s3.5 7 10 7a9.7 9.7 0 0 0 5.4-1.6M9.9 9.9a3 3 0 0 0 4.2 4.2'/%3E%3C/svg%3E");
}

.show-password-input:hover {
	color: var(--c-ink);
}