/* --- Media Icon Styling --- */

/* Hides the close icon in media */
.media__icon--close {
  display: none;
}

/* Hover effect for remote video bundle */
.media--bundle--remote-video:hover {
  cursor: pointer;
}

/* Display and color styling for media icons in remote videos */
.media--bundle--remote-video .media__icon {
  opacity: 1 !important;
  visibility: visible !important;
  color: white;
}

/* Icon background and position adjustments */
.media--bundle--remote-video .media__icon::before,
.media--bundle--remote-video .media__icon::after {
  background: none;
  top: 0;
}

/* Play icon styling within remote video */
.media--bundle--remote-video .media__icon::before {
  font-family: 'Font Awesome 5 Brands';
  content: '\f167'; /* YouTube play icon */
  color: #ff0000;
  font-weight: 900;
  font-size: 70px;
}

/* --- Play Icon Border Styling --- */

.media__icon--play {
  border-color: #ff6d2c;
}

.media__icon--play::before {
  border-left-color: #ff6d2c;
}

/* --- Download Box Styling --- */

.download-box .field--name-field-media-document a::before {
  font-family: 'Font Awesome 5 Free';
  content: '\f019'; /* Download icon */
  font-weight: 900;
  font-size: 2rem;
  color: #be830f;
  padding-right: 10px;
}

.download-box .field--name-field-media-document a {
  font-weight: 600;
}

/* --- Media Caption and Description Styling --- */

span.media-description,
.blazy__caption {
  color: #666;
  font-size: 0.95rem;
  box-sizing: border-box;
  padding: 10px 0;
  word-wrap: break-word;
}

/* --- Video Embed Container Styling --- */

/* Responsive 16:9 aspect ratio for video embeds */
.field--name-field-media-oembed-video,
.video-iframe-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
}

.field--name-field-media-oembed-video iframe,
.video-iframe-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}