@import 'cart-block';
@import 'checkout-block';


// forms
.wc-block-components-textarea,
// .wc-block-components-combobox input[type=text],
.wc-blocks-components-select .wc-blocks-components-select__container,
.wc-block-components-text-input input:is([type=email], [type=number], [type=tel], [type=text], [type=url]) {
	--has-height: var(--false);

	padding-inline: 15px !important;
	color: var(--theme-form-text-initial-color, var(--theme-text-color)) !important;
	border: var(--theme-form-field-border-width, 1px) solid var(--theme-form-field-border-initial-color) !important;
	border-radius: var(--theme-form-field-border-radius, 3px) !important;
	background-color: var(--theme-form-field-background-initial-color) !important;
	transition: color 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955),
				border-color 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955),
				background-color 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955);

	&:focus {
		box-shadow: none !important;
		color: var(--theme-form-text-focus-color, var(--theme-text-color)) !important;
		border-color: var(--theme-form-field-border-focus-color) !important;
		background-color: var(--theme-form-field-background-focus-color) !important;
	}
}

.wc-block-components-text-input.has-error input:is([type=email], [type=number], [type=tel], [type=text], [type=url]) {
	border-color: #cc1818 !important;
}


// form select
.wc-blocks-components-select .wc-blocks-components-select__container {

	.wc-blocks-components-select__select {
		padding-inline: 0;
		color: inherit;
	}

	.wc-blocks-components-select__expand {
		fill: currentColor;
	}
}

// .wc-block-components-combobox .wc-block-components-combobox-control {

// 	input.components-combobox-control__input[aria-expanded=true] {
// 		border-bottom-left-radius: 0 !important;
//     	border-bottom-right-radius: 0 !important;
//     	transition: none;
// 	}

// 	.components-form-token-field__suggestions-list {
// 		box-shadow: none !important;
// 		border: var(--theme-form-field-border-width, 1px) solid var(--theme-form-field-border-focus-color) !important;
// 		border-top: 0 !important;
// 		border-radius: 0 0 var(--theme-form-field-border-radius, 3px) var(--theme-form-field-border-radius, 3px) !important;
// 		background-color: var(--theme-form-field-background-focus-color, #fff) !important;

// 		.components-form-token-field__suggestion {
// 			color: var(--form-field-select-initial-color, var(--theme-text-color)) !important;

// 			&.is-selected {
// 				background-color: rgba(0,0,0,0.05) !important;
// 			}

// 			&:hover {
// 				color: var(--form-field-select-active-color, #fff) !important;
// 				background-color: var(--theme-form-select-background-active-color, var(--theme-palette-color-1)) !important;	
// 			}
// 		}
// 	}
// }


// form input label
.wc-block-components-text-input label,
.wc-blocks-components-select label {
	opacity: 0.6;
	inset-inline-start: 16px !important;
	color: var(--theme-form-text-initial-color, var(--theme-text-color)) !important;
}


// radio
.wc-block-components-radio-control .wc-block-components-radio-control__input {
	outline: none !important;

	&:checked {
		border-color: var(--theme-form-selection-field-active-color) !important;

		&:before {
			background: var(--theme-form-selection-field-active-color) !important;
		}
	}
}


// decorative border color
.wc-block-cart.is-large table.wc-block-cart-items,
.wc-block-cart.is-large .wc-block-cart-items tr td,
.wc-block-components-sidebar .wc-block-components-totals-wrapper,
fieldset.wc-block-checkout__payment-method .wc-block-components-radio-control,
fieldset.wc-block-checkout__payment-method .wc-block-components-radio-control-accordion-option,
.wc-block-checkout.is-large .wc-block-checkout__actions,
.wc-block-checkout .wc-block-components-checkout-step--with-step-number .wc-block-components-checkout-step__container:after {
	border-color: var(--theme-table-border-color, var(--theme-border-color));
}


.wc-block-components-sidebar-layout .wc-block-components-totals-footer-item {

	.wc-block-components-totals-item__label,
	.wc-block-components-totals-item__value {
		font-size: initial;
	}
}