/* Главная: «Новые рецепты», «Случайные рецепты с фото», «Популярные рецепты».
   ПК: «Новые» и «Случайные» — крупная карточка слева, четыре маленькие справа 2x2 (как «Тематические подборки»).
   Телефон: «Новые» — крупная карточка и сетка 2x2; «Популярные» и «Случайные» — список строк с миниатюрой.
   Подключается в _new.ascx, _random.ascx, _popular.ascx. */

/* ---------- ПК: сетка ---------- */
@media (min-width:701px){
#new_content .content_block,#random_content .content_block{display:grid!important;grid-template-columns:1.25fr 1fr 1fr!important;grid-template-rows:1fr 1fr!important;gap:18px!important;align-items:stretch!important}
#new_content .content_block1,#new_content .content_block2,#random_content .content_block1,#random_content .content_block2{display:contents!important}
#new_content .content_block1>a,#random_content .content_block1>a{grid-row:span 2!important;grid-column:1!important;display:flex!important;flex-direction:column!important;height:100%!important}
#new_content .content_block2>a,#random_content .content_block2>a{grid-row:auto!important;grid-column:auto!important}
#new_content .content_block1 figure,#random_content .content_block1 figure{position:relative!important;flex:1 1 auto!important;min-height:240px!important;height:auto!important;width:100%!important;margin:0!important}
#new_content .content_block1 figure img,#random_content .content_block1 figure img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important}
#new_content .content_block1 article,#random_content .content_block1 article{flex:none!important}
}

/* ---------- Маленькие карточки «Новых» и «Случайных»: одинаковый размер, автор внизу, без рейтинга ---------- */
/* «Новые»: рейтинг и лайки плашкой на фото маленькой карточки (прячется, если все значения нулевые) */
#new_content .content_block2>a{position:relative!important}
#new_content .content_block2 .stats{position:absolute!important;left:10px!important;top:112px!important;bottom:auto!important;right:auto!important;display:flex!important;align-items:center;gap:8px;width:auto!important;height:auto!important;margin:0!important;padding:6px 10px!important;background:rgba(255,255,255,.9)!important;border-radius:250px!important;font-size:12px;font-weight:500;color:#2b2723;z-index:2}
#new_content .content_block2 .stats:not(:has(> :not(.is-zero))){display:none!important}
/* «Случайные» на ПК и планшете: такая же плашка на фото маленькой карточки (на телефоне там список, см. ниже) */
@media (min-width:701px){
#random_content .content_block2>a{position:relative!important}
#random_content .content_block2 .stats{position:absolute!important;left:10px!important;top:112px!important;bottom:auto!important;right:auto!important;display:flex!important;align-items:center;gap:8px;width:auto!important;height:auto!important;margin:0!important;padding:6px 10px!important;background:rgba(255,255,255,.9)!important;border-radius:250px!important;font-size:12px;font-weight:500;color:#2b2723;z-index:2}
#random_content .content_block2 .stats:not(:has(> :not(.is-zero))){display:none!important}
}
#new_content .content_block2>a,#random_content .content_block2>a{display:flex!important;flex-direction:column!important;height:100%!important;min-width:0}
#new_content .content_block2>a figure,#random_content .content_block2>a figure{flex:none!important;width:100%!important;margin:0!important}
#new_content .content_block2>a figure,#new_content .content_block2>a figure img,#random_content .content_block2>a figure,#random_content .content_block2>a figure img{height:150px!important;object-fit:cover}
#new_content .content_block2>a article,#random_content .content_block2>a article{display:flex!important;flex-direction:column!important;flex:1 1 auto!important;padding:12px 14px!important;min-height:0}
#new_content .content_block2 .cat_name,#random_content .content_block2 .cat_name{order:1!important;display:block!important;margin:0 0 6px!important;padding:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#new_content .content_block2 .cat_name hr,#random_content .content_block2 .cat_name hr{display:none!important}
#new_content .content_block2 h3,#random_content .content_block2 h3{order:2!important;margin:0 0 6px!important;padding:0!important;font-size:16px;line-height:1.3!important;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em;max-height:2.6em}
#new_content .content_block2 .ellipsis,#random_content .content_block2 .ellipsis{display:-webkit-box!important;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;color:#6b6b66;-webkit-line-clamp:2;min-height:2.8em;max-height:2.8em;line-height:1.4!important;order:3!important;margin:0 0 10px!important}
#new_content .content_block2 .Data,#random_content .content_block2 .Data{order:4!important;margin-top:auto!important;height:40px!important;min-height:40px!important;max-height:40px!important;overflow:hidden!important;padding:0!important;display:flex!important;align-items:center!important}
#new_content .content_block2 .author-chip,#random_content .content_block2 .author-chip{height:40px;max-height:40px!important;padding:0!important;margin:0!important;display:inline-flex!important;align-items:center}
#new_content .content_block2 .author-photo,#random_content .content_block2 .author-photo{width:34px!important;height:34px!important;object-fit:cover;border-radius:50%;flex:none;display:inline-block!important}

