/*
 * Please place your own CSS code to this file
 *
 */
.footer-1 {
    background: #252525;
}
#edit-submit-search {
    width: 60px;
    height: auto;
    margin-left: 5px;
}
.node--type-project .field--name-body {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eeeeee;
}
.node--type-project .field--name-body p {
    margin-bottom: .85714286em;
}  
.ggc h2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    font-weight: 700;
    margin: .2rem 0 1.1rem 0;
    font-size: 88%;
}
.view-header {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgb(238, 238, 238);
}
.image-style-gginin {
    border-radius: .25rem;
}
.gve {
    margin: 20px 0;
}

.imgcover {
    width: 100%;
}
.imgcover .imgbox {
    position: relative;
    display: inline-block;
    font-size: 0;
}
.imgbox {
    overflow: hidden;
}
.imgcover .sti {
    position: absolute;
    bottom: 4%;
    right: 4%;
    box-sizing: border-box;
    padding: 0 0.4em;
    line-height: initial;
    font-size: 1rem;
    color: #fff;
    font-weight: 700;
    background-color: #dc3545;
    border-radius: 6px;
    overflow: hidden;
}
.imgcover .stk {
    position: absolute;
    bottom: 4%;
    left: 4%;
    box-sizing: border-box;
    padding: 0 0.4em;
    line-height: initial;
    font-size: 1rem;
    color: #fff;
    font-weight: 700;
    background-color: #dc3545;
    border-radius: 6px;
    overflow: hidden;
}
.imgbox img {
    transition: transform .8s ease;
    border-radius: 6px;
}

/* 外層容器：直接用 aspect-ratio 維持比例 */
.video-player-wrapper {
  width: 100%;
  aspect-ratio: 16 / 9; /* 瀏覽器自動計算高度 */
  background: #000;     /* 沒影片時避免透明 */
}

/* 內層容器：讓 FluidPlayer 填滿 */
.video-player-inner {
  width: 100%;
  height: 100%;
}

/* 強制 FluidPlayer wrapper 充滿容器 */
.fluid_video_wrapper {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
}

/* 當前來源高亮 */
.m3u8-block.active {
  font-weight: bold;
  color: #ff5722;
}


.imgbox img {
  /* 讓圖片填滿容器 */
  width: 100%;
  height: 100%;
  /* 確保圖片不被閃光條遮擋 */
  display: block;
}

.imgbox::before {
  /* 建立閃光條偽元素 */
  content: '';
  /* 絕對定位 */
  position: absolute;
  top: 0;
  left: -75%;
  /* 閃光條的寬度和高度，寬度通常是容器寬度的2倍，以確保覆蓋整個圖片 */
  width: 50%;
  height: 100%;
  /* 背景為線性漸變 */
  background: rgba(255, 255, 255, 0.2);
  /* 閃光條的斜度 */
  transform: skewX(-45deg);
  /* 平滑過渡效果 */
  transition: all 0.5s cubic-bezier(0.2, 0.8, 0.2, 1.2);
}

/* 滑鼠滑過時的樣式 */
.imgbox:hover::before {
  /* 將閃光條移動到右側 */
  left: 125%;
}