/* ==========================================================================
   3R Gallery — WooCommerce customer flows
   Native blocks/templates remain intact; this file is presentation only.
   ========================================================================== */

.trr-commerce {
	--trr-commerce-control-height: 3rem;
	--trr-commerce-content: 90rem;
	background: var(--trr-surface-primary);
}

.trr-commerce main,
.trr-commerce .site-main {
	min-width: 0;
}

.trr-commerce .page-header,
.trr-commerce .entry-header,
.trr-commerce .page-content,
.trr-commerce .entry-content {
	width: min(100%, var(--trr-commerce-content));
	margin-inline: auto;
	padding-inline: var(--trr-gutter-x);
}

.trr-commerce .page-header,
.trr-commerce .entry-header {
	padding-top: var(--trr-space-xl);
	padding-bottom: var(--trr-space-md);
	border-bottom: var(--trr-rule-heavy);
}

.trr-commerce .page-title,
.trr-commerce .entry-title {
	max-width: 12ch;
	margin: 0;
	font-family: var(--trr-font-heading);
	font-size: var(--trr-page-title-size);
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 0.94;
	text-transform: uppercase;
}

.trr-commerce .page-content,
.trr-commerce .entry-content {
	padding-top: var(--trr-space-lg);
	padding-bottom: var(--trr-space-2xl);
}

.trr-commerce .woocommerce,
.trr-commerce [class*='wc-block-'] {
	font-family: var(--trr-font-body);
}

.trr-commerce :where(input:not([type='checkbox'], [type='radio']), select, textarea) {
	min-height: var(--trr-commerce-control-height);
	border: var(--trr-rule);
	border-radius: 0;
	background: var(--trr-surface-lowest);
	color: var(--trr-foreground-body);
	font-family: var(--trr-font-body);
	font-size: 1rem;
}

.trr-commerce :where(button, .button, .wp-element-button, .wc-block-components-button) {
	min-height: var(--trr-commerce-control-height);
	border: var(--trr-rule);
	border-radius: 0;
	box-shadow: none;
	font-family: var(--trr-font-caption);
	font-size: var(--trr-label-size);
	font-weight: 700;
	letter-spacing: 0.12em;
	line-height: 1.35;
	text-transform: uppercase;
}

.trr-commerce :where(button, .button, .wp-element-button, .wc-block-components-button):not(:disabled) {
	background: var(--trr-surface-inverse);
	color: var(--trr-foreground-inverse);
}

.trr-commerce :where(button, .button, .wp-element-button, .wc-block-components-button):not(:disabled):hover {
	background: var(--trr-surface-lowest);
	color: var(--trr-foreground-primary);
}

.trr-commerce :where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--trr-foreground-primary);
	outline-offset: 3px;
}

.trr-commerce :where(.woocommerce-error, .woocommerce-info, .woocommerce-message, .wc-block-components-notice-banner) {
	display: flex;
	align-items: flex-start;
	gap: var(--trr-space-xs);
	margin: 0 0 var(--trr-space-md);
	padding: var(--trr-space-sm);
	border: var(--trr-rule);
	border-left-width: 0.5rem;
	border-radius: 0;
	background: var(--trr-surface-lowest);
	color: var(--trr-foreground-body);
}

.trr-commerce :where(.woocommerce-error, .wc-block-components-notice-banner.is-error) {
	border-color: var(--trr-status-error);
}

.trr-commerce .wc-block-components-validation-error,
.trr-commerce .woocommerce-invalid-required-field,
.trr-commerce .woocommerce-error {
	color: var(--trr-status-error);
}

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

.trr-commerce--cart .wp-block-woocommerce-cart {
	width: 100%;
	max-width: 100%;
	margin-inline: 0 !important;
	font-size: 1rem;
}

.trr-commerce--cart .wc-block-cart__main,
.trr-commerce--cart .wc-block-cart__sidebar {
	min-width: 0;
}

.trr-commerce--cart .wc-block-cart-items,
.trr-commerce--cart .wc-block-cart-items td,
.trr-commerce--cart .wc-block-cart-items th {
	border-color: var(--trr-border-strong);
}

