/* EasyDonate (тема lullaby-dark), магазин melody.easydonate.ru.
   Внешний вид как у notebuns.inflexus.world: чёрный фон, оранжевый #FFAA00,
   фиолетовый #AA00AA, стеклянные карточки, шрифт Onest.
   Грузится в панели EasyDonate как свой CSS. EasyDonate подключает его ДО
   style.css темы, а там свои !important (.filter-button.active,
   .bg-elegant-night, .badge-active). Где они пересекаются с нашими,
   селектор тут специфичнее. */

/* Шрифт с сайта не отдаётся на чужой домен (нет CORS), берём с Google Fonts. */
@import url('https://fonts.googleapis.com/css2?family=Onest:wght@400;500;600;700;800&display=swap');

:root:root {
    --nb-bg: #050505;
    --nb-surface: rgba(20, 20, 25, 0.55);
    --nb-surface-solid: #0f0f14;
    --nb-surface-deep: #0a0a0f;
    --nb-primary: #FFAA00;
    --nb-primary-glow: rgba(255, 170, 0, 0.4);
    --nb-secondary: #AA00AA;
    --nb-accent: #55FF55;
    --nb-text: #F3F4F6;
    --nb-muted: #9CA3AF;
    --nb-border: rgba(255, 255, 255, 0.08);
    --nb-ease: cubic-bezier(0.25, 0.8, 0.25, 1);

    /* переменные самой темы: красный заменяем на оранжевый */
    --accent-color: #FFAA00;
    --accent-muted: rgba(255, 170, 0, 0.46);
    --accent-neutral: rgba(255, 170, 0, 0.31);
}

/* Общее */

html, body {
    background: var(--nb-bg) !important;
}

body {
    color: var(--nb-text);
    font-family: 'Onest', system-ui, sans-serif;
    background-image: radial-gradient(circle at 50% 0%, rgba(255, 170, 0, 0.06) 0%, transparent 70%) !important;
    background-attachment: fixed !important;
}

/* Тема ставит Roboto точечно (nav-link, p, span в подвале), поэтому шрифт
   на все элементы. Иконки Font Awesome (i.fas и т.п.) не трогаем. */
body,
body *:not(i):not(.fa):not(.fas):not(.far):not(.fab):not(.fal) {
    font-family: 'Onest', system-ui, sans-serif !important;
}

/* У темы базовый вес 300, у Onest минимум 400 */
body { font-weight: 400 !important; }
p:not(.font-weight-bold):not(.font-weight-bolder),
.font-weight-light, .form-control, input, textarea { font-weight: 400 !important; }

h1, h2, .h1, .h2 {
    text-transform: uppercase;
    letter-spacing: 1px;
}

a { color: var(--nb-primary); }
a:hover { color: #ffc54d; }

::selection { background: rgba(255, 170, 0, 0.35); color: #fff; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--nb-bg); }
::-webkit-scrollbar-thumb {
    background: rgba(15, 15, 20, 0.9);
    border: 1px solid var(--nb-border);
    border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover { background: var(--nb-primary); }

/* Осенние листья темы: у сайта их нет */
#autumn { display: none !important; }

/* Полоса загрузки October CMS */
.stripe-loading-indicator .stripe,
.stripe-loading-indicator .stripe-loaded {
    background: linear-gradient(90deg, var(--nb-primary), var(--nb-secondary)) !important;
}

/* Фоны темы */

.bg-elegant-dark,
main.bg-elegant-dark,
#sections {
    background-color: transparent !important;
}

.bg-elegant {
    background-color: var(--nb-surface) !important;
}

html .bg-elegant-night {
    background-color: var(--nb-surface-deep) !important;
}

.fill-elegant-dark { fill: var(--nb-bg) !important; }

.text-danger, .text-success { color: var(--nb-primary) !important; }
.bg-danger { background-color: var(--nb-primary) !important; }
.text-gray { color: var(--nb-muted) !important; }

/* Навбар: стеклянная пилюля как на сайте */

.navbar-main {
    position: relative;
    margin: 15px auto 0;
    width: calc(100% - 32px);
    max-width: 1200px;
    padding: 10px 14px !important;
    border-radius: 100px;
    background: rgba(20, 20, 25, 0.45) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--nb-border);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
}

/* Логотип: вместо загруженной картинки нота и «NoteBuns», как в шапке сайта.
   Нота фоном ссылки, слова двумя псевдоэлементами. */
.navbar-main .navbar-brand {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding-left: 38px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFAA00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18V5l12-2v13'/%3E%3Ccircle cx='6' cy='18' r='3'/%3E%3Ccircle cx='18' cy='16' r='3'/%3E%3C/svg%3E") left center / 28px 28px no-repeat;
    color: var(--nb-text) !important;
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1;
    text-transform: none;
    letter-spacing: 0;
    text-decoration: none;
}

.navbar-main .navbar-brand img { display: none !important; }

.navbar-main .navbar-brand::before { content: 'Note'; color: var(--nb-text); }

.navbar-main .navbar-brand::after {
    content: 'Buns';
    color: var(--nb-primary);
    text-shadow: 0 0 15px var(--nb-primary-glow);
}

.navbar-main .nav-link {
    color: var(--nb-muted) !important;
    font-weight: 600;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    position: relative;
    transition: color 0.3s;
}

.navbar-main .nav-link i { color: var(--nb-primary); margin-right: 4px; }

.navbar-main .nav-link:hover { color: var(--nb-text) !important; }

.navbar-main .nav-link-inner-text { position: relative; }

.navbar-main .nav-link-inner-text::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 0;
    height: 2px;
    background: var(--nb-primary);
    box-shadow: 0 0 10px var(--nb-primary);
    transition: width 0.3s var(--nb-ease);
}

