/* ============================================================
   patch.css - 仅覆盖 WP/Woo 侵入 + 弹窗/交互组件补充样式
   禁止重建源站样式; 源站样式唯一真源 = manypets-inline.css
   ============================================================ */

/* ---------- 1. WP/Woo 侵入覆盖 ---------- */
html { margin-top: 0 !important; }
body.admin-bar { margin-top: 0 !important; }
#wpadminbar { display: none !important; }
body { margin: 0; }
.wp-caption, .alignnone, .aligncenter { margin: 0; }
/* Woo 壳对齐 (Woo 内部表单页面如无镜像 HTML 时) */
.woocommerce .woocommerce-breadcrumb { display: none; }
.woocommerce form .form-row label { font-weight: 400; }
/* 隐藏 WP/Woo 注入到镜像页面的残留 (防御) */
.mp-page-source { display: none; }

/* ---------- 2. details 手风琴展开 (Vue 移除后原生 details 驱动) ---------- */
/* D-BEH-6 (T5 r=5): 收起坍缩修复 —
   ① 移除 content-visibility: visible !important (此前强制可见, 覆盖镜像 CSS 的 hidden
      与 main.js 内联 hidden, 致收起态 content-visibility 无法切换);
   ② 补 transition-behavior: allow-discrete (与目标站镜像 CSS 一致, content-visibility 可参与过渡);
   ③ [style*=0fr] 兜底: JS 内联 grid-template-rows:0fr 时强制 content-visibility:hidden
      (不依赖 JS 内联 hidden 的优先级竞争);
   ④ .m-collapse__content 直接子元素与 .m-collapse__body 补 min-height:0
      (grid item 最小尺寸显式归零, 配合 overflow:hidden 双保险, 使 0fr 轨道按 0px 解析);
   ⑤ details[open] 分支补 content-visibility:visible (无 JS 场景原生 details 展开内容可显示). */
.m-collapse[data-v-7c8f2767] { display: block; }
.m-collapse__content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s, content-visibility 0.3s;
  transition-behavior: allow-discrete;
}
.m-collapse__content[style*="grid-template-rows: 0fr"] { content-visibility: hidden; }
details.m-collapse[open] .m-collapse__content,
.m-collapse--open .m-collapse__content { grid-template-rows: 1fr; content-visibility: visible; }
.m-collapse__content > * { min-height: 0; }
.m-collapse__body { overflow: hidden; min-height: 0; }
.m-collapse__trigger.is-open .feather-chevron-down { transform: rotate(180deg); }
.m-collapse__trigger .feather-chevron-down { transition: transform 0.3s; }
.m-collapse__header::-webkit-details-marker { display: none; }

