*,
	::before,
	::after {
		box-sizing: border-box;
		 -webkit-tap-highlight-color: transparent;
	}
	
	* {
	/*	border: 1px solid red;*/
	}
	
	html {
		font-size: 62.5%; /* 10px (62.5% от 16px) */
		
		scrollbar-gutter: stable;
	}
	
	html:focus-within {
		scroll-behavior: smooth;
	
	}
	
	[v-cloak] { display: none; }
	
		button, textarea {
		all: unset;
	}
	
		svg path {
	  stroke: inherit;
	  stroke-width: inherit;
	}
	
	ul[class] {
	  list-style: none;
	  padding-left: 0px;
	  margin: 0px;
	}
	
	ol {
		list-style: decimal;
	}
	blockquote, q {
		quotes: none;
	}
	
	blockquote::before, blockquote::after, q::before, q::after {
		content: none;
	}
	
	article {
		padding: 1.6rem;
	}
	
	a {
		color: inherit;
	}
	
	ul[role="list"],
	ol[role="list"] {
		list-style: none;
	}

	a:not([class]) {
		text-decoration-skip-ink: auto;
	}
	
	a:link {
		text-decoration:none;
	}
	
	img, picture {
		max-width: 100%;
		display: block;
	}
	
	input, button, textarea, select {
		font: inherit;

	}
	input[type="text"], [type="password"] {
		
width: 100%;
	}
	textarea {
	max-width: 83vw;
	}
	input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
	-webkit-appearance:none;
}
	
	select {
		border: var(--border);
		outline: none;
		border-radius: .4rem;
		padding: .5rem;
		background: white;
	}
	
	fieldset {
		border: var(--border);
    border-radius: .8rem;
    input {
    	    line-height: 1.6rem;
    font-weight: 600;
    font-size: 2rem;
    }
	}
	
	
	
	
::-webkit-scrollbar {
    width: 0.6rem;
    background-color: transparent;
}

::-webkit-scrollbar-track {
    background-color: transparent;
    border-radius: 3px;
    margin: 2px 0;
}

::-webkit-scrollbar-thumb {
    background-color: #cccccc;
    border-radius: 5px;
    border: 2px solid transparent;
    background-clip: content-box;
    transition: background-color 0.2s ease-in-out;
}

::-webkit-scrollbar-thumb:hover {
  /*  background-color: #ee534f;*/
}

::-webkit-scrollbar-button {
    display: none;
}

::-webkit-scrollbar-corner {
    background-color: transparent;
}

/* Для Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #cccccc transparent;
}

	
	
	
	@media (prefers-reduced-motion: reduce) {
		html:focus-within {
			scroll-behavior: auto;
		}
		*, ::before, ::after {
			animation-duration: 0.01ms !important;
			animation-iteration-count: 1 !important;
			transition-duration: 0.01ms !important;
			scroll-behavior: auto !important;
		}
	}

	
	textarea:not([class]), input[type="text"]:not([class]), input[type="search"], input[type="password"], input:not([class]), input[type="number"], input[type="submit"] {
		border: none;
		outline: none;
		background: none;
	}
	
	input[type="number"] {
		text-align: center;
	}
	
	input[type="submit"] {
		cursor: pointer;
	}
	
	textarea:disabled, .hidden {
		display: none;
	}
	
	p {
text-wrap: balance;
text-wrap-style: pretty;
    margin-top: 0;
    strong {
    font-weight: 500;
}
	}
	
		h1, h2, h3, h4, h5, h6, .p-page_name, .category_title {
		text-wrap: balance;
		margin-top: 0;
		padding: 0px;
		letter-spacing: -.9px;
		    line-height: 1.1;
		font-weight: 500;
	}
	 
	.p-page_name,
	h1,
	.category_title {
		font-size: clamp(2rem, 2vw, 2.5rem);
	}
	
	h3 {
		font-size: 1.7rem;
	}
	
	.category_title.home {
	font-size: clamp(2rem, 2vw, 3rem);
		max-width: 70rem;
		padding: calc(2rem + 2vw) 0;
		margin: 0;
	}

	re-captcha {
		display: none;
	}

	:root {
	--bg: oklch(0.98 0 0 / 1);
	--item-bg: oklch(0.98 0 0 / 1);
	  --box-sw: 2px 4px 10px oklch(0 0 0 / 0.05);
	  --shadow-s: inset 0 1px 2px oklch(1 0 0 / 0.19), 0 1px 2px oklch(0 0 0 / 0.19), 0 2px 4px oklch(0 0 0 / 0.08);
	  --box-item: 0 0 1px 0 #00000040, 0 3px 6px 0 #0000001f, 0 .5px 2px 0 #0000000f;
	  --box-sw-modal: 0px 4px 10px oklch(0.80 0 0 / 0.2);
	  --bg-active: oklch(0.57 0.19 257.86);
	  --bg-clear: oklch(0.67 0.22 25.47);
	  --border: 1px solid oklch(from var(--bg) calc(l - 0.03) c h);
	  --bg-img: oklch(0.98 0 0 / 1);
	  --btn-background-hover: oklch(0.92 0.04 264.41);
	  --bg-block: oklch(0.85 0 0 / 0.1);
	  --label: #6e6e6e;
	  --delete: oklch(0.53 0.2 27.16);
	  --index: calc(1wv + 1hv);
	  --radius: 1.8rem;
	  --radius2: 2rem;
	  --header-height: 60px;
	  --text-note: oklch(0.20 0 0);
	  --accent: oklch(0.42 0 0);
	}
	

	
	body {
		margin: 0px;
		padding: 0px;
		font-size: clamp(1.4rem, 2vw, 1.6rem);
		font-weight: 400;
		-webkit-font-smoothing: antialiased;
		vertical-align: baseline;
		font-family: system-ui;
		overflow-y: auto;
		overflow-x: hidden;
		min-height: 100dvh;
		text-rendering: optimizespeed;
		line-height: 1.4;
		color: #000;
		background: var(--bg);
	}
	
	
	
	.fixed {
		overflow-y: hidden;
	}
	

	.wrapper {
		display: grid;
		min-height: 100dvh;
		grid-template-columns: 100%;
		gap: 2rem;
    margin: 0 auto;
    grid-template-rows: auto 1fr;
    padding: 0 .5rem 0 .5rem;
    
		@media only screen and (max-width: 1023px) {
		display: grid;
        padding: 1rem .5rem;
			grid-template-rows: 1fr;
		}
	}
	
	.width_1000 {
		max-width: 102rem;
    margin: 0 auto;
	}
	

	.category_block {
		border-radius: var(--radius);
		padding: 1rem 2rem;
		background: white;
	}
	
	.nav_app {
		border-radius: 1.4rem;
		box-shadow: var(--shadow-s);
		backdrop-filter: blur(6px);
		isolation: isolate;
		background: oklch(1 0 0 / 0.9);
	}
	
	.animation_app {
		opacity: 0;
		visibility: visible;
		transition: opacity 200ms linear;
	}
	
	
	
	:is(.shop2__search.on_search,
	.shop2__catalog.on_catalog,
	.shop2__filter.on_filter) .app_underlay {
    position: fixed;
    z-index: -1;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-color: oklch(0.5 0 0 / 0.1);
}
	
	
	
	.product_label {
		display: grid;
    gap: .5rem;
    position: absolute;
	}
	
	.product_label.product-list {
		bottom: 1rem;
		left: 1rem;
		z-index: 5;
		font-size: 1.2rem;
		font-weight: 600;
	}
	
	.product_label.product-item {
		top: 1rem;
		left: 1rem;
	}
	
	.product-flag,
	.product-new,
	.product-spec,
	.discount_interest {
		color: white;
		padding: .5rem;
		border-radius: .6rem;
		width: fit-content;
	}
	
	.product-spec {
	background: oklch(0.28 0.13 261.41);
	}
	
	.product-new {
		background: oklch(0.42 0.19 308.77);
	}
	
	.discount_interest {
		background: var(--delete);
	}
	
	.info_block {
		border-radius: var(--radius);
		padding: 1rem 2rem;
		border: var(--border);
		background: white;
	}
	

	.button {
		display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: .5rem;
    padding: 1rem 2rem;
    color: white;
    border-radius: .8rem;
    cursor: pointer;
    box-shadow: var(--box-item);
    background: oklch(0.4 0 0);
	}
	
	.button_clear {
	display: inline-flex;
    gap: .5rem;
    padding: 1rem 2rem;
    color: var(--accent);
    cursor: pointer;
    align-items: center;
    border-radius: 1.5rem;
    @media (hover:hover) {
    	&:hover{
    	color: red;
    }
    }
	}

[data-tooltip] {
  position: relative;
  cursor: pointer;
}

[data-tooltip]::before {
  position: absolute;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* Стили для самого тултипа */
