/* ============================================================
   ШЫШ GAMES — custom.css (финальная очищенная версия, Фаза B)
   Фон #0F0F12 · красный #FF1E27 · янтарный #FFB800
   ============================================================ */

/* ---------- 1. Палитра ---------- */
:root{
  --shysh-bg:#0F0F12;
  --shysh-bg-soft:#121316;
  --shysh-card:rgba(26,26,34,.82);
  --shysh-border:#2E2E3A;
  --shysh-red:#FF1E27;
  --shysh-red-dark:#E51013;
  --shysh-red-soft:#FF5A5F;
  --shysh-amber:#FFB800;
  --shysh-white:#FFFFFF;
  --shysh-text:#E0E0E6;
  --shysh-muted:#B9B9C4;
  --shysh-radius:16px;
  --shysh-radius-btn:20px;
  --shysh-font-head:'Montserrat','Manrope','TildaSans',Arial,sans-serif;
  --shysh-font-body:'Inter','TildaSans',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --shysh-glow:0 0 25px rgba(255,30,39,.35);
}

/* ---------- 2. База: фон, шрифт, скролл ---------- */
html{ overflow-x:hidden; }

body,
.t-body{
  background:var(--shysh-bg) !important;
  color:var(--shysh-text) !important;
  font-family:var(--shysh-font-body) !important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* ВАЖНО: background-color, а не background — иначе затираются фото-фоны блоков */
.t-rec{
  background-color:var(--shysh-bg) !important;
  color:var(--shysh-text);
  font-family:var(--shysh-font-body);
}
.t-rec.bg-shysh{ background-color:var(--shysh-bg-soft) !important; }

/* ---------- 3. Типографика (без обводки и без глобального капса) ---------- */
h1, h2,
.t-title,
.t-heading{
  font-family:var(--shysh-font-head) !important;
  font-weight:900 !important;
  letter-spacing:-.01em !important;
  line-height:1.08 !important;
  color:var(--shysh-white) !important;
  text-transform:none !important;
  text-shadow:none !important;
}

h3, h4{
  font-family:var(--shysh-font-head) !important;
  font-weight:800 !important;
  letter-spacing:-.005em !important;
  color:var(--shysh-white) !important;
  text-transform:none !important;
  text-shadow:none !important;
}

/* Кикер над заголовком — единственное место, где капс уместен */
.t-uptitle{
  text-transform:uppercase !important;
  letter-spacing:.12em !important;
  font-size:13px !important;
  font-weight:700 !important;
  color:var(--shysh-red) !important;
}

/* Абзацы, описания, списки — нейтрально */
.t-descr,
.t-text,
.t-text-typo,
.t-descr-typo,
.t-uptitle__descr,
p, li{
  color:var(--shysh-text);
  text-transform:none !important;
}
.t-descr_small,
.t-text_small{ color:var(--shysh-muted); }

/* Опционально: мягкое неоновое свечение заголовков.
   Раскомментируйте, если нужно — на H1 может выглядеть мыльно.
h1, h2, .t-title{ text-shadow:0 0 22px rgba(255,30,39,.25) !important; }
*/

/* ---------- 4. Ссылки (только внутри контента) ---------- */
.t-text a,
.t-text-typo a,
.t-descr a,
.t-descr-typo a,
p a, li a{
  color:var(--shysh-red);
  text-decoration:none;
  border-bottom:1px solid rgba(255,30,39,.35);
  transition:color .2s ease, border-color .2s ease;
}
.t-text a:hover,
.t-text-typo a:hover,
.t-descr a:hover,
.t-descr-typo a:hover,
p a:hover, li a:hover{
  color:var(--shysh-red-soft);
  border-bottom-color:var(--shysh-red-soft);
}

/* ---------- 5. Шапка и меню (белое, не красное) ---------- */
.t-menu__link-item,
.t1368 .t-menu__link-item,
.t-menusub__link-item{
  color:var(--shysh-white) !important;
  transition:color .2s ease;
}
.t-menu__link-item:hover,
.t1368 .t-menu__link-item:hover,
.t-menusub__link-item:hover{
  color:var(--shysh-red) !important;
  text-shadow:none !important;
}

/* ---------- 6. Кнопки CTA ---------- */
.t-btn,
.t-submit,
.t-form__submit-btn,
.t-store__card__btn,
.t778__btn,
.t692__btn{
  background:linear-gradient(180deg,var(--shysh-red) 0%, var(--shysh-red-dark) 100%) !important;
  color:var(--shysh-white) !important;
  border:3px solid #000000 !important;
  border-radius:var(--shysh-radius-btn) !important;
  font-family:var(--shysh-font-head) !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
  text-shadow:none !important;
  box-shadow:0 6px 0 var(--shysh-amber), var(--shysh-glow) !important;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}
.t-btn:hover,
.t-submit:hover,
.t-form__submit-btn:hover,
.t-store__card__btn:hover,
.t778__btn:hover,
.t692__btn:hover{
  background:linear-gradient(180deg,var(--shysh-red-soft) 0%, var(--shysh-red) 100%) !important;
  color:var(--shysh-white) !important;
  box-shadow:0 8px 0 var(--shysh-amber), 0 0 38px rgba(255,30,39,.6) !important;
  transform:translateY(-2px) !important;
}
.t-btn:active,
.t-submit:active,
.t-form__submit-btn:active,
.t-store__card__btn:active,
.t778__btn:active,
.t692__btn:active{
  box-shadow:0 2px 0 var(--shysh-amber) !important;
  transform:translateY(4px) !important;
}

/* Кнопки внутри карточек — компактнее */
.t-store__card__btn,
.t778__btn,
.t692__btn{
  border-width:2px !important;
  box-shadow:0 4px 0 var(--shysh-amber) !important;
}

/* Вторичная кнопка «прозрачная»: добавьте класс t-btn_ghost в настройках кнопки */
.t-btn_ghost,
.t-btn-outline{
  background:transparent !important;
  color:var(--shysh-white) !important;
  border:2px solid var(--shysh-border) !important;
  box-shadow:none !important;
}
.t-btn_ghost:hover,
.t-btn-outline:hover{
  background:rgba(255,30,39,.08) !important;
  border-color:var(--shysh-red) !important;
  color:var(--shysh-white) !important;
  box-shadow:0 0 25px rgba(255,30,39,.28) !important;
}

/* ---------- 7. Карточки каталога (всегда видимые, без opacity-хаков) ---------- */
.t-store__card,
.t692__item{
  background:var(--shysh-card) !important;
  border:1.5px solid var(--shysh-border) !important;
  border-radius:var(--shysh-radius) !important;
  overflow:hidden !important;
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  transition:border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
.t-store__card:hover,
.t692__item:hover{
  border-color:var(--shysh-red) !important;
  box-shadow:0 0 32px rgba(255,30,39,.32), 0 10px 28px rgba(0,0,0,.45) !important;
  transform:translateY(-6px);
}

.t-store__card__title,
.t-store__card__title a,
.t778__title{
  color:var(--shysh-white) !important;
  text-transform:none !important;
  font-weight:700 !important;
}
.t-store__card__descr,
.t778__descr{ color:var(--shysh-muted) !important; }

/* Цена — янтарная */
.t-store__card__price,
.t778__price{
  color:var(--shysh-amber) !important;
  font-weight:800 !important;
  font-size:20px !important;
}

/* ---------- 8. Бейджи (Hit / New) ---------- */
.badge-shysh{
  display:inline-block !important;
  background:var(--shysh-amber) !important;
  color:#000000 !important;
  font-weight:900 !important;
  font-size:11px !important;
  line-height:1.4 !important;
  text-transform:uppercase !important;
  letter-spacing:.05em !important;
  padding:4px 10px !important;
  border:2px solid #000000 !important;
  border-radius:6px !important;
}

/* ---------- 9. Формы и поля ввода (тёмная тема) ---------- */
.t-input,
.t-textarea,
.t-select,
.t-form__input,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
textarea,
select{
  background:rgba(255,255,255,.04) !important;
  border:1.5px solid var(--shysh-border) !important;
  border-radius:12px !important;
  color:var(--shysh-white) !important;
  font-family:var(--shysh-font-body) !important;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.t-input:focus,
.t-textarea:focus,
.t-select:focus,
.t-form__input:focus,
input:focus,
textarea:focus,
select:focus{
  border-color:var(--shysh-red) !important;
  box-shadow:0 0 0 3px rgba(255,30,39,.18) !important;
  outline:none !important;
}
.t-input::placeholder,
.t-textarea::placeholder,
input::placeholder,
textarea::placeholder{
  color:var(--shysh-muted) !important;
  opacity:.75 !important;
}

/* ---------- 10. Доступность ---------- */
a:focus-visible,
button:focus-visible,
.t-btn:focus-visible,
.t-submit:focus-visible,
.t-input:focus-visible{
  outline:2px solid var(--shysh-amber) !important;
  outline-offset:3px !important;
}

/* ---------- 11. Адаптив ---------- */
@media screen and (max-width:960px){
  h1, .t-title{ font-size:clamp(26px, 6vw, 44px) !important; }
  h2{ font-size:clamp(22px, 5vw, 34px) !important; }
}

@media screen and (max-width:640px){
  .t-btn,
  .t-submit,
  .t-form__submit-btn,
  .t-store__card__btn,
  .t778__btn,
  .t692__btn{
    border-width:2px !important;
    box-shadow:0 4px 0 var(--shysh-amber) !important;
    font-size:14px !important;
  }
  .t-btn:active,
  .t-submit:active{ transform:translateY(3px) !important; }
  .t-store__card:hover,
  .t692__item:hover{ transform:none; }
}

/* ---------- 12. Уважение к prefers-reduced-motion ---------- */
@media (prefers-reduced-motion: reduce){
  .t-btn,
  .t-submit,
  .t-form__submit-btn,
  .t-store__card,
  .t-store__card__btn,
  .t692__item,
  .t692__btn,
  .t778__btn{
    transition:none !important;
    transform:none !important;
  }
}

/* ---------- 13. Формы в светлых панелях: заявка (t708) и корзина (t706) ----------
   ПРОБЛЕМА: у блока заявки t708 панель попапа задана инлайном
   background-color:#ffffff, а у корзины t706 белая панель .t706__cartwin-content
   (дефолт Tilda). При этом раздел 9 красит ТЕКСТ ВСЕХ полей в белый
   (#FFFFFF) на почти прозрачном фоне → получалось «белым по белому»,
   поле ввода и подписи были нечитаемы.
   РЕШЕНИЕ: красим сами панели в фирменный тёмный #141419 и возвращаем
   контраст всем элементам внутри них. Все правила с !important —
   часть цветов задана инлайн-стилями блоков.                              */

/* --- 13.1 Попап «Есть вопросы? Оставьте заявку» (блок 2426700593) -------- */
.t708__popup-container{
  background-color:#141419 !important;
  background-image:none !important;
  color:var(--shysh-text) !important;
  border:1px solid var(--shysh-border) !important;
  border-radius:var(--shysh-radius) !important;
  box-shadow:0 30px 80px rgba(0,0,0,.65) !important;
}
/* мобильная шапка попапа: белый крестик терялся на белом фоне */
.t708__mobile-top-panel,
.t708__mobile-top-panel_wrapper{
  background-color:#141419 !important;
}
.t708__popup-container .t708__title{
  color:var(--shysh-white) !important;
}
/* подписи и варианты мессенджеров */
.t708__popup-container .t-contact-method__title,
.t708__popup-container .t-contact-method__type-label,
.t708__popup-container .t-radio__title,
.t708__popup-container .t-input-title{
  color:var(--shysh-text) !important;
}
.t708__popup-container .t-input-subtitle{
  color:var(--shysh-muted) !important;
}
/* крестик в круглой кнопке: на красном фоне белым */
.t708__popup-container .t708__icon-close g,
.t708 .t708__icon-close g{
  fill:#FFFFFF !important;
}
/* выбранный мессенджер — акцентный цвет */
.t708__popup-container .t-contact-method__type-input:checked + .t-contact-method__type-label{
  color:var(--shysh-white) !important;
}

/* --- 13.2 Корзина и оформление заказа (блок 2426699173) ------------------- */
/* .t706__cartwin — тёмный оверлей, .t706__cartwin-content — белая панель */
.t706__cartwin-content{
  background-color:#141419 !important;
  color:var(--shysh-text) !important;
  border-left:1px solid var(--shysh-border) !important;
}
/* весь текст корзины, который Tilda рисует чёрным (#000) */
.t706__cartwin-content .t706__cartwin-heading,
.t706__cartwin-content .t706__product-title,
.t706__cartwin-content .t706__product-plusminus,
.t706__cartwin-content .t706__product-quantity,
.t706__cartwin-content .t706__product-amount,
.t706__cartwin-content .t706__product-amount--portion,
.t706__cartwin-content .t706__cartwin-totalamount-wrap,
.t706__cartwin-content .t706__cartwin-totalamount-list,
.t706__cartwin-content .t706__cartwin-totalamount-hint-label,
.t706__cartwin-content .t706__cartwin-totalamount-hint-name{
  color:var(--shysh-text) !important;
}
/* сумма заказа — белым */
.t706__cartwin-content .t706__cartwin-prodamount-wrap,
.t706__cartwin-content .t706__cartwin-prodamount{
  color:var(--shysh-white) !important;
}
/* подписи полей формы оформления (были #333 на белом) */
.t706__cartwin-content .t-input-title,
.t706__cartwin-content .t-radio__title{
  color:var(--shysh-white) !important;
}
.t706__cartwin-content .t-input-subtitle{
  color:var(--shysh-muted) !important;
}
/* поле количества в строке товара */
.t706__cartwin-content .t706__product-quantity-inp{
  background-color:rgba(255,255,255,.06) !important;
  border:1px solid var(--shysh-border) !important;
  color:var(--shysh-white) !important;
}
/* «Свой вариант» в группе радиокнопок */
.t706__cartwin-content .t-input-ownanswer{
  background-color:rgba(255,255,255,.04) !important;
  border:1.5px solid var(--shysh-border) !important;
  color:var(--shysh-white) !important;
}
/* плейсхолдеры внутри тёмных панелей — не светлее основного текста */
.t708__popup-container input::placeholder,
.t708__popup-container textarea::placeholder,
.t706__cartwin-content input::placeholder,
.t706__cartwin-content textarea::placeholder{
  color:var(--shysh-muted) !important;
  opacity:.7 !important;
}
/* плейсхолдер товара в корзине */
.t706__cartwin-content .t706__product-imgdiv{
  background-color:rgba(255,255,255,.06) !important;
}
/* кнопка закрытия корзины: была чёрным квадратом, на тёмной панели не видна */
.t706 .t706__close,
.t706__cartwin-close{
  background-color:var(--shysh-red) !important;
}
.t706 .t706__close-icon,
.t706__cartwin-close-icon{
  fill:#FFFFFF !important;
}
/* разделители панели */
.t706__cartwin-content .t706__cartwin-top,
.t706__cartwin-content .t706__cartwin-bottom{
  border-color:var(--shysh-border) !important;
}