/* ---------- 3. 桌面导航下拉面板 (F9, 捕获档未渲染, 由 main.js 构建) ---------- */
.mp-desktop-dropdown {
  position: absolute;
  z-index: 1000;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(28, 43, 38, 0.16);
  padding: 16px 0;
  min-width: 240px;
}
.mp-desktop-dropdown__list { list-style: none; margin: 0; padding: 0; }
.mp-desktop-dropdown__link {
  display: block;
  padding: 10px 20px;
  color: #1c2b26;
  text-decoration: none;
  font-size: 15px;
  line-height: 1.4;
}
.mp-desktop-dropdown__link:hover { background: #f8f5f0; color: #355a48; }

/* ---------- 4. 移动导航打开态 (F9) ---------- */
.m-mobile-nav--open .m-mobile-nav__nav { transform: translateX(0); }
.m-mobile-nav--open .m-mobile-nav__overlay { opacity: 1; pointer-events: auto; }
body.no-scroll { overflow: hidden; }

/* ---------- 5. Cookiebot Consent 复刻 (H-1) ----------
   (rework_round=6) 已移除: 旧自研 .mp-cookiebot 简版弹窗样式.
   新复刻结构=#CybotCookiebotDialog (档 home__popup-consent.html), 样式=assets/cookiebot-consent.css
   (目标站 Cookiebot 运行时注入样式 token 替换 manypets 配置色), 由 popups.js 按需注入. */

/* ---------- 6. 升级推荐浮层 (H-2) ---------- */
.mp-upgrade { position: fixed; inset: 0; z-index: 2147483002; font-family: "MP-Euclid Flex", Arial, sans-serif; }
.mp-upgrade__overlay { position: absolute; inset: 0; background: rgba(28, 43, 38, 0.55); }
.mp-upgrade__dialog {
  position: relative;
  margin: 12vh auto 0;
  background: #fff;
  border-radius: 12px;
  max-width: 520px;
  padding: 32px;
  box-shadow: 0 16px 48px rgba(0,0,0,0.25);
}
.mp-upgrade__title { font-size: 24px; margin: 0 0 12px; color: #1c2b26; }
.mp-upgrade__body { font-size: 16px; line-height: 1.6; color: #4a5a52; margin: 0 0 22px; }
.mp-upgrade__actions { display: flex; flex-direction: column; gap: 10px; }
.mp-upgrade__btn { border-radius: 8px; padding: 14px 20px; font-size: 16px; font-weight: 500; cursor: pointer; border: 1px solid #355a48; background: #fff; color: #355a48; }
.mp-upgrade__btn--primary { background: #355a48; color: #fff; }

/* ---------- 7. 报价向导补充组件 (F13/F11/F1, 依 spec 4.1 构建) ---------- */
.mp-excess-wrap { padding: 8px 0; }
.mp-excess-value { font-size: 22px; font-weight: 600; color: #1c2b26; margin: 6px 0; }
.mp-excess-range { width: 100%; accent-color: #355a48; }
.mp-excess-levels { display: flex; justify-content: space-between; font-size: 13px; color: #6b7a72; margin-top: 4px; }
.mp-copay-group { display: flex; flex-direction: column; gap: 8px; padding: 8px 0; }
.mp-copay-group .m-radio-input { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.mp-moneyback-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 10px 0; }
.mp-moneyback-info { flex: 1; min-width: 200px; }
.mp-ipid-link { margin-left: auto; }
.mp-breed-suggestions {
  list-style: none;
  margin: 4px 0 0;
  padding: 6px 0;
  background: #fff;
  border: 1px solid #e2ddd5;
  border-radius: 8px;
  max-height: 240px;
  overflow: auto;
  box-shadow: 0 6px 18px rgba(28,43,38,0.12);
}
.mp-breed-suggestion { padding: 9px 16px; cursor: pointer; font-size: 15px; }
.mp-breed-suggestion:hover { background: #f8f5f0; }
/* B.1-D3 (T5 r=6): 向导校验提示对齐目标站 m-validation-message 体系 (目标站实测 rgb(215,15,15) 14px/400) */
.mp-field-error { color: #d70f0f; font-size: 14px; margin-top: 4px; }
.mp-order-confirmation { margin: 20px 0; }
.mp-order-confirmation .m-card { background: #fff; border-radius: 10px; padding: 8px; }
.mp-order-confirmation p { font-size: 15px; line-height: 1.6; }

/* ---------- 8. lazy-zendesk Help 按钮 (第三方剥离, 保留静态入口) ---------- */
.lazy-zendesk__button { cursor: pointer; }

/* ---------- 9. D-IMG-1: header Logo 容器宽度覆盖 (目标站最终生效 134.85px, desktop 1440 容器 135x29) ----------
   镜像 CSS 仅提取到 `.m-site-header__logo{width:150px}` 单条规则, 目标站存在更后/更高优先级覆盖规则
   使最终生效 width≈134.85px (K-1 差异根因). 此规则加载于镜像 CSS 之后, 同优先级后者生效. */
.m-site-header__logo { width: 134.85px; }

/* ---------- 10. D-FID-3: hero Trustpilot 评分条静态化 (脚本剥离后静态填充) ---------- */
.mp-tp-static {
  display: flex;
  align-items: center;
  gap: 2px 8px;
  color: #ffffff;
  font-size: 13px;
  line-height: 1;
  flex-wrap: wrap;
  white-space: nowrap;
}
.mp-tp-static .mp-tp-stars { display: inline-flex; gap: 2px; color: #00b67a; }
.mp-tp-static .mp-tp-star { display: block; width: 22px; height: 22px; }
@media (min-width: 768px) { .mp-tp-static .mp-tp-star { width: 18px; height: 18px; } }
.mp-tp-static .mp-tp-excellent { font-weight: 700; }
.mp-tp-static .mp-tp-score { font-weight: 700; }
.mp-tp-static .mp-tp-reviews { opacity: 0.9; }
.mp-tp-static .mp-tp-logo { height: 16px; width: auto; display: inline-block; }
/* T-3 (D-032): MICRO_COMBO 为 a 链接 (原站 a[target=_blank], 无 rel) — 去下划线/继承色 */
a.mp-tp-static { text-decoration: none; color: inherit; }
/* 向导 loading 内 MICRO_COMBO (浅色背景 --skin-background-mid=#F8F5F2): 深色文字 (light 主题) */
#mp-loading .mp-tp-static { color: #001e1d; font-size: 13px; }
#mp-loading .mp-tp-static .mp-tp-logo { height: 13px; }

/* ---------- S-4 (D-032): trustpilot iframe 样式泄漏修复 ----------
   镜像 CSS 提取时 (B-1) 将 iframe-full 档 (widget.trustpilot.com 内部文档) 的 <style> 并入,
   其中无 scoped 全局规则 a{color:#191919;text-decoration:none} (位置晚于源站 a 默认规则) 覆盖全站
   a 链接色与下划线. 恢复源站 a 默认语义: color 由皮肤变量继承 (深色皮肤 --color-link-resting-light=#fff,
   浅色皮肤 --color-link-resting-dark=#3e6a55), text-decoration:underline (脚注/正文链接与目标站一致). */
a { color: var(--skin-link-color); text-decoration: underline; }
/* S-4: 返回链接 (footnotes__return ↑ 图标, .m-button-icon 34x34) 深灰 #252727 (--color-grey-800) 18px underline */
.footnotes__return a.m-button-icon { color: var(--color-grey-800); text-decoration: underline; }
/* T5 r1 (R1, rework_round=1): 桌面 1440 hero 评分条内容左溢修复 —
   真源 (verification R1 实测): 目标站 iframe 内容在容器内右移, 1440 下全部视口内可见
   (Excellent x≈130 / 星星 x≈245-405 / "36,672 reviews on" x≈420-630 / TP logo x≈645-790);
   克隆站静态内容左对齐容器 (容器 x=-290.5), 内容从 x=-290.5 起溢出视口左侧
   (视口外隐藏 ≈266px, 相对目标站偏移 ≈420px, 条带区 pixelmatch diff 10.40%).
   修复: ≥1280px (容器 left:-395px → x=-290.5 的断点, 对应 1440 实测) 静态内容右移
   420px → 内容起点 x≈129.5, 与目标站 Excellent x≈130 对齐, 全部进入视口.
   375 断点 (容器 x=33, 两行, 与目标站 pixelmatch 0.0%) 不应用此偏移, 布局不回归. */
@media (min-width: 1280px) {
  .mp-tp-static { padding-left: 420px; }
}
/* T5 r1 (D-11-2): 恢复镜像 CSS 真源 hero MICRO_COMBO 容器规则
   (.trustpilot-widget[data-v-ec738799] = height 40px / ≥768px 20px + position:relative / ≥1024px
   left:-280px / ≥1280px left:-395px, overflow:hidden — 目标站 1440 定位 x=-290.5 左延伸条).
   旧覆盖 (left:0/height:auto/overflow:visible) 是为第三方 iframe 定位服务的, 静态化后误将
   评分条留在原位且高度撑开 (h=50 两行). 现恢复真源: 静态内容在 40px(移动, 两行) /
   20px(桌面, 单行) 容器内按 flex-wrap 自适应显示. */

/* ---------- 11. D-BEH-3: checkout Card 占位区字段样式 (Stripe 剥离为流程占位) ---------- */
.mp-card-section { padding: 16px 0 0; }
.mp-card-fields { display: flex; flex-direction: column; gap: 12px; padding: 12px 0; }
.mp-card-fields .m-form-group { display: flex; flex-direction: column; gap: 6px; flex: 1; }
.mp-card-fields input {
  width: 100%;
  border: 1px solid #c9cfc9;
  border-radius: 6px;
  padding: 10px 12px;
  font-size: 15px;
  font-family: "MP-Euclid Flex", Arial, sans-serif;
  background: #fff;
}
.mp-card-row { display: flex; gap: 12px; }
@media (max-width: 480px) { .mp-card-row { flex-direction: column; } }

/* ---------- 12. D-EXEC-1: Woo 结算页壳对齐 (cart/checkout/my-account/shop) ---------- */
.mp-woo-shell { font-family: "MP-Euclid Flex", Arial, sans-serif; color: #1c2b26; }
.mp-woo-shell .mp-woo-shell__container { max-width: 1280px; margin: 0 auto; padding: 32px 24px 64px; }
.mp-woo-shell h1, .mp-woo-shell h2 { color: #1c2b26; }
.mp-woo-shell a { color: #355a48; }
.mp-woo-shell .woocommerce .woocommerce-breadcrumb { display: none; }
.mp-woo-shell .woocommerce form .form-row label,
.mp-woo-shell .woocommerce table.shop_table th,
.mp-woo-shell .woocommerce table.shop_table td { font-weight: 400; }
.mp-woo-shell .woocommerce #respond input#submit,
.mp-woo-shell .woocommerce a.button,
.mp-woo-shell .woocommerce button.button,
.mp-woo-shell .woocommerce input.button,
.mp-woo-shell .woocommerce .button.alt {
  background: #355a48;
  color: #fff;
  border-radius: 8px;
  font-weight: 500;
}
.mp-woo-shell .woocommerce button.button:hover,
.mp-woo-shell .woocommerce .button.alt:hover { background: #2a483a; color: #fff; }
/* B.2-D1 (T5 r=6): Woo 结算输入框对齐克隆站设计语言 (向导输入框体系 6px 圆角 / 11px 16px padding / 深绿文字 #001e1d).
   提高特异性覆盖 Woo 原生 `.woocommerce form .form-row .input-text` (0,3,1, 于 wp_head 后加载) */
.mp-woo-shell .woocommerce form .form-row .input-text,
.mp-woo-shell .woocommerce form .form-row select,
.mp-woo-shell .woocommerce form .form-row textarea,
.mp-woo-shell .woocommerce input[type="text"],
.mp-woo-shell .woocommerce input[type="email"],
.mp-woo-shell .woocommerce input[type="tel"],
.mp-woo-shell .woocommerce input[type="password"],
.mp-woo-shell .woocommerce select,
.mp-woo-shell .woocommerce textarea,
.mp-woo-shell .woocommerce .select2-container--default .select2-selection--single {
  border: 1px solid #c9cfc9;
  border-radius: 6px;
  padding: 11px 16px;
  color: #001e1d;
  font-family: "MP-Euclid Flex", Arial, sans-serif;
}
.mp-woo-shell .woocommerce table.shop_table { border-color: #e2ddd5; }
.mp-woo-shell .woocommerce .checkout .col-2 { margin-top: 24px; }
.mp-woo-shell .woocommerce-checkout-review-order-table .order-total .amount { font-size: 20px; font-weight: 700; }

/* ---------- 13. D-FID-6: vets/refer 外部 iframe 剥离后静态占位 ---------- */
.mp-video-placeholder { background: #1c2b26; border-radius: 12px; padding: 28px 24px; color: #fff; }
.mp-video-placeholder__inner { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.mp-video-placeholder__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.16);
  font-size: 20px;
  color: #fff;
}
.mp-video-placeholder__title { font-size: 16px; font-weight: 600; margin: 0; }
.mp-video-placeholder a { color: #b9e2c8; }
.mp-woobox-placeholder, .mp-refer-placeholder {
  border: 1px dashed #c9cfc9;
  border-radius: 12px;
  padding: 24px;
  background: #f8f5f0;
}
.mp-woobox-placeholder__title, .mp-refer-placeholder__title { font-size: 18px; margin: 0 0 8px; color: #1c2b26; }
.mp-woobox-placeholder__body, .mp-refer-placeholder__body { font-size: 15px; line-height: 1.6; color: #4a5a52; margin: 0 0 8px; }

/* ============================================================
   T5 r2 (D-11-1-R1, 2026-08-29): body var() 体系等价恢复规则
   真源 = 目标站捕获档 home.html <style> (与镜像 manypets-inline.css :root/body 体系一致):
     body,html{font-size:var(--typography-paragraph-regular-font-size);line-height:var(--typography-paragraph-regular-line-height)}
     body{color:var(--skin-color);font-family:var(--typography-paragraph-font-family);...}
   排查: manypets-inline.css 结构正常 (括号 3381/3381 平衡, css-tree 解析 0 error,
   body,html 规则与 :root 变量均完整存在), 但浏览器 computed line-height=normal /
   font-family 回落系统字体, 属镜像 CSS 该部分规则在浏览器端未应用 (疑似大文件解析),
   故按委派 b) 分支在 patch.css (后加载, 可覆盖) 显式恢复等价声明。
   兜底 :root 变量值 = 镜像 manypets-inline.css :root 真源 (16px / 1.5 / MP-Euclid Flex 系),
   确保即使镜像 :root 未应用, 恢复规则仍可解析。
   不影响 D-021 容器 (.trustpilot-reviews__reviews 特异性 0,1,0 > 本规则, 12px 基准保持)。
   ============================================================ */
:root {
  --typography-paragraph-regular-font-size: 16px;
  --typography-paragraph-regular-line-height: 1.5;
  --typography-paragraph-font-family: "MP-Euclid Flex", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
body, html {
  font-size: var(--typography-paragraph-regular-font-size);
  line-height: var(--typography-paragraph-regular-line-height);
}
body {
  color: var(--skin-color);
  font-family: var(--typography-paragraph-font-family);
}