[data-tooltip]::before {
  content: attr(data-tooltip);

  /* Внешний вид */
  background-color: var(--accent);
  color: #fff;
  box-shadow: var(--box-item);
  padding: 5px 10px;
  border-radius: .6rem;
  white-space: nowrap; /* Запрет переноса строки */
}

/* Позиционирование для левого тултипа */
[data-tooltip][data-tooltip-pos="left"]::before {
  right: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-right: 10px;
}

/* Позиционирование для правого тултипа */
[data-tooltip][data-tooltip-pos="right"]::before {
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 10px;
}

/* Позиционирование для верхнего тултипа */
[data-tooltip][data-tooltip-pos="top"]::before {
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 10px;
}

/* Позиционирование для нижнего тултипа */
[data-tooltip][data-tooltip-pos="bottom"]::before {
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 10px;
}



/* Показываем тултип при наведении */
[data-tooltip]:hover::before {
  visibility: visible;
  opacity: 1;
}

	.header__top-one {
			max-width: 160rem;
			margin: 0 auto;
	        display: flex;
	}
	
	.header__top-2_hover {
    display: grid;
    align-items: center;
    justify-items: center;
    gap: .2rem;
		cursor: pointer;
		svg {
			fill: currentColor;
		}
	}
	
	
	
	.header__logo {
		display: flex;
		font-size: 3rem;
		font-weight: 600;
		position: relative;
		margin-top: .5rem;
	}
	
	
	.header__top-user {
		display: flex;
		z-index: 1001;
		gap: 1rem;
		position: fixed !important;
		bottom: 1rem;
		padding: 1rem 2rem;
		max-width: calc(100% - 1rem);
		font-size: clamp(1.2rem, 2vw, 1.4rem);
		background: oklch(1 0 0 / 0.5);
		@media only screen and (min-width: 1024px) {
		}
	}

	.location {
		display: grid;
		justify-items: center;
		cursor: pointer;
	}

.header__top-2_hover.active {
		color: var(--bg-active);
}

.cart-block {
	    display: flex;
    align-items: flex-end;
}
	
	.shop-cart-full{

	}
	
	#cart_total_amount {
		position: absolute;
		background-color: var(--accent);
		color: white;
		padding: 0px 5px;
		border-radius: 50px;
		border: 2px solid #f9f9fb;
		@media only screen and (min-width: 1024px) {
		top: -.5rem;
		left: 2.5rem;
		}
		@media only screen and (max-width: 1023px) {
			top: -.5rem;
			left: 2.2rem;
		}
	}
	
	
	


	.wrapper-main {
		display: flex;
		flex-direction: column;
		row-gap: 1rem;
		position: relative;
		width: 100%;
		max-width: 160rem;
		margin: 0 auto;
	}

	.main_category {
		display: grid;
		grid-template-columns: repeat(auto-fit,minmax(140px,1fr));
		gap: 30px 10px;
		margin-bottom: 1rem;
	}
	
	.summary_category {
		aspect-ratio: 1;
		position: relative;
		cursor: pointer;
		padding: 1rem;
		img {
			pointer-events: none;
			position: absolute;
			right: 0px;
			bottom: -30px;
			width: 110px;
		}
		
	}

	.block_advantages-menu {
		display: grid;
		gap: 1rem;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		overflow-x: auto;
		@media only screen and (max-width: 1023px) {
			scroll-snap-type: x;
			margin-bottom: 10px;
		}
	}
		.block_advantages-menu::-webkit-scrollbar {
			width: 0px;
			height: 0px;
		}
	
	.block_advantages {
		min-width: 240px;
		padding: 2rem;
		
		h3 {
			font-size: 2.6rem;
		}
		@media (hover: hover){
		&:hover {
		}
		}
	}
	
	.shop2_vendors-list {
		display: grid;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		gap: 1rem;
		    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
	}
	
	.main-product_list {
			@media only screen and (min-width: 1024px) {
				display: flex;
		gap: 2rem;
			}
		
	}
	
.category__menu {
	display: grid;
    gap: 1rem;
 grid-template-columns: repeat(auto-fill,minmax(20rem,1fr));
		@media only screen and (max-width: 1024px) {
			grid-template-columns: repeat(auto-fill,minmax(14rem,1fr)); 
		}
		@media only screen and (max-width: 770px) {
			grid-template-columns: repeat(auto-fill,minmax(12rem,1fr)); 
		}

	}
	
	.category__menu.home {	
			display: flex;
		gap: .5rem;
		position: initial;
		justify-content: space-between;
	}
	
	.category__menu.scrollable-container {
			&::-webkit-scrollbar {
			width: 0px;
			height: 6px;
		}
	@media only screen and (max-width: 1023px) {
			flex-wrap: nowrap;
	
		}
	}
	
	
	.nav_item-home {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    gap: .5rem;
    font-weight: 500;
    min-width: 16rem;
    font-size: 1.6rem;
}

.catalog-nav-list {
display: flex;
    gap: .5rem;
    margin: 1rem 0;
    flex-wrap: wrap;
}

    


