@charset "utf-8";

/*-------------------------------------------*/
/*	Archive
/*-------------------------------------------*/
/*	single
/*-------------------------------------------*/

:root {
	--color-woo-image-border: #f2f2f2;
}

/* コンテント幅を使用するインナーブロック有効 幅広時 */
.woocommerce .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    margin-left: auto !important;
    margin-right: auto !important;
}

.woocommerce-account .wp-block-post-title,
.woocommerce-account main .woocommerce,
.woocommerce-cart .wp-block-post-title,
.woocommerce-cart main .woocommerce,
.woocommerce-checkout .wp-block-post-title,
.woocommerce-checkout main .woocommerce {
	max-width: 100%;
}

.woocommerce .woocommerce-breadcrumb {
	margin-bottom:0;
}
.wc-block-components-notice-banner {
	margin-top:0;
}

/*-------------------------------------------*/
/*	Archive
/*-------------------------------------------*/
.woocommerce {
	ul.products-block-post-template,
	ul.wp-block-woocommerce-product-template{
		li.product {
			img{
				border: 1px solid var(--color-woo-image-border);
			}
		}
	}
}

/*-------------------------------------------*/
/*	qty input-text form
/*-------------------------------------------*/
.woocommerce :is(
	.quantity .input-text.qty,
	.wc-block-add-to-cart-form .quantity .input-text.qty
	) {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    text-align: right;
    width: 5rem;
}

/* ------------------------------------------- */
/* woocommerce-MyAccount */
/* ------------------------------------------- */
.woocommerce-account {
	--wc-form-border-color: var(--wp--preset--color--border-normal);

	font-size: var(--wp--preset--font-size--small);
	/* .woocommerce-MyAccount-navigation ********************/
	.woocommerce-MyAccount-navigation {
		max-width: var(--wp--custom--width--sidebar);
	}
	.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link {
		padding: 1px 0;
		border-bottom: 1px solid var(--wp--preset--color--border-normal);
		&:first-child {
			border-top: 1px solid var(--wp--preset--color--border-normal);
		}
		&:is(.is-active, :hover, :focus-within) a {
			background-color: var(--wp--preset--color--bg-secondary);
			text-decoration: none;
		}
		a {
			display: block;
			padding: var(--wp--custom--spacing--xx-small) var(--wp--custom--spacing--x-small);
			text-decoration: none;
			&:hover {
				text-decoration: none;
			}
			&:focus-visible {
				outline: 2px solid var(--wp--preset--color--primary);
				outline-offset: 2px;
			}
		}
	}
	/* .my-section ********************/
	.my-section {
		border: none;
		padding: 0;
		margin-bottom: var(--wp--custom--spacing--large);
	}
	.my-section-title {
		font-size: var(--wp--preset--font-size--x-large);
		margin-bottom: var(--wp--custom--spacing--small);
		i {
			margin-right: 0.25em;
		}
	}
	fieldset {
		padding: var(--wp--custom--spacing--small);
		border: 1px solid var(--wp--preset--color--border-normal);
		.form-row label {
			margin-bottom: var(--wp--custom--spacing--xx-small);
		}
	}
}

/* ------------------------------------------- */
/* woocommerce-cart-form */
/* ------------------------------------------- */
.woocommerce {
	table.shop_table {
		border:1px solid var(--wp--preset--color--border-normal);
		border-collapse:collapse;
		font-size: var(--wp--preset--font-size--small);
		th {
			font-weight: normal;
			background-color: var(--wp--preset--color--bg-secondary);
		}
		img {
			border:1px solid var(--wp--preset--color--border-normal);
		}
		td.product-price,
		td.product-quantity,
		td.product-subtotal {
			text-align: right;
		}
		button{ /* クーポンを適用 / お買い物かごを更新 */
			height:50px;
		}
		&.woocommerce-checkout-review-order-table{
			td:last-child {
				text-align: right;
			}
		}
	}
	.woocommerce-cart-form table.shop_table {
		margin-bottom: var(--wp--custom--spacing--small);
	}
}

.woocommerce-cart .cart-collaterals {
	.cart_totals {
		h2 {
			font-weight: normal;
			margin-bottom:var(--wp--custom--spacing--xx-small);
		}
		table {
			border-collapse:collapse;
		}
		.cart-subtotal,
		.order-total {
			td {
				text-align: right;
			}
		}
		.wp-element-button {
			padding: 0.5em 1em;
			font-size: var(--wp--preset--font-size--large);
		}
	}
}
/* ------------------------------------------- */
/* 商品一覧 */
/* ------------------------------------------- */
.wp-block-woocommerce-product-template {
	// カートに追加ボタンなどを下に揃える
	li.wc-block-product {
	display: flex;
	flex-direction: column;
	}
	.wp-block-woocommerce-product-button {
		margin-top: auto;
	}
}