/* ---------- Телефон: «Новые» — крупная карточка и сетка 2x2 ---------- */
@media (max-width:700px){
#new_content .content_block{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important}
#new_content .content_block1,#new_content .content_block2{display:contents!important}
#new_content .content_block1>a{grid-column:span 2!important}
#new_content .content_block2 h3{font-size:14px!important;-webkit-line-clamp:3;min-height:3.9em;max-height:3.9em}
#new_content .content_block2 .ellipsis{font-size:12px!important;-webkit-line-clamp:3;min-height:4.2em;max-height:4.2em}
#new_content .content_block2 .cat_name{font-size:12px}
}

/* ---------- Телефон: «Популярные» и «Случайные» — список строк (миниатюра, категория, название, рейтинг и лайки) ---------- */
@media (max-width:700px){
#popular_content .content_block,#random_content .content_block{display:block!important}
#popular_content .content_block1,#popular_content .content_block2,#random_content .content_block1,#random_content .content_block2{display:block!important;margin:0!important;width:100%!important;max-width:none!important}
#popular_content .content_block1>a,#popular_content .content_block2>a,#random_content .content_block1>a,#random_content .content_block2>a{position:relative!important;display:flex!important;flex-direction:row!important;align-items:flex-start!important;gap:12px;width:auto!important;height:auto!important;min-height:88px!important;padding:12px 0!important;margin:0!important;background:none!important;border:0!important;border-bottom:1px solid rgba(0,0,0,.08)!important;border-radius:0!important;box-shadow:none!important}
#popular_content .content_block2>a:last-child,#random_content .content_block2>a:last-child{border-bottom:0!important}
#popular_content .content_block1>a::before,#popular_content .content_block1>a::after,#popular_content .content_block2>a::before,#popular_content .content_block2>a::after,#random_content .content_block1>a::before,#random_content .content_block1>a::after,#random_content .content_block2>a::before,#random_content .content_block2>a::after{display:none!important}
#popular_content .content_block1 figure,#popular_content .content_block2 figure,#random_content .content_block1 figure,#random_content .content_block2>a figure{position:static!important;flex:none!important;width:96px!important;height:64px!important;margin:0!important;border-radius:4px!important;overflow:hidden}
#popular_content .content_block1 figure img,#popular_content .content_block2 figure img,#random_content .content_block1 figure img,#random_content .content_block2>a figure img{width:100%!important;height:100%!important;object-fit:cover!important}
#popular_content .content_block1 article,#popular_content .content_block2 article,#random_content .content_block1 article,#random_content .content_block2>a article{position:static!important;display:flex!important;flex-direction:column!important;flex:1 1 auto!important;min-width:0;padding:0 0 22px!important;border:0!important;box-shadow:none!important;background:none!important}
#popular_content .cat_name,#random_content .content_block1 .cat_name,#random_content .content_block2 .cat_name{order:1!important;display:block!important;font-size:12px!important;font-weight:400;text-transform:uppercase;letter-spacing:.02em;color:#5f5f5a!important;margin:0!important;padding:0!important;line-height:1.3;white-space:normal}
#popular_content .cat_name hr,#random_content .cat_name hr{display:none!important}
#popular_content .content_block1 h3,#popular_content .content_block2 h3,#random_content .content_block1 h3,#random_content .content_block2>a h3{order:2!important;display:block!important;text-transform:none;letter-spacing:normal;color:#222!important;font-size:15px!important;font-weight:700!important;line-height:1.3!important;margin:2px 0 0!important;padding:0!important;min-height:0!important;max-height:none!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;-webkit-line-clamp:unset!important}
#popular_content .ellipsis,#popular_content .Data,#random_content .content_block1 .ellipsis,#random_content .content_block2 .ellipsis,#random_content .content_block1 .Data,#random_content .content_block2 .Data{display:none!important}
#popular_content .stats-badge,#popular_content .content_block2 .stats,#random_content .stats-badge,#random_content .content_block2 .stats{position:absolute!important;left:108px!important;bottom:12px!important;top:auto!important;right:auto!important;display:flex!important;align-items:center;gap:10px;width:auto!important;height:auto!important;margin:0!important;padding:0!important;background:none!important;box-shadow:none!important;border-radius:0!important;font-size:12px;font-weight:700;color:#6b645a}
#popular_content .stats-badge .is-zero,#popular_content .content_block2 .stats .is-zero,#random_content .stats-badge .is-zero,#random_content .content_block2 .stats .is-zero{display:none!important}

/* рейтинг и лайки показываются всегда, даже если оценок и лайков ещё нет */
#popular_content .rating-card--none,#popular_content .stats-badge .rating-card--none,#popular_content .content_block2 .stats .rating-card--none,#random_content .rating-card--none,#random_content .stats-badge .rating-card--none,#random_content .content_block2 .stats .rating-card--none{display:inline-flex!important;align-items:center;gap:4px;font-weight:400}
#popular_content .stats-badge .likes.is-zero,#popular_content .content_block2 .stats .likes.is-zero,#random_content .stats-badge .likes.is-zero,#random_content .content_block2 .stats .likes.is-zero{display:inline-flex!important;align-items:center;font-weight:400}
}

