/*
Theme Name: Twenty Twenty-Five Child
Theme URI: https://zhiwo.com
Description: 知我星球定制子主題，基於 Twenty Twenty-Five
Author: 知我星球
Author URI: https://zhiwo.com
Template: twentytwentyfive
Version: 0.1.9
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive-child
*/

/*
 * 注意：块主题的样式主要通过 theme.json 控制
 * 这个文件用于：
 * 1. 子主题声明（必需）
 * 2. theme.json 无法实现的特殊样式（尽量少用）
 */

/* ==========================================================================
   Header Styles
   ========================================================================== */

/* Header sticky with shadow on scroll */
.site-header {
  z-index: 1000;
  transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

.site-header.scrolled {
  box-shadow: 0 2px 8px color-mix(in srgb, var(--wp--preset--color--black) 6%, transparent);
}

/* Logo and brand styling */
.site-logo-image img {
  border-radius: 8px;
}

.site-brand-name a {
  text-decoration: none;
}

.site-brand-name a:hover {
  color: var(--wp--preset--color--primary) !important;
}

/* Navigation link hover effects */
.main-navigation .wp-block-navigation-item a {
  transition: color 0.2s ease;
}

.main-navigation .wp-block-navigation-item a:hover {
  color: var(--wp--preset--color--primary) !important;
}

/* CTA Button hover effects */
.line-button .wp-block-button__link {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.line-button .wp-block-button__link:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 20px color-mix(in srgb, var(--wp--preset--color--line-green) 40%, transparent);
}

.cta-button .wp-block-button__link {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cta-button .wp-block-button__link:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 20px color-mix(in srgb, var(--wp--preset--color--primary) 30%, transparent);
}

/* ==========================================================================
   Responsive Header
   ========================================================================== */

/*
 * 覆蓋 WordPress 導航塊的響應式斷點
 * 預設是 600px，我們改為 1200px
 * 這樣平板端也會顯示漢堡菜單
 */

/* 1200px 以下：強制顯示漢堡菜單按鈕 */
@media (max-width: 1200px) {
  /* 顯示漢堡菜單按鈕 */
  .main-navigation .wp-block-navigation__responsive-container-open {
    display: flex !important;
  }

  /* 隱藏桌面端導航連結 */
  .main-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }

  /* 隱藏 header CTA 按鈕 */
  .header-cta-buttons {
    display: none;
  }
}

/* 1200px 以上：顯示桌面導航，隱藏漢堡按鈕 */
@media (min-width: 1200px) {
  .main-navigation .wp-block-navigation__responsive-container-open {
    display: none !important;
  }

  .main-navigation .wp-block-navigation__responsive-container {
    display: flex !important;
  }

  /* 桌面端隱藏移動端專用的 CTA 鏈接（因為有獨立的按鈕） */
  .main-navigation .mobile-only-cta {
    display: none !important;
  }
}

/* Mobile adjustments */
@media (max-width: 782px) {
  .site-header {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .site-brand-name {
    font-size: 18px !important;
  }
}

/* ==========================================================================
   Footer Styles
   ========================================================================== */

/* Footer links */
.site-footer .footer-nav-links .wp-block-navigation-item__content {
  display: block;
  color: var(--wp--preset--color--foreground-muted);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.6;
  transition: color 0.2s ease;
}

.site-footer .footer-nav-links .wp-block-navigation-item__content:hover {
  color: var(--wp--preset--color--foreground-light);
}

.site-footer .footer-nav-links .current-menu-item > .wp-block-navigation-item__content,
.site-footer .footer-nav-links .current-menu-ancestor > .wp-block-navigation-item__content,
.site-footer .footer-nav-links .wp-block-navigation-item__content[aria-current="page"] {
  color: var(--wp--preset--color--primary);
}

/* Footer legal links */
.footer-legal-link {
  color: var(--wp--preset--color--foreground-muted) !important;
  text-decoration: none;
  font-size: 13px;
  transition: color 0.2s ease;
}

.footer-legal-link:hover {
  color: var(--wp--preset--color--foreground-light) !important;
}

/* Footer social icons */
.footer-social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background-color: var(--wp--preset--color--gray-100);
  color: var(--wp--preset--color--gray-500);
  transition: all 0.2s ease;
  text-decoration: none !important;
}

.footer-social-link:hover {
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
  text-decoration: none !important;
}

.footer-social-link:focus {
  text-decoration: none !important;
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
}

.footer-social-link--line:hover {
  background-color: var(--wp--preset--color--line-green);
}

/* Footer disclaimer - subtle style */
.footer-disclaimer {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  opacity: 0.7;
}

/* ==========================================================================
   Footer Responsive
   ========================================================================== */

/* Tablet */
@media (max-width: 1200px) {
  .footer-columns {
    flex-wrap: wrap;
  }

  .footer-brand-col {
    flex-basis: 100% !important;
    margin-bottom: var(--wp--preset--spacing--40);
  }

  .footer-nav-col {
    flex-basis: 33.33% !important;
  }
}

/* Mobile */
@media (max-width: 782px) {
  .footer-main {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  .footer-columns {
    gap: var(--wp--preset--spacing--40) !important;
  }

  .footer-brand-col {
    text-align: center;
  }

  .footer-brand-col .wp-block-group {
    align-items: center;
  }

  .footer-nav-col {
    flex-basis: 50% !important;
  }

  .footer-bottom {
    flex-direction: column;
    gap: var(--wp--preset--spacing--20);
    text-align: center;
  }

  .footer-legal {
    justify-content: center;
  }

  .footer-disclaimer {
    font-size: 11px !important;
    padding: 0 16px;
  }

  .footer-social {
    justify-content: center;
  }
}

/* Small mobile */
@media (max-width: 600px) {
  .footer-nav-col {
    flex-basis: 100% !important;
    text-align: center;
  }

  .footer-nav-col .wp-block-group {
    align-items: center;
  }
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */

/* Hide on mobile (< 600px) */
@media (max-width: 600px) {
  .hide-on-mobile {
    display: none !important;
  }
}

/* Hero trust badges - compact on mobile */
@media (max-width: 782px) {
  .hero-trust-badges .trust-badge p {
    font-size: 11px;
    white-space: nowrap;
  }

  .hero-trust-badges .trust-icon {
    width: 14px;
    height: 14px;
  }

  .hero-trust-badges .trust-badge {
    gap: 4px !important;
  }
}

/* ==========================================================================
   Touch Target Accessibility (WCAG 2.5.8 - minimum 44x44px)
   Only targets child-theme-controlled elements.
   Uses padding/min-height to enlarge tap area without changing visual size.
   ========================================================================== */

/* --- Header logo link --- */
.site-header .site-logo-link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* --- Footer logo link --- */
.footer-logo {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* --- Footer social icons (40x40 -> 44x44) --- */
.footer-social-link {
  min-width: 44px;
  min-height: 44px;
}

/* --- Footer navigation links (56x22 -> 56x44) --- */
.site-footer .footer-nav-links .wp-block-navigation-item__content {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* --- Footer legal links (52x21 -> min 44px height) --- */
.footer-legal-link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* --- FAQ "查看更多常見問題" link --- */
a[href="/faq/"] {
  display: inline-block;
  min-height: 44px;
  line-height: 44px;
}

/* --- Blog card title links --- */
.blog-card-title a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* --- Blog "查看所有博客文章" link --- */
.blog-view-all-link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* --- Header navigation links (touch target) --- */
.site-header .wp-block-navigation-item__content {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}