/* ============================================================
   CART PAGE — front-page (MushSkins) style
   Loaded only on is_cart() via functions.php (filemtime version,
   so it auto cache-busts). Body class: custom-cart-active.
   Markup comes from the custom WooCommerce templates
   (woocommerce/cart/cart.php / cart-totals.php / cart-empty.php)
   — all WC hooks/forms/nonces preserved; we ONLY restyle.
   Design system mirrors the home page:
     Accent #cde738 · dark bg #0c1202 · Bebas Neue / Inter ·
     strong rounding · glossy inset shadows · glow / noise.
   ============================================================ */

body.custom-cart-active {
	--ca-accent: #cde738;
	--ca-rgb: 205, 231, 54;
	--ca-warn: #ff7a45;
	--ca-bg: #0c1202;
	--ca-card: linear-gradient(180deg, rgba(20, 40, 12, .5), rgba(8, 16, 4, .85));
	--ca-title-gradient: radial-gradient(ellipse at 50% 50%, #fff152 0%, #cfe636 50%, #9edb1a 100%);
	--ca-card-shadow:
		inset 0px 0.361px 0.65px -1px rgba(255,255,255,0.19),
		inset 0px 1.373px 2.472px -2px rgba(255,255,255,0.18),
		inset 0px 6px 10.8px -3px rgba(255,255,255,0.13);
	--ca-btn-shadow:
		inset 0px 0.723px 1.879px -0.333px rgba(255,255,255,0.24),
		inset 0px 2.746px 7.14px -0.667px rgba(255,255,255,0.34),
		inset 0px 12px 31.2px -1px rgba(255,255,255,0.8);
}

/* ── Page background — home recipe (#0c1202 + green glow).
   background-image layers beat the global #111111 override. ── */
body.custom-cart-active {
	background-color: #0c1202 !important;
	background-image:
		radial-gradient(ellipse 120% 60% at 50% 12%, rgba(25, 62, 4, 0.7) 0%, transparent 62%),
		linear-gradient(#0c1202, #0c1202) !important;
	background-repeat: no-repeat !important;
}
body.custom-cart-active .site-content,
body.custom-cart-active .entry-content,
body.custom-cart-active #page,
body.custom-cart-active .page-wrapper { background: transparent !important; padding-top: 0; }
body.custom-cart-active .elementor,
body.custom-cart-active .elementor-section,
body.custom-cart-active .elementor-container { background: transparent !important; }

/* ══════════════════════════════════════════════════════════
   HERO — compact (title + description, no label, no 100vh)
══════════════════════════════════════════════════════════ */
.ca-hero {
	position: relative;
	overflow: hidden;
	padding: calc(var(--header-h, 80px) + clamp(36px, 5vw, 60px)) 0 clamp(28px, 4vw, 44px);
	text-align: center;
}
.ca-hero__glow {
	position: absolute;
	top: 0; left: 50%;
	transform: translateX(-50%);
	width: 720px; height: 300px; max-width: 92%;
	background: radial-gradient(ellipse at 50% 0%, rgba(var(--ca-rgb), .12) 0%, transparent 70%);
	pointer-events: none;
	z-index: 0;
}
.ca-hero .container { position: relative; z-index: 1; }
.ca-hero__title {
	font-family: 'Bebas Neue', sans-serif;
	font-size: clamp(44px, 7vw, 84px);
	font-weight: 400;
	line-height: 0.9;
	letter-spacing: -1px;
	text-transform: uppercase;
	margin: 0 0 14px;
	background: var(--ca-title-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.ca-hero__sub {
	font-family: 'Inter', sans-serif;
	font-size: clamp(14px, 1.6vw, 17px);
	color: rgba(255, 255, 255, .6);
	line-height: 1.6;
	max-width: 480px;
	margin: 0 auto;
}

/* ══════════════════════════════════════════════════════════
   LAYOUT — items left, totals right
══════════════════════════════════════════════════════════ */
.ca-main { padding-top: clamp(20px, 3vw, 36px); padding-bottom: clamp(56px, 8vw, 96px); }
.ca-layout {
	display: grid;
	grid-template-columns: 1fr 372px;
	gap: 24px;
	align-items: start;
}

.ca-items-hdr { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.ca-items-count {
	font-family: 'Inter', sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .4);
}

/* ── Cart item card ── */
.ca-item {
	display: grid;
	grid-template-columns: 92px 1fr 92px 116px 86px 40px;
	gap: 0 16px;
	align-items: center;
	background: var(--ca-card);
	border: 1px solid rgba(var(--ca-rgb), .1);
	border-radius: 20px;
	box-shadow: var(--ca-card-shadow);
	padding: 16px 20px;
	margin-bottom: 12px;
	transition: border-color .25s ease, box-shadow .25s ease;
}
.ca-item:hover {
	border-color: rgba(var(--ca-rgb), .3);
	box-shadow: var(--ca-card-shadow), 0 12px 36px rgba(0,0,0,.35), 0 0 22px rgba(var(--ca-rgb), .07);
}

/* Image */
.ca-item__img-wrap {
	width: 92px; height: 70px;
	background: rgba(255, 255, 255, .03);
	border-radius: 12px;
	display: flex; align-items: center; justify-content: center;
	overflow: hidden;
	flex-shrink: 0;
}
.ca-item__img-wrap img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ca-item__img-link { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; }

/* Name */
.ca-item__info { min-width: 0; }
.ca-item__name {
	font-family: 'Inter', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: rgba(255, 255, 255, .92);
	line-height: 1.35;
	margin-bottom: 4px;
}
.ca-item__name a { color: inherit; text-decoration: none; transition: color .15s ease; }
.ca-item__name a:hover { color: var(--ca-accent); }
.ca-item__backorder { font-size: 11px; color: var(--ca-warn); margin-top: 4px; }
.ca-item__price-mob { display: none; font-size: 13px; color: rgba(255, 255, 255, .5); margin-top: 6px; }

/* Unit price (desktop) */
.ca-item__price--desk { font-family: 'Inter', sans-serif; font-size: 14px; color: rgba(255, 255, 255, .55); text-align: right; }
.ca-item__price--desk .woocommerce-Price-amount,
.ca-item__price--desk bdi { font-size: inherit; color: inherit; }

/* Quantity */
.ca-item__qty { display: flex; justify-content: center; }
.ca-item__qty .quantity { display: flex; align-items: center; }
.ca-item__qty .qty {
	width: 64px !important;
	height: 40px !important;
	background: rgba(255, 255, 255, .05) !important;
	border: 1px solid rgba(255, 255, 255, .14) !important;
	border-radius: 12px !important;
	color: #fff !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 15px !important;
	text-align: center !important;
	padding: 0 8px !important;
	transition: border-color .2s ease, background .2s ease, box-shadow .2s ease !important;
	-moz-appearance: textfield !important;
	appearance: textfield !important;
}
.ca-item__qty .qty::-webkit-outer-spin-button,
.ca-item__qty .qty::-webkit-inner-spin-button { -webkit-appearance: none; }
.ca-item__qty .qty:focus {
	outline: none !important;
	border-color: var(--ca-accent) !important;
	background: rgba(var(--ca-rgb), .05) !important;
	box-shadow: 0 0 0 3px rgba(var(--ca-rgb), .1) !important;
}

/* Subtotal */
.ca-item__subtotal {
	font-family: 'Bebas Neue', sans-serif;
	font-size: 24px;
	letter-spacing: .01em;
	color: var(--ca-accent);
	text-align: right;
}
.ca-item__subtotal .woocommerce-Price-amount,
.ca-item__subtotal bdi { font-size: inherit; color: inherit; }

/* Remove */
.ca-item__remove { display: flex; align-items: center; justify-content: center; }
.ca-item__remove-btn {
	display: flex; align-items: center; justify-content: center;
	width: 34px; height: 34px;
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 999px;
	color: rgba(255, 255, 255, .35);
	text-decoration: none !important;
	transition: background .2s ease, color .2s ease, border-color .2s ease, transform .15s ease;
}
.ca-item__remove-btn:hover {
	background: rgba(255, 122, 69, .12);
	border-color: rgba(255, 122, 69, .45);
	color: var(--ca-warn);
	transform: scale(1.06);
}

/* ── Actions: coupon + update ── */
.ca-actions {
	display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
	margin-top: 18px; padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, .07);
}
.ca-coupon { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 240px; }
.ca-coupon__input {
	flex: 1;
	height: 44px;
	background: rgba(255, 255, 255, .05) !important;
	border: 1px solid rgba(255, 255, 255, .12) !important;
	border-radius: 999px !important;
	color: #fff !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 14px !important;
	padding: 0 20px !important;
	outline: none !important;
	transition: border-color .2s ease, background .2s ease !important;
}
.ca-coupon__input:focus { border-color: var(--ca-accent) !important; background: rgba(var(--ca-rgb), .05) !important; }
.ca-coupon__input::placeholder { color: rgba(255, 255, 255, .3) !important; }
.ca-coupon__btn {
	height: 44px;
	padding: 0 22px;
	background: rgba(var(--ca-rgb), .1);
	border: 1px solid rgba(var(--ca-rgb), .3);
	border-radius: 999px;
	color: var(--ca-accent);
	font-family: 'Bebas Neue', sans-serif;
	font-size: 17px;
	letter-spacing: .03em;
	text-transform: uppercase;
	cursor: pointer;
	white-space: nowrap;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.ca-coupon__btn:hover { background: var(--ca-accent); color: #000; border-color: var(--ca-accent); }

/* Update cart — ghost pill */
.ca-update-btn {
	display: inline-flex; align-items: center; gap: 8px;
	height: 44px; padding: 0 22px;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 999px;
	color: rgba(255, 255, 255, .55);
	font-family: 'Bebas Neue', sans-serif;
	font-size: 17px;
	letter-spacing: .03em;
	text-transform: uppercase;
	cursor: pointer;
	white-space: nowrap;
	transition: border-color .2s ease, color .2s ease, background .2s ease;
}
.ca-update-btn:hover { border-color: rgba(var(--ca-rgb), .4); color: #fff; background: rgba(var(--ca-rgb), .05); }
.ca-update-btn:disabled { opacity: .35; cursor: not-allowed; }

/* ══════════════════════════════════════════════════════════
   TOTALS — rounded glossy panel
══════════════════════════════════════════════════════════ */
.ca-totals-col { position: sticky; top: calc(var(--header-h, 80px) + 16px); }
.ca-totals-box {
	background:
		radial-gradient(ellipse at 100% 0%, rgba(var(--ca-rgb), .1) 0%, transparent 55%),
		var(--ca-card);
	border: 1px solid rgba(var(--ca-rgb), .16);
	border-radius: 28px;
	box-shadow: var(--ca-card-shadow);
	padding: 30px;
}
.ca-totals-title {
	font-family: 'Bebas Neue', sans-serif;
	font-size: 26px;
	letter-spacing: -.3px;
	text-transform: uppercase;
	color: #fff;
	margin-bottom: 22px;
}

.ca-totals-lines { display: flex; flex-direction: column; gap: 12px; }
.ca-totals-line { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.ca-totals-line__label { font-family: 'Inter', sans-serif; font-size: 13px; color: rgba(255, 255, 255, .5); }
.ca-totals-line__value { font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 600; color: rgba(255, 255, 255, .85); text-align: right; }
.ca-totals-line__value--green { color: var(--ca-accent) !important; }
.ca-totals-line .woocommerce-remove-coupon { font-size: 11px; color: rgba(255, 255, 255, .3); margin-left: 6px; text-decoration: none; }
.ca-totals-line .woocommerce-remove-coupon:hover { color: var(--ca-warn); }

/* WooCommerce shipping rows */
.ca-totals-box .shipping th,
.ca-totals-box .shipping td,
.ca-totals-box tr.shipping th,
.ca-totals-box tr.shipping td {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	font-size: 13px !important;
	color: rgba(255, 255, 255, .5) !important;
	display: flex; justify-content: space-between; width: 100%;
}
.ca-totals-box table.shop_table { display: flex; flex-direction: column; gap: 12px; width: 100%; }
.ca-totals-box table.shop_table tbody { display: contents; }
.ca-totals-box table.shop_table tr { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ca-totals-box table.shop_table th { font-family: 'Inter', sans-serif; font-size: 13px; color: rgba(255, 255, 255, .5); font-weight: 400; background: transparent; }
.ca-totals-box table.shop_table td { font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 600; color: rgba(255, 255, 255, .85); text-align: right; background: transparent; }

.ca-totals-divider { height: 1px; background: rgba(var(--ca-rgb), .14); margin: 18px 0; }

/* Grand total */
.ca-totals-total { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 22px; }
.ca-totals-total__label {
	font-family: 'Inter', sans-serif;
	font-size: 13px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase;
	color: rgba(255, 255, 255, .6);
}
.ca-totals-total__price {
	font-family: 'Bebas Neue', sans-serif;
	font-size: 42px;
	letter-spacing: -.5px;
	background: var(--ca-title-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.ca-totals-total__price .woocommerce-Price-amount,
.ca-totals-total__price bdi { font-size: inherit; background: inherit; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }

/* Checkout button (.checkout-button rendered by WC) — pill */
.ca-proceed .checkout-button,
.ca-proceed a.checkout-button {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	height: 60px !important;
	background: var(--ca-accent) !important;
	color: #000 !important;
	border: none !important;
	border-radius: 999px !important;
	clip-path: none !important;
	font-family: 'Bebas Neue', sans-serif !important;
	font-size: 26px !important;
	letter-spacing: .02em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	box-shadow: var(--ca-btn-shadow) !important;
	cursor: pointer !important;
	transition: transform .2s ease, filter .2s ease !important;
	margin-top: 4px !important;
}
.ca-proceed .checkout-button:hover,
.ca-proceed a.checkout-button:hover {
	transform: scale(1.02) !important;
	filter: brightness(1.04) drop-shadow(0 0 24px rgba(var(--ca-rgb), .45)) !important;
	color: #000 !important;
}
.ca-proceed .checkout-button:active,
.ca-proceed a.checkout-button:active { transform: scale(.98) !important; }

/* Trust badges */
.ca-totals-badges {
	display: flex; flex-direction: column; gap: 9px;
	margin-top: 22px; padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, .07);
}
.ca-totals-badge { display: flex; align-items: center; gap: 9px; font-family: 'Inter', sans-serif; font-size: 12px; color: rgba(255, 255, 255, .4); }
.ca-totals-badge svg { flex-shrink: 0; color: var(--ca-accent); }

/* ══════════════════════════════════════════════════════════
   WooCommerce notices on cart
══════════════════════════════════════════════════════════ */
.woocommerce-cart .woocommerce-error,
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info {
	background: rgba(255, 255, 255, .03) !important;
	border: 1px solid rgba(255, 255, 255, .1) !important;
	color: rgba(255, 255, 255, .78) !important;
	font-family: 'Inter', sans-serif !important;
	padding: 14px 18px !important;
	margin-bottom: 16px !important;
	list-style: none !important;
	border-radius: 14px !important;
}
.woocommerce-cart .woocommerce-error { border-left: 3px solid var(--ca-warn) !important; background: rgba(255, 122, 69, .06) !important; }
.woocommerce-cart .woocommerce-message { border-left: 3px solid var(--ca-accent) !important; background: rgba(var(--ca-rgb), .06) !important; }
.woocommerce-cart .woocommerce-message a.button,
.woocommerce-cart .woocommerce-info a.button {
	background: transparent !important;
	color: var(--ca-accent) !important;
	border: 1px solid rgba(var(--ca-rgb), .35) !important;
	border-radius: 999px !important;
	padding: 6px 16px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: .04em !important;
	text-decoration: none !important;
	float: right !important;
}

/* ══════════════════════════════════════════════════════════
   EMPTY CART
══════════════════════════════════════════════════════════ */
.ca-empty {
	display: flex; flex-direction: column; align-items: center; text-align: center;
	/* clears the fixed header (no hero is rendered on the empty cart) */
	padding: calc(var(--header-h, 80px) + clamp(40px, 6vw, 64px)) 20px clamp(56px, 9vw, 96px);
}
.ca-empty__icon {
	width: 100px; height: 100px;
	display: flex; align-items: center; justify-content: center;
	margin-bottom: 26px;
	border-radius: 999px;
	background: rgba(var(--ca-rgb), .07);
	border: 1px solid rgba(var(--ca-rgb), .2);
	color: var(--ca-accent);
	box-shadow: 0 0 40px rgba(var(--ca-rgb), .12);
}
.ca-empty__icon svg { width: 44px; height: 44px; }
.ca-empty__title {
	font-family: 'Bebas Neue', sans-serif;
	font-size: clamp(28px, 5vw, 50px);
	letter-spacing: -.5px;
	text-transform: uppercase;
	color: #fff;
	margin-bottom: 12px;
}
.ca-empty__msg {
	font-family: 'Inter', sans-serif;
	font-size: 15px;
	color: rgba(255, 255, 255, .5);
	line-height: 1.6;
	max-width: 380px;
	margin-bottom: 30px;
}
.ca-empty__btn,
.ca-empty .btn--green {
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	height: 58px !important;
	padding: 0 38px !important;
	background: var(--ca-accent) !important;
	color: #000 !important;
	font-family: 'Bebas Neue', sans-serif !important;
	font-size: 24px !important;
	font-weight: 400 !important;
	letter-spacing: .02em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	border: none !important;
	border-radius: 999px !important;
	clip-path: none !important;
	box-shadow: var(--ca-btn-shadow) !important;
	transition: transform .2s ease, filter .2s ease !important;
}
.ca-empty__btn:hover,
.ca-empty .btn--green:hover {
	transform: scale(1.03) !important;
	filter: brightness(1.04) drop-shadow(0 0 22px rgba(var(--ca-rgb), .45)) !important;
	color: #000 !important;
}

/* Hide WooCommerce default cart table + default totals h2 */
.woocommerce-cart-form .shop_table { display: none !important; }
.cart_totals > h2 { display: none; }

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
	.ca-layout { grid-template-columns: 1fr 330px; }
	.ca-item { grid-template-columns: 76px 1fr 78px 100px 72px 32px; gap: 0 12px; }
}

@media (max-width: 900px) {
	.ca-layout { grid-template-columns: 1fr; }
	.ca-totals-col { order: -1; position: static; }
	.ca-totals-box { padding: 24px; }
}

@media (max-width: 680px) {
	.ca-item {
		grid-template-columns: 76px 1fr;
		gap: 0 14px;
		padding: 14px 16px;
		position: relative;
		border-radius: 18px;
	}
	.ca-item__img-wrap { grid-row: 1 / 4; width: 76px; height: 60px; }
	.ca-item__info { grid-column: 2; grid-row: 1; }
	.ca-item__price-mob { display: block; }
	.ca-item__price--desk { display: none; }
	.ca-item__qty { grid-column: 2; grid-row: 2; justify-content: flex-start; margin-top: 10px; }
	.ca-item__subtotal { grid-column: 2; grid-row: 3; text-align: left; margin-top: 8px; }
	.ca-item__remove { position: absolute; top: 12px; right: 14px; }
	.ca-actions { flex-direction: column; align-items: stretch; }
	.ca-coupon { min-width: 0; }
	.ca-update-btn { justify-content: center; }
}

@media (max-width: 400px) {
	.ca-proceed .checkout-button,
	.ca-proceed a.checkout-button { font-size: 22px !important; height: 54px !important; }
	.ca-empty__btn, .ca-empty .btn--green { width: 100%; justify-content: center; }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
	.ca-item,
	.ca-item__remove-btn,
	.ca-coupon__btn,
	.ca-update-btn,
	.ca-empty__btn,
	.ca-empty .btn--green,
	.ca-proceed .checkout-button { transition: none !important; }
}