/*
Theme Name: Astro Shell
Description: 极简 WordPress 主题,复用 Astro 前台的 header/footer 与同一份 CSS,让 WooCommerce 的购物车/结账/商品页和静态站看起来是同一个店。不改 Woo 的功能,只统一外壳。
Version: 1.0
Requires at least: 6.5
Tested up to: 7.1
Author: Cooblink
Text Domain: astro-shell
*/

/* ─────────────────────────────────────────────────────────────
   这里只做"桥接":把 WooCommerce 自己的表面映射到 Astro 的设计令牌。
   令牌本身来自 Astro 那份 CSS(functions.php 运行时 glob 加载),
   所以改设计只需要改 Astro,这里不用动。

   刻意不去逐个像素地重写 Woo 的组件 —— 那种东西每次 Woo 升级都会碎。
   目标是"不突兀",不是"像素级一致"。
   ───────────────────────────────────────────────────────────── */

body.woocommerce-page,
body.woocommerce {
  background: var(--color-bg, #fff);
  color: var(--color-text, #1a1a1a);
  font-family: var(--font-body, ui-sans-serif, system-ui, sans-serif);
}

.astro-shell-main {
  max-width: 80rem;          /* 与 Astro 的 max-w-7xl 对齐 */
  margin-inline: auto;
  padding: 3rem 1.5rem 4rem;
  min-height: 50vh;
}

.astro-shell-main h1,
.astro-shell-main h2,
.woocommerce-products-header__title {
  font-family: var(--font-display, Georgia, serif);
  font-weight: 400;
  letter-spacing: .01em;
  color: var(--color-text, #1a1a1a);
}

/* 按钮:统一成 Astro 的金色主按钮 */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-block-components-button,
.wp-block-button__link,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
  background: var(--color-gold, #b08d57) !important;
  color: #fff !important;
  border-radius: 0 !important;
  border: 1px solid var(--color-gold, #b08d57) !important;
  font-family: var(--font-body, inherit);
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .8125rem;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.wc-block-components-button:hover,
.wp-block-button__link:hover {
  background: var(--color-gold-dark, #8f6f3f) !important;
  border-color: var(--color-gold-dark, #8f6f3f) !important;
}

/* 表面与描边 */
.woocommerce table.shop_table,
.wc-block-components-panel,
.wc-block-components-totals-wrapper {
  border-color: var(--color-border, #e6e2da) !important;
  background: var(--color-surface, #fbfaf8);
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
  border-color: var(--color-border, #e6e2da) !important;
}

/* 输入框 */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.wc-block-components-text-input input {
  border-radius: 0 !important;
  border: 1px solid var(--color-border, #e6e2da) !important;
  background: var(--color-bg, #fff) !important;
  color: var(--color-text, #1a1a1a) !important;
}

/* Woo 的提示条 */
.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--color-gold, #b08d57) !important;
  background: var(--color-surface, #fbfaf8);
  color: var(--color-text, #1a1a1a);
}
.woocommerce-message::before,
.woocommerce-info::before { color: var(--color-gold, #b08d57) !important; }

/* Astro 的 header 是 sticky,给 WP 内容留出正确的起始位置 */
body.woocommerce-page #site-header,
body.woocommerce #site-header { position: sticky; top: 0; }

/* 区块版购物车的空态与推荐位:Woo 用的是 Gutenberg 的类名 */
.wc-block-cart__empty-cart__title,
.wp-block-heading {
  font-family: var(--font-display, Georgia, serif);
  font-weight: 400;
  color: var(--color-text, #1a1a1a);
}
.wc-block-grid__product-title,
.woocommerce-loop-product__title {
  font-family: var(--font-body, inherit);
  color: var(--color-text, #1a1a1a);
}