/* Hide extra affiliates on mobile */
@media (max-width: 767px) {
  .aff-list li:nth-child(n+2) { display: none !important; }
}


/* -------------------------------------------------------
   META ROW (paysite + duration)
------------------------------------------------------- */
.item-meta {
  display: flex; align-items: center; gap: 6px; flex-wrap: nowrap;
  font-size: 12px; color: #CCC; margin-top: 1px; max-width: 100%;
}

/* Paysite truncates inline */
.item-paysite {
  display: inline-flex; min-width: 0; max-width: 60%;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.item-paysite a { display: inline; color: #CCC; }
.item-paysite a:hover { text-decoration: underline; }

/* Duration in meta row */
.item-meta .item-time.-below {
  position: static !important; background: transparent !important; color: #CCC !important;
  font-weight: 600; font-size: 12px; border-radius: 0; padding: 0; height: auto; line-height: 1.2;
  box-shadow: none; text-transform: none; display: inline-flex; align-items: center; gap: 6px;
}

/* -------------------------------------------------------
   THUMB OVERLAYS (views + HD + fav)
------------------------------------------------------- */
.item-col { position: relative; }

/* Views badge (top-left) */
.item-col .item-views.item-badge {
  position: absolute; top: 6px; left: 6px;
  background: rgba(0,0,0,0.75); color: #fff;
  font-weight: 600; font-size: 11px; border-radius: 5px;
  padding: 0 6px; height: 14px; line-height: 14px;
  z-index: 2; font-family: "Inter", sans-serif; text-transform: uppercase;
  box-shadow: 0 1px 3px rgba(0,0,0,0.25);
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
  opacity: 0.92;
}
.item-col:hover .item-views.item-badge { opacity: 1; }

/* Inline SVG eye icon */
.icon-eye {
  width: 11px; height: 11px;
  display: block;               /* no baseline */
  flex: 0 0 11px;               /* fixed; don’t shrink */
  color: currentColor;          /* inherit */
}

/* HD pill (top-right) — globally slimmer */
.item-col .item-quality {
  position: absolute; top: 6px; right: 6px !important; left: auto !important;
  background-color: #ff2024; color: #fff; font-weight: 600; font-size: 11px;
  border-radius: 5px; padding: 0 4px !important; height: 14px !important; line-height: 14px !important;
  z-index: 2; font-family: "Inter", sans-serif; text-transform: uppercase;
  box-shadow: 0 1px 3px rgba(0,0,0,0.25);
  opacity: 0.95; transition: transform .25s ease, opacity .25s ease;
  display: inline-flex; align-items: center; justify-content: center; overflow: hidden; letter-spacing: 0;
  min-width: calc(2ch + 8px); /* “HD” + 4px padding each side */
}
.item-col:hover .item-quality { transform: translateY(-1px); opacity: 1; }

/* Add-to-fav */
.item-col .add-to-fav {
  position: absolute; right: 60px; top: 5px;
  height: 16px; line-height: 16px; font-size: 13px; color: #ff2024;
  opacity: 0; z-index: 2; transition: all 0.2s ease; cursor: pointer;
}
.item-col:hover .add-to-fav { opacity: 1; transform: scale(1.05); }
.item-col .add-to-fav:hover { color: #b90003; }

/* -------------------------------------------------------
   TYPOGRAPHY NORMALIZATION (menus, labels)
------------------------------------------------------- */
body,
h1, h2, h3, h4, h5, h6,
a, p, span, strong, em, b, i, label,
button, input, select, textarea,
.nav, .menu, .submenu, .breadcrumb,
.header, .footer, .video-title, .item-title,
.category-name, .section-title, .paysite-name,
h2.title, .title, .btn, .tab, .widget header h2 { text-transform: none !important; }

/* Menus normal weight */
.header .menu, .header .menu > li, .header .menu > li > a,
.nav-main, .nav-main li, .nav-main a,
.main-menu, .main-menu li, .main-menu a,
#main-menu, #main-menu li, #main-menu a,
.navbar, .navbar li, .navbar a,
.top-menu, .top-menu li, .top-menu a { font-weight: 400 !important; }

.header .menu strong, .header .menu b,
.nav-main strong, .nav-main b,
.main-menu strong, .main-menu b,
#main-menu strong, #main-menu b,
.navbar strong, .navbar b,
.top-menu strong, .top-menu b { font-weight: 400 !important; }

.header .menu i, .header .menu .fa,
.nav-main i, .nav-main .fa,
.main-menu i, .main-menu .fa,
#main-menu i, #main-menu .fa,
.navbar i, .navbar .fa,
.top-menu i, .top-menu .fa { font-weight: inherit !important; }

/* Pagination normal weight */
.pagination, .pagination a, .pagination span, .pagination strong,
.page-numbers, .page-numbers li, .page-numbers a,
.page-numbers span, .page-numbers .current { font-weight: 400 !important; }

/* Main nav normalize */
.main-nav, .main-nav li, .main-nav a,
.main-nav .nav-elem > a,
.main-nav .nav-elem .sub-label,
.main-nav .nav-drop a,
.main-nav .nav-channels .item-name { font-weight: 400 !important; }
.main-nav a:hover, .main-nav a:focus, .main-nav a:active,
.main-nav .nav-elem.current > a, .main-nav .nav-elem.active > a,
.main-nav .nav-drop a:hover { font-weight: 400 !important; }
.main-nav strong, .main-nav b { font-weight: 400 !important; }
.main-nav i, .main-nav .fa,
.main-nav [class^="fa-"], .main-nav [class*=" fa-"] { font-weight: inherit; }
ul.nav-drop li a, .nav-drop li a,
.main-nav .nav-drop li a, .main-nav .nav-drop a { font-weight: 400 !important; }
.nav-drop li a:hover, .nav-drop li a:focus, .nav-drop li a:active { font-weight: 400 !important; }

/* -------------------------------------------------------
   STABILIZE BADGES & NUMBERS (all browsers)
------------------------------------------------------- */
.item-col .item-views.item-badge,
.item-col .item-quality {
  contain: layout paint; will-change: transform; text-align: center;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}

/* Stable width so 17 vs 38 feels balanced */
.item-col .item-views.item-badge {
  font-variant-numeric: tabular-nums;
  font-kerning: none;
  min-width: calc(3ch + 12px); /* 3ch digits + 12px padding (0 6px) */
}

/* ===== Desktop Safari-only fine alignment (views + HD) ===== */
@media screen and (min-width: 1025px) {
  @supports (-webkit-hyphens: none) and (not (-webkit-touch-callout: none)) {

    /* Safari-only pixel-perfect tuning */
    .item-col .item-views.item-badge { 
      transform: translateY(-0.6px) !important; /* move up = negative, down = positive */
    }

    .item-col .item-quality { 
      transform: translateY(-0.4px) !important; /* adjust separately for HD pill */
    }

    /* Optional: if you ever need to shift just the SVG icon inside the badge */
    .item-col .item-views.item-badge .icon-eye {
      transform: translateY(-0.1px) !important; /* up = negative, down = positive */
    }
  }
}


/* -------------------------------------------------------
   SAFARI / WEBKIT MICRO-TWEAK (mobile only)
------------------------------------------------------- */
@supports (-webkit-touch-callout: none) {
  .item-col .item-quality { transform: translateY(0.2px); }
}

/* ===== FORCE slimmer HD pill globally (override theme rules) ===== */
.item-col .image .item-quality,
.item-col > .image .item-quality,
.item-col span.item-quality {
  width: auto !important;
  padding-left: 4px !important; padding-right: 4px !important;
  letter-spacing: 0 !important;
  height: 14px !important; line-height: 14px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  min-width: calc(2ch + 8px) !important; /* “HD” + 4px padding each side */
}

.ad-slot { margin: 20px 0; }
.ad-slot .ad-frame {
  max-width: 728px;       /* desktop leaderboard */
  margin: 0 auto;
  text-align: center;
  width: 100%;
}
.ad-slot iframe,
.ad-slot > div,
.ad-slot .ad-frame > div {
  display: block !important;
  margin: 0 auto !important;
  max-width: 100% !important;
}
@media (max-width: 767px) {
  .ad-slot .ad-frame { max-width: 320px; }    /* mobile banner width */
  [data-awe-container-id] { height: 100px !important; } /* or 90px if your network injects that */
}

.ad-slot { 
  margin: 20px 0; 
  text-align: center; 
}

.ad-slot .ad-frame {
  max-width: 728px;
  margin: 0 auto;
  text-align: center;
  width: 100%;
}

/* ======================
   Ad Slots (Top + Bottom)
   ====================== */

.ad-slot {
  margin: 20px 0;
  text-align: center;
}

/* The ad frame wrapper */
.ad-slot .ad-frame {
  max-width: 770px;              /* desktop leaderboard width */
  margin: 0 auto;
  text-align: center;
  width: 100%;
  position: relative;
  overflow: visible !important;  /* allow label to be visible below ad */
  height: auto !important;       /* container grows with ad + label */
}

/* Ensure injected ad iframe/divs are centered and responsive */
.ad-slot iframe,
.ad-slot > div,
.ad-slot .ad-frame > div {
  display: block !important;
  margin: 0 auto !important;
  max-width: 100% !important;
}

/* "Advertisement" label styling */
.ad-slot .ad-label {
  display: block;
  font-size: 12px;
  color: #ccc;
  text-align: center;
  line-height: 1;
  margin-top: 2px;          /* minimal space below banner */
  z-index: 10;              /* keeps label above ad layers */
  position: relative;
  text-transform: uppercase; /* optional: 'ADVERTISEMENT' style */
  letter-spacing: 0.5px;     /* subtle spacing for polished look */
}

/* --- Responsive tweaks --- */
@media (max-width: 767px) {
  .ad-slot .ad-frame { max-width: 320px; }      /* mobile banner */
  [data-awe-container-id] { height: 100px !important; } /* or 90px per network */
  .ad-slot .ad-label {
    font-size: 11px;
    color: #aaa;
  }
}

/* Responsive image-based ads */
.ad-slot .ad-img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
  max-width: 770px;  /* matches your ad-frame width */
}

/* Responsive iframe banners */
.ad-slot .ad-iframe {
  width: 100% !important;        /* force full width inside wrapper */
  height: auto !important;       /* allow scaling */
  aspect-ratio: 728 / 90;        /* maintain leaderboard proportions */
  display: block;
  margin: 0 auto;
}

/* Mobile override for non-responsive creatives */
@media (max-width: 767px) {
  .ad-slot .ad-iframe {
    width: 320px !important;     /* standard mobile leaderboard width */
    height: 100px !important;    /* adjust to 90px if creative looks squished */
    aspect-ratio: auto;
  }
}

/* Make the thumbnail a positioning context and clip overlays */
.item__thumb { position: relative; overflow: hidden; border-radius: inherit; }

/* Compact, self-sizing pills (no fixed height) */
.item__badge { 
  position: absolute; display: inline-flex; align-items: center; gap: 6px;
  padding: 2px 6px; border-radius: 5px; font: 600 12px/1 "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); z-index: 2;
}

/* HD: top-right */
.item__badge.-quality { top: 6px; right: 6px; background: #ff2024; font-weight: 700; }

/* Duration: bottom-right */
.item__badge.-duration { right: 6px; bottom: 6px; background: rgba(0,0,0,.6); }
.item__badge.-duration .icon.-clock { width: 12px; height: 12px; display: block; flex: 0 0 12px; }

/* Views in meta, tuned for black bg */
.item__meta { display: flex; align-items: center; gap: 8px; margin-top: 2px; font-size: 12px; color: #AAA; }
.item__views-meta { display: inline-flex; align-items: center; gap: 6px; font-variant-numeric: tabular-nums; }
.icon.-eye-meta { width: 12px; height: 12px; display: block; flex: 0 0 12px; color: #888; }

/* Reposition favorite to top-left of the thumb (still hidden until hover by your theme) */
.item__link-fav { position: absolute; left: 6px; top: 6px; z-index: 3; }

/* Ensure the outer wrapper is a positioning context for fav/edit links */
.item__inner { position: relative; }