.navbar-main .nav-link:hover .nav-link-inner-text::after { width: 100%; }

/* В меню только «Помощь». Пункты «Магазин» и «Наши серверы» скрыты
   (у «Магазина» и «Помощи» класс link-shop одинаковый, поэтому по href). */
.navbar-main .nav-item:has(> a[href="#shop"]),
.navbar-main .nav-item:has(> a[href="#servers"]),
.navbar-main a.nav-link[href="#shop"],
.navbar-main a.nav-link[href="#servers"] {
    display: none !important;
}

.navbar-main .navbar-collapse { justify-content: flex-end !important; }

/* На телефоне один пункт прятать в бургер незачем: показываем его сразу */
@media (max-width: 991.98px) {
    .navbar-main .container { flex-wrap: nowrap; }

    .navbar-main .navbar-collapse,
    .navbar-main .navbar-collapse.collapse:not(.show) {
        display: flex !important;
        position: static !important;
        flex: 0 0 auto !important;
        width: auto !important;
        height: auto !important;
        overflow: visible !important;
        padding: 0 !important;
        margin: 0 !important;
        background: none !important;
        border: 0 !important;
        box-shadow: none !important;
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    .navbar-main .navbar-collapse-header,
    .navbar-main .navbar-toggler {
        display: none !important;
    }

    .navbar-main .navbar-nav { flex-direction: row; }
    .navbar-main .nav-link { padding: 6px 4px !important; }
}

/* Шапка магазина: одна строка «Официальный магазин Inflexus NoteBuns» */

#welcome-section {
    background-image: none !important;
    background-color: transparent !important;
    padding-top: 2.5rem !important;
    padding-bottom: 0.5rem !important;
}

#welcome-section .shop-title {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
}

/* Красный оверлей темы заменяем свечением как на главной сайта */
#welcome-section.overlay-danger::before,
#welcome-section::before {
    background: radial-gradient(ellipse 60% 70% at 50% 40%, rgba(255, 170, 0, 0.12), transparent 70%),
                radial-gradient(ellipse 40% 50% at 70% 60%, rgba(170, 0, 170, 0.10), transparent 70%) !important;
    opacity: 1 !important;
}

#welcome-section .pattern,
#welcome-section .general-online,
h1.shop-name {
    display: none !important;
}

/* Текст описания из панели подменяется: так строка не зависит от того,
   что там записано. Обычный регистр, «магазин» мелкой подписью ниже. */
