*{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

@font-face {
    font-family: Roboto-Regular; 
    src: url(../fonts/Roboto-Regular.ttf);
}

@font-face {
    font-family: Roboto-Medium; 
    src: url(../fonts/Roboto-Medium.ttf);
}

@font-face {
    font-family: Roboto-Bold; 
    src: url(../fonts/Roboto-Bold.ttf);
}

@font-face {
    font-family: Inter-Regular; 
    src: url(../fonts/Inter-Regular.otf);
}

@font-face {
    font-family: Inter-Medium; 
    src: url(../fonts/Inter-Medium.otf);
}

@font-face {
    font-family: Inter-Bold; 
    src: url(../fonts/Inter-Bold.otf);
}

@font-face {
    font-family: Inter-SemiBold; 
    src: url(../fonts/Inter-SemiBold.otf);
}

a.no-copy, a.no-copy * {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

a.no-copy {
  -webkit-user-drag: none;
  -webkit-tap-highlight-color: transparent; 
}

.style-color {
    fill:var(--uiAccent) !important;
}

img {
    -webkit-user-drag: none;
}

body{
	background-color: var(--uiBg);
	font-family: Inter-Regular;
	scrollbar-width: none;
	padding: 12px 16px 96px 16px;
	color:var(--uiText);
	user-select: none;
}

html.is-mobile-app body {
  padding-top: calc(48px + var(--tg-viewport-safe-area-inset-top, 0px));
}

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

.ripple {
    position: relative;
    overflow: hidden;
    transform: translate3d(0,0,0);
}

.ripple:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
    background-image: radial-gradient(circle, #282837 24%, transparent 100%);
    background-repeat: no-repeat;
    background-position: 50%;
    transform: scale(10,10);
    opacity: 0;
    transition: transform .5s, opacity 2s;
}

.ripple:active:after {
  transform: scale(0, 0);
  opacity: .3;
  transition: 0s;
}




html, body {
  overflow: auto;
  -ms-overflow-style: none;  
  scrollbar-width: none;     
}
html::-webkit-scrollbar,
body::-webkit-scrollbar {
  width: 0;
  height: 0;                 
}

a{
	text-decoration: none;
}

:root {
    --notCompleted:#00ff00;
    --uiBg: #121216;
    --uiBlock: #19191F;
    --uiBlockActive: #1d1d26;
    --uiBlockInactive: #282837;
    --uiText: #D7DEEE;
    --uiDescription:#5C5D74;
    --uiSecondaryDescription: #40424d;
    --outline-color: #1f2d3b;
    --uiAccent: #4597da;
    --uiAccentText: #52B2FF;
    --tg-viewport-safe-area-inset-top: var(--tg-content-safe-area-inset-top, 0px);
    --tg-viewport-safe-area-inset-bottom: var(--tg-content-safe-area-inset-bottom, 0px);
}

.empty-cont {
    display:grid;
    gap:6px;
    text-align:center;
    justify-items: center;
    grid-column: 1 / -1;
}

.empty-emoji {
    width:40px;
    height:40px;
}

.empty-text {
    font-family: Inter-Medium;
    font-size: 14px;
    color: var(--uiSecondaryDescription);
    text-align: center;
    width: 100%;
    grid-column: 1 / -1;
}

/* Загрузчик */
#preloader{
  position: fixed;
  inset: 0;
  background: var(--uiBg);
  display: grid;
  place-items: center;
  z-index: 9999;
  transition: opacity .3s ease, visibility .3s ease;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

#preloader.preloader--show{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

#preloader.preloader--hide{
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.spinner{
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 3px solid rgba(255,255,255,.15);
  border-top-color: var(--uiAccent);
  border-right-color: var(--uiAccent);
  animation: spin .8s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce){
  .spinner{ animation-duration: 1.6s; }
}



header{
	font-size: 16px;
	height:52px;
	width:100%;
	color:white;
}

.first-head {
    display: flex;
    align-items: center;
    height:52px;
}

.logo-main {
    display: flex;
    align-items: center;
}

.logo-main svg .logo-svg {
  fill: var(--uiAccentText);
}

.head-info {
    margin-left:auto;
    height: 52px;
    gap:9px;
    padding: 0 14px; /* только по бокам */
    background-color: rgba(25,25,31,0.64);
    border: 1px solid var(--uiBlockActive);
    border-radius:30px;
    display: flex;
    align-items: center;
}


.balance-info {
    display:flex;
    gap:6px;
    align-items:center;
    font-family:Inter-SemiBold;
}

.icon-valute {
    width:16px;
    height:16px;
}

.icon-valute svg .valute-svg{
    fill:var(--uiAccent);
}



.btn-head {
    display:flex;
    align-items:center;
    margin-left:auto;
    height:26px;
    gap:3px;    
}

.btn-cont {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-cont svg rect,
.btn-cont svg path{
    fill:var(--uiDescription);
    transition: 0.4s;
}

.btn-cont:hover svg rect,
.btn-cont:hover svg path{
    fill: var(--uiSecondaryDescription);
    transition: 0.4s;
}

footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(25, 25, 31, 0.88);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    z-index: 100;
    border-radius:12px 12px 0 0;
    border: 1px solid var(--uiBlockActive);
}

html.is-mobile-app footer {
  height:auto;
}

.cont-footer {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--uiAccent);
}

html.is-mobile-app .cont-footer {
  padding-bottom: calc(20px + var(--tg-viewport-safe-area-inset-bottom, 0px));
}

.cont-footer svg { width:20px; height:20px; display:block; }

.cont-nav svg path {
  fill: var(--uiDescription);
  transition: 0.4s;
}

.cont-nav:hover svg path {
    fill: var(--uiSecondaryDescription);
    transition: 0.4s;
}


.cont-nav {
    padding: 20px 0 24px 0;
    flex: 1;
    display:flex;
    align-items:center;
    justify-content:center;
}

.slider-main {
    margin-top: 24px;
}

.slide-item {
    position: relative;
    width: 312px;
    height: 132px;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    background-color: var(--uiBlock);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.slide-item-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.slide-item-icon {
    position: relative;
    z-index: 1;
}

.slide-item.has-photo .slide-item-icon {
    display: none;
}

.slide-item-name {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    min-height: 22px;
    padding: 6px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-family: Inter-SemiBold;
    color: #fff;
    text-align: center;
    line-height: 1;
    border-radius: 0 0 12px 12px;
    box-sizing: border-box;
    overflow: hidden;
    backdrop-filter: blur(3px);
}

.slide-item-name::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--banner-bg);
    opacity: 0.8;
    border-radius: inherit;
    z-index: 0;
}

.slide-item-name span {
    position: relative;
    z-index: 1;
}

.slider-main .slide-item {
    margin: 0 3px;
}

.slider-main .slick-dots {
    bottom: -24px;
}

.slider-main .slick-dots li {
    width: 6px;
    height: 6px;
}

.slider-main .slick-dots li button {
    width: 6px;
    height: 6px;
    padding: 0;
}

.slider-main .slick-dots li button:before {
    content: "";
    position: absolute;
    inset: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--uiBlockInactive);
    opacity: 1;
}

.slider-main .slick-dots li.slick-active button:before {
    background: var(--uiAccent);
    opacity: 1;
}

.cont-category-change {
  width: 100%;
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: stretch;
  border-bottom: 1px solid var(--uiBlockActive);
}

.switch-category-index {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding:9px 0 16px 0;
  color: var(--uiDescription);
  font-size: 14px;
  font-family: Inter-SemiBold;
  cursor: pointer;
  transition: color 0.2s ease;
  user-select: none;
}

.switch-category-index:hover {
  color: var(--uiSecondaryDescription);
}

.switch-category-index::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -1px;
  transform: translateX(-50%);
  width: 100%;
  height: 2px;
  border-radius: 999px;
  background: transparent;
  transition: background 0.2s ease, opacity 0.2s ease;
  opacity: 0;
}

.switch-category-index.active-switch {
  color: var(--uiAccent);
}

.switch-category-index.active-switch::after {
  background: var(--uiAccent);
  opacity: 1;
}