.trr-commerce--cart .wc-block-cart-items thead th,
.trr-commerce--cart .wc-block-cart__totals-title,
.trr-commerce--cart .wc-block-components-totals-wrapper {
	font-family: var(--trr-font-caption);
	font-size: var(--trr-label-size);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.trr-commerce--cart .wc-block-cart-item__product,
.trr-commerce--cart .wc-block-cart-item__total {
	padding-top: var(--trr-space-sm);
	padding-bottom: var(--trr-space-sm);
}

.trr-commerce--cart .wc-block-components-product-name {
	font-family: var(--trr-font-heading);
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 400;
	line-height: 1;
	text-transform: uppercase;
}

.trr-commerce--cart .wc-block-cart-item__image img {
	border: var(--trr-rule);
	border-radius: 0;
}

.trr-commerce--cart .wc-block-components-quantity-selector {
	min-height: 2.75rem;
	border: var(--trr-rule);
	border-radius: 0;
}

.trr-commerce--cart .wc-block-components-quantity-selector::after {
	display: none;
}

.trr-commerce--cart .wc-block-cart-item__remove-link {
	min-height: 2rem;
	color: var(--trr-foreground-body);
	font-family: var(--trr-font-caption);
	font-size: var(--trr-label-size);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-decoration: underline;
	text-transform: uppercase;
}

.trr-commerce--cart .wc-block-components-sidebar {
	padding: var(--trr-card-padding);
	border: var(--trr-rule-heavy);
	background: var(--trr-surface-lowest);
}

.trr-commerce--cart .wc-block-components-totals-coupon__button {
	white-space: normal;
}

.trr-commerce--cart .wc-block-components-totals-footer-item {
	padding-top: var(--trr-space-sm);
	border-top: var(--trr-rule-heavy);
}

.trr-commerce--cart .wc-block-cart__submit-button {
	width: 100%;
	min-height: 3.5rem;
}

.trr-commerce--cart .wc-block-cart__empty-cart__title {
	margin: 0 0 var(--trr-space-md);
	font-family: var(--trr-font-heading);
	font-size: var(--trr-headline-lg);
	font-weight: 400;
	line-height: var(--trr-headline-lg-line);
	text-transform: uppercase;
}

.trr-commerce--cart .wp-block-woocommerce-empty-cart-block {
	padding-block: var(--trr-space-xl);
	border-top: var(--trr-rule-heavy);
	border-bottom: var(--trr-rule-heavy);
	text-align: left;
}

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

.trr-commerce--checkout .wc-block-checkout__main,
.trr-commerce--checkout .wc-block-checkout__sidebar {
	min-width: 0;
}

.trr-commerce--checkout .wc-block-checkout__main {
	padding-right: var(--trr-space-lg);
}

.trr-commerce--checkout .wc-block-checkout__sidebar {
	padding: var(--trr-card-padding);
	border: var(--trr-rule-heavy);
	background: var(--trr-surface-lowest);
}

.trr-commerce--checkout .wc-block-components-checkout-step {
	margin: 0;
	padding: var(--trr-space-md) 0;
	border-top: var(--trr-rule);
}

.trr-commerce--checkout .wc-block-components-checkout-step:first-child {
	padding-top: 0;
	border-top: 0;
}

.trr-commerce--checkout .wc-block-components-checkout-step__heading h2,
.trr-commerce--checkout .wc-block-components-title,
.trr-commerce--checkout .wc-block-components-order-summary__button-text {
	font-family: var(--trr-font-heading);
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 400;
	line-height: 1;
	text-transform: uppercase;
}

.trr-commerce--checkout .wc-block-components-text-input input,
.trr-commerce--checkout .wc-block-components-combobox .wc-block-components-combobox-control input,
.trr-commerce--checkout .wc-block-components-address-form__country select {
	border: var(--trr-rule);
	border-radius: 0;
	background: var(--trr-surface-lowest);
}

.trr-commerce--checkout .wc-block-components-text-input label,
.trr-commerce--checkout .wc-block-components-combobox label {
	color: var(--trr-foreground-secondary);
}

.trr-commerce--checkout .wc-block-components-radio-control-accordion-option,
.trr-commerce--checkout .wc-block-components-radio-control__option {
	border: var(--trr-rule);
	border-radius: 0;
	background: var(--trr-surface-lowest);
}

.trr-commerce--checkout .wc-block-components-radio-control-accordion-option + .wc-block-components-radio-control-accordion-option,
.trr-commerce--checkout .wc-block-components-radio-control__option + .wc-block-components-radio-control__option {
	border-top: 0;
}

.trr-commerce--checkout .wc-block-checkout__actions_row {
	align-items: center;
	gap: var(--trr-space-sm);
	padding-top: var(--trr-space-md);
	border-top: var(--trr-rule-heavy);
}

.trr-commerce--checkout .wc-block-components-checkout-place-order-button {
	min-height: 3.5rem;
}

/* My Account ------------------------------------------------------------- */

body.trr-commerce--account .page-header,
body.trr-commerce--account .entry-header {
	padding-inline: 0;
}

.trr-commerce--account .woocommerce-error {
	flex-direction: column;
	padding-left: calc(var(--trr-space-sm) + 2rem);
}

.trr-commerce--account .woocommerce-error::before {
	top: var(--trr-space-sm);
	left: var(--trr-space-sm);
}

.trr-commerce--account .woocommerce-info {
	flex-direction: column;
	align-items: flex-start;
}

.trr-commerce--account .woocommerce-info::before,
.trr-commerce--account .woocommerce-info::after {
	display: none;
	content: none;
}

.trr-commerce--account .woocommerce-info > .button {
	order: 1;
	float: none;
	max-width: 100%;
	margin: 0;
	white-space: normal;
}

.trr-commerce--account .woocommerce-Addresses {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--trr-space-lg);
}

