/* ══════════════════════════════════════════════════════════════════
   WC Gifting Option — wc-inputs.css
   Override WooCommerce native radio & checkbox
   Match gifting plugin design language (no JS, pure CSS)
══════════════════════════════════════════════════════════════════ */

/* ─── Shared reset ────────────────────────────────────────────── */
input[type="radio"].input-radio,
input[type="checkbox"].input-checkbox,
input[type="checkbox"].woocommerce-form__input-checkbox {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: inline-block;
	margin: 0;
	padding: 0;
	vertical-align: middle;
	position: relative;
	top: -1px;            /* pixel-perfect vertical centering */
	cursor: pointer;
	flex-shrink: 0;
	transition: border-color 0.15s ease, background-color 0.15s ease;
	/* Xóa style mặc định của theme/WC */
	box-shadow: none;
	outline: none;
}

/* ════════════════════════════════════════════════════════════════
   RADIO — payment methods, shipping methods
════════════════════════════════════════════════════════════════ */
input[type="radio"].input-radio {
	width: 20px;
	height: 20px;
	min-width: 20px;
	border: 1.5px solid #aaa;
	border-radius: 50%;
	background-color: transparent;
	background-image: none;
}

input[type="radio"].input-radio:hover {
	border-color: #555;
}

input[type="radio"].input-radio:checked {
	border-color: #1a1a1a;
	/* Inner dot không cần pseudo-element — dùng radial-gradient */
	background: radial-gradient(circle at 50% 50%, #1a1a1a 42%, transparent 43%);
}

input[type="radio"].input-radio:focus {
	box-shadow: none;
	outline: none;
}

input[type="radio"].input-radio:focus-visible {
	outline: 2px solid #1a1a1a;
	outline-offset: 2px;
}

/* ════════════════════════════════════════════════════════════════
   CHECKBOX — terms, ship-to-different, create account, etc.
════════════════════════════════════════════════════════════════ */
input[type="checkbox"].input-checkbox,
input[type="checkbox"].woocommerce-form__input-checkbox {
	width: 18px;
	height: 18px;
	min-width: 18px;
	border: 1.5px solid #bbb;
	border-radius: 0;
	background-color: transparent;
	background-image: none;
}

input[type="checkbox"].input-checkbox:hover,
input[type="checkbox"].woocommerce-form__input-checkbox:hover {
	border-color: #666;
}

input[type="checkbox"].input-checkbox:checked,
input[type="checkbox"].woocommerce-form__input-checkbox:checked {
	border-color: #1a1a1a;
	background-color: #1a1a1a;
	/* SVG checkmark via data URI — không cần pseudo-element */
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='1%2C5.5 4.5%2C9 11%2C1' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 10px 8px;
}

input[type="checkbox"].input-checkbox:focus,
input[type="checkbox"].woocommerce-form__input-checkbox:focus {
	box-shadow: none;
	outline: none;
}

input[type="checkbox"].input-checkbox:focus-visible,
input[type="checkbox"].woocommerce-form__input-checkbox:focus-visible {
	outline: 2px solid #1a1a1a;
	outline-offset: 2px;
}

/* ════════════════════════════════════════════════════════════════
   Payment methods — căn chỉnh label với radio
════════════════════════════════════════════════════════════════ */
#payment .wc_payment_methods li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	flex-wrap: wrap;
}

#payment .wc_payment_methods li > input.input-radio {
	top: 2px; /* align với line-height của label */
	flex-shrink: 0;
}

#payment .wc_payment_methods li > label {
	flex: 1;
	cursor: pointer;
	line-height: 1.45;
}

#payment .wc_payment_methods li .payment_box {
	flex: 0 0 100%;
	/* Thụt lề theo radio width + gap */
	padding-left: 30px;
	margin-top: 4px;
}

/* ════════════════════════════════════════════════════════════════
   Shipping methods
════════════════════════════════════════════════════════════════ */
.woocommerce-shipping-methods li {
	display: flex;
	align-items: center;
	gap: 10px;
}

.woocommerce-shipping-methods li label {
	cursor: pointer;
}

/* ════════════════════════════════════════════════════════════════
   Checkout form checkboxes (ship-to, create account, terms)
════════════════════════════════════════════════════════════════ */
.woocommerce-form__label.woocommerce-form__label-for-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
}

.woocommerce-form__label.woocommerce-form__label-for-checkbox span {
	line-height: 1.4;
}