.switch-category-index.active-switch:hover {
  color: var(--uiAccent);
}

.category-main-cont {
    margin-top:12px;
    display: grid; 
    gap: 6px;                         
    grid-template-columns: repeat(2, 1fr);
}

.category-cont {
    display:flex;
    border-radius: 9px;
    align-items:center;
    height:50px;
    padding:9px;
    gap:10px;
    cursor:pointer;
}

.category-cont:hover {
    background: var(--uiBlockActive);
    transition: 0.4s;
}

.img-cat {
    width:34px;
    height:34px;
}

.img-cat img {
    width:34px;
    height:34px;
    border-radius:10px;
    -webkit-user-drag: none;
}

.name-cat {
    color:white;
    font-size:14px;
    font-family: Inter-Semibold;
    color: var(--uiText);
}

.balance-count{
  color: var(--uiText);
  position: relative;              
}

.balance-count.is-masked{
  color: transparent;             
  display: inline-block;
  width: 3ch;                     
}

.balance-count.is-masked::before{
  content: "";
  position: absolute;
  inset: 0 0;                 
  height: 1.1em;
  border-radius: 6px;
  pointer-events: none;

  background:
    linear-gradient(90deg,
      rgba(255,255,255,0.12) 0%,
      rgba(255,255,255,0.22) 50%,
      rgba(255,255,255,0.12) 100%);

  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);

  filter: blur(3px) saturate(120%);
  opacity: 0.95;
}


/*О магазине*/

.logoshop {
    display:flex;
    justify-content:center;
    align-items:center;
    margin:0 auto;
    width:96px;
    height:96px;
    background-color:var(--uiBlock);
    border-radius:15px;
    margin-top:25px;
}

.logoshop svg .doplogo-svg {
    fill:var(--uiAccentText);
}

.about-name {
    font-size:18px;
    font-family:Inter-Bold;
    text-align:center;
    margin-top:16px;
}

.about-name { color: var(--uiText); }
.about-name .store { color: var(--uiAccentText); }

.stats-cont {
    height:48px;
    width:100%;
    display:grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top:20px;
    align-items:center;
}

.stats-item {
    text-align:center;
}

.count-stats {
    font-size:16px;
    margin-bottom: 3px;
    font-family:Inter-SemiBold;
    color:var(--uiText);
}

.name-stats {
    font-size:11px;
    font-family:Inter-Semibold;
    color:var(--uiSecondaryDescription);
}

.cont-contacts {
    margin-top:24px;
}

.title-about {
    color:var(--uiAccent);
    font-family:Inter-SemiBold;
    font-size:11px;
    margin-bottom:9px;
}

.cont-items-contacts {
    display:grid;
    width:100%;
    grid-template-columns: repeat(2, 1fr);
    gap:6px;
}

.item-contacts {
    display:flex;
    width:100%;
    padding:9px 6px 0 6px;
    gap:9px;
}

.img-contact {
    display:flex;
    width:32px;
    height:32px;
    align-items:center;
    justify-content:center;
    background-color:var(--uiBlock);
    border-radius:9px;
    flex:0 0 32px;
}

.img-contact svg path{
    fill:var(--uiAccent);
}

.cont-info-contacts {
    padding:0 0 16px 0;
    height:46px;
    border-bottom:1.5px solid var(--uiBlock);
    flex:1 1 auto;
}

.title-contacts {
    font-family:Inter-SemiBold;
    font-size:14px;
    color:var(--uiText);
    height:10px;
    margin-bottom:11px;
}

.contact-link {
    font-family:Inter-Bold;
    font-size:11px;
    color:var(--uiAccent);
    height:8px;
}

.cont-yrinformation {
    margin-top:32px;
}

.cont-items-yrinfo {
    width:100%;
    gap:6px;
}

.yrinfo-link {
    font-family:Inter-SemiBold;
    font-size:11px;
    color:var(--uiSecondaryDescription);
    height:8px;
}

.title-geo {
    font-family:Inter-Bold;
    font-size:12px;
    color:var(--uiText);
}

.footer-about {
    margin-top:16px;
    text-align:center;
    color:var(--uiSecondaryDescription);
    font-family:Inter-SemiBold;
    font-size:11px;
    padding:0 6px;
}

.cont-agreement {
    margin-top:24px;
}

.title-agreement {
    color:var(--uiText);
    font-size:15px;
    font-family:Inter-Bold;
    height:11px;
}

.maininfo-agreement {
    margin-bottom:24px;
    margin-top:16px;
    font-family:Inter-SemiBold;
    font-size:12px;
    color:var(--uiDescription);
}

.maininfo-agreement span {
    color:var(--uiAccent);
}

.main-punkt-agreement {
    height:10px;
    font-family:Inter-Bold;
    font-size:14px;
    color:var(--uiDescription);
    margin-bottom:12px;
}

.main-punkt-agreement span{
    color:var(--uiAccent);
}

.dop-punkt-agreement {
    font-family:Inter-SemiBold;
    font-size:12px;
    color:var(--uiDescription);
}

.dop-punkt-agreement span {
    color:var(--uiAccent);
}


/*Отзывы*/

.body-reviews {
    display:grid;
    gap:32px;
    margin-top:24px;
}

.header-reviews {
    display:grid;
    gap:20px;
}

