.catalogo {
	width: auto;
}

.catalogo .spoiler_varianti_content.open {
	flex-basis: 100%;
}

.catalogo .catalogo_articolo.ajaxtarget {
	clear: both;
}

.catalogo .content_block {
	position: relative;
}

/********** LAYOUT B2C **********/

	.catalogo .catalogo_box.catalogo_b2c {
		margin-bottom: 10px;
	}
	
	.catalogo .catalogo_box.catalogo_b2c .catalogo_content {
	    display: flex;
		flex-wrap: wrap;
	}

	.catalogo .catalogo_box.catalogo_b2c .content_block.block1 {
	    display: flex;
	    flex-direction: column;
		padding: 10px;
	}
	
	.catalogo .catalogo_box.catalogo_b2c .content_block.block2 {
	    display: flex;
		flex-direction: column;
		flex: 1 1 0%;
		padding: 10px;
	}
	
	.catalogo .catalogo_box.catalogo_b2c .content_block.block3 {
		flex-basis: 220px; /* Se si vogliono tutti i .content_block.block3 grandi uguali */
		padding: 10px;
	}
	
	.catalogo .catalogo_box.catalogo_b2c .content_block.block4 {
		display: flex;
		flex-wrap: wrap;
		flex-basis: 100%;
		padding: 10px;
	}
	
	.catalogo .catalogo_box.catalogo_b2c .content_block.block1 .articolo_immagine {
		flex: 0;
	}
	
	.catalogo .catalogo_box.catalogo_b2c .content_block.block4 > .button_acquista_container {
		padding: 0 10px 10px 0;
	}
	
	.catalogo .catalogo_box.catalogo_b2c .content_block .articolo_input_actions + .articolo_configurabile {
		padding-top: 2px;
	}

/* --------- LAYOUT B2C --------- */

/********** LAYOUT B2B **********/

	.catalogo .catalogo_articolo_container.b2b > table > thead > tr > th {
		font-weight: bold;
		padding: 3px;
	}
	
	.catalogo .catalogo_articolo_container.b2b > table > thead > tr > th,
	.catalogo .catalogo_articolo_container.b2b > table > tbody > tr > td {
		border: 1px solid #eee;
	}
	
	.catalogo .catalogo_articolo_container.b2b > table > thead > tr > th.catalogo_b2b_col_50 {
		min-width: 210px;
	}
	
	.catalogo .catalogo_articolo_container.b2b > table > thead > tr > th.catalogo_b2b_col_40 {
		min-width: 70px;
	}
	
	.catalogo .catalogo_articolo_container.b2b > table > tbody > tr > td.odd,
	.catalogo .catalogo_articolo_container.b2b > table > tbody > tr > td.pair {
		padding: 15px;
	}
	
	.catalogo .catalogo_box.catalogo_b2b .catalogo_b2b_col_10 .content_block > .articolo_immagine {
		padding: 20px 0;
	}
	
	.catalogo .catalogo_box.catalogo_b2b .catalogo_b2b_col_20 .content_block {
	    display: flex;
		flex-direction: column;
	}
	
	.catalogo .catalogo_box.catalogo_b2b .catalogo_b2b_col_30 .content_block {
		text-align: center;
	}
	
	.catalogo .catalogo_articolo_container.b2b > table > tbody > tr > td {
		vertical-align: top;
	}
	
	.catalogo .catalogo_box.catalogo_b2b .catalogo_b2b_col_50 .content_block .button_acquista_container + .spoiler_varianti,
	.catalogo .catalogo_box.catalogo_b2b .catalogo_b2b_col_50 .content_block .articolo_input_actions + .articolo_configurabile {
		padding-top: 2px;
	}

/* --------- LAYOUT B2B --------- */

/********** LAYOUT MATRIX (e contesto widget hint ".catalogo_hint") **********/