.trr-commerce--account .woocommerce-Addresses::before,
.trr-commerce--account .woocommerce-Addresses::after {
	display: none;
	content: none;
}

.trr-commerce--account .woocommerce .woocommerce-Addresses > .woocommerce-Address {
	float: none;
	width: 100%;
	min-width: 0;
}

.trr-commerce--account .woocommerce-EditAccountForm button[name='save_account_details'] {
	display: block;
	width: fit-content;
	max-width: 100%;
	margin: var(--trr-space-md) auto 0;
	white-space: normal;
}

.trr-commerce--account .woocommerce-form-login,
.trr-commerce--account .woocommerce-form-register,
.trr-commerce--account .woocommerce-ResetPassword {
	margin: 0;
	padding: var(--trr-card-padding);
	border: var(--trr-rule-heavy);
	border-radius: 0;
	background: var(--trr-surface-lowest);
}

.trr-commerce--account #customer_login {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--trr-space-lg);
}

.trr-commerce--account #customer_login::before,
.trr-commerce--account #customer_login::after {
	display: none;
	content: none;
}

.trr-commerce--account #customer_login > .col-1,
.trr-commerce--account #customer_login > .col-2 {
	float: none;
	width: auto;
}

.trr-commerce--account #customer_login h2,
.trr-commerce--account .woocommerce-MyAccount-content h2,
.trr-commerce--account .woocommerce-MyAccount-content h3 {
	margin-top: 0;
	font-size: var(--trr-headline-md);
}

.trr-commerce--account .form-row {
	margin-bottom: var(--trr-space-sm);
}