.shop-description {
    font-size: 0 !important;
    line-height: 1.1 !important;
    margin: 0 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.shop-description::before {
    content: 'Inflexus NoteBuns';
    display: block;
    font-size: clamp(2.3rem, 7.5vw, 4.25rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #fff;
    text-shadow: 0 0 40px rgba(255, 170, 0, 0.25);
}

.shop-description::after {
    content: 'магазин';
    display: block;
    margin-top: 0.9rem;
    font-size: clamp(0.8rem, 2.4vw, 0.95rem);
    font-weight: 700;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: var(--nb-primary);
}

/* Сервер один, блок с ним не нужен */
#servers { display: none !important; }

/* «Наши товары» и поиск убраны: это блок перед #shop */
section .container.text-white > .d-flex.justify-content-between:has(input[name="search_name"]) {
    display: none !important;
}

#servers + section { padding-top: 1rem !important; }

/* Каталог по секциям: Привилегии, Пропуск, Разбаны.
   В панели у пропуска и разбанов одна категория «Другие», а фильтр темы
   работает на JS и новую кнопку из CSS не получить. Поэтому кнопки фильтра
   скрыты, а товары разложены сеткой по группам с заголовками.

   Разметка: #shop > .row > .col-12 > .row > .col-12 > .row.filter-items >
   .filter-item. Обёрткам между #shop > .row и карточками ставим
   display: contents: их ::before/::after становятся ячейками той же сетки
   и служат заголовками. Место в сетке задаёт order.

   Isotope ставит карточкам inline position: absolute, left, top, а списку
   высоту. Всё это перебито ниже: раскладывает сетка.

   Пропуск узнаётся по id товара (1121338). Всё остальное из «Других»
   попадает в «Разбаны». Новый товар не-разбан в «Другие» надо добавить
   сюда по id. */

#shop .filter-button-group { display: none !important; }

#shop > .row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    margin-top: 0.5rem;
}

@media (min-width: 992px) {
    #shop > .row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

#shop > .row > .col-12,
#shop > .row > .col-12 > .row,
#shop > .row > .col-12 > .row > .col-12,
#shop .filter-items {
    display: contents !important;
}

#shop .filter-item {
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    max-width: none !important;
    width: auto !important;
    order: 5;
}

#shop .filter-item.Привилегии { order: 1; }
#shop .filter-item:has(> #product-1121338) { order: 3; }

/* Заголовки секций */
#shop .filter-items::before,
#shop .filter-items::after,
#shop > .row > .col-12 > .row > .col-12::before {
    grid-column: 1 / -1;
    display: block;
    padding: 0 15px 12px;
    margin: 2.5rem 0 0.25rem;
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #fff;
    background: linear-gradient(90deg, var(--nb-primary), var(--nb-secondary)) 15px 100% / 36px 3px no-repeat;
}

#shop .filter-items::before {
    content: 'Привилегии';
    order: 0;
    margin-top: 0.5rem;
}

#shop .filter-items::after {
    content: 'Пропуск';
    order: 2;
}

#shop > .row > .col-12 > .row > .col-12::before {
    content: 'Разбаны';
    order: 4;
}

/* Если пропуск уберут из продажи, его заголовок не нужен */
#shop > .row:not(:has(#product-1121338)) .filter-items::after {
    display: none;
}

.form-control::placeholder { color: var(--nb-muted) !important; }

.form-control:focus {
    box-shadow: 0 0 0 2px rgba(255, 170, 0, 0.35) !important;
}

/* Карточки товаров. Раскладывает сетка каталога (см. выше), isotope выключен.

   Всё видно сразу, без окна товара: сверху значок, имя и цена, ниже состав,
   внизу «Купить» (сразу в корзину, это кнопка onAdd темы). Клик по самой
   карточке окно товара больше не открывает: в описаниях из панели устаревшая
   ссылка, а лишний клик до покупки не нужен.

   Внутри карточки: a[onRenderProduct] > .row > .col-sm-5 (картинка) и
   .col-sm-7 > .card (имя, цена). .row превращается в сетку, колонки и
   внутренняя .card получают display: contents. Их ::before/::after
   становятся строками той же сетки, в них пункты состава по id товара:
   до 8 пунктов на карточку, у каждого своя галочка и нормальный перенос. */

#shop .filter-item { display: flex !important; flex-direction: column; }
#shop .profile-card { flex: 1; display: flex; flex-direction: column; }

