/* SMN Template - Center highlight carousel (Slick) */

/* Wrapper: allow arrows to show */
.smn-center-slick{
  position: relative;
  overflow: visible !important;
}

/* Viewport: keep only 3 visible, but add breathing space so top label doesn't get clipped */
.smn-center-slick .slick-list{
  overflow: hidden !important;
  padding-top: 28px !important;
  padding-bottom: 28px !important;
}

/* Slides */
.smn-center-slick .slick-slide{
  transform: scale(.86);
  transition: transform .35s ease, filter .35s ease;
  filter: brightness(.75);
}

.smn-center-slick .slick-center{
  transform: scale(1.04);
  filter: brightness(1);
  z-index: 5;
}

/* Card highlight */
.smn-center-slick .smn-card{
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  transition: box-shadow .35s ease, outline-color .35s ease, outline-offset .35s ease;
}

.smn-center-slick .slick-center .smn-card{
  box-shadow: 0 18px 45px rgba(0,0,0,.55);
  outline: 2px solid rgba(212,175,55,.90);
  outline-offset: 6px;
}

/* Slick arrows: force visible */
.smn-center-slick .slick-prev,
.smn-center-slick .slick-next{
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 9999 !important;
  width: 46px;
  height: 46px;
}

.smn-center-slick .slick-prev{ left: 10px !important; }
.smn-center-slick .slick-next{ right: 10px !important; }

/* Make arrow buttons tappable & visible on dark backgrounds */
.smn-center-slick .slick-prev:before,
.smn-center-slick .slick-next:before{
  font-size: 32px;
  opacity: 1 !important;
}
/* Cinema poster frame */
.smn-poster{ width:100%; }

.smn-frame{
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  background: #0a0a0a;
  border: 2px solid rgba(212,175,55,.35);
  box-shadow:
    0 18px 40px rgba(0,0,0,.55),
    inset 0 0 0 2px rgba(0,0,0,.55);
}

.smn-frame::before{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  background: linear-gradient(
    135deg,
    rgba(255,255,255,.10),
    rgba(255,255,255,0) 30%,
    rgba(0,0,0,.35) 70%,
    rgba(255,255,255,.06)
  );
  mix-blend-mode: overlay;
  opacity: .45;
  z-index: 1;
}

.smn-frame-top{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 14px 12px;
  text-align: center;
  font-weight: 700;
  letter-spacing: .12em;
  font-size: 14px;
  color: rgba(255,255,255,.92);
  background: rgba(0,0,0,.68);
  border-bottom: 1px solid rgba(212,175,55,.25);
  z-index: 3;
}

.smn-art{
  position: relative;
  display:block;
  width: 100%;
  aspect-ratio: 2 / 3;
  z-index: 2;
}

.smn-art img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}

/* Dark edge shadow (vignette). Hover → clear */
.smn-art::after{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  background:
    radial-gradient(closest-side, rgba(0,0,0,0) 55%, rgba(0,0,0,.55) 100%),
    linear-gradient(0deg, rgba(0,0,0,.25), rgba(0,0,0,0) 35%);
  opacity: .75;
  transition: opacity .25s ease;
  z-index: 2;
}

.smn-frame:hover .smn-art::after{
  opacity: .05;
}