.trr-commerce--account .woocommerce-form-row label {
	display: block;
	margin-bottom: var(--trr-space-2xs);
	font-family: var(--trr-font-caption);
	font-size: var(--trr-label-size);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.trr-commerce--account .woocommerce-form-row input.input-text {
	width: 100%;
}

.trr-commerce--account .woocommerce-form__label-for-checkbox {
	display: inline-flex;
	align-items: center;
	gap: var(--trr-space-2xs);
	min-height: 2.75rem;
}

.trr-commerce--account .woocommerce-MyAccount-navigation {
	float: left;
	width: 25%;
	padding-right: var(--trr-space-md);
}

.trr-commerce--account .woocommerce-MyAccount-navigation ul {
	margin: 0;
	padding: 0;
	border-top: var(--trr-rule-heavy);
	list-style: none;
}

.trr-commerce--account .woocommerce-MyAccount-navigation a {
	display: flex;
	align-items: center;
	min-height: 3rem;
	padding: var(--trr-space-xs);
	border-bottom: var(--trr-rule);
	font-family: var(--trr-font-caption);
	font-size: var(--trr-label-size);
	font-weight: 700;
	letter-spacing: 0.1em;
	text-decoration: none;
	text-transform: uppercase;
}

.trr-commerce--account .woocommerce-MyAccount-navigation .is-active a,
.trr-commerce--account .woocommerce-MyAccount-navigation a:hover {
	background: var(--trr-surface-inverse);
	color: var(--trr-foreground-inverse);
}

.trr-commerce--account .woocommerce-MyAccount-content {
	float: right;
	width: 75%;
	min-width: 0;
	padding-left: var(--trr-space-md);
}

/* Classic order received ------------------------------------------------- */

.trr-commerce--order-received .woocommerce-order {
	display: grid;
	gap: var(--trr-space-lg);
}

.trr-commerce--order-received .woocommerce-notice--success {
	margin: 0;
	padding: var(--trr-space-md);
	border: var(--trr-rule-heavy);
	background: var(--trr-surface-inverse);
	color: var(--trr-foreground-inverse);
	font-family: var(--trr-font-heading);
	font-size: clamp(1.75rem, 4vw, 3rem);
	line-height: 1;
	text-transform: uppercase;
}

.trr-commerce--order-received .woocommerce-order-overview {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	border-top: var(--trr-rule-heavy);
	border-left: var(--trr-rule);
	list-style: none;
}

.trr-commerce--order-received .woocommerce-order-overview li {
	float: none;
	min-width: 0;
	margin: 0;
	padding: var(--trr-space-sm);
	border-right: var(--trr-rule);
	border-bottom: var(--trr-rule);
	font-family: var(--trr-font-caption);
	font-size: var(--trr-label-size);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	overflow-wrap: anywhere;
}

.trr-commerce--order-received .woocommerce-order-overview strong {
	display: block;
	margin-top: var(--trr-space-2xs);
	font-family: var(--trr-font-body);
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
}

.trr-commerce--order-received .woocommerce-order-details,
.trr-commerce--order-received .woocommerce-customer-details {
	margin: 0;
}

.trr-commerce--order-received .woocommerce-order-details__title,
.trr-commerce--order-received .woocommerce-column__title {
	padding-bottom: var(--trr-space-xs);
	border-bottom: var(--trr-rule-heavy);
	font-size: var(--trr-headline-md);
}

.trr-commerce--order-received table.shop_table {
	border: var(--trr-rule-heavy);
	border-collapse: collapse;
	border-radius: 0;
}

.trr-commerce--order-received table.shop_table th,
.trr-commerce--order-received table.shop_table td {
	padding: var(--trr-space-sm);
	border: var(--trr-rule);
	text-align: left;
	vertical-align: top;
}

.trr-commerce--order-received .woocommerce-customer-details address {
	padding: var(--trr-space-md);
	border: var(--trr-rule-heavy);
	border-radius: 0;
	background: var(--trr-surface-lowest);
	line-height: 1.7;
}

/* Responsive and user preferences --------------------------------------- */

@media (max-width: 780px) {
	.trr-commerce .page-header,
	.trr-commerce .entry-header,
	.trr-commerce .page-content,
	.trr-commerce .entry-content {
		padding-inline: max(1rem, env(safe-area-inset-left));
	}

	.trr-commerce--checkout .wc-block-checkout__main {
		padding-right: 0;
	}

	.trr-commerce--cart .wc-block-components-sidebar,
	.trr-commerce--checkout .wc-block-checkout__sidebar {
		padding: var(--trr-space-sm);
	}

	.trr-commerce--account #customer_login {
		grid-template-columns: minmax(0, 1fr);
	}

	.trr-commerce--account .woocommerce-MyAccount-navigation,
	.trr-commerce--account .woocommerce-MyAccount-content {
		float: none;
		width: 100%;
		padding: 0;
	}

	.trr-commerce--account .woocommerce-MyAccount-content {
		margin-top: var(--trr-space-lg);
	}

	.trr-commerce--order-received .woocommerce-order-overview {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 420px) {
	.trr-commerce--order-received .woocommerce-order-overview {
		grid-template-columns: minmax(0, 1fr);
	}

	.trr-commerce--order-received table.shop_table,
	.trr-commerce--order-received table.shop_table tbody,
	.trr-commerce--order-received table.shop_table tfoot,
	.trr-commerce--order-received table.shop_table tr,
	.trr-commerce--order-received table.shop_table th,
	.trr-commerce--order-received table.shop_table td {
		display: block;
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.trr-commerce *,
	.trr-commerce *::before,
	.trr-commerce *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

@media (forced-colors: active) {
	.trr-commerce :where(button, .button, .wp-element-button, .wc-block-components-button),
	.trr-commerce :where(input, select, textarea),
	.trr-commerce :where(.woocommerce-error, .woocommerce-info, .woocommerce-message, .wc-block-components-notice-banner) {
		border: 1px solid CanvasText;
	}
}