.profile-card > .card {
    flex: 1;
    border-radius: 22px !important;
    overflow: hidden;
    padding-bottom: 82px;
    background: linear-gradient(180deg, rgba(30, 30, 40, 0.6) 0%, rgba(15, 15, 20, 0.8) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    transition: border-color 0.3s, box-shadow 0.3s !important;
}

/* На наведении только подсветка рамки. Сдвиги темы (animate-up-2 на карточке
   и бейдже) выключены: из-за них карточка прыгала, а картинка вылезала. */
.profile-card .animate-up-2,
.profile-card .animate-up-2:hover,
.profile-card > .card:hover,
.profile-card > .card:hover .animate-up-2 {
    transform: none !important;
}

.profile-card > .card:hover {
    border-color: rgba(255, 170, 0, 0.3) !important;
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.45), 0 0 28px rgba(255, 170, 0, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

/* Окно товара по клику выключено */
#shop .profile-card a[data-request="onRenderProduct"] {
    display: block;
    pointer-events: none;
    cursor: default;
}

#shop .profile-card a[data-request="onRenderProduct"] > .row {
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) auto;
    column-gap: 14px;
    align-items: center;
    margin: 0 !important;
    padding: 18px 20px 0;
}

#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-5,
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7,
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7 > .card,
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-header,
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-body,
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-footer {
    display: contents !important;
}

/* Бейдж категории не нужен: его дублирует заголовок секции */
#shop .profile-card .card-header > .badge { display: none !important; }

#shop .profile-card .card-image {
    grid-column: 1;
    grid-row: 1;
    width: 72px;
    height: 72px !important;
    min-height: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: radial-gradient(circle at 50% 50%, rgba(255, 170, 0, 0.14), transparent 70%), var(--nb-surface-deep) !important;
}

#shop .profile-card .product-image {
    position: static !important;
    transform: none !important;
    max-width: 84% !important;
    max-height: 84% !important;
    margin: 0 !important;
    filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.5));
}

#shop .profile-card .card-body > .card-title {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
}

#shop .profile-card .card-footer > h6 {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
    padding-top: 4px;
}

.profile-card .card-footer h6 {
    white-space: nowrap;
    color: var(--nb-primary);
    font-size: 1.15rem;
    font-weight: 800 !important;
    text-shadow: 0 0 15px var(--nb-primary-glow);
}

.profile-card .card-title {
    color: #fff;
    font-weight: 700 !important;
}

/* Пункты состава */
#shop .profile-card a[data-request="onRenderProduct"] > .row::before,
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-5::before,
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-5::after,
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7::before,
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7::after,
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7 > .card::before,
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7 > .card::after,
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-header::before,
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-header::after,
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-body::before,
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-body::after,
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-footer::before,
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-footer::after,
#shop .profile-card a[data-request="onRenderProduct"] > .row::after {
    grid-column: 1 / -1;
    display: block;
    margin-top: 9px;
    padding-left: 25px;
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.45;
    color: #d1d5db;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23FFAA00' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8.5l3.2 3L13 4.5'/%3E%3C/svg%3E") 0 0.18em / 16px 16px no-repeat;
}

#shop .profile-card a[data-request="onRenderProduct"] > .row::before { order: 1; }
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-5::before { order: 2; }
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-5::after { order: 3; }
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7::before { order: 4; }
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7::after { order: 5; }
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7 > .card::before { order: 6; }
#shop .profile-card a[data-request="onRenderProduct"] > .row > .col-sm-7 > .card::after { order: 7; }
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-header::before { order: 8; }
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-header::after { order: 9; }
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-body::before { order: 10; }
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-body::after { order: 11; }
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-footer::before { order: 12; }
#shop .profile-card a[data-request="onRenderProduct"] > .row .card-footer::after { order: 13; }
#shop .profile-card a[data-request="onRenderProduct"] > .row::after { order: 14; }

/* Первый пункт отделён линией от шапки карточки */
#shop .profile-card a[data-request="onRenderProduct"] > .row::before {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--nb-border);
    background-position: 0 calc(14px + 0.18em);
}

#shop #product-1121336 a[data-request="onRenderProduct"] > .row::before,
#shop #product-1121337 a[data-request="onRenderProduct"] > .row::before {
    color: var(--nb-primary);
    font-weight: 700;
}