.nav_item {
	    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    font-weight: 500;
    background: white;
    border-radius: 1.4rem;
	img {
	object-fit: contain;
    height: auto;
    aspect-ratio: 0.75;
    mix-blend-mode: multiply;
	}
	span {
		    overflow: hidden;
		    height: 2lh;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    white-space: normal;
    text-align: center;
    overflow-wrap: anywhere;
    padding: 0 0.4rem;
	}
}
	
	aside {
		flex-shrink: 0;
		@media only screen and (max-width: 1023px) {
        display: none;
	        position: fixed;
        z-index: 100;
        top: 0rem;
        left: -100%;
        background: white;
        overflow: auto;
        padding: 1rem 1rem 4rem 1rem;
        height: 100dvh;
        transition: .5s;
		}
     &.open {
     	left: 0;
     	}
		@media only screen and (min-width: 1024px) {
				width: 270px;
		}
		nav {
			display: grid;
		}
	
	}
	
	 
	
	.details_1 .category_1 {
	}
	.aside_hover {
		padding: .2rem .5rem;
	}

	
	.aside-product_list {
		position: sticky;
    top: 1rem;
    overflow: auto;
    max-height: 90vh;
        overscroll-behavior: none;
            scrollbar-width: none;
	}
	
	.shop2-sorting-param.shop2-sorting-param-desc:after {
		content: "\2193";
	}
	.shop2-sorting-param.shop2-sorting-param-asc:after {
		content: "\2191";
	}
	
	.filter-body {
    display: grid;
    grid-template-rows: auto 1fr auto;
    height: 96dvh;
    overflow: hidden;
    @media only screen and (max-width: 600px) {
    border-radius: var(--radius) var(--radius) 0 0 !important;
    height: 98dvh;
    }
	}
	
	.shop2__filter {
    z-index: 1001;
    top: 2rem;
    right: -300px;
    position: fixed;
    width: 300px;
    transition: .3s ease;
    padding: 1rem;
    @media only screen and (max-width: 600px) {
    	top: 150%;
    	width: 100%;
    	right: 0;
    	padding: 0;
    }
	}

  .live__filter {
        overflow: auto;
        padding: .5rem;
    }
    
    .filter-group {
    padding: 1rem;
    border-radius: 1rem;
    margin: .5rem 0;
    }
    
    .filter__title {
    	font-size: 2rem;
    display: flex;
    justify-content: space-between;
    padding: 1rem 2rem;
    font-weight: bold;
    border-bottom: var(--border);
  background: oklch(0.96 0 0 / 1);
    }
    
    .options-list {
    	max-height: 30rem;
    overflow: auto;
    }
    
    .options-list li {
    	    display: flex;
    align-items: center;
    font-weight: 500;
    }
    
    .filter-option {
			display: flex;
			align-items: center;
			gap: 1rem;
			cursor: pointer;
			position: relative;
			margin-bottom: .5rem;
		font-weight: 600;
		}
    
    
    .filter-option:before {
		position: relative;
		display: block;
		content: "";
		width: 48px;
		height: 26px;
		border-radius: 50px;
		background: oklch(0.94 0 0 / 1);
		flex-shrink: 0;
	}
	
	.filter-option:after {
		position: absolute;
		display: block;
		content: "";
		width: 20px;
		height: 20px;
		border-radius: 50px;
		transition: .3s;
		background: oklch(1 0 0 / 1);
		left: 4px;
		box-shadow: 1px 1px 1px 1px rgba(0,0,0,.06);
	}
	
	.filter-option.active.filter-option:before {
		background: oklch(0.71 0.15 257.16);
	}	

	.filter-option.active.filter-option:after {
	transform: translateX(20px);
	}
    
    .filter-option.disabled {
  opacity: 0.3;
  pointer-events: none;
  cursor: not-allowed;
}
    
    
    .filter__footer {
    	    display: flex;
    justify-content: space-between;
    padding: 1rem;
    align-items: center;
    border-top: var(--border);
    background: oklch(0.96 0 0 / 1);
    }
    
    
    .filter__reset-all{
    opacity: 1;
    transition: opacity .2s;
    border-radius: 1rem;
		&.hide{
			opacity: 0;
			pointer-events: none;
			cursor: not-allowed;
		}
    }

.shop2__filter.on_filter{
	right: 0;
@media only screen and (max-width: 600px) {
    	top: 2rem;
    }
}


:is(.shop2__filter.on_filter) .filter-underlay  {
	position: fixed;
    z-index: -1;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
}
	
	:is(.shop2__filter) td {
		display: flex;
		flex-direction: column;
		gap: .5rem;
		span {
			display: flex;
			align-items: center;
			gap: 1rem;
			cursor: pointer;
			position: relative;
		}
		img {
			object-fit: contain;
		}
	}
	
	.shop-filter-param-val:before {
		position: relative;
		display: block;
		content: "";
		width: 48px;
		height: 26px;
		border-radius: 50px;
		background: #0000001f;
	}
	
	.shop-filter-param-val:after {
		position: absolute;
		display: block;
		content: "";
		width: 20px;
		height: 20px;
		border-radius: 50px;
		transition: .3s;
		background: #0000007a;
		left: 4px;
		box-shadow: 1px 1px 1px 1px rgba(0,0,0,.06);
	}
	
	.shop-filter-param-val-active.shop-filter-param-val:before {
		background: #2662d959;
	}	

	.shop-filter-param-val-active.shop-filter-param-val:after {
		
	transform: translateX(20px);
	background: var(--bg-active);
	}
	
	.filter_result {
   border: var(--border);
    border-radius: var(--radius);
    color: red;
    padding: .5rem 2rem;
    font-weight: 600;
	}
	
	:is(.filter_result-hide) #filter-result {
		display: none;
	}
	
	

	.item__body {
		display: none;
	}
	
	
	#options__filter::-webkit-scrollbar {
		width: 0px;
		height: 0px;
	}
	
	
	.scrollable-container {
		overflow-x: scroll;
		scrollbar-width: none;
	}
	
	
	.products-controls {
	margin-bottom: 1.5rem;
    background: var(--bg);
    display: flex;
    gap: 1rem;
    padding: 1rem 0rem;
    align-items: center;
    position: sticky;
    top: 0rem;
    z-index: 10;
	}
	
	.products-controls-item {
		   display: flex;
    align-items: center;
    background: white;
    border-radius: .8rem;
    padding: .5rem 1rem;
    height: 4rem;
    gap: .5rem;
	}
	
	.shop2-sorting__params {
		display: flex;
      gap: 1rem;
      padding: 0 1rem;
      align-items: center;
position: sticky;
    top: 0rem;
    @media only screen and (max-width: 1023px) {
			top: 0rem;
		}
    z-index: 1000;
	}
	
.sort-by_price {
   cursor: pointer;
		display: flex;
		align-items: center;
		gap: .5rem;
    padding: 1.2rem;
	}
	
	#options__filter {
		display: flex;
  gap: .4rem;
	}

	.filter_aside {
		@media only screen and (max-width: 1023px) {
		    position: fixed;
			top: 0;
			bottom: 56px;
			left: -100%;
			background: white;
			z-index: 1000;
			transition: .5s all;
			overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-gutter: stable;
		}
	}
	.filter_aside.open {
		left: 1%;
	}
	
	.batton-shop2__filter {
		display: flex;
		align-items: center;
		padding: 0 0.5rem;
			display: none;
		@media only screen and (min-width: 1024px) {
		}
	}
	.close-overlay {
		position: fixed;
		inset: 0;
	}
	
	.category_aside {
		display: grid;
		position: relative;
	}
	
	.category_1 {
	position: relative;
	    display: flex;
    align-items: center;
    gap: 1rem;
    font-weight: 600;
	}
	 
	
	
	.category_2 {
		margin-left: 1rem;
	}
	.category_3 {
		margin-left: 3rem;

	}
	
	.category_1:hover,
	.category_2:hover,
	.category_3:hover {
		color: var(--bg-active);
	}
		
		:is(.category_1.active):after {
    position: absolute;
    content: "";
    width: 3px;
    height: 20px;
    transition: .5s;
    background: var(--bg-active);
    left: 0;
}
	.category_1.active,
	.category_2.active,
	.category_3.active {
    color: var(--bg-active);
	}

	.fade-up-element {
		display: inline-block;
		animation:1s ease 0s 1 normal forwards running fadeIn-up;
	}
	
