
.product_bar{
  display: flex;
  padding-top: 8px;
  padding-right: 0px;
  padding-bottom: 8px;
  border-radius: 6px;
  align-items: stretch;
  align-items: center;

}

/* В toolbar каталога padding задаёт catalog_shell — иначе FOUC при загрузке CSS */
.catalog-shell__toolbar .product_bar {
	padding: 0;
	margin: 0;
}

.product_bar .card_changer{
  margin-left:auto; 
}

.catalog-shell:not(.catalog-shell--no-sidebar) .card_changer--marketplace {
	display: none;
}

@media (max-width: 991px) {
	.card_changer--marketplace {
		display: none !important;
	}
}


.product_bar .card_filter {
	display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    border-radius: 4px;
    padding: 6px 10px;
}


.product_bar .card_filter img{
    width: 16px;
}


/* Переключатель */
.card_changer {
	display: flex;
	height: fit-content;
}

.card_changer button{  
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 40px;
  padding: 6px 10px;
  background-color: var(--color-stage, #fff);
  border-color: var(--color-border, #ebebeb);
  color: var(--color-text-stage, #202020);
  cursor: pointer;
}

.card_changer button.active{
  background-color: var(--color-back-stage, #f5f5f5);
  border-color: var(--tv-action-primary, #6366f1) !important;
  box-shadow: inset 0 0 0 1px var(--tv-action-primary, #6366f1);
}

.card_changer button img{  
	width: unset;
}

.card_changer button:not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-right: -1px;
}

.card_changer button:not(:first-child) {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.card_changer button:hover{
	background-color: color-mix(in srgb, var(--color-text-stage, #202020) 4%, var(--color-stage, #fff));
}

html.dark .card_changer button {
	background-color: var(--color-stage);
	border-color: var(--color-border);
	color: var(--color-text-stage);
}

html.dark .card_changer button.active {
	background-color: color-mix(in srgb, var(--tv-action-primary, #818cf8) 22%, var(--color-stage));
	border-color: var(--tv-action-primary, #818cf8) !important;
	box-shadow: inset 0 0 0 1px var(--tv-action-primary, #818cf8);
}

html.dark .card_changer button:hover {
	background-color: color-mix(in srgb, var(--color-text-stage) 6%, var(--color-stage));
}

html.dark .card_changer button.active:hover {
	background-color: color-mix(in srgb, var(--color-text-stage) 10%, var(--color-border));
}


.middle_container{
  margin-right: 15px;
  margin-left: auto;
}

.middle_container img{
  width: 27px;
  position: relative;
  top: -2px;
  cursor: pointer;
  transition: .3s;
}

.middle_container img:hover{
  filter: saturate(1.5);
  filter: drop-shadow(1px 4px 3px #eb3871);
}


.middle_container .column_3{
  width: 28px;
  margin-right: 5px;
  filter: grayscale(1);
  top: -1px;
}

.middle_container .column_3.grid_3{
  filter: grayscale(0);
}


.middle_container .column_3:hover{
  filter: drop-shadow(1px 4px 3px #47c4ea);
}


/* фильтры в сайт-баре */

.product_bar_filter  {
    display: flex;
}

.product_bar_filter span{ 
  display: flex;
  align-items:center;
  padding: 6px 15px;
  margin-right: 23px;
  text-align: center;
  cursor:pointer;
}


.product_bar_filter span:hover {
  background-color: #94a7c8;
  color: white;
}















