/* ============================================================================
   CFMOTO — WooCommerce surfaces (cart + my-account) brand stylesheet
   Part of the Elementor-removal migration (P4b). Loaded ONLY on WC cart /
   my-account pages (see inc/routing.php). The pages themselves render through
   page.php (our header/footer chrome) wrapping WooCommerce's default content —
   this sheet only RESKINS that content to the CFMOTO design language used by the
   checkout shell (teal #12BAD5, GL Tatishvili display, FiraGO/Noto body, 6px
   radius). No markup is changed; selectors target both the classic (my-account)
   and block (cart) component trees.

   Brand tokens are scoped to the WC containers so they cannot leak into / be
   overwritten by the global chrome stylesheet.
   ============================================================================ */

.woocommerce,
.woocommerce-page,
body.woocommerce-cart .entry-content,
body.woocommerce-account .entry-content,
.wp-block-woocommerce-cart {
	--cfm-teal: #12BAD5;
	--cfm-teal-hover: #0a8ba1;
	--cfm-ink: #202223;
	--cfm-muted: #6d7175;
	--cfm-subtle: #8c9196;
	--cfm-border: #e1e3e5;
	--cfm-surface: #ffffff;
	--cfm-surface-alt: #f6f6f7;
	--cfm-radius: 6px;
	--cfm-radius-lg: 10px;
	--cfm-font-display: 'GL Tatishvili Metal', 'FiraGO', 'Noto Sans Georgian', sans-serif;
	--cfm-font-body: 'FiraGO', 'Noto Sans Georgian', 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ---- Page rhythm: give WC content the same max-width / padding as the site ---- */
body.woocommerce-cart .entry-content,
body.woocommerce-account .entry-content,
body.woocommerce-cart .site-main,
body.woocommerce-account .site-main,
body.woocommerce-cart main,
body.woocommerce-account main {
	max-width: 1180px;
	margin-inline: auto;
	padding: 48px 24px 80px;
	font-family: var(--cfm-font-body);
	color: var(--cfm-ink);
}

/* Page title (e.g. "Cart", "My account") */
body.woocommerce-cart .entry-title,
body.woocommerce-account .entry-title,
.woocommerce-products-header__title,
.wc-block-cart__empty-cart__title {
	font-family: var(--cfm-font-display);
	font-weight: 400;
	letter-spacing: 0.01em;
	color: var(--cfm-ink);
}

/* ============================================================================
   BUTTONS — unify classic .button + block .wc-block-components-button
   ============================================================================ */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.wc-block-components-button:not(.is-link),
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: var(--cfm-teal);
	color: #fff;
	font-family: var(--cfm-font-display);
	font-weight: 400;
	letter-spacing: 0.02em;
	border: 0;
	border-radius: var(--cfm-radius);
	padding: 14px 26px;
	line-height: 1;
	text-transform: none;
	box-shadow: none;
	cursor: pointer;
	transition: background 0.18s cubic-bezier(0.4, 0, 0.2, 1), transform 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.wc-block-components-button:not(.is-link):hover,
.wp-block-button__link:hover {
	background: var(--cfm-teal-hover);
	color: #fff;
	transform: translateY(-1px);
}
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.wc-block-components-button:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--cfm-teal);
}
/* Secondary / outline buttons (e.g. "Update cart", "Continue shopping") */
.woocommerce a.button.wc-backward,
.woocommerce button[name="update_cart"],
.wc-block-components-button.outlined {
	background: #fff;
	color: var(--cfm-ink);
	border: 1px solid var(--cfm-border);
}
.woocommerce a.button.wc-backward:hover,
.woocommerce button[name="update_cart"]:hover,
.wc-block-components-button.outlined:hover {
	background: var(--cfm-surface-alt);
	color: var(--cfm-ink);
	border-color: var(--cfm-subtle);
}
/* The big proceed-to-checkout button (block + classic) */
.wc-block-cart__submit-button,
.wc-proceed-to-checkout a.checkout-button {
	width: 100%;
	font-size: 16px;
	padding: 16px 24px;
}

/* ============================================================================
   PRICES — CFMOTO teal accents
   ============================================================================ */
.woocommerce .woocommerce-Price-amount,
.wc-block-components-product-price,
.wc-block-formatted-money-amount {
	font-family: var(--cfm-font-display);
	font-weight: 400;
	color: var(--cfm-ink);
}
.wc-block-components-totals-item__value,
.wc-block-cart__totals-title {
	font-family: var(--cfm-font-display);
}

/* ============================================================================
   FORM FIELDS — inputs, selects, textareas (classic + block)
   ============================================================================ */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-account input[type="text"],