#product-1121335 a[data-request="onRenderProduct"] > .row::before { content: 'Префикс «Плюшка» в чате, над головой и в Tab'; }
#product-1121335 a[data-request="onRenderProduct"] > .row > .col-sm-5::before { content: '3 привата'; }
#product-1121335 a[data-request="onRenderProduct"] > .row > .col-sm-5::after { content: 'Набор раз в 5 дней (/kit sdoba): железные инструменты и броня, щит, еда'; }
#product-1121335 a[data-request="onRenderProduct"] > .row > .col-sm-7::before { content: 'Частицы вокруг персонажа (/pp)'; }
#product-1121335 a[data-request="onRenderProduct"] > .row > .col-sm-7::after { content: 'Мгновенная выдача'; }
#product-1121336 a[data-request="onRenderProduct"] > .row::before { content: 'Всё из Сдобы'; }
#product-1121336 a[data-request="onRenderProduct"] > .row > .col-sm-5::before { content: 'Префикс «Круассан»'; }
#product-1121336 a[data-request="onRenderProduct"] > .row > .col-sm-5::after { content: '4 привата'; }
#product-1121336 a[data-request="onRenderProduct"] > .row > .col-sm-7::before { content: 'Алмазный набор с зачарованиями раз в 5 дней (/kit croissant)'; }
#product-1121336 a[data-request="onRenderProduct"] > .row > .col-sm-7::after { content: 'Разовый набор декора: стойки, рамки, картины (/kit croissant_decor)'; }
#product-1121336 a[data-request="onRenderProduct"] > .row > .col-sm-7 > .card::before { content: '2 точки дома (/sethome и /home)'; }
#product-1121336 a[data-request="onRenderProduct"] > .row > .col-sm-7 > .card::after { content: 'Возврат туда, где был до телепорта (/back)'; }
#product-1121336 a[data-request="onRenderProduct"] > .row .card-header::before { content: 'Частицы «Жар из печи»'; }
#product-1121336 a[data-request="onRenderProduct"] > .row .card-header::after { content: 'Мгновенная выдача'; }
#product-1121337 a[data-request="onRenderProduct"] > .row::before { content: 'Всё из Круассана'; }
#product-1121337 a[data-request="onRenderProduct"] > .row > .col-sm-5::before { content: 'Префикс «Сладкая Булочка», выше всех в Tab'; }
#product-1121337 a[data-request="onRenderProduct"] > .row > .col-sm-5::after { content: '5 приватов'; }
#product-1121337 a[data-request="onRenderProduct"] > .row > .col-sm-7::before { content: 'Лучший алмазный набор раз в 7 дней (/kit bun)'; }
#product-1121337 a[data-request="onRenderProduct"] > .row > .col-sm-7::after { content: 'Невидимые рамки раз в 16 дней (/kit frame)'; }
#product-1121337 a[data-request="onRenderProduct"] > .row > .col-sm-7 > .card::before { content: '3 точки дома'; }
#product-1121337 a[data-request="onRenderProduct"] > .row > .col-sm-7 > .card::after { content: 'Эндер-сундук (/ec) и верстак (/wb) где угодно'; }
#product-1121337 a[data-request="onRenderProduct"] > .row .card-header::before { content: 'Починка вещей (/repair)'; }
#product-1121337 a[data-request="onRenderProduct"] > .row .card-header::after { content: 'Частицы «Элитная аура»'; }
#product-1121337 a[data-request="onRenderProduct"] > .row .card-body::before { content: 'Мгновенная выдача'; }
#product-1121338 a[data-request="onRenderProduct"] > .row::before { content: 'Вход на сервер через сторонний лаунчер без верификации'; }
#product-1121338 a[data-request="onRenderProduct"] > .row > .col-sm-5::before { content: 'Навсегда, на один ник'; }
#product-1121338 a[data-request="onRenderProduct"] > .row > .col-sm-5::after { content: 'Мгновенная выдача'; }
#product-1121339 a[data-request="onRenderProduct"] > .row::before { content: 'Снимает блокировку аккаунта и устройства, если её срок до 7 дней'; }
#product-1121339 a[data-request="onRenderProduct"] > .row > .col-sm-5::before { content: 'Разблокировка мгновенно после оплаты'; }
#product-1121340 a[data-request="onRenderProduct"] > .row::before { content: 'Снимает блокировку аккаунта и устройства, если её срок до 30 дней'; }
#product-1121340 a[data-request="onRenderProduct"] > .row > .col-sm-5::before { content: 'Разблокировка мгновенно после оплаты'; }
#product-1121341 a[data-request="onRenderProduct"] > .row::before { content: 'Снимает бессрочную блокировку аккаунта и устройства'; }
#product-1121341 a[data-request="onRenderProduct"] > .row > .col-sm-5::before { content: 'Разблокировка мгновенно после оплаты'; }

