/** Shopify CDN: Minification failed

Line 26:18 Unexpected "{"
Line 26:27 Expected ":"
Line 30:18 Unexpected "{"
Line 30:27 Expected ":"
Line 125:18 Unexpected "{"
Line 125:27 Expected ":"
Line 125:33 Unexpected "{"
Line 131:20 Unexpected "{"
Line 131:29 Expected ":"
Line 169:20 Unexpected "{"
... and 7 more hidden warnings

**/
  .video-section {
    position: relative;
    text-align: center;
  }

  /* 视频包裹容器 */
  .video-wrapper {
    position: relative;
  }

  #section-width-{{ section.id }} .title-wrapper {
    margin: 20px;
  }

  #section-width-{{ section.id }} .title {
    /* font-size 由 Liquid 动态控制 */
    line-height: var(--line-height-tight);
  }

  .video-section__media {
    position: relative;
    width: 100%;
    height: 421px; /* 固定高度 */
    overflow: hidden;
    display: none; /* 默认隐藏 */
    opacity: 0; /* 默认透明 */
    transition: opacity 0.5s ease; /* 淡入淡出过渡效果 */
  }

  .video-section__media.active {
    display: block; /* 激活时显示 */
    opacity: 1; /* 激活时完全可见 */
  }

  /* 视频样式 */
  .video-section__media video {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 确保视频填充容器 */
    display: block;
    border-radius: 15px;
  }

  /* 胶囊式Toggle开关容器 */
  .video-toggle-container {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
  }

  /* Toggle开关外壳 */
  .video-toggle-switch {
    display: inline-flex !important;
    align-items: center;
    background: #505050 !important;
    border-radius: 50px;
    padding: 5px;
    position: relative;
  }

  /* Toggle选项按钮 */
  .video-toggle-switch .toggle-option {
    position: relative;
    z-index: 2;
    padding: 12px 28px;
    /* font-size 由 Liquid 动态控制 */
    /* font-weight 由 Liquid 动态控制 */
    color: #fff !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer;
    transition: color 0.3s ease;
    white-space: nowrap;
    letter-spacing: 0.5px;
    margin: 0;
    outline: none;
  }

  .video-toggle-switch .toggle-option:hover {
    color: #fff !important;
  }

  .video-toggle-switch .toggle-option.active {
    color: #1a1a1a !important;
  }

  /* 滑动背景块 */
  .video-toggle-switch .toggle-slider {
    position: absolute !important;
    top: 5px;
    left: 5px;
    height: calc(100% - 10px);
    width: calc(50% - 5px);
    background: #fff !important;
    border-radius: 45px;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    display: block !important;
    pointer-events: none;
  }

  /* 当第二个按钮激活时，滑块移动到右边 */
  .video-toggle-switch.right .toggle-slider {
    transform: translateX(100%);
  }

  #section-width-{{ section.id }}{
    max-width:1320px;
    width:100%;
  }

  @media screen and (min-width: 750px) and (max-width: 1200px) {
    #section-width-{{ section.id }}  .title , .ct-title{
        /* font-size 由 Liquid 动态控制 */
      }


  }
  /* 移动端样式 */
  @media (max-width: 749px) {
    .video-section__media {
      height: 150px; /* 移动端高度减小 */
    }

    .title {
      /* font-size 由 Liquid 动态控制 */
    }

    /* 移动端：视频包裹容器改为垂直布局 */
    .video-wrapper {
      display: flex;
      flex-direction: column;
      gap: 15px;
    }

    /* 移动端Toggle开关样式 - 移到视频下方 */
    .video-toggle-container {
      position: relative;
      bottom: auto;
      left: auto;
      transform: none;
      display: flex;
      justify-content: center;
    }

    .toggle-option {
      padding: 8px 16px;
      /* font-size 由 Liquid 动态控制 */
    }

    #section-width-{{ section.id }}{
    max-width:1320px;
    width:100%;
    padding: 0 15px;
  }

   #section-width-{{ section.id }} .title-wrapper {
    margin: 30px 0 20px 0;
  }
  }

     .video-section__media {
     position: relative;
   }

   .video-progress-bar {
     width: 100%;
     height: 5px;
     background-color: #e0e0e0;
     position: absolute;
     margin-top: 10px;
     bottom:0px;
   }

   .progress {
     height: 100%;
     width: 0;
     background-color: #ff3d33;
     transition: width 0.04s ease-out;
      display:block !important;
   }

   /* 隐藏非激活视频的进度条 */
   .video-section__media:not(.active) .video-progress-bar {
     display: none;
   }
  @media screen and (max-width: 750px) {
   .video-progress-bar{
     transition: auto;
     display:none !important;
   }

    .color-{{ section.settings.color_scheme }}{
      /* margin:0 -15px; */
    }
  }