/* ---------- ПК: «Популярные» — один ряд из четырёх одинаковых карточек (на планшете 2x2) ---------- */
@media (min-width:701px){
#popular_content .content_block{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;grid-template-rows:auto!important;gap:16px!important;align-items:stretch!important}
#popular_content .content_block1,#popular_content .content_block2{display:contents!important}
#popular_content .content_block1>a,#popular_content .content_block2>a{position:relative!important;display:flex!important;flex-direction:column!important;height:100%!important;min-width:0;overflow:hidden!important;grid-row:auto!important;grid-column:auto!important}
#popular_content .content_block1 figure,#popular_content .content_block2 figure{position:relative!important;flex:none!important;width:100%!important;height:150px!important;min-height:0!important;margin:0!important}
#popular_content .content_block1 figure img,#popular_content .content_block2 figure img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important}
#popular_content .content_block1 article,#popular_content .content_block2 article{display:flex!important;flex-direction:column!important;flex:1 1 auto!important;padding:12px 14px!important;min-height:0}
#popular_content .cat_name{order:1!important;display:block!important;margin:0 0 6px!important;padding:0!important;white-space:nowrap!important;font-size:13px}
#popular_content .content_block2 .cat_name{overflow:hidden!important;text-overflow:ellipsis}
#popular_content .content_block1 .cat_name{margin-bottom:0!important}
#popular_content .cat_name hr{display:none!important}
#popular_content .content_block1 h3,#popular_content .content_block2 h3{order:2!important;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:16px!important;line-height:1.3!important;margin:6px 0!important;padding:0!important;min-height:2.6em;max-height:2.6em}
#popular_content .content_block1 h3{white-space:normal!important;margin-top:20px!important}
#popular_content .content_block1 .ellipsis,#popular_content .content_block2 .ellipsis{display:-webkit-box!important;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;color:#6b6b66;-webkit-line-clamp:2;min-height:2.8em;max-height:2.8em;line-height:1.4!important;order:3!important;margin:0 0 10px!important}
#popular_content .content_block1 .Data,#popular_content .content_block2 .Data{order:4!important;margin-top:auto!important;height:40px!important;min-height:40px!important;max-height:40px!important;overflow:hidden!important;padding:0!important;display:flex!important;align-items:center!important}
#popular_content .content_block1 .stats-badge,#popular_content .content_block2 .stats{position:absolute!important;left:10px!important;top:112px!important;bottom:auto!important;right:auto!important;display:flex!important;flex-direction:row!important;align-items:center;gap:8px;width:auto!important;height:auto!important;margin:0!important;padding:6px 10px!important;white-space:nowrap;background:rgba(255,255,255,.9)!important;border-radius:250px!important;font-size:12px;font-weight:500;color:#2b2723;z-index:2}
#popular_content .content_block1 .stats-badge:not(:has(> :not(.is-zero))),#popular_content .content_block2 .stats:not(:has(> :not(.is-zero))){display:none!important}
}
@media (min-width:701px) and (max-width:999px){
#popular_content .content_block{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* нулевой значок рейтинга вне мобильного списка не виден */
.rating-card--none{display:none}
@media (min-width:701px){
#popular_content .rating-card--none,#random_content .rating-card--none{display:none!important}
}

/* минимальный размер текста 12 px: категории, рейтинг и лайки (в т.ч. плашки на фото) */
#new_content .stats-badge,#new_content .stats,#new_content .rating-card,#new_content .rating-card__count,#new_content .likes,#new_content .comments,
#random_content .stats-badge,#random_content .stats,#random_content .rating-card,#random_content .rating-card__count,#random_content .likes,#random_content .comments,
#popular_content .stats-badge,#popular_content .stats,#popular_content .rating-card,#popular_content .rating-card__count,#popular_content .likes,#popular_content .comments{font-size:12px}