/* Nota: .catalogo_hint NON E' contenuto in ".catalogo", ma possiamo referenziarlo similmente con ".catalogo_articolo" */

	.catalogo .catalogo_articolo_container.matrix {
	    display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: unset;
		container-type: inline-size;
		container-name: catalogo_articolo_container_matrix;
	}
	
	.catalogo .catalogo_articolo_container.matrix .catalogo_articolo,
	.catalogo.vetrina .catalogo_articolo_container.matrix .catalogo_box.catalogo_matrix {
		flex: 1 0 24%;
		margin: 5px;
		border: 1px solid #ccc;
	}
	
	#body.ec_mode_3 .catalogo .catalogo_articolo_container.matrix .catalogo_articolo,
	#body.ec_mode_3 .catalogo.vetrina .catalogo_articolo_container.matrix .catalogo_box.catalogo_matrix {
		flex: 1 0 45%; /* A parte che il valore di default sarebbe troppo piccolo, se non aumentiamo la % le schedine rimangono disallineate */
	}
	
	.catalogo .catalogo_box.catalogo_matrix,
	.catalogo .catalogo_articolo_container.matrix .catalogo_articolo,
	.catalogo_articolo .catalogo_box.catalogo_matrix.catalogo_hint {
		min-width: 240px;

		/*! max-width: 310px; */
		/*! height: 100%; */
	}
	
	.cms_content .catalogo_articolo {
		/*! max-width: 240px; */
	}
	
	.catalogo .catalogo_box.catalogo_matrix:hover,
	.catalogo_articolo .catalogo_box.catalogo_matrix.catalogo_hint:hover {
		/*box-shadow: 0 1px 5px 0 rgb(0 0 0 / 20%);*/
	}
	
	.catalogo.vetrina .catalogo_box.catalogo_matrix {
		height: unset; /* Altrimenti in vetrina non autoallinea gli elementi (align-items) */
	}
	
	.catalogo .catalogo_box.catalogo_matrix .catalogo_content,
	.catalogo_articolo .catalogo_box.catalogo_matrix.catalogo_hint .catalogo_content {
		height: 100%;
		min-height: unset !important;
		padding: 20px 5px;
	}
	
	.catalogo .catalogo_box.catalogo_matrix .catalogo_content .content_block,
	.catalogo_articolo .catalogo_box.catalogo_matrix.catalogo_hint .catalogo_content .content_block {
	    display: flex;
	    flex-wrap: nowrap;
		flex-flow: column nowrap;
		min-height: 100%;
	}
	
	.catalogo .catalogo_box.catalogo_matrix .catalogo_content .content_block > div,
	.catalogo_articolo .catalogo_box.catalogo_matrix.catalogo_hint .catalogo_content .content_block {
		padding: 2px 20px;
	}
	
	.catalogo .catalogo_box.catalogo_matrix .articolo_prezzo,
	.catalogo_articolo .catalogo_box.catalogo_matrix.catalogo_hint .articolo_prezzo {
		margin-top: auto;
	}
	
	.catalogo .catalogo_box.catalogo_matrix .content_block > .button_acquista_container::before {
		content: "\00a0";
		line-height: 3.3em;
	}
	
	.catalogo .catalogo_box.catalogo_matrix .content_block .articolo_input_actions + .articolo_configurabile {
		padding-top: 2px;
	}
	
	/* Contesto correlati (modalità tabs cascade) */
	
	.scheda_articolo_tabs.cascade .catalogo.correlati .catalogo_articolo {
		max-width: 310px;
	}
	
	/* ... se hscroll */
	
	.scheda_articolo_tabs.cascade.hscroll .catalogo.correlati .catalogo_articolo_container.matrix {
		flex-wrap: nowrap;
	}
	
	.scheda_articolo_tabs.cascade.hscroll .catalogo.correlati .catalogo_articolo_container.matrix > .catalogo_articolo {
		min-height: 600px;
	}
	
	.scheda_articolo_tabs.cascade.hscroll .catalogo.correlati .catalogo_articolo_container.matrix > .catalogo_articolo,
	.scheda_articolo_tabs.cascade.hscroll .catalogo.correlati .catalogo_articolo_container.matrix > .catalogo_articolo > .catalogo_box.catalogo_matrix {
		min-width: 290px;
	}
	
	/* ... se bxSlider */
	
	.scheda_articolo_tabs.cascade.bxSlider .catalogo.correlati .catalogo_articolo_container.matrix .catalogo_articolo {
		/* Utilizzo dei border per emulare il margin+background simile al normale catalogo matrix */

		/* NOTA: si veda anche catalogo_content.html dove con codice js si va a rimuovere lo spessore di questo border sul max-width dello bxslider */
		margin: 0;
		border: 5px solid var(--wec-color-bg-contro);
	}
	
	.scheda_articolo_tabs.cascade.bxSlider .catalogo.correlati .catalogo_page .bx-wrapper {
		box-shadow: none;
	}
	
	.scheda_articolo_tabs.cascade.bxSlider .catalogo.correlati .catalogo_page .bx-wrapper .bx-controls-direction .bx-prev, 
	.scheda_articolo_tabs.cascade.bxSlider .catalogo.correlati .catalogo_page .bx-wrapper .bx-controls-direction .bx-next {
		color: transparent;

		/* background: url(/mediaweb/std_ec/css/jquery.bxSlider/rsoft_controls.png) no-repeat 0 -32px; */
		background: none;
		text-indent: 0;
	}
	
	.scheda_articolo_tabs.cascade.bxSlider .catalogo.correlati .catalogo_page .bx-wrapper .bx-controls-direction .bx-next {
		/* background: url(/mediaweb/std_ec/css/jquery.bxSlider/rsoft_controls.png) no-repeat -43px -32px; */
		text-indent: -15px;
	}

