/**
 * GhostLabz Storefront — Cart front-end styles.
 * Colors from CSS variables printed by GLZ_Assets:
 *   --glz-primary, --glz-bright, --glz-border, --glz-light, --glz-font
 *
 * These styles layer onto the theme's native cart; they do not replace it.
 */

/* ----- Free-shipping progress bar (inside cart totals) ----- */
.glz-ship-calc-note { font-size: 12px; color: #6b6b76; text-align: center; margin: 14px 0 8px; }
.glz-ship-bar {
	background: var(--glz-light, #f5f4f9);
	border: 1px solid var(--glz-border, #ddd8ee);
	border-radius: 12px;
	padding: 12px 14px;
	margin: 0 0 14px;
}
.glz-ship-bar__head {
	display: flex; align-items: center; gap: 8px;
	font-size: 13px; font-weight: 500;
	color: var(--glz-primary, #3c2681);
	margin-bottom: 8px;
}
.glz-ship-bar__icon { color: var(--glz-primary, #3c2681); display: inline-flex; }
.glz-ship-bar__icon .glz-svg { width: 18px; height: 18px; }

/* Masked SVG icons — color follows currentColor */
.glz-svg {
	display: inline-block; width: 1em; height: 1em;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: center; mask-position: center;
	-webkit-mask-size: contain; mask-size: contain;
	vertical-align: middle;
}
.glz-svg--truck { -webkit-mask-image: url(../icons/truck.svg); mask-image: url(../icons/truck.svg); }
.glz-svg--droplet { -webkit-mask-image: url(../icons/droplet.svg); mask-image: url(../icons/droplet.svg); }
.glz-ship-bar__track {
	height: 6px; background: var(--glz-border, #ddd8ee);
	border-radius: 3px; overflow: hidden; margin-bottom: 6px;
}
.glz-ship-bar__fill {
	display: block; height: 100%;
	background: var(--glz-primary, #3c2681);
	border-radius: 3px; transition: width 0.3s ease;
}
.glz-ship-bar__note { margin: 0; font-size: 12px; color: #5b5b66; }
.glz-ship-bar__note strong { color: var(--glz-primary, #3c2681); }
.glz-ship-bar .glz-free { color: var(--glz-bright, #7d3fb4); font-weight: 600; }

/* ----- Reminder section ----- */
.glz-reminder {
	width: 100%;
	background: var(--glz-light, #f5f4f9);
	border: 1px solid var(--glz-border, #ddd8ee);
	border-radius: 14px;
	padding: 1.25rem;
	margin: 2rem 0 0;
}
.glz-reminder__head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 1rem; }
.glz-reminder__icon {
	flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%;
	background: var(--glz-primary, #3c2681); color: #fff;
	display: flex; align-items: center; justify-content: center;
}
.glz-reminder__icon .glz-svg { width: 20px; height: 20px; }
.glz-reminder__copy h3 { margin: 0 0 2px; font-size: 17px; font-weight: 600; color: var(--glz-primary, #3c2681); }
.glz-reminder__copy p { margin: 0; font-size: 13px; line-height: 1.5; color: #5b5b66; }
.glz-reminder__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}
.glz-reminder__opt {
	position: relative;
	display: grid;
	grid-template-columns: 60px 1fr auto;
	gap: 14px;
	align-items: center;
	background: #fff;
	border: 1px solid var(--glz-border, #ddd8ee);
	border-radius: 12px;
	padding: 12px 16px;
}
.glz-reminder__opt.is-featured { border: 2px solid var(--glz-primary, #3c2681); }
.glz-reminder__badge {
	position: absolute; top: -10px; left: 16px;
	background: var(--glz-primary, #3c2681); color: #fff;
	font-size: 10.5px; font-weight: 600; padding: 2px 10px; border-radius: 20px; white-space: nowrap;
}
.glz-reminder__thumb {
	width: 60px; height: 60px; border-radius: 10px; overflow: hidden;
	background: var(--glz-light, #f5f4f9); color: var(--glz-primary, #3c2681);
	display: flex; align-items: center; justify-content: center;
}
.glz-reminder__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.glz-reminder__info { min-width: 0; }
.glz-reminder__size { display: block; font-size: 15px; font-weight: 600; color: var(--glz-font, #222); }
.glz-reminder__price { display: block; font-size: 14px; font-weight: 600; color: var(--glz-primary, #3c2681); margin-top: 2px; }
.glz-reminder__price del { color: #9a9aa5; font-weight: 400; margin-right: 4px; }
.glz-reminder__add {
	padding: 9px 20px; border: none; border-radius: 8px;
	background: var(--glz-primary, #3c2681); color: #fff;
	font-size: 12.5px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.glz-reminder__add.is-alt { background: #fff; color: var(--glz-primary, #3c2681); border: 1px solid var(--glz-primary, #3c2681); }
.glz-reminder__add:disabled { opacity: 0.65; cursor: default; }

/* ----- Light brand restyle of the native cart (non-structural) ----- */
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
	background: var(--glz-primary, #3c2681) !important;
	color: #fff !important;
	border-radius: 8px !important;
	border: none !important;
}
.woocommerce-cart .cart_totals h2 { color: var(--glz-primary, #3c2681); }

/* ===== Custom two-column cart layout (shortcode-rendered cart) ===== */
.glz-cart-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 24px;
	align-items: start;
}
.glz-cart__main { min-width: 0; }

.glz-cart-items { display: flex; flex-direction: column; gap: 12px; }
.glz-cart-item {
	position: relative;
	display: grid;
	grid-template-columns: 60px 1fr auto auto auto;
	gap: 16px;
	align-items: center;
	background: #fff;
	border: 1px solid var(--glz-border, #ddd8ee);
	border-radius: 14px;
	padding: 14px 16px;
}
.glz-cart-item__thumb img { width: 60px; height: 60px; object-fit: cover; border-radius: 10px; display: block; }
.glz-cart-item__details { min-width: 0; }
.glz-cart-item__name { font-size: 15px; font-weight: 600; margin-bottom: 2px; }
.glz-cart-item__name a { color: var(--glz-font, #222); text-decoration: none; }
/* Bundle / variation meta ("Bundle discount", "You save …") — small */
.glz-cart-item__details .variation,
.glz-cart-item__details .variation *,
.glz-cart-item__details dl.variation { font-size: 11px; line-height: 1.4; color: #6b6b76; margin: 2px 0 0; }
.glz-cart-item__qty { display: flex; justify-content: center; }
/* Right-side pricing: line total only */
.glz-cart-item__pricing { text-align: right; min-width: 72px; }
.glz-cart-item__subtotal { font-size: 16px; font-weight: 600; white-space: nowrap; }
/* Never underline a price (kills the default <ins> underline and any link underline) */
.glz-cart-item__pricing ins,
.glz-cart-item__pricing ins *,
.glz-cart-item__pricing a { text-decoration: none !important; }

/* Quantity stepper wrapping WooCommerce's native .quantity > input.qty */
.glz-qty {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--glz-border, #ddd8ee);
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 8px;
}
.glz-qty .quantity { margin: 0 !important; display: flex; align-items: center; }
.glz-qty__btn {
	width: 34px; height: 36px; border: none; background: #fff;
	color: var(--glz-primary, #3c2681); font-size: 18px; line-height: 1; cursor: pointer;
}
.glz-qty__btn:hover { background: var(--glz-light, #f5f4f9); }
.glz-cart-item .glz-qty input.qty,
.glz-cart-item .glz-qty .glz-qty__input {
	width: 46px; height: 36px; text-align: center;
	border: none;
	border-left: 1px solid var(--glz-border, #ddd8ee);
	border-right: 1px solid var(--glz-border, #ddd8ee);
	border-radius: 0; background: #fff; box-shadow: none;
	-moz-appearance: textfield; font-size: 14px;
}
.glz-cart-item .glz-qty input.qty::-webkit-outer-spin-button,
.glz-cart-item .glz-qty input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.glz-cart-item__remove {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	font-size: 20px;
	line-height: 1;
	color: #b5b5be !important;
	text-decoration: none;
	border-radius: 50%;
	transition: color 0.15s, background 0.15s;
}
.glz-cart-item__remove:hover { color: var(--glz-bright, #7d3fb4) !important; background: var(--glz-light, #f5f4f9); }

.glz-cart-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 16px; }
.glz-coupon { display: flex; gap: 8px; }
.glz-coupon .input-text { height: 40px; border: 1px solid var(--glz-border, #ddd8ee); border-radius: 8px; padding: 0 12px; min-width: 160px; }
.glz-coupon__apply,
.glz-update-cart {
	height: 40px; padding: 0 16px;
	border-radius: 8px !important; border: 1px solid var(--glz-primary, #3c2681) !important;
	background: #fff !important; color: var(--glz-primary, #3c2681) !important;
	font-size: 13px; cursor: pointer;
}
/* Quantity changes auto-submit, so the Update Cart button is hidden.
   It stays in the DOM because the stepper JS clicks it to apply changes. */
.glz-update-cart { display: none !important; }
.glz-continue {
	display: inline-block; margin-top: 18px; font-size: 13px; font-weight: 600;
	color: var(--glz-primary, #3c2681) !important; text-decoration: none !important;
}

/* Order summary (right column) */
.glz-cart__summary {
	background: #fff;
	border: 1px solid var(--glz-border, #ddd8ee);
	border-radius: 14px;
	padding: 1.25rem;
	position: sticky;
	top: 1.5rem;
}
.glz-summary-title { margin: 0 0 1rem; font-size: 18px; font-weight: 600; color: var(--glz-font, #222); }
.glz-cart__summary .cart_totals > h2 { display: none; }
.glz-cart__summary .cart-collaterals,
.glz-cart__summary .cart_totals { width: 100% !important; float: none !important; margin: 0 !important; }
.glz-cart__summary table.shop_table { border: none; margin: 0; width: 100%; }
.glz-cart__summary table.shop_table th,
.glz-cart__summary table.shop_table td {
	border: none; border-bottom: 1px solid var(--glz-border, #ddd8ee);
	padding: 10px 0; font-size: 14px;
}
.glz-cart__summary table.shop_table th { text-align: left; font-weight: 500; }
.glz-cart__summary table.shop_table td { text-align: right; }
.glz-cart__summary table.shop_table tr:last-child th,
.glz-cart__summary table.shop_table tr:last-child td { border-bottom: none; }
.glz-cart__summary .order-total .amount { color: var(--glz-primary, #3c2681); font-size: 18px; }
.glz-cart__summary .woocommerce-shipping-methods { list-style: none; margin: 0; padding: 0; }
.glz-cart__summary .shipping-calculator-button { color: var(--glz-bright, #7d3fb4); }
.glz-cart__summary .wc-proceed-to-checkout { padding: 0; margin-top: 14px; }
.glz-cart__summary .wc-proceed-to-checkout .checkout-button {
	display: block; width: 100%; text-align: center;
	background: var(--glz-primary, #3c2681) !important; color: #fff !important;
	border-radius: 8px !important; border: none !important;
	padding: 13px !important; font-weight: 600 !important;
}

/* Reminder full-width below the layout */
.glz-reminder { clear: both; width: 100%; }

/* Hide shipping entirely in the cart summary (determined at checkout) */
.glz-cart__summary tr.shipping,
.glz-cart__summary tr.woocommerce-shipping-totals,
.glz-cart__summary .shipping-calculator-button,
.glz-cart__summary .shipping-calculator-form { display: none !important; }

/* Remove the browser default underline on WooCommerce sale prices (<ins>) */
.glz-cart-item__price ins,
.glz-cart-item__subtotal ins,
.glz-reminder__price ins,
.glz-cart__summary ins { text-decoration: none; }

/* "Calculated at checkout" line */
.glz-cart__summary .glz-shipping-note { color: #6b6b76; }

/* Responsive */
@media (max-width: 860px) {
	.glz-cart-layout { grid-template-columns: 1fr; }
	.glz-cart__summary { position: static; }
}
@media (max-width: 600px) {
	.glz-reminder__grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
	.glz-cart-item { grid-template-columns: 56px 1fr auto; }
	.glz-cart-item__qty { grid-column: 2; justify-content: flex-start; }
	.glz-cart-item__pricing { grid-column: 2; text-align: left; min-width: 0; }
	.glz-cart-item__remove { grid-column: 3; grid-row: 1; }
}