.woocommerce-account input[type="email"],
.woocommerce-account input[type="password"],
.woocommerce-account input[type="tel"],
.wc-block-components-text-input input,
.wc-blocks-components-select__container {
	width: 100%;
	font-family: var(--cfm-font-body);
	font-size: 15px;
	color: var(--cfm-ink);
	background: var(--cfm-surface);
	border: 1px solid var(--cfm-border);
	border-radius: var(--cfm-radius);
	padding: 12px 14px;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce-account input:focus,
.wc-block-components-text-input input:focus {
	outline: none;
	border-color: var(--cfm-teal);
	box-shadow: 0 0 0 3px rgba(18, 186, 213, 0.15);
}
.woocommerce form .form-row label,
.woocommerce-account label,
.wc-block-components-text-input label {
	font-family: var(--cfm-font-body);
	font-size: 13px;
	font-weight: 600;
	color: var(--cfm-muted);
}

/* ============================================================================
   NOTICES — info / success / error (classic + block)
   ============================================================================ */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner {
	font-family: var(--cfm-font-body);
	border-radius: var(--cfm-radius);
	border: 1px solid var(--cfm-border);
	border-left: 4px solid var(--cfm-teal);
	background: var(--cfm-surface-alt);
	color: var(--cfm-ink);
	padding: 14px 18px;
}
.woocommerce-error,
.wc-block-components-notice-banner.is-error {
	border-left-color: #d63638;
}
.woocommerce-message::before,
.woocommerce-info::before { color: var(--cfm-teal); }

/* ============================================================================
   CART — classic table (fallback) + block cart line items / totals
   ============================================================================ */
.woocommerce table.shop_table {
	border: 1px solid var(--cfm-border);
	border-radius: var(--cfm-radius-lg);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}
.woocommerce table.shop_table th {
	font-family: var(--cfm-font-display);
	font-weight: 400;
	color: var(--cfm-muted);
	background: var(--cfm-surface-alt);
}
.woocommerce table.shop_table td { border-top: 1px solid var(--cfm-border); }
.woocommerce .cart_totals h2,
.wc-block-cart__totals-title {
	font-family: var(--cfm-font-display);
	font-weight: 400;
}
/* Block cart sidebar card */
.wp-block-woocommerce-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper,
.wc-block-cart .wc-block-cart__sidebar {
	border: 1px solid var(--cfm-border);
	border-radius: var(--cfm-radius-lg);
	background: var(--cfm-surface-alt);
}
/* Quantity stepper */
.wc-block-components-quantity-selector {
	border: 1px solid var(--cfm-border);
	border-radius: var(--cfm-radius);
}
.wc-block-components-quantity-selector__button:hover { color: var(--cfm-teal); }
.woocommerce .quantity input.qty {
	border: 1px solid var(--cfm-border);
	border-radius: var(--cfm-radius);
	padding: 8px;
}
/* Coupon field */
.woocommerce .coupon input.input-text,
.wc-block-components-totals-coupon__input input {
	border-radius: var(--cfm-radius);
}
/* Empty-cart state */
.wc-block-cart__empty-cart__title { margin-top: 16px; }

/* ============================================================================
   MY-ACCOUNT — navigation, dashboard, tables, login/register
   ============================================================================ */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	border: 1px solid var(--cfm-border);
	border-radius: var(--cfm-radius-lg);
	overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-navigation li {
	border-bottom: 1px solid var(--cfm-border);
}
.woocommerce-account .woocommerce-MyAccount-navigation li:last-child { border-bottom: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 13px 18px;
	font-family: var(--cfm-font-body);
	font-weight: 500;
	color: var(--cfm-ink);
	text-decoration: none;
	transition: background 0.15s, color 0.15s;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	background: var(--cfm-surface-alt);
	color: var(--cfm-teal);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	background: var(--cfm-teal);
	color: #fff;
}
.woocommerce-account .woocommerce-MyAccount-content {
	font-family: var(--cfm-font-body);
	color: var(--cfm-ink);
}
/* Login / register columns */
.woocommerce-account .col2-set .col-1,
.woocommerce-account .col2-set .col-2,
.woocommerce form.login,
.woocommerce form.register {
	border: 1px solid var(--cfm-border);
	border-radius: var(--cfm-radius-lg);
	padding: 28px;
	background: var(--cfm-surface);
}
.woocommerce form.login h2,
.woocommerce-account h2 {
	font-family: var(--cfm-font-display);
	font-weight: 400;
}

/* ============================================================================
   Responsive
   ============================================================================ */
@media (max-width: 768px) {
	body.woocommerce-cart .entry-content,
	body.woocommerce-account .entry-content,
	body.woocommerce-cart main,
	body.woocommerce-account main {
		padding: 28px 16px 56px;
	}
	.woocommerce a.button,
	.woocommerce button.button,
	.wc-block-components-button:not(.is-link) { width: 100%; }
}