/* CMS 附加樣式：分頁、輪播、查詢表格、頁尾署名等（沿用 styles.css 的品牌變數） */

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* 待核實標記：前台以一般文字顯示 */
mark.verify { background: none; color: inherit; padding: 0; }

/* 管理員預覽提示 */
.preview-bar {
  position: sticky; top: 0; z-index: 200; background: var(--ink); color: var(--yellow);
  font-size: .85rem; padding: .5rem 1rem; text-align: center;
}
.preview-bar a { color: #fff; text-decoration: underline; margin-left: .5rem; }

/* 語言切換 */
.nav a.lang-switch { border: 1px solid var(--line); border-radius: var(--radius); margin-left: .25rem; }

/* 首頁輪播 */
.hero-slider { display: grid; }
.hero-slider::after { display: none; }
.hero-slider .hero-slide {
  grid-area: 1 / 1; position: relative; display: grid; align-items: end; isolation: isolate;
  min-height: min(92vh, 760px); opacity: 0; visibility: hidden; transition: opacity .8s var(--ease), visibility .8s;
}
.hero-slider .hero-slide.is-active { opacity: 1; visibility: visible; }
.hero-slider .hero-slide::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, rgba(26, 26, 26, 0.25) 0%, rgba(26, 26, 26, 0.55) 45%, rgba(26, 26, 26, 0.82) 100%),
    linear-gradient(90deg, rgba(26, 26, 26, 0.55), transparent 55%);
}
.hero-slider .hero-media picture, .hero-media picture img { width: 100%; height: 100%; }
.hero-dots {
  position: absolute; left: 50%; bottom: 1.1rem; transform: translateX(-50%);
  display: flex; gap: .5rem; z-index: 3;
}
.hero-dot {
  width: 12px; height: 12px; border-radius: 50%; background: rgba(255, 255, 255, .45);
  border: 2px solid rgba(255, 255, 255, .8); padding: 0;
}
.hero-dot.is-active { background: var(--yellow); border-color: var(--yellow); }

/* 分頁 */
.pagination {
  display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; margin: 2.5rem 0 0;
}
.pagination .page-link {
  min-width: 42px; height: 42px; padding: 0 .8rem; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); background: var(--white); border-radius: var(--radius);
  font-family: var(--font-display); font-weight: 600; color: var(--ink-soft);
  transition: background .2s var(--ease), color .2s var(--ease);
}
.pagination a.page-link:hover { background: var(--yellow); color: var(--ink); }
.pagination .page-link.is-current { background: var(--ink); color: var(--yellow); border-color: var(--ink); }
.pagination .page-gap { align-self: center; color: var(--muted); padding: 0 .25rem; }

/* 相關文章 */
.related-posts { margin: 3rem 0 1rem; padding-top: 2rem; border-top: 2px solid var(--line); }
.related-posts h2 { font-family: var(--font-display); margin: 0 0 1.25rem; }

/* 查詢表格 */
.contact-form {
  background: var(--white); border-top: 4px solid var(--yellow); box-shadow: var(--shadow);
  padding: 1.75rem; border-radius: var(--radius); margin: 1.5rem 0;
}
.contact-form-title { font-family: var(--font-display); margin: 0 0 .25rem; font-size: 1.35rem; }
.contact-form-note, .form-privacy { color: var(--muted); font-size: .9rem; margin: 0 0 1rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.form-grid label { display: flex; flex-direction: column; gap: .35rem; font-weight: 500; font-size: .92rem; }
.form-grid label.full { grid-column: 1 / -1; }
.form-grid input, .form-grid select, .form-grid textarea {
  font: inherit; padding: .7rem .8rem; border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--paper); color: var(--ink); width: 100%;
}
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus {
  outline: 2px solid var(--yellow); border-color: var(--yellow-deep); background: var(--white);
}
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-result { margin-top: 1rem; font-weight: 600; }
.form-result.is-ok { color: #1f7a3a; }
.form-result.is-error { color: var(--red); }
.contact-form button[disabled] { opacity: .6; cursor: wait; }
@media (max-width: 640px) {
  .form-grid { grid-template-columns: 1fr; }
  .contact-form { padding: 1.25rem; }
}

/* 頁尾署名：網頁設計 由 EC Shop City 提供 */
.site-credit {
  display: flex; justify-content: center; padding-top: 1rem; margin-top: 1rem;
  border-top: 1px dashed rgba(255, 255, 255, 0.08);
}
.site-credit-inner {
  font-size: .72rem; letter-spacing: .06em; color: rgba(255, 255, 255, 0.42);
  display: inline-flex; align-items: center; gap: .3rem;
}
.site-credit a { color: rgba(255, 255, 255, 0.55); transition: color .2s var(--ease); }
.site-credit a:hover { color: var(--yellow); }
.site-credit .credit-brand {
  font-family: var(--font-display); font-weight: 600; letter-spacing: .08em;
  background: linear-gradient(90deg, var(--yellow), #ffe766); -webkit-background-clip: text; background-clip: text;
  color: transparent; padding: 0 .1rem;
}
.site-credit .credit-brand:hover { color: var(--yellow); -webkit-text-fill-color: currentColor; }