/*
  CUBE — Register page extras
  1. Auto-sliding 6-photo showcase carousel (replaces the static cube icon)
  2. "Developed by" credit line under the tagline
  3. Glass-styled dropdown options for department/year (fixes white popup)
  Additive only, loaded after register.css and auth-dark.css.
*/

/* ================================================
   BRAND CREDIT LINE
   ================================================ */
.brand-credit {
  font-size: 11.5px !important;
  color: rgba(242, 233, 233, 0.45) !important;
  margin-top: 3px !important;
}

/* ================================================
   SHOWCASE SLIDER — fills the panel, replaces the cube icon
   ================================================ */
.showcase-panel {
  position: relative;
  overflow: hidden;
}

.showcase-slider {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.showcase-slider .slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1s ease;
}

.showcase-slider .slide.active {
  opacity: 1;
}

.showcase-slider .slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Dark scrim so dots/caption stay readable over any photo */
.showcase-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(15, 10, 10, 0.35) 0%, rgba(15, 10, 10, 0.15) 40%, rgba(15, 10, 10, 0.85) 100%);
}

.showcase-panel .carousel-dots,
.showcase-panel .showcase-caption {
  position: relative;
  z-index: 2;
}

.showcase-panel .showcase-caption h3,
.showcase-panel .showcase-caption p {
  color: #fff !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}

.carousel-dots .dot {
  cursor: pointer;
}

/* ================================================
   GLASS DROPDOWN OPTIONS
   Native <select> popups can't have real blur (OS-rendered),
   but dark background + light text fixes the white-list problem.
   ================================================ */
.field select option {
  background-color: #1b1114;
  color: #f2e9e9;
  padding: 10px;
}

.field select option:checked,
.field select option:hover {
  background-color: #e31136;
  color: #fff;
}

/* ================================================
   RESPONSIVE
   ================================================ */
@media (max-width: 900px) {
  .showcase-panel {
    display: none;
  }
}