/* --------- LAYOUT MATRIX (e contesto widget hint ".catalogo_hint") --------- */

/********** GALLERY **********/

	.catalogo_articolo_gallery_container {
		padding: 0 !important;
		margin: 0 auto;
	}
	
	.catalogo_articolo_gallery_container.sliderizzato {
		width: 100%;
		max-width: unset !important;
	}

	.catalogo_articolo_gallery_container .bx-wrapper {
		margin: 0 auto;
		box-shadow: none;
	}
	.catalogo_articolo_gallery_container .bx-wrapper .bx-viewport {
		z-index: 100; /* Mette .bx-controls sotto se stesso, per permettere click sugli elementi */
	}
	
	
	.catalogo_articolo_gallery_container .bx-wrapper .bx-controls .bx-controls-direction a {
		display: flex;
		align-items: center;
		justify-content: center;
		text-decoration: none;
		background-image: none;
	}
	
	.catalogo_articolo_gallery_container .bx-wrapper .bx-controls .bx-controls-direction a.bx-prev {
		left: -50px;
	}
	
	.catalogo_articolo_gallery_container .bx-wrapper .bx-controls .bx-controls-direction a.bx-next {
		right: -50px;
	}

	.catalogo_articolo_gallery_container .catalogo_articolo_gallery {
	    display: flex;
	}
	
	.catalogo_articolo_gallery_container .catalogo_articolo_gallery > div {
		flex: 0;
		min-width: 73px;
		max-width: 73px;
		width: 73px;
	}
	
	.catalogo_articolo_gallery_container .catalogo_articolo_gallery > div img {
		border: 1px solid #ccc;
		padding: 1px;
	}
	
	.catalogo_articolo_gallery_container .catalogo_articolo_gallery .catalogo_articolo_immagini_gallery:not(.bx-clone) {
		cursor: pointer;
	}

/* --------- GALLERY --------- */

/********** VIS NAV (catalogo e scheda articolo) **********/

	.vis_nav {
		position: relative;
		width: 100%;
		padding: 0 0 10px;
		font-weight: bold;
	}

	.vis_nav a {
		text-decoration: none;
	}
	
	.vis_nav .actions {
		display: inline-block;
	}

	/* Contesto catalogo correlati */
	
	.catalogo.correlati .vis_nav {
		display: none;
	}

	/* Contesto scheda articolo */
	
	#tab_scheda_articolo > .vis_nav {
		font-size: 0.8em;
		padding-bottom: 20px;
	}
	
	#tab_scheda_articolo > .vis_nav .vis_nav_backlink,
	#tab_scheda_articolo > .vis_nav ol {
		display: inline-block;
	}

/* --------- VIS NAV (catalogo e scheda articolo) --------- */

/********** SLIDE VETRINA (#slide_vetrina) **********/

	#tabs-vetrina #slide_vetrina {
		width: 608px;
		list-style: none;
	}
	
	#tabs-vetrina #slide_vetrina img {
		border-width: 0;
	}
	
	#tabs-vetrina #slide_vetrina h3  {
	    color: #004B93;
	    font-weight: bold;
	}
	
	#tabs-vetrina #slide_vetrina li p  {
	    line-height: 1.5em;
	}

/* --------- SLIDE VETRINA (#slide_vetrina) --------- */

