/* Переключение цвета фона слева направо */
.btn-9 .tn-atom {
  z-index: 1;
  position: relative;
  overflow: hidden;
  border-radius: 4px; /* Без скругления изначально */
  transition: border-radius 0.3s ease; /* Плавный переход для скругления */
}

.btn-9 .tn-atom:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background-color: #CFC3FF; /* Цвет фона при наведении */
  transition: all 0.3s ease;
}

.btn-9 .tn-atom:hover {
  color: #3D1C02 !important; /* Цвет текста при наведении */
  border-radius: 4px; /* Скругление углов при наведении */
}

.btn-9 .tn-atom:hover:after {
  left: 0;
  width: 100%;
}

.btn-9 .tn-atom:active {
  top: 2px;
}

.t-feed__post-tag {
    font-size: 10px !important;
}


/* Переключение цвета фона слева направо */
.btn-10 .tn-atom {
  z-index: 1;
  position: relative;
  overflow: hidden;
  border-radius: 4px; /* Без скругления изначально */
  transition: border-radius 0.3s ease; /* Плавный переход для скругления */
}

.btn-10 .tn-atom:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background-color: #A65ED3; /* Цвет фона при наведении */
  transition: all 0.3s ease;
}

.btn-10 .tn-atom:hover {
  color: #ffffff !important; /* Цвет текста при наведении */
  border-radius: 4px; /* Скругление углов при наведении */
}

.btn-10 .tn-atom:hover:after {
  left: 0;
  width: 100%;
}

.btn-10 .tn-atom:active {
  top: 2px;
}

.t-feed__post-tag {
    font-size: 10px !important;
}

/* Переключение цвета фона слева направо */
.btn-8 .tn-atom {
  z-index: 1;
  position: relative;
  overflow: hidden;
  border-radius: 4px; /* Без скругления изначально */
  transition: border-radius 0.3s ease; /* Плавный переход для скругления */
}

.btn-8 .tn-atom:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background-color: #3D1C02; /* Цвет фона при наведении */
  transition: all 0.3s ease;
}

.btn-8 .tn-atom:hover {
  color: #ffffff !important; /* Цвет текста при наведении */
  border-radius: 4px; /* Скругление углов при наведении */
}

.btn-8 .tn-atom:hover:after {
  left: 0;
  width: 100%;
}

.btn-8 .tn-atom:active {
  top: 2px;
}

.t-feed__post-tag {
    font-size: 10px !important;
}




.punkt[data-elem-type="text"] a {
    border: 0 !important;
    display: inline-block !important;
    width: auto !important;
    position: relative !important;
    transition: all 0.3s ease !important;
    /* цвет ссылки до наведения */
    color: #3D1C02 !important;
}

.punkt[data-elem-type="text"] a:hover {
    /* цвет ссылки после наведения */
    color: #A65ED3 !important;
}

.punkt[data-elem-type="text"] a::after {
    content: '';
    position: absolute;
    transition: all 0.3s ease;
    margin: auto;
    /* отступ между ссылкой и подчеркиванием; 
    если нужно сделать расстояние больше, то используй отрицательное значение */
    margin-bottom: 2px;
    /* толщина подчеркивания */
    height: 1px;  
    /* цвет подчеркивания до наведения */
    background: ; 
     
    opacity: 1;
    top: auto;
    bottom: 0;
    left: 0;
    right: auto;
    width: 0;
     
}

.punkt[data-elem-type="text"] a:hover::after {
    /* цвет подчеркивания после наведения */
    background: #A65ED3;
     
    opacity: 1;
    top: auto;
    bottom: 0;
    left: 0;
    right: auto;
    width: 100%;
     
}


.t-form__successbox {
    background: #E6E0FF;
    color: #3D1C02;
    border-radius: 10px;
}
