/* =============================================================================
   SPRINT 2 – CUCKCLIPS PREMIUM CARD SYSTEM
   5 skins • Chastity lock overlays • Denial badges • Advanced hover
============================================================================= */

.rt-video-card {
  position: relative;
  background: var(--rt-card-bg, var(--rt-card));
  border: 1px solid var(--rt-card-border, var(--rt-border));
  border-radius: var(--rt-card-radius, var(--rt-radius));
  overflow: hidden;
  transition: all 0.35s cubic-bezier(0.23, 1, 0.32, 1);
  box-shadow: 0 8px 25px rgba(0, 0, 0, calc(var(--rt-shadow-strength) * var(--rt-density)));
  height: 100%;
  display: flex;
  flex-direction: column;
}

.rt-video-card:hover {
  transform: translateY(calc(-1 * var(--rt-card-lift))) scale(1.035);
  border-color: var(--rt-denial-color);
  box-shadow: 
    0 20px 45px rgba(192, 38, 211, 0.35),
    0 0 calc(var(--rt-card-glow) * var(--rt-glow-strength)) color-mix(in srgb, var(--rt-denial-color) 65%, transparent);
}

/* Chastity lock overlay – appears on hover for chastity/denial tagged videos */
.rt-video-card.chastity-tagged:hover::after {
  content: "🔒";
  position: absolute;
  top: 14px;
  right: 14px;
  font-size: var(--rt-chastity-lock-size);
  color: var(--rt-lock-color);
  text-shadow: 0 0 15px #eab308;
  opacity: 0.95;
  z-index: 20;
  animation: lockPulse 1.8s infinite alternate ease-in-out;
}

@keyframes lockPulse {
  from { transform: scale(0.85) rotate(-8deg); }
  to   { transform: scale(1.15) rotate(8deg); }
}

/* Card skins */
[data-rt-card-skin="flat"] .rt-video-card { box-shadow: none; border: 2px solid rgba(255,255,255,0.08); }
[data-rt-card-skin="glass"] .rt-video-card {
  background: rgba(255,255,255,0.06);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,0.18);
}
[data-rt-card-skin="neon"] .rt-video-card:hover {
  box-shadow: 0 0 50px #22d3ee, 0 0 30px #c026d3;
}
[data-rt-card-skin="cuckclips"] .rt-video-card {
  border-color: #4f46e5;
  background: linear-gradient(145deg, #0f172a, #1e2937);
}

/* Media area */
.rt-card-media {
  position: relative;
  aspect-ratio: 16 / 9;
  background: #000;
  overflow: hidden;
}

/* Shimmer loading state */
.rt-thumb-wrap{position:relative;width:100%;height:100%;}
.rt-thumb-wrap.rt-shimmer{background: rgba(255,255,255,0.04);}
.rt-thumb-wrap.rt-shimmer::before{
  content:"";
  position:absolute;inset:0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.10), transparent);
  transform: translateX(-120%);
  animation: rtShimmer 1.2s infinite;
}
.rt-thumb-wrap.is-loaded::before{display:none;}
@keyframes rtShimmer{to{transform:translateX(120%);}}
.rt-card-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.23,1,0.32,1);
}
.rt-video-card:hover .rt-card-thumb {
  transform: scale(1.08);
}