/********** CMS INTRO + IMMAGINE CATALOGO (.cms_content.cms_intro e .catalogo_image) **********/

	.catalogo .catalogo_image,
	.catalogo .cms_content.cms_intro {
	}
	
	.catalogo .catalogo_image img {
		width: 1280px; /* See templatetag draw_grumerc_or_sgrumerc_image */
		height: 200px; /* See templatetag draw_grumerc_or_sgrumerc_image */
	}
	
	.catalogo .cms_content.cms_intro img {
		width: 100%;
	}

/* --------- CMS INTRO + IMMAGINE CATALOGO (.cms_content.cms_intro e .catalogo_image) --------- */

/********** CATALOGO FILTRO **********/
/*
	.catalogo_filtro, all'interno di un catalogo, si presenta due volta, una come .header, una come .footer
*/

	.catalogo_filtro {
		padding: 5px;
	}
	
	.catalogo_filtro.header {
		margin-bottom: 10px;
	}
	
	.catalogo_filtro.footer {
		margin-top: 10px;
	}

	.catalogo_filtro .catalogo_filtro_items {
	    display: flex;
		flex-wrap: wrap;
		align-items: center;  
		gap: 20px;
	}
	
	.catalogo_filtro .catalogo_filtro_items .label {
		display: none;
	}

	.catalogo_filtro .catalogo_filtro_items button .with_image img {
		width: 80px;
		height: 20px; /* Per adeguare altezza bottoni a quelli senza immagine */
	}

	.catalogo_filtro .catalogo_filtro_items button .without_image {
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.catalogo_filtro .catalogo_filtro_items button .without_image {
		white-space: nowrap; 
	}
	
	.catalogo_filtro .catalogo_filtro_items button .catalogo_filtro_text {
		display: none;
	}
	
	/* Contesto catalogo correlati (scheda articolo) con tabs cascade */
	
	#tabs-scheda_articolo .tab_cascade_content .catalogo.correlati .catalogo_filtro.footer {
		display: none;
	}

/* --------- CATALOGO FILTRO --------- */

/********** CATALOGO ATTRIBUTI **********/

/* Hint: ul.attributi > li.attributo > ul.attributi_opzioni > li.attributo_opzione */

	/* Fix .box_menu */
	
	.box_menu.attributi > .box_menu_item {
		cursor: default;
	}

	.box_menu.attributi > .box_menu_item:hover {
		color: unset;
	}
	
	.box_menu.attributi > .box_menu_item ul.attributi_opzioni > li.attributo_opzione:hover .flowbite_form_field_checkbox_option,
	.box_menu.attributi > .box_menu_item ul.attributi_opzioni > li.attributo_opzione.checked .flowbite_form_field_checkbox_option {
		background-color: var(--wec-color-focus);
	}
	
	.areaside .box_menu.attributi {
		flex-direction: column;
	}
	
	/* Contesto lista attributi */
	
	.catalogo_attributi_filtro {
	}
	
	.catalogo_attributi_filtro_dialog {
		z-index: 10000; /* Override ".bx-wrapper .bx-controls-direction a" */
	}
	
	.ui-autocomplete.filter_attributi_autocompleter {
		z-index: 10001; /* Higher than z-index of ".catalogo_attributi_filtro_dialog" */
	}
	
	.catalogo_attributi_filtro ul.attributi > li.attributo {
		max-height: 140px; /* Questo valore è usato da codice js */
		overflow-y: auto; /* Questo valore è usato da codice js */
		position: relative;
	}
	
	.catalogo_attributi_filtro ul.box_menu.attributi > li.box_menu_item.attributo {
		flex: 1 1 20%;
		margin: 10px;
		padding: 0 10px 10px;
	}
	
	#body.ec_mode_3 .catalogo_attributi_filtro ul.box_menu.attributi > li.box_menu_item.attributo {
		flex: 1 1 45%;
	}
	
	.areaside .catalogo_attributi_filtro ul.box_menu.attributi > li.box_menu_item.attributo,
	.catalogo_attributi_filtro_dialog.catalogo_attributi_filtro ul.box_menu.attributi > li.box_menu_item.attributo {
		flex: 1 1 100%;
		width: 100%;
		margin: 0 0 10px;
	}
	
	.catalogo_attributi_filtro ul.attributi > li.attributo > .attributo_header {
		position: sticky;
		top: 0;
		display: block;
	}
	
	.catalogo_attributi_filtro ul.attributi > li.attributo > .attributo_header .tip {
		font-size: 0.6em;
		font-style: italic;
		vertical-align: middle;
	}
	
	.catalogo_attributi_filtro ul.attributi > li.attributo > .attributo_header .attributi_opzioni_handle {
		position: absolute;
		right: 0;
		top: 0;
		display: none;
		font-size: 0.8em;
		text-align: right;
		text-decoration: underline;
		color: #6087ff;
		cursor: pointer;
		border-right: 1px solid;
		border-style: dotted;
		padding-right: 2px;
	}
	
	.catalogo_attributi_filtro ul.attributi > li.attributo > .attributo_widget_alternativo {
		margin-bottom: 0;
	}
	
	.catalogo_attributi_filtro ul.attributi > li.attributo > .attributo_widget_alternativo.autocomplete > input {
		width: 100%;
	}
	
	/* Contesto lista opzioni di un attributo */
	
	.catalogo_attributi_filtro ul.attributi_opzioni {
	    display: flex;
	    flex-direction: column;
		list-style: none;
	}
	
	.catalogo_attributi_filtro ul.attributi_opzioni > li.attributo_opzione {
		order: 2;
	    display: flex;
	    align-items: center;
	    cursor: pointer;
	    margin-bottom: 0;
	}
	
	.catalogo_attributi_filtro ul.attributi_opzioni > li.attributo_opzione.checked {
		order: 1;
	}
	
	.catalogo_attributi_filtro ul.attributi_opzioni > li.attributo_opzione > * {
		padding: 0 2px;
		margin-bottom: 0;
	}
	
	.catalogo_attributi_filtro ul.attributi_opzioni > li.attributo_opzione > * > label {
		padding-block: 0;
	}
	
	.catalogo_attributi_filtro ul.attributi_opzioni > li.attributo_opzione > .attributo_opzione_descrizione {
		font-size: 0.9em;
	}
	
	.catalogo_attributi_filtro ul.attributi_opzioni > li.attributo_opzione > .attributo_opzione_counter {
		font-size: 0.8em;
		font-style: italic;
		vertical-align: text-bottom;
	}
	
	/* Contesto catalogo correlati (scheda articolo) con tabs cascade */
	
	#tabs-scheda_articolo .tab_cascade_content .catalogo.correlati .catalogo_attributi_filtro {
		display: none;
	}