/* Короткие имена товаров по id: полное название из панели не влезало.
   Подпись ниже мелким серым. Переименуешь товар в панели: поправь и здесь. */
:is(#product-1121335, #product-1121336, #product-1121337, #product-1121338,
    #product-1121339, #product-1121340, #product-1121341) .card-title {
    font-size: 0 !important;
    margin: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

:is(#product-1121335, #product-1121336, #product-1121337, #product-1121338,
    #product-1121339, #product-1121340, #product-1121341) .card-title::before {
    display: block;
    font-size: clamp(1.15rem, 4.8vw, 1.35rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: #fff;
}

:is(#product-1121335, #product-1121336, #product-1121337, #product-1121338,
    #product-1121339, #product-1121340, #product-1121341) .card-title::after {
    display: block;
    margin-top: 4px;
    font-size: 0.82rem;
    font-weight: 500;
    line-height: 1.35;
    color: var(--nb-muted);
}

#product-1121335 .card-title::before { content: 'Плюшка'; }
#product-1121336 .card-title::before { content: 'Круассан'; }
#product-1121337 .card-title::before { content: 'Сладкая Булочка'; }
#product-1121338 .card-title::before { content: 'Пропуск'; }
#product-1121339 .card-title::before { content: 'Снятие бана до 7 дней'; }
#product-1121340 .card-title::before { content: 'Снятие бана до 30 дней'; }
#product-1121341 .card-title::before { content: 'Снятие бессрочной блокировки'; }

#product-1121335 .card-title::after,
#product-1121336 .card-title::after,
#product-1121337 .card-title::after { content: '30 дней'; }
#product-1121338 .card-title::after { content: 'Вход без верификации'; }
#product-1121339 .card-title::after { content: 'Бан до 7 дней'; }
#product-1121340 .card-title::after { content: 'Бан до 30 дней'; }
#product-1121341 .card-title::after { content: 'Бессрочная блокировка'; }

/* «Купить» во всю ширину внизу карточки: сразу кладёт товар в корзину и
   открывает оформление. Тема ставит этой ссылке inline top/right. */
#shop .profile-card a[data-request="onAdd"] {
    top: auto !important;
    left: 20px !important;
    right: 20px !important;
    bottom: 20px !important;
    margin: 0 !important;
    z-index: 10 !important;
}

#shop .profile-card a[data-request="onAdd"] .btn-inner-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    height: 46px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--nb-primary), #c77800);
    color: #0a0a0f !important;
    font-size: 0.98rem;
    font-weight: 800;
    box-shadow: 0 4px 15px rgba(255, 170, 0, 0.3);
    transition: box-shadow 0.3s, filter 0.3s;
}

#shop .profile-card a[data-request="onAdd"] .btn-inner-icon::after { content: 'Купить'; }

#shop .profile-card a[data-request="onAdd"]:hover .btn-inner-icon {
    filter: brightness(1.08);
    box-shadow: 0 8px 25px rgba(255, 170, 0, 0.5);
}

/* Скелетоны при загрузке */
.skeleton-box {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Кнопки */

.btn-danger, .btn-primary, .btn-success,
button[type="submit"], .btn-buy {
    border: none !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, var(--nb-primary), #c77800) !important;
    color: #0a0a0f !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 15px rgba(255, 170, 0, 0.3) !important;
    transition: box-shadow 0.3s var(--nb-ease), filter 0.3s !important;
}

.btn-danger:hover, .btn-primary:hover, .btn-success:hover,
button[type="submit"]:hover, .btn-buy:hover {
    filter: brightness(1.08);
    box-shadow: 0 8px 25px rgba(255, 170, 0, 0.5) !important;
}

.btn-outline-danger, .btn-secondary, .btn-dark {
    border: 1px solid var(--nb-border) !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    color: var(--nb-text) !important;
}

/* Модалки: корзина, товар, сервер */

.modal-backdrop.show {
    opacity: 0.75;
    background: #000;
}

/* Только окна темы (корзина, сервер, карточка товара). Платёжные окна плагина
   (#accept-payment, #payment-type) светлые с чёрным текстом, их не трогаю. */
.modal-content.bg-elegant {
    background: rgba(12, 12, 17, 0.96) !important;
    border: 1px solid var(--nb-border) !important;
    border-radius: 24px !important;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.7) !important;
    color: var(--nb-text);
}