@keyframes fadeIn-up {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
	
		
	
	.shop_window {
		display: flex;
		flex-direction: column;
		width: 100%;
	}
	

	
	
	
	
	
	
	.tpl-product-list-v {
	display: grid;
	gap: 2rem 1rem;
		grid-template-columns: repeat(auto-fill,minmax(227px,1fr));
		@media only screen and (max-width: 1024px) {
			grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); 
		}
		@media only screen and (max-width: 770px) {
			grid-template-columns: repeat(auto-fill,minmax(160px,1fr)); 
		}
	}
	
	.product__item {
		display: grid;
		height: fit-content;
	}
	
	
	.buy_button,
	a.cart-link {
        cursor: pointer;
    display: flex;
    width: 100%;
    height: 4rem;
    align-items: center;
    justify-content: center;
	}
	
	.list__buy-wrap-js,
	.add-to-cart-btn {
		display: flex;
    width: 100%;
    height: 4rem;
    align-items: center;
    justify-content: center;
    border-radius: 1rem;
    overflow: hidden;
    background: oklch(0.30 0 0 / 1);
    color: white;
    margin-top: .5rem;
	}

		.product__item.no_buy {
			filter: grayscale(1);
		}
	@media (hover: hover) {
		
		
		
		.product__item:hover .icon-quick_view {
			width: 40px;
			height: 40px;
			border-radius: 50%;
			background-color: rgba(54,59,69,0.3);
			backdrop-filter: blur(4px);
			-webkit-backdrop-filter: blur(4px);
			position: absolute;
			z-index: 1;
			margin: 0px auto;
			right: 0px;
			left: 0px;
			cursor: pointer;
			transition: background-color 0.3s ease 0s;
		}
		.product__item:hover .icon-quick_view:hover {
			background-color: rgba(54,59,69,0.5);
			transform: scale(1.2);
			transition: all 0.3s ease 0s;
		}
		.product__item:hover .icon-quick_view {
			background-image: url("/d/fgs16_seo-reg_color.svg");
			fill: #ffffff;
			background-size: cover;
		}
	}
	

	.product__list {
		position: relative;
		overflow: hidden;
		border-radius: 1.4rem;
		background: var(--item-bg);
	}


	
	
	.product__unit {
		font-weight: 600
	}

	.product__item-image {
		-o-object-fit: contain;
		object-fit: contain;
		height: auto;
		width: 100%;
		aspect-ratio: 3 / 4;
		mix-blend-mode: multiply;
	}
	
	.product__bot {
		display: grid;
		justify-items: center;
	}
	
	
	
	.product_params_v {
		display: none;
    gap: .5rem;
    flex-wrap: wrap;
	}
	
	.list__buy-wrap {
	display: inline-flex;
    border-radius: .4rem .4rem 1rem 1rem;
    overflow: hidden;
    width: 100%;
    background: oklch(0.3 0 0);
    font-weight: 500;
    box-shadow: var(--shadow-s);
    color: white;
	}
	
	.list__buy-wrap.no_buy {
		 opacity: 0;
  pointer-events: none;
  cursor: not-allowed;
	}
	
	.product__buy {
		padding: 0 .5rem;
	}
	
	.product__price, .not_available, .product__status {
		font-size: 2.5rem;
		font-weight: 700;
	}
	
	.product__price-item, .not_available-item {
		font-size: 3rem;
		font-weight: 700;
	}
	
	
	.product__price-nds {
		font-size: 1.3rem;
	}
	
	
	.product__name {
	overflow: hidden;
    height: 2lh;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    white-space: normal;
    padding: 0 .5rem;
    font-size: 1.5rem;
	}
	
	.product__amount-field {
		width: 100%;
		text-align: center;
		box-shadow: none !important;
	}
	
	.amount_button {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr auto;
		align-items: center;
	}
	
	.amount_button input {
		height: 24px;
		padding: 0;
		background: none;
		font-weight: 600;
		border-left: 1px solid #ccc;
		border-right: 1px solid #ccc;
	}
	
	.product__amount-button-remove, .product__amount-button-add, .p__minus, .p__plus, .p_minus, .p_plus {
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
		user-select: none;
		-webkit-user-select: none;
		font-weight: bold;
		width: 100%;
    height: 100%;
	}
	
	.product__amount-button-remove, .p__minus, .p_minus {
		    position: relative;
		&::after{
			    content: '';
			width: 12px;
			height: 2px;
			background-color: #242424;
			position: absolute;
			inset: 0;
			margin: auto;
			}
	}
	
	.product__amount-button-add, .p__plus, .p_plus {
		position: relative;
		&::after{
			    content: '';
			width: 12px;
			height: 2px;
			background-color: #242424;
			position: absolute;
			inset: 0;
			margin: auto;
			}
		&::before {
			content: '';
			width: 12px;
			height: 2px;
			background-color: #242424;
			position: absolute;
			inset: 0;
			margin: auto;
			transform: rotate(-90deg);
		}
	}
	


/* Кнопка внутри ссылки */
a.cart-link > button.buy_button.in-cart {
	display: none;
  pointer-events: none;
  background: none;
  border: none;
  padding: 0;
  cursor: default;
}

/* Анимация при наведении на обычную кнопку */
button.buy_button:not(.in-cart):hover {
  color: var(--bg-active);
}
.list__buy-wrap:not(.in-cart):hover {
}


.list__buy-wrap:has(button.buy_button.in-cart) {
		color: oklch(1 0 0 / 1);
		background: oklch(0.57 0.19 257.86);
}



	.shop2__product-item {
		display: grid;
		align-items: start;
		justify-content: center;
		    gap: 1rem 3rem;
		@media only screen and (min-width: 1000px) {
			grid-template-columns: 525px .7fr auto;
			max-width: 1600px;
		}
		@media only screen and (max-width: 999px) {
			max-width: 70rem;
			margin: auto;
		}
	}
	

	.product-thumbnails-wrapper {
		display: flex;
    position: relative;
	background: white;
		border-radius: var(--radius);
		overflow: hidden;
		    @media only screen and (min-width: 1000px) {
		height: 70rem;
	}
	}
	
	
	
	.shop2__product-image {
		object-fit: contain;
    aspect-ratio: 3 / 4;
    height: auto;
	}
	
	.shop2__product-image-min {
		border-radius: 1rem;
		cursor: pointer;
	}
	
	.shop2__product-wrap {
		display: grid;
    justify-items: center;
    gap: 1rem;
    background: white;
    border-radius: 2rem;
		@media only screen and (min-width: 1000px) {
			position: sticky;
			top: 6.3rem;
		}
	
	}
	

	.product__buy-item {
		min-width: 19rem;
		    display: grid;
		gap: .4rem;
		background: var(--item-bg);
		padding: .4rem;
		border-radius: 1.4rem;
		@media only screen and (min-width: 1000px) {
			position: sticky;
			top: 6.3rem;
			box-shadow: var(--shadow-s);
		}
		@media only screen and (max-width: 999px) {
			grid-row: 2;
		}
	}
		.product__buy-item-1{
			border-radius: 1rem 1rem 0.4rem 0.4rem;
			background: white;
			padding: 1rem;
			box-shadow: var(--shadow-s);
		}
	
	
	
	

	
	.product-item_delivery {
		display: grid;
    gap: 1rem;
    color: oklch(0.57 0 0);
    background: white;
    border-radius: .4rem;
    padding: 0.5rem;
    box-shadow: var(--shadow-s);
		& > span {
			display: flex;
			gap: .5rem;
		}
	}
	
	
	.product__buy-wrap {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0.5rem;
		margin: 1rem 0;
	}
	.product__buy-wrap.no_buy {
		display: none;
	}
	
	.shop2__product-amount {
		display: flex;
		input{
			background: none;
			font-weight: 600;
		}
	}
	
	.shop2_button {
		background: var(--bg-active);
		border-radius: .5rem;
		color: white;
		font-weight: 500;
		box-shadow: var(--box-sw);
	}
	
	h1 > a {
		font-weight: 600;
	}
	
	.product_folder {
		display: inline-grid;
		gap: 1rem;
	}
	
	.product_vendor {
		display: inline-grid;
    grid-template-columns: 4rem auto auto;
    align-items: center;
    font-weight: 600;
    padding: .3rem .5rem;
    border-radius: 0.8rem;
    width: max-content;
    justify-items: center;
		img {
    	    object-fit: contain;
		}
	}
	
	.p__desc {
		display: grid;
		align-items: start;
		gap: .4rem;
		h1 {
			background: white;
			padding: 2rem 1rem;
			border-radius: 2rem 2rem 0.4rem 0.4rem;
			margin: 0;
		}
		& > div {
			background: white;
			padding: 1rem;
			border-radius: 0.4rem;
		}
		& > div:last-child {
			border-radius: 0.4rem .4rem 2rem 2rem;
			padding: 1rem 2rem;
		}
	}
	