/* --------- CATALOGO ATTRIBUTI --------- */

/********** PANELLO DI CONTROLLO CATALOGO **********/
/*
	.controlpanel, all'interno di un catalogo, si presenta due volta, una come .header, una come .footer
	
	.controlpanel contiene come diretti figli .catalogo_settings e .paginatore
*/

	.controlpanel {
	    display: flex;
	    flex-direction: row;
	    flex-wrap: nowrap;
	    justify-content: space-between;
	    gap: 5px;
	}
	
	.controlpanel > * {
		padding: 5px 0;
	}
	
	.controlpanel .paginatore {
		order: 1;
	}
	
	.controlpanel .catalogo_settings {
		order: 2;
		display: flex;
		flex-direction: row;
	    flex-wrap: nowrap;
	    gap: 5px;
	}
	
	.controlpanel .catalogo_settings .form_catalogo_layout legend,
	.controlpanel .catalogo_settings .form_catalogo_layout label {
		display: none;
	}
	
	.controlpanel .catalogo_settings .form_container {
		align-self: center;
	}
	
	.controlpanel .catalogo_settings .form_paginator_size_layout > .flowbite_form_field,
	.controlpanel .catalogo_settings .form_catalogo_layout > .flowbite_form_field {
		margin-bottom: 0;
	}

	/* Controlpanel header */
	
	.controlpanel.header {
		margin-bottom: 10px;
	}
	
	.controlpanel.header .form_paginator_size_layout,
	.controlpanel.header .paginatore .pagination {
		display: none;
	}
	
	/* Controlpanel footer */
	
	.controlpanel.footer {
		margin-top: 10px;
	}
	
	.controlpanel.footer .catalogo_settings .form_catalogo_layout,
	.controlpanel.footer .articolo_bookmark_box,
	.controlpanel.footer .catalogo_settings .box_generapdf {
		display: none;
	}

/* --------- PANELLO DI CONTROLLO CATALOGO --------- */

/********** GRIGLIA INPUT RAPIDO **********/

	.carrello_input_rapido {
	}
	
	.carrello_input_rapido .tblcontent_grid_collapsers {
		margin-bottom: 10px;
	}

/* --------- GRIGLIA INPUT RAPIDO --------- */