﻿/* ev-extra.css — B 站補充樣式（A 版型頁首/頁尾之外的調整）
   1. 頁首搜尋框（A 站沒有，B 保留）
   2. 沒有橫幅的頁面，預留導覽列高度
   3. 產品系列輪播（以原生 JS 取代 Owl Carousel 的排版） */

/* 1. 搜尋框 ------------------------------------------------------------- */
#ev-header .ev-search-item { display: flex; align-items: center; padding: .9rem 20px; }
#ev-header .ev-search { display: flex; align-items: center; border-bottom: 1px solid rgba(0, 0, 0, .35); }
#ev-header .ev-search input { border: 0; background: transparent; outline: 0; width: 110px; font-size: 14px; color: #000; padding: 2px 4px; }
#ev-header .ev-search input::placeholder { color: rgba(0, 0, 0, .45); }
#ev-header .ev-search-btn { color: #000; font-size: 14px; padding: 0 4px; line-height: 1; }
#ev-header .ev-search-btn:hover { color: #96bb7c; }
@media (max-width: 991.98px) {
  #ev-header .ev-search-item { padding: .9rem 0; }
  #ev-header .ev-search input { width: 100%; }
}

/* 2. 內頁沒有橫幅時，補上導覽列的高度（導覽列在桌機是絕對定位） */
@media (min-width: 992px) {
  #defaultimg:empty { display: block; height: 123px; }
}

/* 3. 產品系列輪播 -------------------------------------------------------- */
#ev-main .ev-carousel { position: relative; overflow: hidden; }
#ev-main .ev-carousel .ev-track { display: flex; will-change: transform; }
#ev-main .ev-carousel .item { flex: 0 0 auto; padding: 0 15px; box-sizing: border-box; opacity: .4; transition: opacity .3s ease; }
#ev-main .ev-carousel .item.is-active { opacity: 1; }
#ev-main .ev-carousel.is-dragging .ev-track { transition: none; }
#ev-main .ev-carousel .ev-track { transition: transform .35s ease; }
#ev-main .ev-carousel .ev-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .9); box-shadow: 0 0 10px rgba(0, 0, 0, .1); color: #96bb7c; font-size: 18px; cursor: pointer; }
#ev-main .ev-carousel .ev-prev { left: 0; }
#ev-main .ev-carousel .ev-next { right: 0; }
#ev-main .ev-carousel .ev-nav:hover { background: #96bb7c; color: #fff; }

/* ====== 4. 內頁（A 版型）補充 ========================================== */

/* 4-1 後台編輯的內文：圖片、表格不要撐破版面 */
#ev-main .ev-article,
#ev-main .ev-summary { line-height: 1.9; color: #4d4d4d; font-size: 16px; word-wrap: break-word; }
#ev-main .ev-article p,
#ev-main .ev-summary p { margin-bottom: 1em; }
#ev-main .ev-article img,
#ev-main .ev-summary img,
#ev-main .ev-article figure,
#ev-main .ev-summary figure { max-width: 100%; height: auto; }
#ev-main .ev-article figure { margin: 0 0 1em; }
#ev-main .ev-article table { max-width: 100%; border-collapse: collapse; }
#ev-main .ev-article table td,
#ev-main .ev-article table th { padding: 6px 10px; border: 1px solid #e6e6e6; }
#ev-main .ev-article iframe { max-width: 100%; }
#ev-main .meta-date { color: #96bb7c; font-size: 14px; letter-spacing: 1px; margin-bottom: 1.5em; }

/* 4-2 分類下拉 */
#ev-main .form-select select {
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  min-width: 240px; max-width: 100%; padding: 10px 40px 10px 16px;
  border: 1px solid #ddd; border-radius: 3px; background: #fff; color: #1a1a1a;
  font-size: 16px; line-height: 1.4; cursor: pointer;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%2396bb7c' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; background-size: 12px 8px;
}
#ev-main .form-select select:focus { outline: 0; border-color: #96bb7c; }

/* 4-3 大類卡（案例類別）：標題與分類連結 */
#ev-main .staff .text h3 a { color: inherit; }
#ev-main .staff:hover .text h3 a { color: #96bb7c; }
#ev-main .staff .text .position a { color: #96bb7c; font-size: 15px; letter-spacing: 0; text-transform: none; }
#ev-main .staff .text .position a:hover { color: #1a1a1a; }

/* 4-4 品牌卡（產品系列） */
#ev-main .block-7 .img { background-size: contain; background-repeat: no-repeat; background-position: center; margin: 0 auto; }
#ev-main .block-7 .pricing-text li a { color: #1a1a1a; }
#ev-main .block-7 .pricing-text li a:hover { color: #96bb7c; }
/* ev-extra.css 比 ev-home.scoped.css 早載入，選擇器要比 :is(...) .block-7 .price .number 更精確才蓋得過去 */
#ev-main .block-7 .price .number.number { font-size: 20px; color: #96bb7c; }

/* 4-5 應用分類方格 */
#ev-main .block-6.services .icon img { max-width: 100%; height: auto; }
#ev-main .block-6.services a { display: block; color: inherit; }

/* 4-6 列表卡片標題（型錄名稱較長，縮小一點） */
#ev-main .blog-entry .text h3.heading { font-size: 16px; line-height: 1.5; }

/* 4-6b 後台的橫幅圖是 1920x350 的長條，放進 A 版型 600px 高的大圖會裁掉太多，
        螢幕越窄裁得越兇，所以窄螢幕把高度降下來 */
@media (max-width: 991.98px) {
  #ev-main .hero-wrap.hero-wrap-2,
  #ev-main .hero-wrap.hero-wrap-2 .overlay,
  #ev-main .hero-wrap.hero-wrap-2 .slider-text { height: 420px !important; }
}
@media (max-width: 767.98px) {
  #ev-main .hero-wrap.hero-wrap-2,
  #ev-main .hero-wrap.hero-wrap-2 .overlay,
  #ev-main .hero-wrap.hero-wrap-2 .slider-text { height: 320px !important; }
  #ev-main .slider-text h1.bread { font-size: 34px; }
}

/* 4-7 聯絡我們 */
#ev-main .ev-offices { margin-top: 2em; }
#ev-main .ev-offices h2 { font-size: 22px; margin-bottom: 20px; }
#ev-main .ev-offices ul { padding: 0; margin: 0 0 2em; list-style: none; }
#ev-main .ev-offices li { margin-bottom: 14px; color: #4d4d4d; }
#ev-main .ev-offices li a { color: #4d4d4d; }
#ev-main .ev-offices li a:hover { color: #96bb7c; }
#ev-main .ev-offices .icon { color: #96bb7c; font-size: 18px; }
#ev-main .ev-map iframe { width: 100%; height: 450px; border: 0; display: block; }
#ev-main .ev-form label { display: block; margin-bottom: 6px; color: #1a1a1a; font-weight: 600; }
#ev-main .ev-form .form-control {
  display: block; width: 100%; padding: 10px 14px; border: 1px solid #ddd; border-radius: 3px;
  background: #fff; color: #1a1a1a; font-size: 15px; line-height: 1.5;
}
#ev-main .ev-form .form-control:focus { border-color: #96bb7c; box-shadow: none; }
#ev-main .ev-form .form-group { margin-bottom: 20px; }
#ev-main .ev-form .ev-valid img { vertical-align: middle; margin-right: 10px; }
#ev-main .ev-form .ev-valid .form-control { display: inline-block; width: 8em; vertical-align: middle; }
#ev-main .ev-form .custom-btn { display: inline-block; cursor: pointer; }
