/**
 * Store selection block (multistore).
 *
 * One labelled select in the world's outlined form grammar plus the
 * store notice as a ruled note. Depends on css/foodmaster-tokens.css.
 */

.wp-block-foodmaster-store-selection-block,
.wp-block-woocommerce-foodmaster-store-selection-block {
	margin: 0 0 calc(var(--fm-m) * 2);
	font-family: var(--fm-font-body);
	color: var(--fm-black);
}

.wp-block-foodmaster-store-selection-block[data-body-background-color] {
	background: transparent;
}

.wp-block-foodmaster-store-selection {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: calc(var(--fm-m) * 1.5);
}

.wp-block-foodmaster-store-selection .wc-blocks-components-select__container {
	position: relative;
	display: grid;
	gap: 4px;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.wp-block-foodmaster-store-selection .wc-blocks-components-select__container:last-child {
	margin: 0;
}

.wp-block-foodmaster-store-selection .wc-blocks-components-select__label {
	position: static;
	transform: none;
	margin: 0;
	padding: 0;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2;
	color: var(--fm-n7);
}

.wp-block-foodmaster-store-selection .wc-blocks-components-select__select {
	appearance: none;
	-webkit-appearance: none;
	width: 100%;
	min-height: calc(var(--fm-m) * 6);
	margin: 0;
	padding: 0 calc(var(--fm-m) * 5) 0 calc(var(--fm-m) * 1.5);
	background: var(--fm-paper);
	border: 1.5px solid var(--fm-black);
	border-radius: var(--fm-radius);
	box-shadow: none;
	color: var(--fm-black);
	font-family: var(--fm-font-body);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
}

.wp-block-foodmaster-store-selection .wc-blocks-components-select__select:hover {
	background: var(--fm-paper);
	border-color: var(--fm-black);
}

.wp-block-foodmaster-store-selection .wc-blocks-components-select__select:focus,
.wp-block-foodmaster-store-selection .wc-blocks-components-select__container:focus-within .wc-blocks-components-select__select {
	outline: none;
	box-shadow: var(--fm-focus);
}

.wp-block-foodmaster-store-selection .wc-blocks-components-select__expand {
	position: absolute;
	inset-inline-end: calc(var(--fm-m) * 1.5);
	bottom: calc(var(--fm-m) * 3 - 12px);
	width: 24px;
	height: 24px;
	fill: var(--fm-black);
	pointer-events: none;
}

/* Store notice: a ruled note, not a coloured banner */
.wp-block-foodmaster-store-selection .wc-block-components-notice-banner,
.wp-block-foodmaster-store-selection .wc-block-components-notice-banner.is-info {
	margin: 0;
	padding: var(--fm-m) calc(var(--fm-m) * 1.5);
	background: var(--fm-paper);
	border: 1.5px solid var(--fm-black);
	border-radius: var(--fm-radius);
	color: var(--fm-black);
	box-shadow: none;
}

.wp-block-foodmaster-store-selection .wc-block-components-notice-banner > svg {
	display: none;
}

.wp-block-foodmaster-store-selection .wc-block-components-notice-banner__content {
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height: 1.4;
}

.wp-block-foodmaster-store-selection .wc-block-components-notice-banner__content div {
	margin: 0;
}

.wp-block-foodmaster-store-selection .wc-block-components-notice-banner__content strong {
	font-family: var(--fm-font-display);
	font-weight: 800;
	font-size: 17px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--fm-black);
}

/* Inside the WooCommerce order summary the rows sit on a 16px inner module */
.wc-block-checkout__sidebar .wp-block-woocommerce-foodmaster-store-selection-block,
.wc-block-components-order-summary .wp-block-woocommerce-foodmaster-store-selection-block {
	padding-inline: 16px;
}
