/* @group @variables */

[class*="m-opzione-list"] {
/*--head-3-font-family: var(--font-family-heading);*/
--head-3-font-size: 1.125rem;
--head-3-line-height: 1.33333333;
--head-3-font-weight: 400;
--head-3-font-variation-settings: "wght" 400;
--head-3-color: var(--color-primary);
/*--head-4-font-family: var(--font-family-heading);*/
--head-4-font-size: 1.125rem;
--head-4-line-height: 1.33333333;
--head-4-font-weight: 400;
--head-4-font-variation-settings: "wght" 400;
--head-4-color: var(--color-primary);
--opzione-list-background-color: var(--color-secondary);
}

[style*="--section: quaternary"] [class*="m-opzione-list"] {
--opzione-list-background-color: var(--color-white);
}

/* @end @variables */

/* @group @m-opzione-list */

[class*="m-opzione-list"] {
display: grid;
align-self: start;
grid-auto-flow: row;
grid-auto-columns: 1fr;
gap: .75rem;
background-color: var(--opzione-list-background-color);
padding: 1.125rem;
}

/* @end @m-opzione-list */

/* --------------------------------------------------------*/

/* @group @variables */

[class*="a-opzione-detail"] {
--opzione-detail-grid-auto-flow: row;
--head-4-margin-bottom: .75rem;
--head-4-font-weight: var(--font-weight-bold);
--head-4-font-variation-font-variation-settings: "wght" var(--font-weight-bold);
--head-5-font-weight: var(--font-weight-bold);
--head-5-font-variation-font-variation-settings: "wght" var(--font-weight-bold);
}

@container section (min-width: 26em) {

[class*="a-opzione-detail"] {
--opzione-detail-grid-auto-flow: column;
}

}

/* @end @variables */

/* @group @a-opzione-detail */

[class*="a-opzione-detail"] {
display: grid;
justify-content: start;
align-self: start;
grid-auto-flow: var(--opzione-detail-grid-auto-flow);
gap: .375rem;
}

/* @end @a-opzione-detail */

/* --------------------------------------------------------*/

/* @group @variables */

[class*="a-option-list"] {
--price-list-grid-auto-flow: row;
}

@container section (min-width: 26em) {

[class*="a-option-list"] {
--price-list-grid-auto-flow: column;
--price-list-after-content: '/';
}

}

/* @end @variables */

/* @group @a-option-list */

[class*="a-option-list"] {
display: grid;
justify-content: start;
align-self: start;
grid-auto-flow: var(--price-list-grid-auto-flow);
gap: .375rem;
}

[class*="a-option-list"] li:not(:last-of-type):after {
content: var(--price-list-after-content);
margin-left: .75rem;
}

/* @end @a-option-list */