.modal-content.bg-elegant .bg-elegant-dark {
    background-color: rgba(255, 255, 255, 0.025) !important;
}

.modal-content.bg-elegant .input-group-text,
.modal-content.bg-elegant .form-control,
.modal-content.bg-elegant select {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid var(--nb-border) !important;
    color: var(--nb-text) !important;
}

.modal-content.bg-elegant .input-group-text { color: var(--nb-primary) !important; }

.modal-content.bg-elegant .cart-cost,
.modal-content.bg-elegant .cart-cost + i {
    color: var(--nb-primary);
    text-shadow: 0 0 15px var(--nb-primary-glow);
}

/* Окно товара (клик по карточке): полное название, цена, описание, «Купить» */
html .product-modal .modal-header,
html .product-modal .modal-footer {
    background: transparent !important;
}

.product-modal .modal-header { padding: 6px 8px 0 !important; }

/* В шапке окна то же название, что и в теле: оставляем только крестик */
.product-modal .modal-header .modal-title { visibility: hidden; }

.product-modal .modal-body { padding: 0 28px 8px !important; }

.product-modal .modal-body > .badge { display: none !important; }

.product-modal .modal-body .py-3 { padding-top: 0 !important; }

.product-modal .card-image {
    border-radius: 20px;
    padding: 18px !important;
    background: radial-gradient(circle at 50% 50%, rgba(255, 170, 0, 0.14), transparent 65%), var(--nb-surface-deep) !important;
}

.product-modal .card-image img {
    width: 140px !important;
    max-width: 60% !important;
    filter: drop-shadow(0 10px 15px rgba(0, 0, 0, 0.5));
}

.product-modal h3.modal-title {
    font-size: 1.35rem !important;
    font-weight: 800 !important;
    line-height: 1.25;
    letter-spacing: -0.01em;
    text-transform: none !important;
    color: #fff;
}

.product-modal h5 {
    font-size: 1.4rem !important;
    color: var(--nb-primary);
    text-shadow: 0 0 15px var(--nb-primary-glow);
}

.product-modal .modal-body .my-3 {
    color: var(--nb-muted);
    font-size: 0.92rem;
    line-height: 1.6;
}

.product-modal .modal-footer {
    padding: 8px 28px 26px !important;
    border-top: 0 !important;
}

.product-modal .modal-footer .btn {
    width: 100%;
    padding: 13px 20px !important;
    border: none !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, var(--nb-primary), #c77800) !important;
    color: #0a0a0f !important;
    font-weight: 800 !important;
    box-shadow: 0 4px 15px rgba(255, 170, 0, 0.3) !important;
    transition: box-shadow 0.3s, filter 0.3s !important;
}

.product-modal .modal-footer .btn:hover {
    filter: brightness(1.08);
    box-shadow: 0 8px 25px rgba(255, 170, 0, 0.5) !important;
}

/* В светлых платёжных окнах акцент темы (#FFAA00) на белом не читается */
#accept-payment .cart-cost,
#payment-type .cart-cost {
    color: #9a5b00 !important;
}

