/*
 * builder.css — eigener Namespace `.__Builder_` fuer punktuelle Style-Overrides.
 * Diese Praefixe werden sonst NIRGENDS verwendet, daher kollisionsfrei und nie ueberschrieben.
 * Reines CSS (kein Sass-Build noetig). Nach Aenderung ?v= in layouts/default.blade.php hochzaehlen.
 */

/* Bottom "Latest Blockchain Games News" Heading (pages/home/last_news.blade.php) */
.__Builder_H2_id10 {
  font-size: 32px;
  font-weight: 800;
}

/* Device-Sprite zentriert im Avatar-Kreis (gamelistitems / gameitems_ad), wenn (noch) kein SVG-Icon vorhanden */
.__Builder_DeviceSprite {
  align-items: center;
  justify-content: center;
}

/* ===== Top Boxes (pages/home/trending_top.blade.php) ===== */
.__Builder_TrendAd { position: relative; }
.__Builder_TrendAdBadge { position: absolute; left: 10px; top: 0; }
.__Builder_Icon16 { width: 16px !important; height: 16px !important; }
.__Builder_Img16 { width: 16px; height: 16px; }
.__Builder_LabelBlack { color: #000; }
.__Builder_ImgCover { width: 100%; height: 100%; object-fit: cover; }
.__Builder_InlineFlexGap { display: inline-flex; align-items: center; gap: 0.2rem; }
.__Builder_PtHalf { padding-top: 0.5rem; }
.__Builder_Pointer { cursor: pointer; }
.__Builder_AvgScoreDown { background: #ff2f45; color: #fff; display: flex; align-items: center; gap: 0.2rem; }
.__Builder_AvgScoreUp { background: #5be85c; color: #000; display: flex; align-items: center; gap: 0.2rem; }
.__Builder_TrendDownImg { transform: scaleX(1) scaleY(-1); filter: invert(1) brightness(2); }

/* ===== Topbar / Tab-Filter (pages/home/topbar.blade.php) ===== */
.__Builder_TabFilterBar { justify-content: space-between; align-items: center; border-bottom: 0; }
.__Builder_FlexGapHalf { display: flex; align-items: center; gap: 0.5rem; }
.__Builder_FlexCenter { display: flex; align-items: center; }
/* "Add Game"-Button neben dem Filter (Stil wie auf /games) */
.__Builder_AddGameBtn { display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 0; border-radius: 8px; height: 38px; padding: 0 14px; color: #000; font-size: 16px; font-weight: 600; text-decoration: none; transition: background .15s ease; }
.__Builder_AddGameBtn:hover { background: #f2f2f1; color: #000; }

/* ===== Top-Boxen Preload-Placeholder (pages/home/trending.blade.php) ===== */
.__Builder_ShimmerW200 { width: 200px; }
.__Builder_ShimmerW120 { width: 120px; }
/* col4-Placeholder (zwei gestapelte Boxen): Spaltenhoehe fuellen statt feste Hoehe,
   damit sie nicht hoeher werden als die echten geladenen Boxen / die anderen Spalten.
   !important noetig, da .HomeTopBoxPreloadElement .BigHolderContent (2 Klassen) height:152px setzt. */
.__Builder_PreloadVertical { height: 100%; }
.__Builder_PreloadVertical .BigHolderContent { height: auto !important; flex: 1 1 0; min-height: 0; }

/* ===== Tabellen-Rahmen (pages/home/gameitems.blade.php) ===== */
.__Builder_NoFound { padding: 6rem 0; border-bottom: 1px solid #e2e2e2; margin-bottom: 2rem; height: auto; }
.__Builder_NoFoundIcon { width: 300px; height: 300px; }
.__Builder_TextCenter { text-align: center; }
.__Builder_LastUpdated { text-align: right; font-size: 9px; }

/* ===== Tabellen-Zeilen (pages/home/gamelistitems.blade.php) ===== */
.__Builder_Hidden { display: none; }
.__Builder_AlignCenter { align-items: center; }
.__Builder_GameLogoBox { width: 80px !important; height: 80px !important; border-radius: 15px !important; position: relative; }
.__Builder_LogoBadge { position: absolute; top: 0.3rem; right: 0.3rem; z-index: 1; }
.__Builder_InlineFlexGapHalf { display: inline-flex; align-items: center; gap: 0.5rem; }
.__Builder_InlineFlex { display: inline-flex; }
.__Builder_Sparkline { width: 120px; height: 50px; }

/* ===== Index-Wrapper (pages/index.blade.php) ===== */
.__Builder_FlexCol { flex-direction: column; }
/* Sichtbar-Zustand = flex (per Stylesheet, NICHT none!), damit slideToggle korrekt auf flex zurueckstellt.
   Verstecken passiert per Inline display:none am Element (jQuery entfernt das beim Anzeigen). */
.__Builder_CategoryFilters {
  padding-top: 1rem !important;
  border-top: 1px solid #eee;
  display: flex; }

/* ===== Status-Badge (Soft Pill, Farbe inline aus status_color) ===== */
/* gamelistitems / gameitems_ad — background = rgba(status_color, .12), color = status_color (inline) */
.__Builder_StatusBadge {
  display: inline-flex;
  align-items: center;
  padding: 4px 11px;
  border-radius: 100px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  text-decoration: none;
}

/* P2E-Spalte: Original buttonYes-Struktur (inkl. Top/Bottom-Stack) behalten, nur grau einfaerben.
   !important noetig, da .buttonYes Farbe per !important setzt. */
.__Builder_P2eGrey { background: #f2f2f1 !important; color: #333 !important; }

/* ===== Sort-Icon im Thead: Tabler "selector" statt fa-sort (pages/home/gameitems.blade.php) ===== */
/* Ersetzt das FontAwesome fa-sort-Glyph (ungesorteter Zustand) per CSS-Mask durch das
   Tabler-"selector"-SVG. background-color: currentColor uebernimmt die Textfarbe (inkl. Hover). */
table.SnowTable thead th.SortTrue a i.fa-sort {
  font-size: 0 !important;
  line-height: 0;
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: middle;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 9l4 -4l4 4'/%3E%3Cpath d='M16 15l-4 4l-4 -4'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 9l4 -4l4 4'/%3E%3Cpath d='M16 15l-4 4l-4 -4'/%3E%3C/svg%3E") no-repeat center / contain;
}
table.SnowTable thead th.SortTrue a i.fa-sort::before { content: none !important; }

/* ===== Earnings-Spalte vorerst komplett ausgeblendet (Thead + gamelistitems + gameitems_ad) ===== */
.__Builder_HideEarn { display: none !important; }