.logo-reviews {
    margin:0 auto;
    height:96px;
    width:96px;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.maininfo-reviews {
    display:grid;
    gap:12px;
    text-align:center;
    line-height: 1;
}

.title-reviews {
    font-family:Inter-Bold;
    font-size:16px;
    color:var(--uiText);
}

.dopinfo-reviews {
    font-family:Inter-SemiBold;
    font-size:12px;
    color:var(--uiDescription);
}

.maincont-reviews {
    display:grid;
    gap:9px;
}

.headcont-reviews {
    display:grid;
    gap:16px;
}

.mainestats-profile {
    display: grid;
    gap:24px;
}

.statscont-reviews {
    display:flex;
    gap:12px;
    align-items: center;
}

.imgstats-reviews {
    border-radius: 6px;
    background-color: var(--uiBlock);
    width:42px;
    height:42px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.statsinfo-reviews {
    display: grid;
    gap:9px;
}

.statstitle-reviews {
    display:flex;
    gap:6px;
    line-height: 1;
    align-items: center;
}

.statsname-reviews {
    display:flex;
    color: var(--uiText);
    font-size:14px;
    font-family: Inter-Bold;
}

.statsname-reviews span {
    color: var(--uiAccentText);
}

.statscontpercent-reviews{
    display:flex;
    line-height: 1;
    font-size: 11px;
    font-family: Inter-SemiBold;
}

.statscontpercent-reviews span{
    color:var(--uiDescription);
}

.statspercent-reviews {
    display: flex;
    gap:3px;
    color: var(--uiAccent);
}

.statspercent-reviews span{
    color: var(--uiAccent);
}

.statscount-reviews {
    color: var(--uiDescription);
    font-size:11px;
    font-family: Inter-SemiBold;
    line-height: 1;    
}

.switchcont-reviews {
    display: flex;
    border-bottom: 1px solid var(--uiBlock);
}

.switchcont-reviews a {
  text-decoration: none;
  color: inherit;
}

.tabcont-reviews {
    position: relative;
    padding: 9px 16px 16px 16px;
    text-align: center;
    flex: 0 0 auto;
    cursor: pointer;
    transition: color 0.4s, transform 0.08s ease, opacity 0.4s;
}

.tabcont-reviews::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 100%;
    height: 1px;
    background: transparent;
    transition: background 0.4s;
}

.tabcont-reviews:hover .tabname-reviews {
    color: var(--uiSecondaryDescription);
}

.tabcont-reviews:active {
    transform: scale(0.97);
}

.tabcontactive-reviews {
    cursor: default;
}

.tabcontactive-reviews::after {
    background: var(--uiAccent);
}

.tabcontactive-reviews:active {
    transform: none;
}

.tabcontactive-reviews:hover .tabname-reviews {
    color: var(--uiAccent);
}

.tabflex-reviews {
    display: flex;
    gap: 5px;
    line-height: 1;
    align-items: center;
}

.tabname-reviews {
    font-size: 13px;
    font-family: Inter-SemiBold;
    color: var(--uiDescription);
    white-space: nowrap;
    transition: color 0.4s;
}

.tabcontactive-reviews .tabname-reviews {
    color: var(--uiAccent);
}

.tabcount-reviews {
    min-width: 20px;
    font-size: 10px;
    font-family: Inter-Bold;
    border-radius: 111px;
    padding: 4px 6px;
    white-space: nowrap;
    transition: transform 0.2s ease, opacity 0.3s ease;
}

.tabcont-reviews:nth-child(1) .tabcount-reviews {
    background: linear-gradient(142.267deg, rgba(69, 151, 218, 0.24) 0%, rgba(82, 178, 255, 0.24) 100%);
}

.tabcont-reviews:nth-child(1) .tabcount-reviews span {
    background: linear-gradient(142.267deg, #4597DA 0%, #52B2FF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

.tabcont-reviews:nth-child(2) .tabcount-reviews {
    background: linear-gradient(142.267deg, rgba(82, 255, 180, 0.24) 0%, rgba(159, 243, 152, 0.24) 100%);
}

.tabcont-reviews:nth-child(2) .tabcount-reviews span {
    background: linear-gradient(142.267deg, #52FFB4 0%, #9FF398 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

.tabcont-reviews:nth-child(3) .tabcount-reviews {
    background: linear-gradient(-176.528deg, rgba(221, 54, 54, 0.24) 0%, rgba(255, 135, 193, 0.24) 100%);
}

.tabcont-reviews:nth-child(3) .tabcount-reviews span {
    background: linear-gradient(-176.528deg, #DD3636 0%, #FF87C1 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

.displaymain-reviews {
    display:grid;
    gap:6px;
}

.mainitem-reviews {
    padding:12px 9px 16px 9px;
    border-bottom: 1px solid var(--uiBlock);
}

.item-reviews {
    display:grid;
    gap:16px;
}

.iteminfo-reviews {
    display: flex;
    gap:12px;
    align-items: center;
}

.imgitem-reviews {
    display: flex;
    align-items: center;
    justify-content: center;
    width:32px;
    height:32px;
    border-radius: 50%;
    background-color: var(--uiBlock);
}

.imgitem-reviews img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}

.itemmain-reviews {
    display: grid;
    gap:5px;
    line-height: 1;
    flex: 1;
}

.itemhead-reviews {
    display: flex;
    gap:4px;
    align-items: center;
}

.itemtitle-reviews {
    font-family: Inter-Bold;
    font-size:14px;
    color: var(--uiText);
}

.itemlike-reviews {
    font-size: 11px;
    font-family: Inter-SemiBold;
    color: var(--uiDescription);
}

.itemdislike-reviews {
    font-size: 11px;
    font-family: Inter-SemiBold;
    color: var(--uiDescription);
}

.itemdate-reviews {
    font-size: 11px;
    font-family: Inter-SemiBold;
    color: var(--uiSecondaryDescription);
    margin-left: auto;
}

.itemtovar-reviews {
    font-size: 11px;
    font-family: Inter-SemiBold;
    color: var(--uiAccent);
    transition: opacity .2s ease;
}

.itemtovar-reviews:hover {
  opacity: .8;
}

.itemtext-reviews {
    color: var(--uiDescription);
    font-size: 12px;
    font-family: Inter-SemiBold;
    line-height: 1;
}

.dislike-svg {
    fill:#D64242;
}

.itemfeedback-reviews {
    display: flex;
    font-size:11px;
    font-family: Inter-SemiBold;
    gap:6px;
    line-height: 1;
    align-items: center;
}

.itemliketitle-reviews {
    background: linear-gradient(142.267deg, #4597DA 0%, #52B2FF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

.itemdisliketitle-reviews {
    background: linear-gradient(-176.528deg, #DD3636 0%, #FF87C1 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

.itemtovarcont-reviews {
    padding:12px 0 0 0;
    display: block;
}

.itemtovarflex-reviews {
    display:flex;
    background-color: rgba(25, 25, 31, 0.48);
    padding:6px 16px 6px 6px;
    border-radius: 9px;
    gap:12px;
    align-items: center;
}

.itemtovarimg-reviews {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--uiBlock);
}

.itemtovarimg-reviews img {
    width:16px;
    height:16px;
}

.itemtovarinfo-reviews {
    display: flex;
    gap:6px;
    line-height: 1;
    align-items: center;
}

.itemtovartitle-reviews {
    font-size:13px;
    font-family: Inter-Bold;
    color: var(--uiText);
}

.itemtovarcats-reviews {
    font-size:11px;
    font-family: Inter-SemiBold;
    color: var(--uiDescription);
}

.itemtovarsvg-reviews {
    margin-left: auto;
}

/*Профиль*/
    
.maincont-profile {
    margin-top:24px;
    display:grid;
    gap:32px;
}

.header-profile {
    display: grid;
    gap: 16px;
}

.img-profile {
    position: relative;
    width: 96px;
    height: 96px;
    margin: 0 auto;
    background-color: var(--uiBlock);
    border-radius: 50%;
}

.img-profile img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    opacity: 0;
    transition: opacity .25s ease;
}

.img-profile img.is-loaded {
    opacity: 1;
}

.settings-profile {
    position: absolute;
    right: 0;             
    bottom: 0;
    display:flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    background-color:var(--uiBlock);
    border:3px solid var(--uiBg);
    border-radius:50%;
    z-index: 1;
    cursor:pointer;
}

.settings-profile path{
    fill:var(--uiAccent);
}

.headerinfo-profile {
    display: grid;
    gap: 12px;
    margin: 0 auto;
    line-height: 1;
    text-align: center;
    justify-items: center;
}


.headerflex-profile {
    gap:12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.name-profile {
   font-size: 20px;
   font-family: Inter-Bold;
   color: var(--uiText); 
}

.icon-profile svg .index-color {
    fill:var(--uiAccent)
}

.date-profile {
    font-size: 11px;
    font-family: Inter-SemiBold;
    color: var(--uiDescription);
}

.body-profile {
    display:grid;
    gap:20px;
}

.tabscont-profile {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(var(--tabs-count, 3), minmax(0, 1fr));
    align-items: stretch;
    border-bottom: 1px solid var(--uiBlockActive);
}

.tab-profile {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding:9px 0 16px 0;
  color: var(--uiDescription);
  font-size: 14px;
  font-family: Inter-SemiBold;
  cursor: pointer;
  transition: color 0.2s ease;
  user-select: none;
}

.tab-profile:hover {
  color: var(--uiSecondaryDescription);
}

.tab-profile::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -1px;
  transform: translateX(-50%);
  width: 100%;
  height: 2px;
  border-radius: 999px;
  background: transparent;
  transition: background 0.2s ease, opacity 0.2s ease;
  opacity: 0;
}

.tab-profile.activetab-profile {
  color: var(--uiAccent);
}

.tab-profile.activetab-profile::after {
  background: var(--uiAccent);
  opacity: 1;
}

.tab-profile.activetab-profile:hover {
  color: var(--uiAccent);
}

.statscont-profile {
    display:grid;
    gap:9px;
    line-height: 1;
}

.datestats-profile {
    font-size:11px;
    font-family: Inter-Bold;
    color: var(--uiSecondaryDescription);
}

.itemstats-profile {
    display: grid;
    gap:6px;
}

.itemflex-profile {
    display: flex;
    padding:9px 6px 0 6px;
    gap:12px;
    cursor: pointer;
}

.itemimg-profile {
    width: 32px;
    height:32px;
    border-radius: 9px;
    background-color: var(--uiBlock);
    display: flex;
    align-items: center;
    justify-content: center;
}

.itemimg-profile img {
    width:16px;
    height: 16px;
}

.iteminfo-profile {
    display: flex;
    padding:0 0 16px 0;
    align-items: center;
    border-bottom: 1px solid var(--uiBlock);
    flex:1;
}

.itemtext-profile {
    display: grid;
    gap:6px;
}

.itemtitle-profile {
    font-size: 14px;
    font-family: Inter-SemiBold;
    color: var(--uiText);
}

.itemstatus-profile {
    font-size: 11px;
    font-family: Inter-SemiBold;
    color: var(--uiAccent);
}

.itemprice-profile {
    display: flex;
    align-items: center;
    color: var(--uiText);
    font-size: 15px;
    font-family: Inter-Bold;
    gap:6px;
    margin-left: auto;
}

.profile-feed-loader {
  padding: 12px 0 4px;
  text-align: center;
  font-size: 13px;
  color: var(--uiDescription);
}

.profile-feed-sentinel {
  width: 100%;
  height: 1px;
}

.itemprice-profile svg .index-color {
    fill: var(--uiAccent);
}

/* Окно транзакций */
body.txn-modal-lock {
    overflow: hidden;
}

.txn-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background: rgba(18, 18, 22, 0.67451);
    backdrop-filter: blur(4.5px);
    -webkit-backdrop-filter: blur(4.5px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease;
}

.txn-modal-overlay.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.txn-modal-dialog {
    width: 100%;
    background: rgba(29, 29, 38, 0.56);
    border-radius: 12px 12px 0 0;
    transform: translateY(20px);
    transition: transform .22s ease;
    overflow: hidden;
    padding:0 0 16px 0;
}

.txn-modal-overlay.is-open .txn-modal-dialog {
    transform: translateY(0);
}

.txn-open-trigger {
    cursor: pointer;
}

.title-modal {
    color:var(--uiText);
    font-size:14px;
    font-family:Inter-Bold;
    text-align: center;
    padding:18px 0 20px 0;
}

.title-modal-kind {
    color: var(--uiText)!important;
}

.title-modal span {
    color:var(--uiDescription);
}

.maininfo-modal {
    background: rgba(29, 29, 38, 0.72);
    padding:6px 16px 3px 16px;
    border-radius: 12px;
    display:grid;
    gap:6px;
}

.modalinfo-group {
    display: grid;
    gap:12px;
}

.punkt-modal {
    padding:9px 6px 0 6px;
    display:flex;
    gap:12px;
}

.imgpunkt-modal {
    width:32px;
    height: 32px;
    background-color: var(--uiBlock);
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.imgpunkt-modal svg path {
    fill:var(--uiAccent);
}

.infopunkt-modal {
    padding:9px 0 21px 0;
    width:100%;
    border-bottom: 1px solid var(--uiBlock);
    display:flex;
    align-items: center;
    justify-content: space-between;
    font-size:14px;
    font-family: Inter-SemiBold;
    color: var(--uiText);
    line-height: 1;
}

.punkt-modal:last-child .infopunkt-modal {
    border-bottom: none;
}

.itogpunkt-modal {
    display:flex;
    gap:6px;
    align-items: center;
}

.itogpunkt-modal svg .index-color {
    fill: var(--uiAccent);
}

.userlink-modal {
    color: var(--uiAccent);
    text-decoration: none;
}

.userlink-modal:hover {
    opacity: .9;
}

.userlink-modal.is-disabled {
    color: var(--uiText);
    pointer-events: none;
}

.status-order-good {
  color: var(--uiAccent);
}

.status-order-bad {
  background: linear-gradient(360deg, #8A7BDB -35.78%, #D64242 97.99%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.status-order-warn {
  background: linear-gradient(360deg, #8A7BDB -35.78%, #D64242 97.99%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.status-order-work{
  background: linear-gradient(93.67deg, #DAC945 -26.38%, #DB7BB8 102.89%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/*Категории*/

.maincont-items {
    display:grid;
    gap:20px;
}

.header-items {
    margin-top:24px;
    display:grid;
    justify-items: center;
    gap:20px;
}

.items-logo {
    width:96px;
    height:96px;
}

.text-items {
    display:grid;
    gap:6px;
    text-align:center;
}

.name-items {
    font-size:18px;
    font-family:Inter-Bold;
    color: var(--uiText);
}

.note-items {
    font-size:12px;
    font-family:Inter-Semibold;
    color:var(--uiDescription);
}

.body-items {
    display:grid;
    margin-top:12px;
    gap:12px;
}

.switch-category {
    display:grid;
    text-align:center;
    padding:0;
    gap: 0 6px;
    border-bottom:1.5px solid var(--uiBlock);
}

.switch-category.grid-3 { grid-template-columns: repeat(3, 1fr); }
.switch-category.grid-2 { grid-template-columns: repeat(2, 1fr); }

.choice-category {
    color:var(--uiDescription);
    font-family:Inter-SemiBold;
    font-size:14px;
    padding:9px 0 14px 0;
    cursor:pointer;
    border-bottom:1.5px solid transparent;
    box-sizing:border-box;
    transition: 0.4s;
}

.choice-category:hover {
    color: var(--uiSecondaryDescription);
    transition: 0.4s;
}

.active-category {
    color:var(--uiAccent);
    border-bottom-color: var(--uiAccent);
    cursor: default;
}

.active-category:hover {
    color:var(--uiAccent);
    border-bottom-color: var(--uiAccent);
}

.switch-items {
    display:flex;
    gap:6px;
    text-align:center;
    font-family:Inter-SemiBold;
    font-size:14px;
    color:var(--uiAccent);

    flex-wrap: nowrap;
    overflow-x: auto;       
    overflow-y: hidden;

    touch-action: pan-x;
    -webkit-overflow-scrolling: touch;
    
    scrollbar-width: none;  
    -ms-overflow-style: none; 

    margin-top: 3px;
}

.switch-items::-webkit-scrollbar { display: none; }

.switch-items a{
  display: inline-block;
  flex: 0 0 auto;
  -webkit-user-drag: none;
  user-select: none;
}

.choice-fillter {
    flex: 0 0 auto;
    white-space: nowrap; 
    border-radius:111px;
    padding: 7px 16px;
    color:var(--uiDescription);
    cursor:pointer;
    transition: 0.4s;
}

.choice-fillter:hover {
    color: var(--uiSecondaryDescription);
    transition: 0.4s;
}

.active-fillter {
    background-color:var(--uiBlockActive);
    color:var(--uiAccent);
    cursor: default;
}

.active-fillter:hover {
	color: var(--uiAccent);
}

.items-maintovarcont {
    display:grid;
    gap:28px;
}

.items-main {
    display:grid;
    gap:16px;
}

.items-title {
    color:var(--uiAccent);
    font-family:Inter-Bold;
    font-size:15px;
}

.items-tovarcont {
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap:16px 12px;
}

.items-tovar {
    display:grid;
    grid-template-columns: 1fr; 
    gap:11px;
    border-radius: 12px;
    padding:3px;
}

.items-logotovar {
    display:flex;
    justify-content:center;
    align-items:center;
    border-radius:16px;
    background-color:var(--uiBlock);
    height:136px;
}

.items-logotovar img{
    width:72px;
    height:72px;
    -webkit-user-drag: none;
}

.items-infotovar {
    display:grid;
    gap:7px;
    font-family:Inter-Bold;
    color:var(--uiText);
}

.items-nametovar {
    font-size:14px;
    font-family: Inter-Semibold;
}

.items-pricetovar {
    font-size:15px;
    display:flex;
    align-items:center;
    gap:6px;
}

.items-pricetovar svg .rub-svg{
    fill:var(--uiAccent);
}

/*Товар*/

.maincont-item {
    display:grid;
    gap:32px;
    margin-top:24px;
}

.infocont-item {
    display:grid;
    gap:32px;
    width:256px;
    margin:0 auto;
}

.switch-item {
    padding:3px;
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    border-radius:100px;
    background-color:var(--uiBlock);
    font-family:Inter-SemiBold;
    font-size:14px;
    text-align:center;
}

.choice-item {
    padding:6px 0;
    border-radius:100px;
    color:var(--uiDescription);
    cursor: pointer;
    transition: 0.4s;
}

.choice-item:hover {
    color: var(--uiSecondaryDescription);
    transition: 0.4s;
}

.active-choice-item {
    background-color:var(--uiBlockActive);
    color:var(--uiAccentText);
    cursor: default;
}

.active-choice-item:hover {
    color:var(--uiAccentText);
    cursor: default;
}


.info-item {
    display:grid;
    gap:20px;
    justify-items:center;
}

.logo-item {
    width:96px;
    height:96px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:18px;
    background-color:var(--uiBlock);
}

.logo-item img {
    width:64px;
    height:64px;
}

.textinfo-item {
    display:grid;
    gap:6px;
    justify-items:center;
}

.title-item {
    font-family:Inter-Bold;
    font-size:18px;
    color:var(--uiText);
}

.leadtime-item {
    font-family:Inter-SemiBold;
    font-size:12px;
    color:var(--uiDescription);
}

.detailcont-item {
    display:grid;
    gap:12px;
}

.order-form {
    display:grid;
    gap:12px;
}

.tab-pane[hidden] { display: none !important; }

.choice-item[role="tab"] { user-select: none; }

.orderinfocont-item {
    display:grid;
    gap:12px;
}

.orderinfo-title {
    font-family:Inter-SemiBold;
    font-size:11px;
    color:var(--uiAccent);
}

.order-details-cont {
    display:grid;
    gap:12px;
}

.form-groupcont {
    gap:6px;
    display:flex;
    padding:0 6px;
}

.form-group {
    display:flex;
    gap:16px;
    padding:9px 6px 0 6px;
}

.form-group-code {
    display:flex;
    gap:16px;
    padding:9px 0 0 0;
}

.form-group img {
    width:16px;
    height:16px;
}

.form-group-code img{
    width:16px;
    height:16px;
}

.input-details {
    padding:0 0 16px 0;
    border: 0;
    font-family:Inter-SemiBold;
    font-size:14px;
    color:var(--uiText);
    border-bottom:1.5px solid var(--uiBlock);
    outline: none;
    background-color: transparent;
    flex:1 1 auto;
    width:100%;
    transition: border-bottom-color .6s ease;
}

.input-details::placeholder {
  color: var(--uiSecondaryDescription);     
  opacity: 1;          
}


.input-details:focus,
.input-details:focus-visible {
  border-bottom:1.5px solid rgba(69, 151, 218, 0.48);
  transition: border-bottom-color .6s ease;
}

.dopinfocont-item {
    display:grid;
    gap:9px;
}

.availability-item {
    display:flex;
    align-items:center;
    gap:6px;
    padding: 9px 12px;
    border-radius:12px;
    background-color:var(--uiBlockActive);
}

.availability-item path{
    fill:var(--uiDescription);
}

.availability-text {
    font-family:Inter-Medium;
    font-size:12px;
    color:var(--uiDescription);
}

.punkts-info {
    display:flex;
    flex-wrap:wrap;
    gap:6px; 
}

.punkt-dopinfo {
    display:flex;
    white-space:nowrap;
    align-items:center;
    gap:6px;
    padding:4px 9px;
    border-radius:100px;
    background-color:var(--uiBlockActive);
}

.punkt-dopinfo path{
    fill:var(--uiAccent);
}

.text-dopinfo {
    font-family:Inter-SemiBold;
    font-size:12px;
    color:var(--uiText);
}

.make-ordercont {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    display: flex;
    gap: 12px;
    padding: 16px 16px 20px 16px;
    border-radius: 12px 12px 0 0;
    background-color: rgba(25, 25, 31, 0.88);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
}

.price-contitem {
    display:grid;
    gap:3px;
}

.summ-itemcont {
    display:flex;
    align-items:center;
    gap:6px;
}

.summ-itemcont svg .rub-svg {
    fill:var(--uiAccent);
}

.summ-item {
    font-family:Inter-Bold;
    font-size:18px;
    color:var(--uiText);
}

.comission-item {
    font-family:Inter-SemiBold;
    font-size:11px;
    color:var(--uiSecondaryDescription);
}

.btn-createorder {
    margin-left:auto;
    padding:10px 32px;
    border-radius:100px;
    background-color:var(--uiAccent);
    color:#FFF;
    font-size:14px;
    font-family:Inter-SemiBold;
    cursor:pointer;
    outline: none;
    border:none;
    box-shadow: none;
    transition: 0.4s;
}

.btn-createorder:hover {
    background: var(--uiAccentText);
    transition: 0.4s;
}

.questioncont-item {
    display:grid;
    gap:6px;
}

.question-item {
    display:flex;
    background-color: var(--uiBlock);
    color: var(--uiDescription);
    transition: background-color .5s ease, color .5s ease;
    border-radius: 12px;
    width:100%;
    padding: 16px;
    align-items: center;
    justify-content: space-between;
    cursor:pointer;
}

.questiontext-item {
    flex: 1 1 auto;
    min-width: 0; 
    font-size:13px;
    font-family:Inter-SemiBold;
    color:inherit;
    white-space: normal;
    transition: 0.4s;
}


.question-item svg path{
    fill:var(--uiAccent);
    transition: fill .5s ease;
}

.question-item svg{
    transition: transform .3s ease;
}

.question-item.is-open {
	background: var(--uiBlockActive);
    color: var(--uiAccent);
}

.question-item.is-open svg { transform: rotate(180deg);}

.question-item.is-open .questiontext-item {
  color: var(--uiAccent);
}

.question-item[role="button"] {
  -webkit-tap-highlight-color: transparent; 
}
.question-item[role="button"]:focus,
.question-item[role="button"]:focus-visible {
  outline: none;
  box-shadow: none;
}

.answer-item{
  overflow: hidden;
  height: 0;               
  opacity: 0;
  transform: translateY(-4px);

  background-color: var(--uiBlock);
  border-radius: 12px;
  width: 100%;

  transition: height .28s ease, opacity .18s ease, transform .18s ease;
  will-change: height;
}

.answer-item.is-open{
  opacity: 1;
  transform: translateY(0);
}

.answertext-item{
  display:block;
  padding: 12px 16px;
  font-size:13px;
  font-family:Inter-SemiBold;
  color:var(--uiDescription);
}


@media (prefers-reduced-motion: reduce){
  .answer-item{ transition:none; }
}

.text-colored { color: var(--uiAccent); }

/*Создание заказа*/

.crodrer-cont {
    display:grid;
    gap:24px;
    margin-top:24px;
}

.crorderinfo-cont {
    display:grid;
    gap:24px;
}

.crorder-text {
    font-family:Inter-SemiBold;
    font-size:11px;
    color:var(--uiAccent);
}

.crorder-dopcont {
    display:grid;
    gap:12px;
}

.crorderinfo-flex {
    display:flex;
    gap:12px;
    align-items:center;
}

.crodrerinfo-img {
    border-radius:12px;
    background-color:var(--uiBlock);
    display:flex;
    justify-content:center;
    align-items:center;
    width:48px;
    height:48px;
}

.crodrerinfo-img img {
    width:24px;
    height:24px;
}

.crorderinfo-iteminfo {
    display:grid;
    color:var(--uiText);
    font-family:Inter-Bold;
    gap:6px;
}

.crorderinfo-itemname {
    font-size:14px;
}

.crorderinfo-itemprice {
    display:flex;
    align-items:center;
    font-size:15px;
    gap:6px;
}

.crorderinfo-itemprice svg .rub-svg {
    fill:var(--uiAccent);
}

.crorder-detailcont {
    display:grid;
    gap:6px;
}

.crorder-inputinfo {
    display:flex;
    padding:3px 6px 0 6px;
    gap:12px
}

.crorder-inputimg {
    display:flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    background-color:var(--uiBlock);
    border-radius:9px;
}

.crorder-inputimg svg path {
    fill:var(--uiAccent);
}


.crorder-input {
    padding:9px 0 19px 0;
    display:flex;
    flex:1;
    font-family:Inter-SemiBold;
    font-size:14px;
    border-bottom:1px solid var(--uiBlock);
}

.crorder-inputtitle {
    color:var(--uiText);
    font-family: Inter-Semibold;
}

.crorder-inputpass {
    margin-left:auto;
    color:var(--uiAccent);
    font-family: Inter-Semibold;
}

.crorder-paymentcont {
    display:grid;
    gap:6px;
}

.crorder-payment {
    display:flex;
    gap:12px;
    padding:9px 6px 0 6px;
    border-radius:12px;
    cursor:pointer;
}

.crorder-payment--disabled {
    opacity: 0.48;
    cursor: default;
    pointer-events: none; 
}

.crorder-payment:hover .crorder-paymentinfocont{
    border-bottom:1px solid var(--uiAccent);
}

.crorder-payment--active .crorder-paymentinfocont {
    border-bottom-color: var(--uiAccent);
}


.crorder-paymentimg {
    display:flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    background-color:var(--uiBlock);
    border-radius:9px;
}

.crorder-paymentimg svg .aviedo-logo {
    fill:var(--uiAccent);
}

.crorder-paymentinfocont {
    padding:0 0 10px 0;
    border-bottom:1px solid var(--uiBlock);
    flex:1;
    transition: 0.4s;
}

.crorder-paymentinfo {
    display:grid;
    gap:4px;
}

.crorder-paymentname {
    font-family:Inter-Semibold;
    font-size:14px;
    color:var(--uiText);
}

.crorder-paymentcomission {
    font-family:Inter-SemiBold;
    font-size:11px;
    color:var(--uiAccent);
}

.crorder-paycont {
    display:grid;
    gap:16px;
}

.crorder-payflex {
    display:flex;
    align-items:center;
}

.crorder-summcont {
    display:grid;
    gap:5px;
}

.crorder-summ {
    display:flex;
    align-items:center;
    gap:6px;
    font-family:Inter-Bold;
    font-size:17px;
    color:var(--uiText);
}

.crorder-summ svg .rub-svg{
    fill:var(--uiAccent);
}

.crorder-promo {
    font-family:Inter-SemiBold;
    font-size:11px;
    color:var(--uiAccent);
    cursor:pointer;
}

.crorder-promo:hover  {
    color: var(--uiAccentText);
}

.btn-pay {
    margin-left:auto;
    border-radius:12px;
    padding:14px 32px;
    color:var(--uiAccent);
    background-color:var(--uiBlock);
    font-family:Inter-SemiBold;
    font-size:14px;
    cursor:pointer;
    transition: 0.4s;
}

.btn-pay:hover {
    background-color: var(--uiBlockActive);
    transition: 0.4s;
}


.crorder-payinfo {
    text-align:center;
    color:var(--uiDescription);
    font-family:Inter-SemiBold;
    font-size:11px;
}

.crorder-payinfo span {
    color:var(--uiAccent);
    cursor:pointer;
}

.crorder-payinfo span:hover {
    color: var(--uiAccentText);
}


/*Пополнение баланса*/

.deposit-cont {
    display:grid;
    gap:24px;
    margin-top:24px;
}

.deposit-headcont {
    display:grid;
    gap:12px;
}

.deposit-inputcont {
    display:flex;
    padding:9px 6px 0 6px;
    gap:16px;
}

.deposit-inputcont img {
    width:16px;
    height:16px;
}

.deposit-input {
    padding:0 0 15px 0;
    border: 0;
    font-family:Inter-SemiBold;
    font-size:14px;
    color:var(--uiText);
    border-bottom:1.5px solid var(--uiBlock);
    outline: none;
    background-color: transparent;
    flex:1;
}

.deposit-input::placeholder {
  color: var(--uiSecondaryDescription);     
  opacity: 1;          
}

.deposit-autosumcont {
    display:grid;
    gap:6px;
    grid-template-columns: repeat(4, 1fr);
}

.deposit-autosumitem {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:9px 0;
    border-radius:12px;
    background-color:var(--uiBlock);
    color:var(--uiText);
    font-size:14px;
    font-family:Inter-SemiBold;
    cursor:pointer;
    transition: 0.4px;
    transition: background-color 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}

.deposit-autosumitem svg .rub-svg {
    fill:var(--uiAccent);
}

.deposit-autosumitem:hover {
    background-color: var(--uiBlockActive);
    transition: 0.4px;
}


.deposit-text {
    font-family:Inter-SemiBold;
    font-size:11px;
    color:var(--uiAccent);
}

.deposit-dopcont {
    display:grid;
    gap:16px;
}

.deposit-paymentcont {
    display:grid;
    gap:6px;
}

.deposit-payment {
    display:flex;
    gap:12px;
    padding:9px 6px 0 6px;
    border-radius:12px;
    cursor:pointer;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.deposit-paymentimg {
    display:flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    background-color:var(--uiBlock);
    border-radius:9px;
}

.deposit-paymentimg img{
    width:16px;
    height:16px;
}

.deposit-paymentinfocont {
    padding:0 0 10px 0;
    border-bottom:1px solid var(--uiBlock);
    flex:1;
    transition: border-color 0.2s ease;
}

.deposit-payment:hover .deposit-paymentinfocont,
.deposit-payment.active .deposit-paymentinfocont {
    border-bottom-color: var(--uiAccent);
}

.deposit-paymentinfo {
    display:grid;
    gap:4px;
}

.deposit-paymentname {
    font-family:Inter-Bold;
    font-size:14px;
    color:var(--uiText);
}

.deposit-paymentcomission {
    font-family:Inter-SemiBold;
    font-size:11px;
    color:var(--uiAccent);
}

.deposit-paymentcomission span {
    color: var(--uiDescription);
}

.deposit-payflex {
    display:flex;
    align-items:center;
}

.deposit-summcont {
    display:grid;
    gap:5px;
}

.deposit-summ {
    display:flex;
    align-items:center;
    gap:6px;
    font-family:Inter-Bold;
    font-size:18px;
    color:var(--uiText);
}

.deposit-summ svg .rub-svg{
    fill:var(--uiAccent);
}

.deposit-titlepay {
    font-family:Inter-SemiBold;
    font-size:11px;
    color:var(--uiSecondaryDescription);
}

.btn-deposit {
    margin-left:auto;
    border-radius:12px;
    padding:14px 32px;
    color:var(--uiAccent);
    background-color:var(--uiBlock);
    font-family:Inter-SemiBold;
    font-size:14px;
    cursor:pointer;
    transition: 0.4s;
}

.btn-deposit:hover {
    background-color: var(--uiBlockActive);
    transition: 0.4s;
}


.deposit-payinfo {
    text-align:center;
    color:var(--uiDescription);
    font-family:Inter-SemiBold;
    font-size:11px;
}

.deposit-payinfo span {
    color:var(--uiAccent);
    cursor:pointer;
}

.deposit-payinfo span:hover {
    color: var(--uiAccentText);
}

/*Вывод баланса*/

.withdrawal-inputcont img {
    width:16px;
    height:16px;
}

.withdrawal-inputcont {
    display:flex;
    padding:0 0 15px 0;
    flex:1;
    border-bottom:1.5px solid var(--uiBlock);
}

.withdrawal-input {
    font-family:Inter-SemiBold;
    font-size:14px;
    color:var(--uiText);
    border: 0;
    outline: none;
    background-color: transparent;
}

.withdrawal-input::placeholder {
  color: var(--uiSecondaryDescription);     
  opacity: 1;          
}

.withdrawal-btnall {
    margin-left:auto;
    padding:0 16px;
    font-family:Inter-SemiBold;
    font-size:14px;
    color:var(--uiAccent);
    cursor:pointer;
}

.withdrawal-btnall:hover {
    color: var(--uiAccentText);
}


.withdrawal-autosumcont {
    display:grid;
    gap:6px;
    grid-template-columns: repeat(2, 1fr);
}

.withdrawal-autosumitem {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:9px 0;
    border-radius:12px;
    background-color:var(--uiBlock);
    color:var(--uiText);
    font-size:14px;
    font-family:Inter-SemiBold;
}

.withdrawal-autosumitem span {
    color:var(--uiDescription);
}

.withdrawal-autosumitem svg .rub-svg{
    fill:var(--uiAccent);
}

/*Настройки*/

.settings-maincont {
    display:grid;
    gap:32px;
    margin-top:24px;
}

.head-settings {
    display: grid;
    gap: 15px;
    justify-items: center;
}

.stik-settings {
    border-radius: 18px;
    height: 96px;
    width: 96px;
}

.head-textcont {
    display: grid;
    gap: 6px;
    text-align: center;
}

.head-settingstitle {
    font-family: Inter-SemiBold;
    font-size: 16px;
    color: var(--uiText);
}

.head-settingsnote {
    font-family:Inter-Semibold;
    font-size:12px;
    color:var(--uiDescription);
}

.settings-main {
    display:grid;
    gap:24px;
}

.settings-dopcont {
    display:grid;
    gap:12px;
}

.settings-title {
    font-size:11px;
    font-family:Inter-SemiBold;
    color:var(--uiAccentText);
}

.settings-items {
    display:grid;
    gap:6px;
}

.settings-item {
    display:flex;
    gap:9px;
    padding:9px 6px 0 6px;
    max-height: 55px;
}

.settigns-itemimg {
    width:32px;
    height:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:var(--uiBlock);
    border-radius:9px;
}

.settigns-itemimg path {
    fill:var(--uiAccentText);
}

.settings-itemdop {
    display:flex;
    align-items:center;
    flex:1;
    border-bottom:1px solid var(--uiBlock);
    padding:3px 0 16px 0;
}

.settings-itemdopend {
    display:flex;
    align-items:center;
    flex:1;
    padding:3px 0 16px 0;   
}

.settings-itemdopmore {
    display:flex;
    align-items:center;
    flex:1;
    border-bottom:1px solid var(--uiBlock);
    padding:3px 0 21px 0;
}

.settings-itemdopmoreend {
    display:flex;
    align-items:center;
    flex:1;
    padding:3px 0 21px 0;
}

.settings-itemtitle {
    font-family:Inter-SemiBold;
    font-size:14px;
    color:var(--uiText);
}

.settings-switch {
  background: var(--uiBlock);
  padding: 2px;
  border-radius: 999px;
  margin-left: auto;      
  display: flex; 
  align-items: center;
  justify-content: center;
}

.settings-switch span {
  background: var(--uiBlockActive);
  color: var(--uiAccentText);
  padding: 4px 13px;
  border-radius: 999px;
  font-family:Inter-Bold;
  font-size:11px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.settings-color {
    display:flex;
    align-items:center;
    gap:9px;
    margin-left:auto;
}

.color-edit {
    border-radius:50%;
    width:16px;
    height:16px;
    cursor:pointer;
    box-sizing: content-box;
}


#color-blue   { background-color:#4597da; }
#color-pink   { background-color:#DB7BB8; }
#color-purple  { background-color:#8A7BDB; }
#color-yellow { background-color:#DAC945; }
#color-green { background-color:#45DAAB; }

.active-color {
    padding:2px;
    border:1px solid var(--uiAccent);
    background-clip: content-box;
}

.settigns-switchlock {
    padding:3px;
    background-color:var(--uiBlock);
    border-radius:100px;
    width:41px;
    display:flex;
    align-items:center;
    justify-content:right;
    margin-left:auto;
    cursor:pointer;
}

.settigns-switchlock-active {
    padding: 3px;
    width: 41px;
    height: 22px;                
    border-radius: 999px;
    background-color: var(--uiBlock);
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    transition: background-color .2s ease;
    margin-left:auto;
}

.settigns-switchlock svg rect {
    fill:var(--uiAccent);
}


.padlock-cont {
    background-color:var(--uiAccent);
    width:16px;
    height:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
}


/* КРУЖОК */
.circle-switch {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: var(--uiBlockInactive);
    transform: translateX(0); 
    transition: transform .22s ease, background-color .2s ease, box-shadow .2s ease;
}

/* ВКЛЮЧЕНО (скрыт баланс) */
.settigns-switchlock-active.is-on {
    background-color: var(--uiBlock);
}
.settigns-switchlock-active.is-on .circle-switch {
    transform: translateX(19px); 
    background-color: var(--uiAccent);
}

.settigns-switchlock-active:active .circle-switch {
    box-shadow: 0 0 0 8px rgba(0,0,0,.06);
}

@media (prefers-reduced-motion: reduce) {
    .settigns-switchlock-active, .circle-switch { transition: none !important; }
}

/* Уведомления */

.main-notifications {
    margin-top:24px;
    width:100%;
    display:grid;
    gap:20px;
}

.stik-notifications {
    margin:0 auto;
    width:96px;
    height:96px;
    border-radius: 18px;
}

.info-notifications {
    display:grid;
    gap:12px;
    text-align: center;
}

.title-notifications {
    font-size:16px;
    font-family: Inter-Bold;
    color:var(--uiAccent);
}

.text-notifications {
    color:var(--uiDescription);
    font-family: Inter-Medium;
    font-size:13px;
}

.flex-notif {
    display: flex;
    gap:9px;
    align-items: center;
    margin: 0 auto;
}

.dopbtn-notif {
    border-radius: 111px;
    padding:11px 16px;
    color:var(--uiDescription);
    font-size: 14px;
    font-family: Inter-SemiBold;
    background: rgba(25, 25, 31, 0.24);
    border: 1px dashed #282837;
    line-height: 1;
    cursor: pointer;
}

.tg-notif {
    color: #fff;
    font-size: 14px;
    font-family: Inter-SemiBold;
    border-radius: 12px;
    padding: 9px 12px;
    background-color: var(--uiAccent);
    text-align: center;
    line-height: 1;
}

/* Рефералы */

.main-contpage {
    gap:24px;
    display:grid;
    margin-top:24px;
}

.info-referrals {
    display:grid;
    gap:24px;
}

.header-referrals {
    display:grid;
    gap:20px;
}

.stik-referrals {
    margin:0 auto;
    width:96px;
    height:96px;
    border-radius: 18px;
}

.headerinfo-referrals {
    display:grid;
    gap:6px;
    text-align:center;
}

.title-referrals {
    font-family:Inter-Bold;
    font-size:16px;
    color:var(--uiText);
}

.note-referrals {
    font-family: Inter-Medium;
    font-size:13px;
    color:var(--uiDescription);
}

.maininfo-referrals {
    display:grid;
    gap:16px;
}

.statslist-referrals {
    display:flex;
    padding:9px 0 9px 0;
}

.stat-referrals {
    display:grid;
    gap:6px;
    text-align: center;
    flex:1;
}

.countstat-referrals {
    font-size:16px;
    font-family: Inter-Bold;
    color: var(--uiText);
}

.namestat-referrals {
    font-size:11px;
    font-family: Inter-SemiBold;
    color:var(--uiSecondaryDescription);
}

.percent-sign {
    color:var(--uiDescription);
}

.linkcont-referrals{
  position: relative;
  width:100%;
  padding: 16px 48px 16px 12px;
  border-radius: 9px;
  background: #19191F52;
  box-sizing: border-box;
  overflow: hidden;
  cursor: pointer;
}

.linkcont-referrals::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  border: 2px dashed var(--uiBlockInactive);
  pointer-events:none;
  z-index: 1;
}

.link-referrals{
  position: relative;
  z-index: 2;
  line-height: 1;
  padding-right: 8px;
  color:var(--uiSecondaryDescription);
  font-size:14px;
  font-family: Inter-SemiBold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.copy-referrals{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border-radius: 0 9px 9px 0;
    background-color: var(--uiBlock);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index: 3;
    cursor:pointer;
}

.copy-referrals svg path{
  transition: fill 0.4s ease;
}

.copy-referrals:hover svg path{
  fill: var(--uiSecondaryDescription);
}

.toast-top{
  position: fixed;
  left: 50%;
  top: calc(var(--tg-content-safe-area-inset-top, 0px) + 75px);
  transform: translateX(-50%);
  z-index: 9999;

  display: flex;
  flex-direction: column;
  gap: 10px;
  pointer-events: none;
}

.toast-item{
  width: max-content;
  max-width: calc(100vw - 24px);
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--uiBlockInactive);
  background: rgba(25, 25, 31, 0.64);
  backdrop-filter: blur(24px);
  color: var(--uiText);
  font-size: 13px;
  font-family: Inter-SemiBold;
  text-align: center;
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity .18s ease, transform .18s ease;
}

.toast-item.show{
  opacity: 1;
  transform: translateY(0);
}

.toast-item.hide{
  opacity: 0;
  transform: translateY(-10px);
}

.main-referrals {
    display:grid;
    gap:20px;
}

.switch-referrals  {
    display:grid;
    text-align:center;
    padding:0;
    border-bottom:1.5px solid var(--uiBlock);
    grid-template-columns: repeat(2, 1fr);
}

.itemswitch-referrals {
    color:var(--uiDescription);
    font-family:Inter-SemiBold;
    font-size:14px;
    padding:9px 0 16px 0;
    cursor:pointer;
    border-bottom:1.5px solid transparent;
    box-sizing:border-box;
    transition: 0.4s;
}

.itemswitch-referrals:hover {
    color: var(--uiSecondaryDescription);
    transition: 0.4s;
}

.activeswitch-referrals {
    color:var(--uiAccent);
    border-bottom-color: var(--uiAccent);
    cursor: default;
}

.activeswitch-referrals:hover {
    color:var(--uiAccent);
    border-bottom-color: var(--uiAccent);
}

.page-referrals {
    display:grid;
    gap:12px;
}

.headerpage-referrals {
    font-family:Inter-SemiBold;
    font-size:11px;
    display:flex;
    justify-content: space-between;
}

.nothingpage-referrals {
    display:grid;
    gap:12px;
    padding:20px 0 9px 0;
    margin:0 auto;
    justify-items: center;  
    text-align: center;     
}

.nothingicontext-referrals {
    color:var(--uiSecondaryDescription);
    font-size:14px;
    font-family: Inter-SemiBold;
}

.users-referrals {
    display:flex;
    padding:9px 6px 0 6px;
    gap:12px;
}

.imguser-referrals {
    width:32px;
    height:32px;
    border-radius: 50%;
    background-color: var(--uiSecondaryDescription);
}

.statsuser-referrals {
    display:flex;
    padding:3px 0 12px 0;
    border-bottom:1px solid var(--uiBlock);
    flex: 1; 
    justify-content: space-between;
}

.infouser-referrals {
    display:grid;
    gap:6px;
}

.nameuser-referrals {
    color:var(--uiText);
    font-size:14px;
    font-family: Inter-SemiBold;
    line-height: 1;
}

.dateuser-referrals {
    color:var(--uiAccent);
    font-size:11px;
    font-family: Inter-SemiBold;
}

.dateuser-referrals span {
    color:var(--uiDescription);
}

.sumuser-referrals {
    display: flex;
    gap:6px;
    align-items: center;
    color:var(--uiText);
    font-family: Inter-Bold;
    font-size: 15px;
}

.sumuser-referrals svg .valute-svg{
    fill:var(--uiAccent);
}

/* Создание отзыва */

.header-order {
    display:grid;
}

.titlecont-order {
    display:grid;
    gap:20px;
}

.maininfo-order {
    display:flex;
    gap:12px;
    align-items:center
}

.img-order {
    width:42px;
    height:42px;
    background-color: var(--uiBlock);
    display:flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    flex-shrink: 0;
}

.img-order img{
    width:24px;
    height:24px;
}

.title-order {
    display:grid;
    gap:7px;
    width:100%;
}

.textup-order {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex:1 1 auto;
}

.tovar-order {
    color:var(--uiText);
    font-size:14px;
    font-family: Inter-Bold;
}

.date-order {
    font-size:11px;
    font-family: Inter-SemiBold;
    color:var(--uiSecondaryDescription);
}

.status-order {
    color:var(--uiAccent);
    font-size:12px;
    font-family: Inter-SemiBold;
}

.body-review {
    display:grid;
    gap:12px;
}

.title-crreview {
    color:var(--uiAccent);
    font-size:11px;
    font-family: Inter-SemiBold;
    list-style: 1;
}

.mainsettings-review {
    display:grid;
    gap:12px;
}

.settings-review {
    display:grid;
    gap:9px;
}

.punkt-review {
    display: flex;
    gap:12px;
    padding:9px 0 0 0;
}

.img-crreview {
    border-radius: 9px;
    background-color: var(--uiBlock);
    width:32px;
    height:32px;
    display:flex;
    justify-content: center;
    align-items: center;
}

.img-crreview path {
    fill:var(--uiAccent);
}

.punktinfo-review {
    display:flex;
    padding:0 0 16px 0;
    border-bottom:1.5px solid var(--uiBlock);
    flex:1;
    align-items: center;
}

.mainpunktinfo-review {
    display:flex;
    padding:3px 0 21px 0;
    border-bottom:1.5px solid var(--uiBlock);
    flex:1;
    align-items: center;
}

.nameinfo-review {
    color:var(--uiText);
    font-size:14px;
    font-family: Inter-SemiBold;
    line-height: 1;
}

.selector-review {
    display:flex;
    font-size:11px;
    font-family: Inter-Bold;
    line-height: 1;
    background-color: var(--uiBlock);
    border-radius: 100px;
    margin-left: auto;
    padding: 2px;
    gap: 3px;
    align-items: center;
}

.rating-crreview {
    color:var(--uiAccent);
    display:flex;
    gap:6px;
    padding:8px 14px;
    border-radius: 100px;
    cursor: pointer;
    transition: background-color .18s ease, transform .12s ease;
    user-select: none;
}

.rating-crreview path {
    fill:var(--uiAccent);
    transition: fill .18s ease;
}

.active-rating {
    background-color:var(--uiBlockActive);
    border-radius: 100px;
}

.switch-review {
    width:41px;
    padding:3px;
    border-radius: 100px;
    background-color: var(--uiBlock);
    margin-left:auto;
    cursor: pointer;
    display:flex;
    align-items:center;
}

.switch-circle {
    width:16px;
    height:16px;
    background-color: var(--uiBlockInactive);
    border-radius: 100px;
    transition: transform .18s ease, background-color .18s ease;
}

.switch-review--on{
  background-color: var(--uiBlockActive);
}

.switch-review--on .switch-circle{
  transform: translateX(19px);
  background-color: var(--uiAccent);
}

.review-textblock {
    display:grid;
    gap:12px;
}

.textinput-review {
    width:100%;
    background-color:var(--uiBlock);
    border-radius: 12px;
    border: 0;
    height:90px;
    outline: none;
    color:var(--uiText);
    font-size:13px;
    font-family: Inter-SemiBold;
    padding:16px;
    resize:none;
    overflow-y:auto;
    overflow-x:hidden;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
    word-break:break-word;
}

.textinput-review::placeholder {
  color: var(--uiSecondaryDescription);     
  opacity: 1;          
}

.warn-review {
    font-size:11px;
    font-family: Inter-SemiBold;
    color:var(--uiSecondaryDescription);
}

.btnsubmit-review {
    padding:14px 0;
    background-color: var(--uiBlock);
    border-radius: 12px;
    color:var(--uiAccent);
    cursor: pointer;
    text-align: center;
    font-size:14px;
    font-family: Inter-SemiBold;
}

.review-submitbar{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
  background: var(--uiBg); 
}

.review-submitbar .btnsubmit-review{
  width: 100%;
  border:0;
}

.back-review {
    color:#fff;
    font-size:14px;
    font-family: Inter-SemiBold;
    border-radius: 12px;
    padding:9px 12px;
    background-color: var(--uiAccent);
    text-align: center;
    line-height: 1;
    width:auto;
    margin:0 auto;
}

.maincont-notifpay {
    margin-top:24px;
    width:100%;
    display:grid;
    gap:20px;
}

.img-notifpay {
    margin:0 auto;
    width:96px;
    height:96px;
    border-radius: 18px;
}

.info-notifpay {
    display:grid;
    gap:12px;
    text-align: center;
}

.title-notifpay {
    font-size:16px;
    font-family: Inter-Bold;
    color:var(--uiAccent);
}

.text-notifpay {
    color:var(--uiDescription);
    font-family: Inter-Medium;
    font-size:13px;
}

.back-notifpay {
    color:#fff;
    font-size:14px;
    font-family: Inter-SemiBold;
    border-radius: 12px;
    padding:9px 12px;
    background-color: var(--uiAccent);
    text-align: center;
    line-height: 1;
    width:auto;
    margin:0 auto;
}