.modal-content.bg-elegant [style*="dashed"] {
    border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

.alert-warning {
    border-radius: 14px;
    background: rgba(255, 170, 0, 0.08) !important;
    border: 1px solid rgba(255, 170, 0, 0.25) !important;
    color: #ffd27a !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--nb-primary) !important;
    border-color: var(--nb-primary) !important;
}

.close, .modal .close { color: var(--nb-text) !important; opacity: 0.7; }

/* «Помощь»: секция #help превращается во всплывающее окно под меню.
   :target не годится: SmoothScroll темы меняет адрес через pushState, и
   #help:target не срабатывает. Поэтому окно открывается наведением на пункт
   меню или кликом (ссылка получает фокус) и держится, пока курсор или фокус
   внутри окна. Внизу страницы секция не показывается: инструкция есть в
   корзине, а в Safari (ссылки там фокус не получают) окно откроет наведение. */

#help { display: none !important; }

body:has(.navbar-main .nav-item:hover > a[href="#help"]) #help,
body:has(.navbar-main a[href="#help"]:focus) #help,
#help:hover,
#help:focus-within {
    display: block !important;
    position: absolute !important;
    z-index: 1000;
    top: 66px;
    right: max(16px, calc((100vw - 1200px) / 2));
    width: min(420px, calc(100vw - 32px));
    margin: 0 !important;
    /* прозрачный отступ сверху: мостик от меню до окна, чтобы наведение
       не обрывалось в зазоре */
    padding: 12px 0 0 !important;
    background: none !important;
    visibility: visible !important;
    animation: nb-pop 0.15s ease-out !important;
}

@media (min-width: 992px) {
    body:has(.navbar-main .nav-item:hover > a[href="#help"]) #help,
    body:has(.navbar-main a[href="#help"]:focus) #help,
    #help:hover,
    #help:focus-within {
        top: 86px;
    }
}

@keyframes nb-pop {
    from { opacity: 0; transform: translateY(-4px); }
}

#help .container,
#help .row,
#help .col-md-6 {
    max-width: none !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

#help .col-md-6 {
    padding: 22px 24px !important;
    border-radius: 20px;
    background: #0c0c11;
    border: 1px solid var(--nb-border);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.7);
}

#help h2 {
    font-size: 1.05rem !important;
    letter-spacing: 1px;
    margin-bottom: 14px;
}

#help p { font-size: 0.92rem; }
#help p.font-weight-bolder { color: var(--nb-primary); }
#help p.mt-0 { color: var(--nb-muted); margin-bottom: 10px; }

/* Контакты: обычные ссылки из HTML инструкции в панели. Иконки по адресу
   ссылки, классы не нужны: редактор панели может их вырезать. */
#help a[href^="mailto:"],
#help a[href*="discord"],
#help a[href*="t.me/"] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 8px;
    padding: 11px 14px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--nb-border);
    color: var(--nb-text) !important;
    font-weight: 600;
    text-decoration: none !important;
    transition: border-color 0.2s, background 0.2s;
}

#help a[href^="mailto:"]:hover,
#help a[href*="discord"]:hover,
#help a[href*="t.me/"]:hover {
    border-color: rgba(255, 170, 0, 0.45);
    background: rgba(255, 170, 0, 0.06);
}

#help a[href^="mailto:"]::before,
#help a[href*="discord"]::before,
#help a[href*="t.me/"]::before {
    width: 20px;
    text-align: center;
    font-size: 1.05rem;
    color: var(--nb-primary);
}

#help a[href^="mailto:"]::before {
    content: '\f0e0';
    font-family: 'Font Awesome 5 Free' !important;
    font-weight: 900;
}

#help a[href*="discord"]::before {
    content: '\f392';
    font-family: 'Font Awesome 5 Brands' !important;
    font-weight: 400;
}

#help a[href*="t.me/"]::before {
    content: '\f2c6';
    font-family: 'Font Awesome 5 Brands' !important;
    font-weight: 400;
}

/* В корзине та же инструкция: контакты там строкой, без плашек */
.cart-content a[href^="mailto:"],
.cart-content a[href*="discord"],
.cart-content a[href*="t.me/"] {
    margin-right: 14px;
    color: var(--nb-primary) !important;
}

/* Подвал */

footer.footer {
    background: rgba(10, 10, 15, 0.9) !important;
    border-top: 1px solid var(--nb-border);
}

footer .footer-brand img { display: none; }

footer .footer-brand::before {
    content: '';
    display: block;
    width: 32px;
    height: 32px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFAA00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18V5l12-2v13'/%3E%3Ccircle cx='6' cy='18' r='3'/%3E%3Ccircle cx='18' cy='16' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
    filter: drop-shadow(0 0 8px var(--nb-primary));
}

/* «© 2026 melody» в подвале: слово melody заменяем на NoteBuns */
#footer p.small > span {
    font-size: 0;
}

#footer p.small > span::after {
    content: 'NoteBuns';
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--nb-text);
}

#footer p.small { color: var(--nb-muted); }
#footer p.small a { color: var(--nb-primary) !important; }