:is(.get_product) .p__desc {
		background: #fff;
	    overflow: auto;
	    @media (prefers-color-scheme: dark) {
		}
	}
	

	
	.product_description-text {
		    line-height: 2rem;
	}
	
	.description_cert {
		display: grid;
		gap: 0.5rem;
		a {
			color: var(--bg-active);
		}
	}
	
	.description_cert-a {
		display: inline-flex;
		align-items: center;
		gap: .5rem;
	}
	
	.additional_sales {
		display: inline-block;
		margin-bottom: .5rem;
		font-size: 1rem;
		font-weight: 500;
		border-radius: 1rem;
		padding: .5rem;
		border: var(--border);
		background: white;
	}
	

	.product_params {
		    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .5rem 1rem;
	}

	
	.add__params, .event__params {
		display: grid;
		grid-template-columns: subgrid;
		grid-column: 1 / -1;
		align-items: end;
	}
	
	.params__name {
		    display: inline-grid;
    grid-template-columns: auto 1fr;
    color: #777;
    gap: 1rem;
	}
	
	.params__option {
    font-weight: 500;
	}
	
	
	.params__dotted {
		display: inline-block;
		width: 100%;
		border-bottom: 1px dotted #cccccc;
	}
	

		

	.footer-top-line {
		max-width: 160rem;
    margin: 2rem auto;
		display: flex;
		padding: 2rem;
		border-top: var(--border);
		border-bottom: var(--border);
		flex-wrap: wrap;
		gap: 1rem 3rem;
	}
	.footer__column {
		display: grid;
		row-gap: 1rem;
		height: fit-content;
	}
	
	.footer_headers {
		font-size: 1.6rem;
    font-weight: 500;
	}
	
	.footer__row{
		display: grid;
		row-gap: 1rem;
		font-size: 1.4rem;
	}
	.footer__left-place { font-size:1.1rem; }
	.social-block span {
		display: none;
		font-size: 1.1rem;
		margin-bottom: .7rem;
	}
	
	a.in {
		display: none;
		background: url("../instagram-32.png") 0px 0px no-repeat;
		width: 31px;
		height: 31px;
		border-radius: 50%;
		box-shadow: #cccccc 0px 5px 10px 0px;
	}
	
	
	.counters {
		color: #ffffff;
		font-size: 11px;
	}
	
	.copyright_text {
		color: hsl(0, 0, 30);
		font-size: 12px;
		padding: 0 1rem;
	}
	
	div.footer__timework {
		display: flex;
		flex-direction: column;
		width: max-content;
	}
	
	div.footer__timework a {
		width: max-content;
		margin-bottom: 10px;
	}
	
	div.footer__contacts {
		display: flex;
		flex-direction: column;
		width: max-content;
	}
	
	div.footer__contacts a {
		width: max-content;
		margin-bottom: 15px;
	}
	
	a.footer__menu__item-title {
		font-weight: 600;
	}
	
	a.footer__menu__item:hover {
		color: #0088cc;
	}
	
	.bottom-line {
		max-width: 160rem;
    margin: 0 auto;
	}
	
	.shop2-table-order th {
		border-bottom: var(--border);
	}
	.shop2-table-order td {
		border-bottom: var(--border);
	}
	.shop2-table-order p {
		display: flex;
		align-items: center;
	}
	
	.shop2-cart-content {
    justify-content: space-between;
    gap: .5rem;
    @media (max-width: 1024px) {
		flex-direction: column;
    }
	}
	
	.shop2-order-data legend {
		font-weight: 700;
		text-align: center;
	}
	
	.order__table-products {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 10px;
		border: var(--border);
		border-radius: .5rem;
		padding: .25rem;
	}
	
	.order__table-products > :first-child {
		width: 50px;
		height: 50px;
	}
	
	#shop2-cart-page {
		display: flex;
    flex-direction: column;
    isolation: isolate;
    gap: .2rem;
	}
	
	.cart__row:first-child {
		border-radius: 1rem 1rem 0.4rem 0.4rem;
	}

	.cart__row {
		transition: opacity 0.3s ease;
		opacity: 1;
		border-radius: 0.4rem;
		position: relative;
		background: white;
		box-shadow: var(--shadow-s);
	}
	
	.cart__row:last-child {
		background: white;
        border-radius: .4rem .4rem 1rem 1rem;
	}
	
	
	#shop2-cart {
		display: flex;
		gap: 1rem;
		margin: 1rem 0px;
		flex-wrap: wrap;
	}
	

	
	#cart-items-container {
		display: grid;
    gap: .4rem;
	}
	
	.product_container {
		display: flex;
		gap: .5rem;
		padding: .5rem;
	}
	
	.shop2-cart-image {
    img {
    	    height: auto;
    	    border-radius: .8rem;
    }
	}
	
	.cart__product {
		display: grid;
		@media (min-width: 550px) {
		grid-template-columns: 1fr 1fr;
        width: 100%;
		}
    gap: 1rem;
    a {
    	    max-width: 300px;
    margin: 1rem 1rem;
    font-size: 1.4rem;
    }
	}
	
	.shop2__UP {
		display: grid;
		gap: 10px;
		padding: 2rem 0;
	}
	
	.shop2_cart-body {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		align-items: center;
	}
	
	.shop2__amount-wrap {
		display: flex;
		gap: 2rem;
		justify-content: space-between;
	}
	
	.shop2__amount-wrap span {
		cursor: pointer;
		user-select: none;
		-webkit-user-select: none;
	}
	
	.cart-amount-btn.minus.disabled {
		color: #ccc;
		
	}
	
	.product__amount-button {
		display: grid;
		grid-template-columns: 4rem 6rem 4rem;
		border-radius: var(--radius2);
		background: var(--bg);
		margin-bottom: 1rem;
		    height: 4rem;
		    align-items: center;
    justify-items: center;
    border: var(--border);
	}
	
	.product__amount-button input {
		text-align: center;
		width: 60px;
		background: none;
		border: 0;
    outline: 0;
	}
	
	.shop2-cart-delete {
		position: absolute;
		right: .5rem;
		bottom: .5rem;
		fill: var(--label);
		width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
	}
	
	.total-row {
		display: flex;
		gap: 0.5rem;
	}
	
	.shop2__cart-sum {
    font-weight: 501;
		text-wrap: nowrap;
		font-size: 2rem;
	}
	
	.product__amount-button-remove.cart, .product__amount-button-add.cart {
		cursor: pointer;
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		user-select: none;
		-webkit-user-select: none;
	}
	
	label[for="user_fio"], [for="user_company"], [for="user_phone"], [for="user_email"], [for="user_note"] {
		display: grid;
	}
	
	
	.shop2-cart-totals {
		height: max-content;
    font-weight: 600;
    background: oklch(0.3 0 0);
    position: sticky;
    top: 1rem;
    color: white;
    border-radius: 1rem;
    padding: 2rem;
    box-shadow: var(--shadow-s);
	}
	
	.shop2-cart-totals td {
		padding: 0px .5rem;
	}
	
	.total-price.last-line {
		font-size: 2rem;
    font-weight: 501;
	}
	
	td.shop2-cart-body {
		border-bottom: var(--border);
	}
	
	.shop2-cart-delivery {
		    display: inline-grid;
    gap: .5rem;
    padding: 2rem;
    border-radius: 2.8rem;
    margin-bottom: 2rem;
    box-shadow: var(--shadow-s);
    background: white;
	}
	
	#delivery-0 {
		max-width: 340px;
	}
	
	#order-form input[type="text"], #order-form textarea, #shop2-order-receipt-pd4 input[type="text"], #shop2-order-receipt-pd4 textarea {
		outline: none;
	}
	
	#order-form strong, #shop2-order-receipt-pd4 strong {
		font-size: 15px;
		margin-right: .5rem;
	}
	
	#order-form strong.error, #order-form span.required, #shop2-order-receipt-pd4 strong.error, #shop2-order-receipt-pd4 span.required, ul.error li {
		color: red;
	}
	
	td.shop2-cart-body > div {
		display: none;
	}
	
	.highslide-body {
		display: none;
	}
	
	.shop2-order-completed {
		background: white;
		padding: .5rem;
		border-radius: 15px;
		margin: .5rem 0px;
		box-shadow: rgba(0,0,0,0.1) 0px 1px 6px;
	}
	
	#shop2-order-table fieldset {
		border-radius: .5rem;
		border: var(--border);
		background: white;
	}
	

	
	.shop_cart-button {
		background: var(--bg-active);
		padding: 1rem 2rem;
		border-radius: var(--radius);
		color: #fff;
		font-weight: 600;
		box-shadow: var(--box-sw);
	}
	

	
	
	#delivery_address {
		max-width: 300px;
		
	}
	
	.g-form-control-text.g-form-control-value.g-form-control--required, .g-form-control-text.g-form-control-value, .g-form-control-textarea.g-form-control-value, #orderForm > input:not([type="submit"]), textarea {

	background: none;
	}
	
	.g-form-field__required-mark {
		color: red;
	}
	
	.table {
		border-collapse: separate;
		border-spacing: 0px;
		border-radius: .5rem;
		background: white;
	}
	table {
    border-collapse: separate;
    border-spacing: 0px;
    overflow: hidden;
    table-layout: fixed;
	}
	
	tr:first-child th:first-child {
		}
 tr:last-child th:first-child {
}

