/*
 * Custom overrides for madfanboy.com
 * --------------------------------------------------------------------------
 * "Новостная помойка" (homepage block)
 *
 * Goal: keep click behaviour unchanged, but make the list more compact:
 * - small thumbnail on the left
 * - title on the right (2-line clamp)
 * - date + comment count in a small meta row
 *
 * How to enable:
 * In the View display used for this block, set (Advanced → CSS class):
 *   view-mini-news-compact
 * Then clear caches.
 */

/* Compact list wrapper */
/* -------------------------
 * Mini News (front page)
 * Compact one-line, no image
 * Add this class in Views: "view-mini-news-compact"
 * ------------------------- */
.view-mini-news-compact .view-content {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* Override the default "list articles" look for this one display */
.view-mini-news-compact.view-list-articles .views-row,
.view-mini-news-compact .views-row {
  float: none;
  width: 100%;
  margin: 0;
  padding: 8px 0;
  border-bottom: 1px solid rgba(139, 0, 0, 0.25);

  display: flex;
  align-items: center;
  gap: 10px;
}

/* Hide thumbnail/media completely in this block */
.view-mini-news-compact .views-field-field-image,
.view-mini-news-compact .views-field-field-image img,
.view-mini-news-compact .views-field-field-media,
.view-mini-news-compact .views-field-field-media img,
.view-mini-news-compact .views-field-field_media,
.view-mini-news-compact .views-field-field_media img {
  display: none !important;
}

/* Title: one line with ellipsis */
.view-mini-news-compact .views-field-title {
  flex: 1 1 auto;
  min-width: 0; /* required for ellipsis in flex */
}

.view-mini-news-compact .views-field-title a {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600;
}

/* Date + comment count: compact meta on the right */
.view-mini-news-compact .views-field-created,
.view-mini-news-compact .views-field-last-replies,
.view-mini-news-compact .views-field-last-replies,
.view-mini-news-compact .views-field-comment {
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1;
  opacity: .75;
}

.view-mini-news-compact .views-field-created {
  margin-left: auto;
}

/* Separator before comment count */
.view-mini-news-compact .views-field-last-replies:before,
.view-mini-news-compact .views-field-last-replies:before {
  content: "·";
  margin: 0 8px;
  opacity: .6;
}

/* If the View also outputs teaser body / "read more" in this display — hide it */
.view-mini-news-compact .views-field-body,
.view-mini-news-compact .views-field-view-node {
  display: none;
}

/* Mobile: keep everything on one line by hiding date */
@media (max-width: 575px) {
  .view-mini-news-compact .views-field-created {
    display: none;
  }
}


/* Mini News: compact one-line (view-mini-news-compact) */
.view-mini-news-compact .views-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 0;
}

/* Hide thumbnail/image fields entirely */
.view-mini-news-compact .views-field-field-image,
.view-mini-news-compact .views-field-field_image,
.view-mini-news-compact .views-field-field-media,
.view-mini-news-compact .views-field-field_media,
.view-mini-news-compact .views-field-field_image *,
.view-mini-news-compact .views-field-field_media *,
.view-mini-news-compact .views-field-field-image *,
.view-mini-news-compact .views-field-field-media *{
  display:none !important;
}

/* Force field ordering regardless of markup order */
.view-mini-news-compact .views-field-title{ order:1; flex:1 1 auto; min-width:0; }
.view-mini-news-compact .views-field-created{ order:2; margin-left:auto; flex:0 0 auto; white-space:nowrap; }
.view-mini-news-compact .views-field-last-replies,
.view-mini-news-compact .views-field-last-replies,
.view-mini-news-compact .views-field-comments,
.view-mini-news-compact .views-field-comment{ order:3; flex:0 0 auto; white-space:nowrap; }

.view-mini-news-compact .views-field-title a{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-weight:600;
}

.view-mini-news-compact .views-field-created,
.view-mini-news-compact .views-field-last-replies,
.view-mini-news-compact .views-field-last-replies,
.view-mini-news-compact .views-field-comments,
.view-mini-news-compact .views-field-comment{
  font-size:12px;
  opacity:.75;
  line-height:1;
}

/* Small separator before comment count */
.view-mini-news-compact .views-field-last-replies:before,
.view-mini-news-compact .views-field-last-replies:before,
.view-mini-news-compact .views-field-comments:before,
.view-mini-news-compact .views-field-comment:before{
  content:"·";
  margin:0 8px;
  opacity:.6;
}

/* Mobile: keep it one-line — hide date if needed */
@media (max-width: 600px){
  .view-mini-news-compact .views-field-created{ display:none; }
}

/* QuickTabs: компактные вкладки в 1 линию, без скруглений и без hover-полос */
#quicktabs-quick_popular ul.quicktabs-tabs,
#quicktabs-quick_blog ul.quicktabs-tabs {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;            /* строго 1 линия */
  gap: 8px !important;

  padding: 0 !important;
  margin: 0 0 12px 0 !important;

  list-style: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;

  overflow-x: auto;                        /* если совсем узко — скролл вместо переноса */
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

/* li как “кнопки” */
#quicktabs-quick_popular ul.quicktabs-tabs > li,
#quicktabs-quick_blog ul.quicktabs-tabs > li {
  flex: 0 0 auto !important;
  width: auto !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 1px solid #b30000 !important;    /* твой красный */
  border-radius: 0 !important;             /* НИКАКИХ скруглений */
  background: transparent !important;

  box-shadow: none !important;
}

/* ссылка внутри */
#quicktabs-quick_popular ul.quicktabs-tabs > li > a,
#quicktabs-quick_blog ul.quicktabs-tabs > li > a {
  display: block !important;

  padding: 3px 10px !important;            /* компактнее */
  font-size: 13px !important;
  line-height: 18px !important;            /* держим высоту аккуратно */
  font-weight: 600;

  color: #111 !important;
  text-decoration: none !important;

  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;

  outline: none !important;
  box-shadow: none !important;
}

/* активная вкладка */
#quicktabs-quick_popular ul.quicktabs-tabs > li.active,
#quicktabs-quick_blog ul.quicktabs-tabs > li.active {
  background: #b30000 !important;
}

#quicktabs-quick_popular ul.quicktabs-tabs > li.active > a,
#quicktabs-quick_blog ul.quicktabs-tabs > li.active > a {
  color: #fff !important;
}

/* hover — без розовых полос, просто лёгкая заливка */
#quicktabs-quick_popular ul.quicktabs-tabs > li:not(.active):hover,
#quicktabs-quick_blog ul.quicktabs-tabs > li:not(.active):hover {
  background: #f3f3f3 !important;
}

/* на всякий случай прибиваем псевдо-эффекты/подсветки */
#quicktabs-quick_popular ul.quicktabs-tabs > li > a::before,
#quicktabs-quick_blog ul.quicktabs-tabs > li > a::before,
#quicktabs-quick_popular ul.quicktabs-tabs > li > a::after,
#quicktabs-quick_blog ul.quicktabs-tabs > li > a::after {
  content: none !important;
}