.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown > input[type="checkbox"] {
    position: absolute;
    left: -100vw;
}

.dropdown > label {
    display: inline-flex;
    align-items: center;
    color: #0C1B2E;
    font-size: 18px;
    cursor: pointer;
    font-weight: 500;
}

.dropdown > label img {
    margin-left: 8px;
    width: 16px;
    height: 16px;
}

.dropdown-menu {
    display: none;
    position: absolute;
    right: 0;
    margin-top: 10px;
    width: 220px;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border: 1px solid #e0e0e0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    z-index: 10;
}

.dropdown-menu ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.dropdown > input[type="checkbox"]:checked ~ .dropdown-menu {
    display: block;
    opacity: 1;
    visibility: visible;
}

.logout-button {
    display: flex;
    align-items: center;
    padding: 10px;
    color: red;
    background: none;
    border: none;
    cursor: pointer;
    width: 100%;
}

.logout-button img {
    margin-right: 8px;
}
.underline-on-hover {
    position: relative;
    display: inline-block;
    text-decoration: none;
  }
  
  .underline-on-hover::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: white;
    transition: width 0.3s ease;
  }
  
  .underline-on-hover:hover::after {
    width: 100%;
  }

.mobile-menu {
    display: none;
    bottom: -67px;
}

#burger-toggle:checked ~ .mobile-menu {
    display: flex;
    transform: translateX(0);
}
.btn-category {
    padding: 10px 15px;
}

/* MENU */
.category-menu {
    position: relative;
    display: inline-block;
}

/* Скрываем чекбокс */
.category-toggle {
    display: none;
}

/* Кнопка */
.category-btn {
    width: 158px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    background-color: #195BA9;
    font-size: 16px;
    color: white;
    cursor: pointer;
    border: none;
    transition: opacity 0.2s ease-in-out;
}
.category-btn:hover {
    opacity: 0.8;
}

/* Меню по умолчанию скрыто */
.category-dropdown {
    position: absolute;
    left: 0;
    margin-top: 8px;
    z-index: 30;
    min-width: 250px;
    background: #17181f;
    border-radius: 8px;
    border: none;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    opacity: 0;
    pointer-events: none;
    transform: translateY(5px);
    transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
    overflow-y: scroll;
    max-height: 400px;
    color: #fff;
}

/* Показ меню только при клике */
.category-toggle:checked + .category-btn + .category-dropdown {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

/* Стили списка */
.category-dropdown ul {
    list-style: none;
    padding: 8px 0;
    margin: 0;
}

.category-dropdown li a {
    display: block;
    padding: 8px 16px;
    font-size: 14px;
    color: #adafb8;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}
.category-dropdown li a:hover {
    background-color: #F9FAFB;
    color: #195BA9;
}

.category-dropdown li span {
    display: block;
    padding: 8px 16px;
    color: #9ca3af;
    font-size: 14px;
}

.relative.inline-flex.items-center.px-2.py-2.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.rounded-l-md.leading-5.hover\:text-gray-400.focus\:z-10.focus\:outline-none.focus\:ring.ring-gray-300.focus\:border-blue-300.active\:bg-gray-100.active\:text-gray-500.transition.ease-in-out.duration-150.dark\:bg-gray-800.dark\:border-gray-600.dark\:active\:bg-gray-700.dark\:focus\:border-blue-800 {
    background: #f9fafb !important;
    border: none !important;
    box-shadow: 1px 1px 1px 2px #ddd !important;
}

.relative.inline-flex.items-center.px-4.py-2.-ml-px.text-sm.font-medium.text-gray-700.bg-white.border.border-gray-300.leading-5.hover\:text-gray-500.focus\:z-10.focus\:outline-none.focus\:ring.ring-gray-300.focus\:border-blue-300.active\:bg-gray-100.active\:text-gray-700.transition.ease-in-out.duration-150.dark\:bg-gray-800.dark\:border-gray-600.dark\:text-gray-400.dark\:hover\:text-gray-300.dark\:active\:bg-gray-700.dark\:focus\:border-blue-800 {
    background: #fff !important;
    border: none !important;
    box-shadow: 1px 1px 1px 2px #ddd !important;
}

.relative.inline-flex.items-center.px-4.py-2.-ml-px.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.cursor-default.leading-5.dark\:bg-gray-800.dark\:border-gray-600 {
    background: #195ba9 !important;
    border: 1px solid #195ba9 !important;
    color: #fff !important;
}

.relative.inline-flex.items-center.px-2.py-2.-ml-px.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.rounded-r-md.leading-5.hover\:text-gray-400.focus\:z-10.focus\:outline-none.focus\:ring.ring-gray-300.focus\:border-blue-300.active\:bg-gray-100.active\:text-gray-500.transition.ease-in-out.duration-150.dark\:bg-gray-800.dark\:border-gray-600.dark\:active\:bg-gray-700.dark\:focus\:border-blue-800 {
    background: #fff !important;
    border: none !important;
    box-shadow: 1px 1px 1px 2px #ddd !important;
}

.relative.inline-flex.items-center.px-2.py-2.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.cursor-default.rounded-l-md.leading-5.dark\:bg-gray-800.dark\:border-gray-600 {
    background: #fff !important;
    border: none !important;
    box-shadow: 1px 1px 1px 2px #ddd !important;
}

.relative.inline-flex.items-center.px-2.py-2.-ml-px.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.cursor-default.rounded-r-md.leading-5.dark\:bg-gray-800.dark\:border-gray-600 {
    background: #fff !important;
    border: none !important;
    box-shadow: 1px 1px 1px 2px #ddd !important;
}

.qr-code svg {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
}

.flex-wallet {
    flex-direction: row;
}

.overflow-wrap-anywhere {
    overflow-wrap: anywhere;
}

.captcha-img {
    position: absolute;
    right: 0;
    max-height: 63px;
    border-radius: 0 5px 5px 0;
    border: 1px solid #ddd;
    height: 100%;
    width: 50%;
}

@media(max-width: 1280px) {
    .flex-wallet {
        flex-direction: column;
    }
    .qr-code {
        display: flex;
        width: 100%;
        justify-content: center;
    }
    .text-custom-wallet {
        text-align: center;
        width: 100%;
    }
}

@media(max-width: 767px) {
    .category-btn {
        width: 124px;
        height: 40px;
        font-size: 15px;
    }
}

/* domains carousel */
@keyframes marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
  
.animate-marquee {
    display: flex;
    width: max-content; 
    animation: marquee 20s linear infinite;
}

.relative.inline-flex.items-center.px-4.py-2.-ml-px.text-sm.font-medium.text-gray-700.bg-white.border.border-gray-300.cursor-default.leading-5.dark\:bg-gray-800.dark\:border-gray-600 {
    border: 1px solid #ddd;
    background: #fff;
  }