/* ===========================================================================
   Yakuza — WooCommerce cart / checkout / account styling
   The Cart & Checkout pages use WooCommerce blocks. They render inside the
   theme's narrow article container, so the main fixes are: give them room,
   match the brand, and stay clean on mobile (mobile-first).
   =========================================================================== */

/* --- Give the block cart/checkout/account room (they are alignwide) -------- */
.woocommerce-cart .yk-content,
.woocommerce-checkout .yk-content,
.woocommerce-account .yk-content {
	max-width: 1140px;
}
/* The order-confirmation / thank-you page reads better a touch narrower. */
.woocommerce-order-received .yk-content {
	max-width: 880px;
}

/* Let alignwide/alignfull blocks actually use the width on these pages. */
.woocommerce-cart .yk-content .alignwide,
.woocommerce-checkout .yk-content .alignwide {
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}

/* Never let a block table cause a horizontal scrollbar on small screens. */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	max-width: 100%;
	overflow-x: hidden;
}

/* --- Brand the primary buttons (Proceed to checkout / Place order) --------- */
.wc-block-cart__submit-button,
.wc-block-components-button.contained {
	background: var(--brand) !important;
	border-radius: 999px !important;
	font-weight: 600;
	min-height: 48px;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-button.contained:hover {
	background: #0b756e !important;
}

/* Secondary "apply coupon" / outline buttons: brand outline. */
.wc-block-components-button.outlined {
	border-radius: 999px !important;
}

/* --- Inputs / selects to match the theme ---------------------------------- */
.wc-block-components-text-input input,
.wc-block-components-select .wc-block-components-select__container,
.wc-block-components-quantity-selector,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select {
	border-radius: 10px;
}
.wc-block-components-text-input.is-active input,
.wc-block-components-text-input input:focus {
	border-color: var(--brand);
	box-shadow: 0 0 0 1px var(--brand);
}

/* --- Totals / order summary card ------------------------------------------ */
.wc-block-components-totals-item__value,
.wc-block-components-order-summary-item__total-price {
	font-weight: 700;
}
.wc-block-components-sidebar,
.wc-block-cart__sidebar .wc-block-components-totals-wrapper {
	border-radius: 16px;
}

/* The booking deposit "Pick up or ship" note we inject into the block cart. */
.yevb-cart-fulfilment {
	max-width: 100%;
}

/* --- Mobile-first: comfortable spacing, stacked layout -------------------- */
@media (max-width: 781px) {
	.woocommerce-cart .yk-content,
	.woocommerce-checkout .yk-content,
	.woocommerce-account .yk-content {
		padding-left: 4px;
		padding-right: 4px;
	}
	/* WooCommerce blocks already switch to a single column here; just make sure
	   buttons are full-width and tappable. */
	.wc-block-cart__submit-button,
	.wc-block-components-button.contained {
		width: 100%;
	}
	/* My Account tabs scroll horizontally instead of wrapping awkwardly. */
	.woocommerce-account .woocommerce-MyAccount-navigation ul {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		gap: 6px;
		-webkit-overflow-scrolling: touch;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation li {
		flex: 0 0 auto;
	}
}

/* ------------------------------------------------------------------------- */
/* Batch 1 additions                                                         */
/* ------------------------------------------------------------------------- */

/* Primary button label always white (Proceed to checkout / Place order). */
.wc-block-cart__submit-button,
.wc-block-components-button.contained,
.wc-block-cart__submit-button *,
.wc-block-components-button.contained * {
	color: #fff !important;
}

/* Booking deposit (₹999) is NOT a discount: hide the auto "Save ₹X" badge and
   the struck-through full price in cart + checkout so no saving is implied.
   The balance is collected later. */
.woocommerce-cart .wc-block-components-sale-badge,
.woocommerce-checkout .wc-block-components-sale-badge,
.wp-block-woocommerce-cart .wc-block-components-sale-badge,
.wp-block-woocommerce-checkout .wc-block-components-sale-badge,
.woocommerce-cart .wc-block-components-product-price__regular,
.woocommerce-checkout .wc-block-components-product-price__regular,
.wp-block-woocommerce-cart .wc-block-components-product-price__regular,
.wp-block-woocommerce-checkout .wc-block-components-product-price__regular,
.woocommerce-cart .wc-block-components-product-price del,
.woocommerce-checkout .wc-block-components-product-price del {
	display: none !important;
}

/* ========================================================================= */
/* Batch 2 — Login / Register / My Account redesign (mobile-first)           */
/* ========================================================================= */

/* Give account pages room + center the card. */
.woocommerce-account .yk-content,
.woocommerce-account .yk-content .alignwide {
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

/* ---------------------------------------------------- Auth (login/register) */
.yk-auth {
	display: grid;
	grid-template-columns: 1fr;
	max-width: 1040px;
	margin: 22px auto 40px;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: 24px;
	overflow: hidden;
	box-shadow: 0 40px 90px -60px rgba(6, 48, 45, .55);
}

/* Brand hero panel */
.yk-auth-hero {
	background: linear-gradient(158deg, var(--brand-deep) 0%, #0a5751 55%, var(--brand) 130%);
	color: #fff;
	position: relative;
	overflow: hidden;
}
.yk-auth-hero::before {
	content: "";
	position: absolute;
	width: 75%;
	aspect-ratio: 1;
	right: -22%;
	top: -18%;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(22, 179, 167, .45), transparent 62%);
	filter: blur(30px);
}
.yk-auth-hero-in {
	position: relative;
	z-index: 1;
	padding: 30px 28px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	height: 100%;
}
.yk-auth-brand {
	font-family: "Sora", sans-serif;
	font-weight: 800;
	font-size: 20px;
	letter-spacing: -.02em;
	color: #fff;
	text-decoration: none;
}
.yk-auth-tit {
	font-family: "Sora", sans-serif;
	font-weight: 700;
	font-size: clamp(24px, 5vw, 30px);
	line-height: 1.12;
	letter-spacing: -.02em;
	margin: 6px 0 0;
	color: #fff;
}
.yk-auth-sub {
	color: #CFF3EE;
	font-size: 14.5px;
	line-height: 1.6;
	margin: 0;
	max-width: 40ch;
}
.yk-auth-points {
	list-style: none;
	margin: 4px 0 0;
	padding: 0;
	display: grid;
	gap: 10px;
}
.yk-auth-points li {
	position: relative;
	padding-left: 30px;
	font-size: 14px;
	color: #eafaf7;
	line-height: 1.4;
}
.yk-auth-points li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .16);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 12px;
}
.yk-auth-badge {
	margin-top: auto;
	padding-top: 18px;
	display: flex;
	align-items: baseline;
	gap: 10px;
	border-top: 1px solid rgba(255, 255, 255, .16);
}
.yk-auth-badge b {
	font-family: "Sora", sans-serif;
	font-weight: 800;
	font-size: 26px;
	letter-spacing: -.02em;
}
.yk-auth-badge span {
	font-size: 12.5px;
	color: #bfeae4;
}

/* Forms side */
.yk-auth-main {
	padding: 26px 24px 30px;
	display: flex;
	flex-direction: column;
}
.yk-auth-tabs {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4px;
	background: var(--soft-2);
	border-radius: 999px;
	padding: 4px;
	margin-bottom: 22px;
}
.yk-auth-tab {
	border: 0;
	background: transparent;
	border-radius: 999px;
	padding: 11px 10px;
	font-family: "Sora", sans-serif;
	font-weight: 600;
	font-size: 14px;
	color: var(--muted);
	transition: background .2s, color .2s, box-shadow .2s;
}
.yk-auth-tab.is-active {
	background: var(--paper);
	color: var(--brand-deep);
	box-shadow: 0 4px 12px -6px rgba(0, 0, 0, .35);
}
.yk-auth-head h1 {
	font-family: "Sora", sans-serif;
	font-weight: 700;
	font-size: clamp(22px, 5vw, 27px);
	letter-spacing: -.02em;
	margin: 0;
	color: var(--ink);
}
.yk-auth-head p {
	color: var(--muted);
	font-size: 14.5px;
	margin: 6px 0 20px;
}

/* Panel toggle */
.yk-auth[data-tab="login"] .yk-panel-register { display: none; }
.yk-auth[data-tab="register"] .yk-panel-login { display: none; }

/* Inputs inside auth */
.yk-auth .form-row,
.yk-auth .woocommerce-form-row {
	display: block;
	margin: 0 0 15px;
}
.yk-auth label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: 7px;
}
.yk-auth .required { color: var(--brand); border: 0; }
.yk-auth input[type="text"],
.yk-auth input[type="email"],
.yk-auth input[type="password"] {
	width: 100%;
	box-sizing: border-box;
	padding: 13px 15px;
	font-size: 15px;
	font-family: inherit;
	color: var(--ink);
	background: var(--soft);
	border: 1.5px solid var(--line);
	border-radius: 12px;
	transition: border-color .18s, background .18s, box-shadow .18s;
}
.yk-auth input:focus {
	outline: none;
	border-color: var(--brand);
	background: var(--paper);
	box-shadow: 0 0 0 4px var(--brand-soft);
}
.yk-auth-row-flex {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}
.yk-auth-row-flex label {
	margin: 0;
	font-weight: 500;
	color: var(--muted);
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.yk-auth-lost {
	font-size: 13.5px;
	color: var(--brand);
	text-decoration: none;
	font-weight: 600;
}
.yk-auth-lost:hover { text-decoration: underline; }
.yk-auth-submit {
	width: 100%;
	min-height: 52px;
	border: 0;
	border-radius: 999px !important;
	background: var(--brand) !important;
	color: #fff !important;
	font-family: "Sora", sans-serif;
	font-weight: 600;
	font-size: 15.5px;
	margin-top: 4px;
	cursor: pointer;
	transition: background .2s, box-shadow .2s, transform .05s;
	box-shadow: 0 14px 30px -14px var(--brand);
}
.yk-auth-submit:hover { background: #0b756e !important; }
.yk-auth-submit:active { transform: translateY(1px); }
.yk-auth .woocommerce-privacy-policy-text {
	font-size: 12.5px;
	color: var(--muted);
	margin: 4px 0 14px;
}

/* Desktop: two columns */
@media (min-width: 860px) {
	.yk-auth { grid-template-columns: 0.92fr 1.08fr; }
	.yk-auth-hero-in { padding: 44px 40px; }
	.yk-auth-main { padding: 44px 46px; justify-content: center; }
	.yk-auth--login-only { grid-template-columns: 0.92fr 1.08fr; }
}

/* ------------------------------------------------------- Logged-in account */
.yk-account {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin: 22px 0 40px;
}
@media (min-width: 820px) {
	.yk-account { grid-template-columns: 248px 1fr; gap: 34px; align-items: start; }
}

/* Navigation as a clean list (desktop) / scroll tabs (mobile) */
.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 8px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-bottom: 4px;
}
.woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
.woocommerce-MyAccount-navigation li { flex: 0 0 auto; }
.woocommerce-MyAccount-navigation li a {
	display: block;
	white-space: nowrap;
	padding: 11px 16px;
	border-radius: 999px;
	font-family: "Sora", sans-serif;
	font-weight: 600;
	font-size: 14px;
	color: var(--muted);
	text-decoration: none;
	background: var(--soft);
	border: 1px solid var(--line);
	transition: background .18s, color .18s, border-color .18s;
}
.woocommerce-MyAccount-navigation li a:hover { color: var(--brand-deep); border-color: var(--brand); }
.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--dashboard.is-active a {
	background: var(--brand);
	color: #fff;
	border-color: var(--brand);
}
@media (min-width: 820px) {
	.woocommerce-MyAccount-navigation { position: sticky; top: 90px; }
	.woocommerce-MyAccount-navigation ul { flex-direction: column; gap: 6px; overflow: visible; }
	.woocommerce-MyAccount-navigation li a { border-radius: 12px; }
}

/* Dashboard cards */
.yk-dash-hello h2 {
	font-family: "Sora", sans-serif;
	font-weight: 700;
	font-size: clamp(22px, 5vw, 28px);
	letter-spacing: -.02em;
	margin: 0;
	color: var(--ink);
}
.yk-dash-sub { color: var(--muted); font-size: 14px; margin: 6px 0 0; }
.yk-dash-sub a { color: var(--brand); text-decoration: none; font-weight: 600; }
.yk-dash-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	margin-top: 20px;
}
@media (min-width: 520px) { .yk-dash-grid { grid-template-columns: 1fr 1fr; } }
.yk-dash-card {
	display: block;
	padding: 20px;
	border: 1px solid var(--line);
	border-radius: 16px;
	background: var(--paper);
	text-decoration: none;
	transition: transform .2s, border-color .2s, box-shadow .2s;
}
.yk-dash-card:hover {
	transform: translateY(-3px);
	border-color: var(--brand);
	box-shadow: 0 22px 44px -30px rgba(6, 48, 45, .5);
}
.yk-dash-ic {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: var(--brand-soft);
	color: var(--brand);
	margin-bottom: 12px;
}
.yk-dash-card b {
	display: block;
	font-family: "Sora", sans-serif;
	font-weight: 700;
	font-size: 16px;
	color: var(--ink);
	letter-spacing: -.01em;
}
.yk-dash-card small { display: block; margin-top: 4px; font-size: 13px; color: var(--muted); line-height: 1.45; }
.yk-dash-card--brand {
	background: linear-gradient(150deg, var(--brand-deep), var(--brand));
	border-color: transparent;
}
.yk-dash-card--brand .yk-dash-ic { background: rgba(255, 255, 255, .18); color: #fff; }
.yk-dash-card--brand b { color: #fff; }
.yk-dash-card--brand small { color: #d6f3ef; }

/* Content polish */
.woocommerce-MyAccount-content { min-width: 0; }
.woocommerce-MyAccount-content .woocommerce-Address,
.woocommerce-MyAccount-content > .woocommerce-message,
.woocommerce-MyAccount-content form .woocommerce-Input {
	border-radius: 12px;
}
.woocommerce-account .woocommerce-MyAccount-content table.shop_table {
	border-radius: 14px;
	overflow: hidden;
	border-collapse: separate;
}