/* ==========================================================
   1. ФИКС ВЫРАВНИВАНИЯ И ЦВЕТА КНОПКИ В ШАПКЕ
   ========================================================== */
.t-menu__rightcontainer,
.t-menusub__rightside,
.t228__rightside,
.t-navcontainer__rightside {
    display: flex !important;
    align-items: center !important;     
    justify-content: flex-end !important;
    height: 100% !important;            
    margin-top: 0 !important;           
    padding-top: 0 !important;
}

.t-sociallinks {
    display: flex !important;
    align-items: center !important;     
    margin: 0 !important;
}

/* Круглая кнопка (СВЕТЛЫЙ режим - шапка черная) */
.header-theme-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px;  
    height: 32px;
    background: transparent;
    border: 1px solid #ffffff !important; /* Белая рамка */
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    transition: all 0.3s ease;
    flex-shrink: 0;
    margin-left: 12px !important;       
}

/* Иконки внутри кнопки (СВЕТЛЫЙ режим) */
.header-theme-toggle svg { 
    width: 16px; 
    height: 16px; 
    fill: #ffffff !important; /* Белая луна */
    position: absolute; 
    transition: opacity 0.3s, fill 0.3s, transform 0.3s; 
}
.header-theme-toggle .sun-icon { opacity: 0; }
.header-theme-toggle .moon-icon { opacity: 1; }

/* --- КНОПКА ПРИ ТЕМНОЙ ТЕМЕ (DARK MODE) --- */
/* Становится полностью БЕЛОЙ, иконка внутри — ЧЕРНОЙ */
body.dark-theme .header-theme-toggle { 
    border-color: #ffffff !important; 
    background: #ffffff !important; /* Полностью белый фон кнопки */
}
body.dark-theme .header-theme-toggle .moon-icon { 
    opacity: 0 !important; 
}
body.dark-theme .header-theme-toggle .sun-icon { 
    opacity: 1 !important; 
    fill: #141414 !important; /* Черное солнце */
}

/* ==========================================================
   2. ОБЩИЙ ФОН САЙТА И СТАНДАРТНЫЕ БЛОКИ
   ========================================================== */
body.dark-theme {
    background-color: #141414 !important;
}

body.dark-theme .r:not([bgcolor^="#2"]), 
body.dark-theme .r[bgcolor="#ffffff"], 
body.dark-theme .r[bgcolor="#fff"] {
    background-color: #141414 !important;
}

body.dark-theme .t-text,
body.dark-theme .t-title,
body.dark-theme .t-descr,
body.dark-theme .t-heading,
body.dark-theme .t-name {
    color: #ffffff !important;
}

/* Интернет-магазин (каталог, карточки, корзина) */
body.dark-theme .t762__wrapper, 
body.dark-theme .t754__col, 
body.dark-theme .t-store__grid-cont {
    background-color: #1c1c1c !important; 
}
body.dark-theme .t-store__prod-popup__info,
body.dark-theme .t-popup__container {
    background-color: #1c1c1c !important; 
    color: #fff !important;
}
body.dark-theme .t-store__prod-popup__title,
body.dark-theme .t-store__prod-popup__price-value {
    color: #fff !important;
}

/* ==========================================================
   3. ZERO-БЛОКИ И ШЕЙПЫ (SHAPE) С РАЗМЫТИЕМ
   ========================================================== */
body.dark-theme .t396__artboard {
    background-color: #141414 !important;
    background-image: none !important; 
}

body.dark-theme .t396__elem .tn-atom,
body.dark-theme .t396__artboard font, 
body.dark-theme .t396__artboard span {
    color: #ffffff !important;
}

/* ИСПРАВЛЕНИЕ БАГА С ШЕЙПОМ: Инвертируем светлые размытые фигуры (Shape) в темные */
body.dark-theme .t396__elem[data-elem-type="shape"] .tn-atom {
    background-color: rgba(20, 20, 20, 0.6) !important; /* Меняем белый размытый фон на темный размытый фон */
    border-color: #333333 !important;
}
/* ==========================================================
   ИНВЕРСИЯ ТОЛЬКО КНОПОК (НЕ ВСЕГО САЙТА)
   ========================================================== */

/* 1. БАЗОВЫЙ ОТБОР: только элементы, похожие на кнопки */
body.dark-theme a[class*="btn"],
body.dark-theme a[class*="button"],
body.dark-theme button,
body.dark-theme .t-store__card__btn,
body.dark-theme .tn-atom[data-elem-type="button"] {
    
    /* Инверсия визуала */
    filter: invert(1) hue-rotate(180deg) !important;
    
    /* Чтобы текст не ломался */
    -webkit-font-smoothing: antialiased;
}

/* 2. ВОЗВРАТ ТЕКСТА В НОРМАЛЬНЫЙ ВИД */
body.dark-theme a[class*="btn"] *,
body.dark-theme a[class*="button"] *,
body.dark-theme button *,
body.dark-theme .t-store__card__btn *,
body.dark-theme .tn-atom[data-elem-type="button"] * {
    
    filter: invert(1) hue-rotate(180deg) !important;
}

/* 3. ИСКЛЮЧЕНИЯ (шапка, меню и т.д.) */
body.dark-theme header,
body.dark-theme .t228,
body.dark-theme .tmenu,
body.dark-theme nav {
    filter: none !important;
}
/* ==========================================================
   5. ИНВЕРСИЯ КАРТИНОК И ИКОНОК (PNG)
   ========================================================== */
body.dark-theme img {
    filter: brightness(0.9) contrast(1.1);
}

/* Инвертируем стандартные PNG и картинки-атомы в Zero */
body.dark-theme img[src*=".png"], 
body.dark-theme .tn-atom__img {
    filter: invert(1) !important;
}

/* ИСПРАВЛЕНИЕ БАГА: Инвертируем картинки, которые загружены КАК ФОН внутрь кнопок Zero-блока */
body.dark-theme .t396__elem[data-elem-type="button"] .tn-atom span {
    filter: invert(1) !important;
}

/* ОТМЕНА ИНВЕРСИИ для картинок с классом no-invert */
body.dark-theme img.no-invert,
body.dark-theme .no-invert .tn-atom__img, 
body.dark-theme .tn-atom.no-invert {
    filter: none !important;
}