.mb-rv { margin: 1rem 0; }
.mb-rv__toggle { display:flex; align-items:center; justify-content:space-between; cursor:pointer; user-select:none; padding:.75rem 1rem; border:1px solid #ddd; border-radius:8px; background:#f8f8f8; font-weight:600; }
.mb-rv__toggle:focus { outline: 2px solid #5b9dd9; outline-offset: 2px; }
.mb-rv__chev { transition: transform .2s ease; }
.mb-rv.is-open .mb-rv__chev { transform: rotate(90deg); }
.mb-rv__panel { display:none; border:1px solid #eee; border-top:none; border-radius:0 0 8px 8px; padding:.5rem 1rem; }
.mb-rv.is-open .mb-rv__panel { display:block; }

.mb-related-videos__head { font-weight:600; display:flex; gap:1rem; border-bottom:1px solid #ddd; padding:.5rem 0; margin-top:.25rem; }

.mb-related-videos__date { width:12rem; flex:0 0 12rem; }

/* Modal */
.mb-rv-modal__overlay { position: fixed; inset: 0; background: rgba(0,0,0,.66); display:flex; align-items:center; justify-content:center; z-index: 999999; }
.mb-rv-modal { background: #000; border-radius: 8px; max-width: 90vw; width: 960px; aspect-ratio: 16 / 9; position: relative; box-shadow: 0 10px 30px rgba(0,0,0,.5); }
.mb-rv-modal iframe, .mb-rv-modal video { width: 100%; height: 100%; border: 0; display:block; border-radius: 8px; background: #000; }
.mb-rv-modal__close { position: absolute; top: -42px; right: 0; background: #fff; color:#111; border-radius: 999px; width: 36px; height: 36px; display:flex; align-items:center; justify-content:center; font-weight:700; cursor:pointer; box-shadow: 0 2px 6px rgba(0,0,0,.35); }

@media (max-width: 768px){
  .mb-rv-modal { width: 94vw; }
  .mb-rv-modal__close { top: -40px; }
}
/* Two-column row: title left, duration right */
.mb-related-videos__row {
  display: flex;
  align-items: center;
  justify-content: space-between; /* pushes duration to the right */
  gap: 1rem;
  padding: .4rem 0;
  border-bottom: 1px solid #eee;
}

.mb-related-videos__title {
  flex: 1 1 auto;     /* take remaining width */
  min-width: 0;       /* allow text-ellipsis if you add it later */
}

.mb-related-videos__dur {
  flex: 0 0 auto;     /* hug content */
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums; /* nicer lining digits */
  color: #555;
}

/* The main container you already style */
.mb-rv-inline-embed {
    position: relative; /* Essential for positioning the overlay */
    /* Other styles... */
}

/* The click-blocking overlay */
.mb-rv-inline-embed.is-frozen:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* Use a transparent background and a high z-index */
    background: transparent;
    z-index: 10; 
    cursor: pointer; /* Optional: indicates replay ability */
}

/* Optional: Add a simple replay button or icon when frozen */
.mb-rv-inline-embed.is-frozen:before {
    content: "↻"; /* Replay icon */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 40px;
    color: rgba(255, 255, 255, 0.9);
    z-index: 11; /* Must be above the overlay */
    pointer-events: none; /* Allows clicks to go through to the overlay */
}

/* --------------------------------------
   Aspect Ratio & Full Width Container Fix
   -------------------------------------- */

/* 1. Ensure the top-level container takes 100% width of its parent column */
.mb-rv-inline-embed {
    width: 100%; /* Important: makes it expand to the container column */
    max-width: 100%;
}

/* 2. Aspect Ratio Hack (16:9) */
.mb-rv-ratio-16x9 {
    position: relative;
    padding-top: 56.25%; /* 9 / 16 = 0.5625 (56.25%) */
    height: 0; /* Necessary to allow padding-top to define height */
}

/* 3. Ensure the dynamically inserted iframe/video fills the ratio container */
.mb-rv-inline-embed iframe,
.mb-rv-inline-embed video {
    /* These styles already exist in your JS, but placing them here is cleaner */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* --------------------------------------
   Rest of your existing CSS for the freeze overlay:
   -------------------------------------- */

.mb-rv-inline-embed.is-frozen:after {
    /* ... your existing overlay styles ... */
    z-index: 10;
}
/* ... etc. */