tr:first-child td:last-child {
}
  tr:last-child td:last-child {
}
caption {
    font-weight: 600;
    margin-bottom: 0.5rem;
}
	td {
		padding: .4rem 1rem;
		text-align: left;
	}
	.shop2_product-params-list {
		display: table;
	}
	@media (max-width: 768px) {
	  table {
		display: block;
		overflow-x: auto;
		white-space: nowrap;
	  }
		th, td {
			white-space: nowrap;
		}
	}
	
	

	
	.no-move-close .highslide-header .highslide-move, .no-move-close .highslide-header .highslide-close { display:none; }
	.yashare-auto-init.b-share_theme_counter {
		border-top: 1px dotted #82a805;
		clear: both;
		text-align: right;
	}
	
	.g-page-article--main {
		display: block;
		background: #ffffff;
		border-radius: 15px;
		padding: 20px;
	}
	
	.g-article-list {
		display: grid;
		grid-template-columns: 1fr;
		gap: 10px;
	}
	
	div.shop2-pageist {
		display: flex;
		align-items: center;
		justify-content: center;
		a {
			padding: 1rem;
		}
	}
	
	div.shop2-pageist :hover {
		color: var(--bg-active);
		
	}
	
	div.shop2-pageist a.shop2-pageist-front-page {
		background: url("../first_page_black_24dp.svg") 50% 50% no-repeat;
		
	}
	
	div.shop2-pageist a.shop2-pageist-last-page {
		background: url("../last_page_black_24dp.svg") 50% 50% no-repeat;
		
	}
	
	div.shop2-pageist span.shop2-pagelist-active {
		border-radius: 100%;
		background: var(--bg-active);
		color: white;
		width: 30px;
		aspect-ratio: 1;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	
	
	#myDialog, #loginDialog, #personalDialog {
		margin: auto auto;
		max-width: 95vw;
		min-width: min-content;
		max-height: 80vh;
		border: none;
		border-radius: 1rem;
		padding: 1rem;
		background: none;
		opacity: 1;
    transform: scale(1);
    transition: opacity 0.5s ease, transform 0.5s ease;

    
    
	}
	
	@starting-style {
		#myDialog, #loginDialog, #personalDialog {
        opacity: 0;
        transform: scale(0.9);
		}
    }
	
	::backdrop {
  position: fixed;
	top:0px;
	bottom: 0px;
	left:0px;
	right:0px;
background-color: rgba(0,0,0,0.3);
}


	
	.cancel-button {
		position: absolute;
		right: 10px;
		z-index: 1000;
		padding: 5px 10px;
	}
	
	.popup fieldset {
		display: grid;
		gap: 10px;
		border: none;
	}
	
	.popup fieldset legend {
		font-size: 1.2rem;
		font-weight: 600;
	}
	
	.popup input {
		font-size: 1.2rem;
		border: var(--border);
		border-radius: 1rem;
		padding: .5rem;
	}
	
	.popup textarea {
		resize: none;
		width: 100%;
		height: 150px;
		border-top: none;
		border-right: none;
		border-left: none;
		border-image: initial;
		outline: none;
		border-bottom: 1px solid #cfd0d3;
		font-size: 1rem;
		padding-top: .5rem;
	}
	
	.popup textarea:focus {
		border-bottom: 1px solid #2982ff;
	}
	
	.popup textarea:focus + .label__text {
		color: #2982ff;
	}
	
	.password {
		display: flex;
		align-items: center;
	}
	
	.user {
		display: flex;
		justify-content: space-between;
		gap: 10px;
	}
	
	.user a:hover {
		color: #eb4a4a;
	}
	
	#back, .back_top {
	}
	
	.arrow_upward {
		display:none;
		position: fixed;
		right: 1rem;
		width: 4rem;
    height: 4rem;
		@media only screen and (min-width: 1024px) {
			top: 90%;
		}
		@media only screen and (max-width: 1023px) {
			bottom: 110px;
		}
	}
	
	.arrow_back {
		width: min-content;
		@media (hover: none) and (pointer: coarse) and (max-width: 1023px) {
    position: sticky;
    left: 2vw;
	bottom: 110px;
	}
	}
	
	
	
	
	.tooltip{

    margin-left: 0;
    position: sticky;
    top: 0;
	display: none;
    color: black;
  }
  .tooltip.show{
	opacity: 1;
    visibility: visible;
    z-index: 1050;
    animation-name: fadeInOut;
    animation-duration: 5s;
    animation-fill-mode: both;
}
	
	  .shop2-main-before {
	  	    margin-top: 2rem;
    border-radius: var(--radius);
    padding: 2rem;
    
	@media only screen and (min-width: 700px) {
	  	columns: 65ch;
		column-gap: 3rem;
	  }
	  @media (prefers-color-scheme: dark) {
			
		}
	}
	
	:is(.shop2-main-before) h1 {
		column-span: all;
	}
	:is(.shop2-main-before) h2 {
	}
	
#modal {
	position: fixed;
	top:0px;
	bottom: 0px;
	left:0px;
	right:0px;
	background-color:rgba(0,0,0,0.5);
	z-index:1000;

	/* Flexbox centers the .modal-content vertically and horizontally */
	display:flex;
	flex-direction:column;
	align-items:center;

	/* Animate when opening */
	animation-name: fadeIn;
	animation-duration:150ms;
	animation-timing-function: ease;
}

#modal > .modal-underlay {
	position: absolute;
	z-index: -1;
	top:0px;
	bottom:0px;
	left: 0px;
	right: 0px;
	background: hsl(0, 0, 80, .10);
}

#modal > .modal-content {
	margin-top:10vh;
	max-width:600px;
	border-radius: 1rem;
	padding: 1rem;
	background: hsl(0, 0, 100);




	animation-name:zoomIn;
	animation-duration:150ms;
	animation-timing-function: ease;
	* {
		    font-weight: 500;
	}
}

	.close_modal {
		position: absolute;
		right: 6px;
		top: 6px;
		cursor: pointer;
	}
#modal.closing {
	animation-name: fadeOut;
	animation-duration:150ms;
	animation-timing-function: ease;
}

#modal.closing > .modal-content {
	animation-name: zoomOut;
	animation-duration:150ms;
	animation-timing-function: ease;
}

@keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
} 

@keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
} 

@keyframes zoomIn {
	0% {transform: scale(0.9);}
	100% {transform: scale(1);}
} 