/* Pills: HD / NEW / TRENDING */
.rt-cardpillstack{
  position:absolute;
  top:10px;
  left:10px;
  display:flex;
  gap:6px;
  z-index:16;
}
.rt-cardpill{
  font-size:10px;
  font-weight:900;
  padding:3px 8px;
  border-radius:9999px;
  letter-spacing:0.6px;
  text-transform:uppercase;
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.15);
}
.rt-cardpill-hd{background: rgba(59,130,246,0.18); color: color-mix(in srgb, var(--rt-text) 90%, #93c5fd); box-shadow: 0 0 14px rgba(59,130,246,0.25);}
.rt-cardpill-new{background: rgba(34,197,94,0.16);  color: color-mix(in srgb, var(--rt-text) 90%, #86efac); box-shadow: 0 0 14px rgba(34,197,94,0.22);}
.rt-cardpill-trending{background: rgba(192,38,211,0.18); color: color-mix(in srgb, var(--rt-text) 90%, #f0abfc); box-shadow: 0 0 18px rgba(192,38,211,0.28);}

/* Hover variants */
.rt-video-card{--rt-hover-intensity: var(--rt-card-hover-intensity, 1);}
.rt-video-card[data-rt-hover="lift"]:hover{transform: translateY(calc(-1 * (var(--rt-card-lift) * var(--rt-hover-intensity)))) scale(1.02);}
.rt-video-card[data-rt-hover="glow"]:hover{
  transform: translateY(calc(-1 * (var(--rt-card-lift) * 0.6 * var(--rt-hover-intensity)))) scale(1.01);
  box-shadow: 0 18px 40px rgba(0,0,0,0.55), 0 0 calc(var(--rt-card-glow) * var(--rt-hover-intensity)) color-mix(in srgb, var(--rt-accent) 55%, transparent);
}
.rt-video-card[data-rt-hover="title"] .rt-card-title{transform: translateY(6px); opacity:0.92; transition: transform .35s ease, opacity .35s ease;}
.rt-video-card[data-rt-hover="title"]:hover .rt-card-title{transform: translateY(0); opacity:1;}

/* Badges */
.rt-badge {
  position: absolute;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 9999px;
  z-index: 15;
  backdrop-filter: blur(8px);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: 1;
}
.rt-badge-duration {
  top: 10px;
  right: 10px;
  background: rgba(0,0,0,0.82);
  color: #fff;
  /* Duration badge MUST be compact (avoid tall pill look)
     theme.css defines .rt-badge padding that can make this look tall.
     Use stronger overrides + explicit height.
  */
  padding: 0 6px !important;
  font-size: 10px !important;
  line-height: 1 !important;
  height: 16px !important;
  min-height: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center;
  border-radius: 9999px;
}

/* Stronger specificity to ensure this wins over theme.css defaults */
.rt-badge.rt-badge-duration{
  padding: 0 6px !important;
  font-size: 10px !important;
  line-height: 1 !important;
  height: 16px !important;
  min-height: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
}
.rt-badge-provider { bottom: 10px; left: 10px; background: linear-gradient(90deg, #6d28d9, #c026d3); color: #fff; }
.rt-chastity-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #eab308;
  color: #000;
  font-weight: 900;
  padding: 3px 9px;
  font-size: 10px;
  border-radius: 9999px;
  box-shadow: 0 0 12px #eab308;
}

/* Body */
.rt-card-body {
  padding: 14px 12px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.rt-card-title {
  font-size: 15px;
  line-height: 1.35;
  font-weight: 700;
  margin: 0 0 8px 0;
  display: -webkit-box;
  -webkit-line-clamp: var(--rt-card-title-lines);
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--rt-text);
}
.rt-card-submeta{
  margin-top: auto;
  font-size: 12px;
  line-height: 1.45;
  color: color-mix(in srgb, var(--rt-muted) 86%, var(--rt-text));
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rt-card-link{
  display:flex;
  min-height:100%;
  flex-direction:column;
  color:inherit;
  text-decoration:none;
}
.rt-card-media::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:48%;
  pointer-events:none;
  background:linear-gradient(to top, rgba(0,0,0,.48), rgba(0,0,0,0));
  opacity:.72;
}
.rt-badge-provider{
  max-width:68%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rt-denial-tag {
  margin-top: auto;
  font-size: 11px;
  color: var(--rt-denial-color);
  font-weight: 600;
  letter-spacing: 0.8px;
  opacity: 0.9;
}

/* Responsive */
@media (max-width: 640px) {
  .rt-video-card:hover {
    transform: translateY(-4px) scale(1.02);
  }
  .rt-card-body{
    padding:12px 11px;
  }
  .rt-card-title{
    font-size:14px;
  }
  .rt-badge-provider{
    max-width:74%;
    font-size:10px;
  }
  .rt-card-submeta{
    font-size:11px;
  }
}
