/* =============================================================================
   OMG Big Boobs — tour6/assets/css/omg-sfw.css
   session_ref: 2026-11-05-omg-sfw-tour

   Loaded by header.php only when OMG_SFW is defined (SFW landing, SFW
   models, join.php?sfw=1). Everything else comes from the normal tour CSS;
   this file only adds the stripe, the 8-up small grid, the verify block
   and removes the NSFW background photo from the member section.
   ========================================================================== */

:root {
  /* Peter: CMYK 20/0/100/0. Naive conversion is #CCFF00; his JPG mockup
     samples nearer this. Swap for his hex if he supplies one. */
  --omg-sfw-yellow: #E8FF2E;
}

/* ---------- Top stripe ---------------------------------------------------- */

.omg-sfw-stripe {
  background: var(--omg-sfw-yellow);
  color: #111;
  font-family: var(--omg-font);
  font-weight: var(--omg-w-bold);
  font-size: 13px;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  position: relative;
  z-index: 60; /* above the header pill */
}

.omg-sfw-stripe__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  min-height: 28px;
}

.omg-sfw-stripe a,
.omg-sfw-stripe button {
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

.omg-sfw-stripe a:hover,
.omg-sfw-stripe button:hover { color: var(--omg-pink-active); }

.omg-sfw-stripe .omg-sfw-verify { display: inline; }

@media (max-width: 640px) {
  .omg-sfw-stripe { font-size: 11px; }
  .omg-sfw-stripe__inner {
    flex-direction: column;
    gap: 2px;
    text-align: center;
    padding-block: 4px;
  }
}

/* ---------- 8-up small grid (Top rated 8x4, Other popular 8x8) ------------ */

.omg-grid--8 {
  grid-template-columns: repeat(8, 1fr);
  gap: 8px;
}
@media (max-width: 1200px) { .omg-grid--8 { grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 900px)  { .omg-grid--8 { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 520px)  { .omg-grid--8 { grid-template-columns: repeat(2, 1fr); } }

.omg-grid--8 .omg-card__body { padding: 6px 2px 0; }
.omg-grid--8 .omg-card__meta {
  font-size: 11px;
  gap: 4px;
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow: hidden;
}
.omg-grid--8 .omg-card__meta .omg-icon { width: 12px; height: 12px; }
.omg-grid--8 .omg-card__meta-sep  { display: none; }
.omg-grid--8 .omg-card__date-full { display: none; }
.omg-grid--8 .omg-card__date-short{ display: inline; }
.omg-grid--8 .omg-card__play .omg-icon { width: 28px; height: 28px; }

/* ---------- SFW card ------------------------------------------------------ */

/* MP4 whose poster the nightly script has not produced yet */
.omg-card__img--pending {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: var(--omg-surface-1);
}

/* ---------- Member section: no background photo (Peter spec #3) ---------- */

body.omg-sfw .omg-membership::before {
  background-image: none;
}

/* ---------- Heaven band without a photo yet ------------------------------ */

body.omg-sfw .omg-banner__img:empty {
  background: rgba(0, 0, 0, 0.25);
}

/* ---------- VERIFY AGE block on join.php?sfw=1 ---------------------------- */

.omg-sfw-verify-box {
  text-align: center;
  padding: 40px 32px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 16px;
}

.omg-sfw-verify-box .omg-heading { justify-content: center; }

.omg-sfw-verify-box p {
  max-width: 640px;
  margin: 16px auto 24px;
  color: var(--omg-text-muted);
  font-size: var(--omg-fs-body-lg);
  line-height: var(--omg-lh-body);
}

.omg-sfw-verify-box .omg-sfw-verify { display: inline-block; }

.omg-sfw-verify button.omg-btn {
  border: 0;
  cursor: pointer;
  font-family: inherit;
}

@media (max-width: 640px) {
  .omg-sfw-verify-box { padding: 24px 16px; }
}

/* ---------- Join bar lady cutout ------------------------------------------
   CHANGE 2026-11-05: HB - lady-033.png is NSFW; blurred on SFW pages until
   Peter supplies an SFW cutout (then drop this rule and swap the asset). */
body.omg-sfw .omg-joinbar__lady {
  filter: blur(14px);
  opacity: 0.6;
}

/* ---------- Heaven band with no SFW photo yet ------------------------------
   CHANGE 2026-11-05: HB - the band kept the 420px photo column empty. While
   assets/images/sfw/heaven.jpg is missing, drop the column and centre the
   remaining two. Stops matching by itself once the photo exists. */
@media (min-width: 901px) {
  body.omg-sfw .omg-banner__inner:not(:has(.omg-banner__img img)) {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "brand ."
      "brand points"
      "brand cta"
      "brand .";
  }
}
body.omg-sfw .omg-banner__inner:not(:has(.omg-banner__img img)) .omg-banner__img {
  display: none;
}