@keyframes zoomOut {
	0% {transform: scale(1);}
	100% {transform: scale(0.9);}
}

	

	.details_catalog[open] {
		position: fixed;
		background: white;
		z-index: 999;
		padding: 1rem;
		overflow: auto;
		@media only screen and (min-width: 1024px) {
			inset: 60px 0 0 0;
			max-width: 1440px;
			margin: auto;
		}
		@media only screen and (max-width: 1023px) {
			inset: 0 0 55px 0;
		}
		
	}
	
	.details_catalog {
		
	}
	

summary::marker {
  content: none;
}
.summary_1 {

}

.summary_1,.summary_2{
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: transform .3s;
}

.details_1[open] .details_1-svg{
  transform: rotate(90deg);
   transition: transform .3s;
}
.details_2[open] .details_2-svg{
  transform: rotate(90deg);
   transition: transform .3s;
}

.details_1-svg,
.details_2-svg,
.path_svg {
	color: #99a3ae;
    display: inline-block;
    height: 16px;
    vertical-align: top;
    width: 16px;
}

	
	
	.details_catalog[open] {
		summary {
		aspect-ratio: inherit;
		}
		.summary_category img {
			display: none;
		}	
		.summary_category span {
			position: unset;
		}	
	}
	
	
	.vendor_item {
		display: grid;
    align-items: center;
    justify-items: center;
    font-weight: 500;
	}
	
	#badge-recaptcha {
		display: none;
	}
	
	.modal_block {
		position: fixed;
		inset: 0;
		z-index: -10;
		opacity: 0;
       	
	}
	
       .modal {
	position: fixed;
	top:0px;
	bottom: 0px;
	left:0px;
	right:0px;
	z-index:1000;
	opacity: 1;

	display:flex;
	flex-direction:column;
	align-items:center;

	animation-name: fadeIn;
	animation-duration:150ms;
	animation-timing-function: ease;
}

.modal > .modal-underlay {
	position: absolute;
	z-index: -1;
	top:0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	    background-color: rgba(0,0,0,0.3);;
}

.modal > .modal-content {
margin: auto auto;
	max-width:1000px;
	overflow: auto;
	border-radius: var(--radius2);
	    position: relative;
    background: #fff;

	animation-name:zoomIn;
	animation-duration:150ms;
	animation-timing-function: ease;
	
}

.modal.closing {
	animation-name: fadeOut;
	animation-duration:150ms;
	animation-timing-function: ease;
}

.modal.closing > .modal-content {
	animation-name: zoomOut;
	animation-duration:150ms;
	animation-timing-function: ease;
}

.modal-content {
	max-width: 1000px;
	overflow: hidden;
}
.get_product {
	display: grid;
    grid-template-columns: 1.5fr 1fr;
    aspect-ratio: 2 / 1;
    justify-items: start;

}
#result {
	display: grid;
    grid-template-rows: max(60dvh) auto;
	 position: absolute;
    top: 58px;
    background: white;
    display: grid;
    gap: .25rem;
    width: 100%;
    border-radius: 1rem;
        padding: .25rem;
    overflow: auto;
    overscroll-behavior: none;
    border: var(--border);
    z-index: 100;
    a {
    	padding: .5rem .5rem .5rem 3rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    }
}
  .product__name2.selected {
    background: var(--bg-active);
    border-radius: .75rem;
    color: white;

  }
  	.product__name2:hover {
 background: var(--bg-active);
 border-radius: .75rem;
    color: white;
  	}


    .shop2__search.on_search {
		opacity: 1;
    	bottom: 10%;
    	@media only screen and (max-width: 600px) {
			top: 10dvh;
			bottom: 0;
		}
   	}

.shop2__search {
    z-index: 1001;
    bottom: -200%;
    position: fixed;
    width: min(500px, 100%);
    padding: 1rem;
    @media only screen and (max-width: 600px) {
    	right: 0;
    	padding: 0;
    }
}

:is(.shop2__search.on_search) .search-underlay {
    position: fixed;
    z-index: -1;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
}
    
    #search-app {
    display: grid;
    grid-template-rows: auto auto 1fr;
    overflow: hidden;
    @media only screen and (min-width: 601px) {
    height: 85dvh;
    }
    @media only screen and (max-width: 600px) {
    	border-radius: var(--radius) var(--radius) 0 0;
    	bottom: 0;
        top: 0;
        left: 0px;
    right: 0px;
        position: absolute;
    }
    }
    
    




    
    .search__title {
    font-size: 2rem;
    display: flex;
    justify-content: space-between;
    padding: 1rem 2rem;
    font-weight: 600;
}
    
    .search-button {
    	    padding: 0 1rem;
    font-weight: 600;
    cursor: pointer;
        height: inherit;
        display: flex;
        align-items: center;
        svg {
			fill: currentColor;
		}
		position: absolute;
    right: 2rem;
    @media only screen and (min-width: 1024px) and (hover: hover){
   
    &:hover{
    }
   
    }
    }
    
    .site-search {
  display: flex;
    padding: .5rem;
    align-items: center;
    font-size: 2rem;
    overflow: hidden;
    position: relative;
    background: var(--bg);
    width: 95%;
    margin: auto;
    border-radius: var(--radius);
    height: 5rem;
    input {
    padding-left: 2rem;
    width: 100%;
    height: 100%;
    border-radius: 1.5rem;
    &:focus {
    background: #fff;
    }
    }
    .button {
    	border-radius: 0;
    }
}
    
    #search-result {
   padding-top: .5rem;
    overflow: auto;
    overscroll-behavior: none;
     -webkit-overflow-scrolling: touch;
    }
    
    
    .search-result-left, .search-result-right {
   	border-radius: 1rem;
    padding: 1rem 2rem;
    margin-bottom: .5rem;
    }
    
    .products-search-title, .folders-search-title {
    	border-bottom: var(--border);
    	margin-bottom: 1rem;
    }
    
    .product-items,
    .folder-items,
    .vendor-items {
    	display: grid;
    gap: 1.5rem;
    font-weight: 500;
    }
    
   
    
   
body:has(dialog[open]) {
    overflow: hidden;
}


 
  
   @keyframes fade-out {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 0;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}

.slide-it {
  view-transition-name: slide-it;
}

::view-transition-old(slide-it) {
  animation: 300ms cubic-bezier(0.4, 0, 0.2, 1) both fade-out;
}

::view-transition-new(slide-it) {
  animation: 300ms cubic-bezier(0.4, 0, 0.2, 1) both fade-in;
}



.lazy-img {
    opacity: 1; 
    transition: opacity 1s ease-in-out;
    
}
.fade-in {
    opacity: 0; /* Начальное состояние для анимации */
}





.title_back {
	display: flex;
}

.orders-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 1rem auto;
}

.order-item {
	    padding: 2rem;
    background: white;
    border-radius: 2rem;
    box-shadow: var(--shadow-s);
}

.order-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.order-details {
    display: flex;
    gap: 15px;
    margin-bottom: 10px;
}

.order-actions {
    display: flex;
    gap: 10px;
}

.order-actions a {
    text-decoration: none;
    color: #007bff;
}

.order-actions a:hover {
    text-decoration: underline;
}

.batton__close {
		
		cursor: pointer;
		user-select: none;
		-webkit-user-select: none;
	
	}
	
	
	
	

.table_orders {
	display: table-caption;
	th {
	}
	td {
	}
}


.order_form {
	display: grid;
	gap: .5rem;
    margin-bottom: 1rem;
    box-shadow: var(--shadow-s);
    padding: 2rem;
    border-radius: 2.8rem;
    background: white;
	@media (min-width: 500px) {
    grid-template-columns: 1fr 1fr;
	}
}

.order_form-group {
	display: inline-grid;
	max-width: 100vw;
	gap: .5rem;
	
}
.order_form-group:has(#user_on_order_registration) {
	    grid-column-start: 1;
}

