/* ===================== Полный окончательный CSS r ===================== */

/* --------------------- Защитная база и общие правила --------------------- */
.promo-carddr, .promo-logodr, .promo-infodr, .promo-main-linkr { box-sizing: border-box; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
.material-symbols-roundedr {  font-size:22px; font-family:'Material Symbols Rounded'; font-variation-settings:'FILL' 1, 'wght' 700; display:inline-block; vertical-align:middle; color:#ADB8C0; }
.material-symbols-roundedr1 {  font-size:22px; font-family:'Material Symbols Rounded'; font-variation-settings:'FILL' 1, 'wght' 700; display:inline-block; vertical-align:middle; color:#FBDB62; }
.promo-titler, .promo-descr, .promo-title, .promo-descd { margin:0; padding:0; }

/* Общие элементы изображений и текста */
.promo-logodr { position:relative; overflow:visible; background:transparent !important; display:block; box-sizing:border-box; }
.promo-logodr img { display:block; object-fit:cover; object-position:center center; }
.promo-infodr { box-sizing:border-box; }

/* Кнопка базовая */
.cpa-go-bttr, .promo-btndr { text-decoration:none; color:#fff; background: linear-gradient(90deg,#F3814B,#FFB068); border-radius:8px; box-shadow:0 6px 18px rgba(243,129,75,0.12); display:inline-flex; align-items:center; justify-content:center; }
.cpa-go-bttr .material-symbols-roundedr { font-size:20px; color:#fff; line-height:1; display:inline-block; }

/* ------------------------- ГЛАВНАЯ: compact (home-top-gridr) ------------------------- */
.home-top-gridr { display:grid; grid-template-columns:1fr; gap:10px; box-sizing:border-box; }

/* карточка на главной — компактная горизонтальная */
.home-top-gridr .promo-carddr {
  background:#fff;
  border-radius:15px;
  box-shadow:0 10px 40px rgba(0,0,0,.10);
  transition: transform .3s ease, box-shadow .3s ease;
  position:relative;
  min-height:85px;
  overflow:visible;
  padding:0;
  box-sizing:border-box;
}

/* внутренняя зона: позиционируем относительно для абсолютного текста/лога */
.home-top-gridr .promo-logodr {
  position:relative !important;
  height:85px !important;
  border-radius:15px;
  background:transparent !important;
  box-sizing:border-box;
  padding:0 !important;
  background-image:none !important;
}

/* Абсолютно позиционированный логотип (лево) 72x72 */
.home-top-gridr .img-mainr {
  position:absolute !important;
  left:10px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:72px !important;
  height:72px !important;
  min-width:72px !important;
  min-height:72px !important;
  flex:0 0 72px !important;
  object-fit:cover !important;
  object-position:center center !important;
  border-radius:14px !important;
  margin:0 !important;
  padding:0 !important;
  z-index:10 !important;
  box-sizing:border-box !important;
}

/* Абсолютный текстовый блок ровно 10px правее логотипа */
.home-top-gridr .promo-infodr {
  position:absolute !important;
  left: calc(10px + 72px + 10px) !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  right: 54px !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
  z-index:8 !important;
  display:block !important;
}

/* Заголовок/описание внутри абсолютного блока */
.home-top-gridr .promo-titler, .home-top-gridr .promo-title { font-size:16px; font-weight:700; margin:0; color:#424852 !important; text-align:left; line-height:1.1; }
.home-top-gridr .promo-descr, .home-top-gridr .promo-descd { font-size:13px; color:#898995; margin-top:2px; line-height:1.2; }

/* Правая узкая кнопка остаётся абсолютной и центрированной */
.home-top-gridr .cpa-go-bttr {
  position:absolute !important;
  right:8px !important;
  top:8px !important;
  bottom:8px !important;
  width:36px !important;
  height: calc(100% - 16px) !important;
  border-radius:10px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  z-index:12 !important;
  padding:0 !important;
  opacity:0.95 !important;
}

/* Центрируем иконку */
.home-top-gridr .cpa-go-bttr .material-symbols-roundedr { margin:0; transform:none; display:inline-block; }

/* Hover: лёгкое поднятие */
.home-top-gridr .promo-carddr:hover { transform: scale(1.01); z-index:14; }
.home-top-gridr .promo-carddr:hover .cpa-go-bttr { opacity:1; transform:none; }

/* Защита: если uCoz вкладывает обёртки */
[class*="home-top-gridr"] .promo-carddr { box-sizing:border-box; }

/* Скрыть любые элементы/фон скрина на главной */
.home-top-gridr .img-catr,
.home-top-gridr .screen-wrap,
.home-top-gridr [class*="screen"],
.home-top-gridr [data-screen],
.home-top-gridr [style*="background"],
.home-top-gridr .promo-logodr .img-catr,
.home-top-gridr .promo-carddr .img-catr {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.home-top-gridr .promo-logodr::before,
.home-top-gridr .promo-logodr::after,
.home-top-gridr .promo-carddr::before,
.home-top-gridr .promo-carddr::after { content:none !important; display:none !important; background:none !important; }

/* Перекрытие inline background-image на главной */
body .home-top-gridr [style*="background-image"], body .home-top-gridr [style*="background"] { background-image:none !important; background:none !important; }

/* Сброс max-width/height, чтобы изображения не растягивались */
.home-top-gridr .promo-logodr img, .home-top-gridr .img-mainr { max-width:none !important; max-height:none !important; }

/* -------------------- КАТЕГОРИИ: promo 4 в ряд (category-top-gridr) -------------------- */
.category-top-gridr { display:grid; grid-template-columns: repeat(4,1fr); gap:16px; box-sizing:border-box; }
@media (max-width:1100px) { .category-top-gridr { grid-template-columns: repeat(2,1fr); } }
@media (max-width:520px)  { .category-top-gridr { grid-template-columns: 1fr; } }

.category-top-gridr .promo-carddr {
  display:flex;
  flex-direction:column;
  min-height:290px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,0.06);
  position:relative;
  overflow:hidden;
  box-sizing:border-box;
}

/* показываем big screen и скрываем маленький логотип */
.category-top-gridr .img-catr { display:block !important; width:100% !important; height:120px !important; object-fit:cover !important; z-index:1 !important; object-position: top center !important; -webkit-object-position: top center !important; }
.category-top-gridr .img-mainr { display:none !important; }

/* зона с изображением */
.category-top-gridr .promo-logodr { height:120px; overflow:hidden; position:relative; background-image:none !important; }

/* текст и кнопка */
.category-top-gridr .promo-infodr { padding:22px; flex:1 1 auto; box-sizing:border-box; z-index:2; }
.category-top-gridr .promo-titler { font-size:18px; font-weight:700; margin:0 0 6px 0; color:#424852 !important; }
.category-top-gridr .promo-descr { font-size:14px; color:#898995; margin:0; }

/* кнопка promo — справа внизу */
.category-top-gridr .cpa-go-bttr { position:absolute; right:12px; bottom:12px; padding:10px 12px; border-radius:6px; box-sizing:border-box; z-index:3; }
.category-top-gridr .cpa-go-bttr .material-symbols-roundedr { font-size:18px; }

/* Защитные правила */
[class*="category-top-gridr"] .promo-carddr { box-sizing:border-box; }

/* ------------------- Унификация логотипов и фиксы для проблемных src ------------------- */
/* Универсальное поведение всех логотипов */
.promo-logodr img.img-mainr,
.home-top-gridr .img-mainr,
.category-top-gridr .img-mainr {
  display:block !important;
  width:72px !important;
  height:72px !important;
  min-width:72px !important;
  min-height:72px !important;
  flex: 0 0 72px !important;
  object-fit: cover !important;
  object-position: center center !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:14px !important;
  box-sizing:border-box !important;
}

/* Защитные отмены inline размеров */
.promo-logodr img[width], .promo-logodr img[height] { width:72px !important; height:72px !important; }
body .home-top-gridr .promo-logodr .img-mainr { width:72px !important; height:72px !important; }

/* Компенсация для известных проблемных src (при необходимости добавьте ключевые слова) */
.promo-logodr img[src*="vavada"],
.promo-logodr img[src*="vavadapart"],
.promo-logodr img[src*="vavada.part"] { object-position:center center !important; transform:none !important; }

/* Если uCoz ставит $SCREEN_URL как background-image — принудительно отключаем на главной */
.home-top-gridr .promo-carddr,
.home-top-gridr .promo-logodr,
.home-top-gridr [style*="background-image"] { background-image:none !important; background:none !important; }

/* Защита от фоновых псевдоэлементов (::before/::after) */
.home-top-gridr .promo-logodr::before,
.home-top-gridr .promo-logodr::after,
.home-top-gridr .promo-carddr::before,
.home-top-gridr .promo-carddr::after {
  content:none !important; display:none !important; background:none !important;
}

/* Сброс видимости логотипа поверх скрина в категориях */
.category-top-gridr .promo-logodr .img-mainr,
.category-top-gridr .promo-logodr .logo-overlay,
.category-top-gridr .promo-logodr .logo-wrap { display:none !important; opacity:0 !important; pointer-events:none !important; }

/* Фолбек: background-image вместо <img> для проблемных картинок (опционально)
   используйте в шаблоне: <div class="bg-mainr" style="background-image:url(...)" data-bg="1"></div>
*/
.promo-logodr .bg-mainr { display:none; }
.promo-logodr[data-use-bg="1"] .bg-mainr { display:block !important; width:72px; height:72px; flex:0 0 72px; background-size:cover; background-position:center; border-radius:8px; }

/* Бейдж "Рекомендуем" — показывается только в категориях */
.category-top-gridr .promo-logodr { position: relative; }
.home-top-gridr .badge-rec {
  display:none;
}

/* сам бейдж */
.category-top-gridr .badge-rec {
  position: absolute;
  left: 15px;
  bottom: 15px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #8AC75D;
  font-size: 13px;
  font-weight: 600;
  z-index: 30;
  pointer-events: none;
}

/* иконка внутри бейджа — можно заменить на svg или иконку шрифта */
.category-top-gridr .badge-rec .badge-icon {
  display:inline-block;
  width:16px;
  height:16px;
  line-height:16px;
  text-align:center;
  font-weight:700;
  font-size:13px;
}




/* ------------------- Мелкие адаптивы и точность ------------------- */
@media (max-width:520px) {

  .home-top-gridr .img-mainr { left:10px !important; width:64px !important; height:64px !important; transform:translateY(-50%) !important; }
  .home-top-gridr .promo-infodr { left: calc(10px + 64px + 20px) !important; right: 48px !important; }
  .home-top-gridr .promo-logodr { height:88px !important; }
  .category-top-gridr { gap:12px; }
  .category-top-gridr .img-catr { height:100px !important; }
}

/* Убедиться, что иконки Material Symbols видны */
.home-top-gridr .material-symbols-roundedr, .category-top-gridr .material-symbols-roundedr { display:inline-block !important; visibility:visible !important; }

/* ===================== Конец окончательного CSS r ===================== */
