/* ═══════════════════════════════════════════════════
   Video 4K Badge — badge.css
   ═══════════════════════════════════════════════════ */

/* ── CSS custom properties (overridden via inline style) ── */
:root {
  --v4kb-fs:            11px;
  --v4kb-br:            3px;
  --v4kb-color-4k:      #e50914;
  --v4kb-color-1080p:   #c0392b;
  --v4kb-color-hd:      #1a73e8;
  --v4kb-color-720p:    #2980b9;
  --v4kb-color-sd:      #5f6368;
  --v4kb-color-custom:  #8e44ad;
  --v4kb-color-text:    #ffffff;
}

/* ── Thumbnail wrapper ──────────────────────────────── */
.v4kb-thumb-wrap {
  position:      relative;
  display:       inline-block;
  line-height:   0;
  width:         100%;
  overflow:      hidden;
}
.v4kb-thumb-wrap img {
  width:   100%;
  height:  auto;
  display: block;
}

/* ── Timebox overlay ────────────────────────────────── */
.v4kb-timebox {
  position:    absolute;
  bottom:      6px;
  left:        6px;
  display:     inline-flex;
  align-items: center;
  gap:         4px;
  line-height: 1;
  z-index:     10;
}
.v4kb-timebox.v4kb-pos-right {
  left:             auto;
  right:            6px;
  flex-direction:   row-reverse;
}

/* ── Duration pill ──────────────────────────────────── */
.v4kb-duration {
  background:    rgba(0, 0, 0, 0.75);
  color:         #fff;
  font-size:     var(--v4kb-fs);
  font-family:   -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-weight:   600;
  padding:       3px 7px;
  border-radius: var(--v4kb-br);
  letter-spacing: 0.3px;
  white-space:   nowrap;
}

/* ── Badge base ─────────────────────────────────────── */
.v4kb-badge {
  display:        inline-block;
  font-size:      var(--v4kb-fs);
  font-family:    -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-weight:    800;
  color:          var(--v4kb-color-text);
  padding:        3px 6px;
  border-radius:  var(--v4kb-br);
  letter-spacing: 0.8px;
  text-transform: uppercase;
  white-space:    nowrap;
  line-height:    1.3;
}

/* ── Per-quality colors ─────────────────────────────── */
.v4kb-badge--4k     { background: var(--v4kb-color-4k); }
.v4kb-badge--1080p  { background: var(--v4kb-color-1080p); }
.v4kb-badge--hd     { background: var(--v4kb-color-hd); }
.v4kb-badge--720p   { background: var(--v4kb-color-720p); }
.v4kb-badge--sd     { background: var(--v4kb-color-sd); }
.v4kb-badge--custom { background: var(--v4kb-color-custom); }

/* ── Content badge wrap (single post fallback) ──────── */
.v4kb-content-badge-wrap {
  display:       flex;
  margin-bottom: 10px;
}
.v4kb-content-badge-wrap .v4kb-timebox {
  position: relative;
  bottom:   auto;
  left:     auto;
}

/* ── Category list shortcode ────────────────────────── */
.v4kb-category-list .v4kb-badge {
  display: inline-block;
}

/* ── Theme compatibility overrides ─────────────────────

   These selectors target common adult/video WP themes.
   The plugin injects .v4kb-thumb-wrap around thumbnails
   so absolute positioning works in all cases.
   ──────────────────────────────────────────────────── */

/* StreamTube */
.video-item .v4kb-thumb-wrap .v4kb-timebox,
.video-card .v4kb-thumb-wrap .v4kb-timebox { bottom: 6px; left: 6px; }

/* Videofly / VideoPress */
.vf-item .v4kb-thumb-wrap .v4kb-timebox    { bottom: 5px; left: 5px; }

/* MTS themes */
.mts-thumbnail-wrapper .v4kb-timebox       { bottom: 4px; left: 4px; }

/* WP Video Lightbox */
.wplightbox .v4kb-timebox                  { bottom: 4px; left: 4px; }

/* Generic .video-thumb class */
.video-thumb .v4kb-thumb-wrap .v4kb-timebox { bottom: 6px; left: 6px; }