.shop2__catalog {
    z-index: 1001;
    
    
    position: fixed;
    	bottom: -150%;
    	@media (max-width: 400px) {
    	    width: 100%;	
    	    }
   
}

    .shop2__catalog.on_catalog{
    	    bottom: 10rem;
    	    opacity: 1;
    	    @media (max-width: 400px) {
    	    bottom: 0rem;	
    	    }
}
:is(.shop2__catalog.on_catalog) .search-underlay {
    position: fixed;
    z-index: -1;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
}
.catalog-body {
	overflow: hidden;
   @media (max-width: 400px) {
    	    border-radius: var(--radius) var(--radius) 0 0;
    	    }
}

.nav__catalog {
    padding: 1rem;
    display: grid;
    gap: .2rem;
    grid-auto-rows: 7rem;
    overflow: auto;
    @media (max-width: 400px) {
    	    
        height: auto;
        max-height: 98dvh;	
    	    }
}

.catalog__item {
	    background: oklch(0.85 0.07 var(--h));
    border-radius: .4rem;
    color: oklch(0.40 0.1 var(--h));
    &:first-child {
    	border-radius: 1rem 1rem .4rem .4rem;
    }
    &:last-child {
    	border-radius: .4rem .4rem 1rem 1rem;
    }
    img {
    	filter: drop-shadow(oklch(0.70 0.1 var(--h)) 0px 4px 2px);
    }
}

.bottom-app {
	display: flex;
    justify-content: center;
}

.user_login-body {
	display: flex;
    gap: 1rem;
    margin: 1rem auto;
    @media only screen and (max-width: 560px) {
    	margin: 0;
    flex-wrap: wrap;
    }
}
	.g-label-tabs {
		display: inline-flex;
			@media only screen and (min-width: 561px) {
				flex-direction: column;
			}
	}
	.g-user-profile__item, .g-user__button {
		padding: .5rem;
    border-radius: var(--radius2);
    text-align: right;
	}
	
	.g-user-profile__item.g-user-profile--opened {
	    color: var(--bg-active);
	
	}
	
	.tpl-users {
		border-radius: 1.8rem;
		padding: 1rem;
		box-shadow: var(--shadow-s);
		background: white;
		@media only screen and (max-width: 400px) {
				width: 100%;
			}
	}
	
    .user__home-page {
    	display: grid;
    	gap: 1rem;
    }
    
	.tpl-users input {
    font-weight: 600;
        border: 0;
    }
    
    .g-form-row__subrow {
		padding: 8px 12px;
		background: var(--item-bg);
		border-radius: .8rem;
		margin-bottom: 1rem;
    }
    
.user_registration {
	max-width: 100%;
}

.user_registration-form {
    display: flex;
    gap: 1rem;
    justify-items: center;
    flex-direction: column;
}


.fade-out {
    opacity: 0;
}

.found-product {
	display: grid;
    grid-template-columns: auto 1fr 0.3fr;
    gap: .5rem;
        font-weight: 500;
}

/*cookie.message*/
#s3-cookie-message {
	display: none;
	position: fixed;
    inset: 0;
    margin: auto auto;
    width: 30rem;
    height: 22rem;
    border: none;
    border-radius: 1rem;
    padding: 2rem;
    box-shadow: var(--box-item);
    backdrop-filter: blur(10px);
    isolation: isolate;
    background: oklch(1 0 0 / 0.9);
}

.s3-cookie-message__btn {
	display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: .5rem;
    padding: 1rem 2rem;
    background: var(--accent);
    color: white;
    border-radius: .8rem;
    box-shadow: var(--box-item);
    cursor: pointer;
}







.thumbnails-nav {
  display: none; /* По умолчанию скрываем на мобильных */
}

/* Показываем стрелки только на десктопах с поддержкой ховера */
@media (hover: hover) and (pointer: fine) {
  .thumbnails-nav {
    display: flex;
    position: absolute;
    top: 50%;
    width: 100%;
    justify-content: space-between;
    transform: translateY(-50%);
    pointer-events: none;
    padding: 0 10px;
    box-sizing: border-box;
  }
}

.nav-btn {
  pointer-events: all;
  background: oklch(0.95 0 0 / 0.1);
  color: white;
  border: none;
  padding: 0;
  cursor: pointer;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: bold;
  transition: background 0.3s ease;
}

.nav-btn:hover {
  background: oklch(0.9 0 0 / 1);
}

.nav-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.thumbnails-counter {
position: absolute;
    bottom: 1rem;
    right: 1rem;
    background: oklch(0.95 0 0 / 0.8);
    padding: .5rem 1rem;
    border-radius: var(--radius);
}

.scrollable-container {
  overflow-x: auto;
  white-space: nowrap;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  scroll-snap-type: x mandatory;
}

.product-thumbnails-wrap {
	overflow-y: hidden;
}

/* Стили только для десктопов с поддержкой ховера */
@media (hover: hover) and (pointer: fine) {
  .scrollable-container {
    cursor: grab;
  }
  
  .scrollable-container.grabbing {
    cursor: grabbing;
  }
}

.scrollable-container::-webkit-scrollbar {
  display: none;
}

.shop2__product-image {
  display: inline-block;
  transition: opacity 0.3s ease;
  flex-shrink: 0;
}

.shop2__product-image.active {
  opacity: 1;
}

.shop2__product-image:not(.active) {
  opacity: 0.7;
}

/* На мобильных - скрываем неактивные изображения или делаем их очень бледными */
@media (hover: none) and (pointer: coarse) {
  .shop2__product-image:not(.active) {
    opacity: 0.3;
  }
  
  .scrollable-container {
    /* На мобильных можно добавить snap-скролл */
    scroll-snap-type: x mandatory;
  }
  
  .shop2__product-image {
    scroll-snap-align: center;
  }
}

.product__item-image {
    
    transition: z-index 0.3s ease;
   touch-action: pan-y; /*  Разрешаем вертикальную прокрутку */
}

.product__item-image.active {
    z-index: 1;
}
.product__item-image:not(.active) {
    z-index: -1;
}
.image-blocks{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: flex;
    grid-auto-columns: 1fr;
    z-index: 2;
    touch-action: pan-y; /* Разрешаем вертикальную прокрутку */
}
.span-blocks{
    width: 0.8rem;
    height: 0.8rem;
    background: #555;
    border-radius: 50%;
    cursor: pointer;
    transition: background 0.3s ease;
}
.span-blocks.active {
    background: var(--bg-active);
}

/* Для мобильных устройств - улучшаем UX */
@media (hover: none) and (pointer: coarse) {
    .image-blocks {
        cursor: grab;
    }
    .image-blocks:active {
        cursor: grabbing;
    }
}



.cart-amount-btn {
    cursor: pointer;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    user-select: none;
}

.cart-amount-btn[data-action="decrease"]:before {
    content: "−";
    font-size: 24px;
}

.cart-amount-btn[data-action="increase"]:before {
    content: "+";
    font-size: 24px;
}

.cart__row.fade-out {
    opacity: 0;
    transition: opacity 0.3s;
}

.cart-delete-btn {
    cursor: pointer;
    position: absolute;
    right: 1rem;
    bottom: 1rem;
}

.order-receipt {
	display: grid;
    gap: 1rem;
    margin-bottom: 2rem;
}

.customer-info,
.delivery-info-section,
.order-summary {
	display: grid;
    gap: 1rem;
	background: white;
    box-shadow: var(--shadow-s);
    padding: 2rem;
    border-radius: 1.2rem;
}

.info-row {
    max-width: 58rem;
    display: grid;
    grid-template-columns: 13rem 1fr;
}

.info-value {
    width: fit-content;
    font-weight: 500;
}

#order-in-one-page-form {
	input,
	textarea {
		border: 0;
		background: var(--bg);
		border-radius: var(--radius);
    padding: 1rem 2rem;
	}
}