/* 香香糖果屋導航 v1.1.0 - 原始 HTML 視覺精準還原版 */
/* 所有規則限定在 .xxcn-shell 內，避免 WordPress 主題干擾 */

.xxcn-shell,
.xxcn-shell *{
  box-sizing:border-box!important;
}

.xxcn-shell{
  --xx-bg:#f6f7fb;
  --xx-primary:#ff7a00;
  --xx-primary-dark:#e86d00;
  --xx-text:#1f2937;
  --xx-muted:#6b7280;
  --xx-card:#ffffff;
  --xx-border:#e5e7eb;
  --xx-notice1:#fff7e6;
  --xx-notice2:#fff1d6;
  --xx-notice-border:#ffd591;
  --xx-width:520px;
  --xx-shadow:0 10px 30px rgba(0,0,0,.08);
  --xx-radius:14px;
  --xx-safe:env(safe-area-inset-bottom,0);

  width:100%!important;
  min-width:0!important;
  min-height:100vh!important;
  margin:0!important;
  padding:20px!important;
  background:var(--xx-bg)!important;
  color:var(--xx-text)!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans TC",sans-serif!important;
  font-size:16px!important;
  line-height:1.6!important;
  font-style:normal!important;
  font-weight:400!important;
  letter-spacing:normal!important;
  text-transform:none!important;
  isolation:isolate;
}

.xxcn-shell.xxcn-fullwidth{
  position:relative!important;
  left:50%!important;
  width:100vw!important;
  max-width:none!important;
  margin-left:-50vw!important;
  margin-right:-50vw!important;
}

.xxcn-shell a{
  text-decoration:none!important;
  text-underline-offset:initial!important;
}
.xxcn-shell button,
.xxcn-shell a{
  font-family:inherit!important;
}

.xxcn-container{
  width:100%!important;
  max-width:var(--xx-width)!important;
  margin:0 auto!important;
  padding:0!important;
}

.xxcn-card{
  width:100%!important;
  margin:0!important;
  padding:0!important;
  background:var(--xx-card)!important;
  border-radius:var(--xx-radius)!important;
  box-shadow:var(--xx-shadow)!important;
  border:1px solid var(--xx-border)!important;
  overflow:hidden!important;
}

/* Header - 對齊原始 HTML */
.xxcn-header{
  display:block!important;
  width:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:28px 20px 22px!important;
  text-align:center!important;
  background:transparent!important;
  border:0!important;
  border-bottom:1px solid var(--xx-border)!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.xxcn-header h1{
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:var(--xx-text)!important;
  background:none!important;
  font-family:inherit!important;
  font-size:1.9rem!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
.xxcn-header p{
  display:block!important;
  margin:6px 0 0!important;
  padding:0!important;
  color:var(--xx-muted)!important;
  font-family:inherit!important;
  font-size:.95rem!important;
  line-height:1.5!important;
  font-weight:400!important;
}

/* 公告卡 */
.xxcn-notice-card{
  display:block!important;
  width:auto!important;
  min-height:0!important;
  margin:16px 20px 12px!important;
  padding:16px!important;
  background:linear-gradient(180deg,var(--xx-notice1),var(--xx-notice2))!important;
  border:1px solid var(--xx-notice-border)!important;
  border-radius:14px!important;
  box-shadow:none!important;
}
.xxcn-notice-card-title{
  display:block!important;
  margin:0 0 8px!important;
  padding:0!important;
  color:#7a4a00!important;
  font-size:1.05rem!important;
  line-height:1.4!important;
  font-weight:900!important;
}
.xxcn-notice-card p{
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:#5a3b00!important;
  font-size:.95rem!important;
  line-height:1.7!important;
  font-weight:400!important;
}

/* 主提示 */
.xxcn-notice{
  display:block!important;
  width:auto!important;
  min-height:0!important;
  margin:0 20px 16px!important;
  padding:12px!important;
  background:#fff7ed!important;
  border:1px solid #fed7aa!important;
  border-radius:12px!important;
  box-shadow:none!important;
  color:#9a3412!important;
  font-size:1rem!important;
  line-height:1.5!important;
  font-weight:800!important;
  text-align:center!important;
}

/* 店鋪 - 嚴格還原原始 gap / padding，避免被主題拉高 */
.xxcn-shops{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-auto-rows:auto!important;
  gap:14px!important;
  row-gap:14px!important;
  column-gap:14px!important;
  width:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:10px 20px 20px!important;
  align-items:stretch!important;
}
.xxcn-shops > .xxcn-shop-btn{
  --xx-shop-bg:var(--xx-primary);
  --xx-shop-hover:var(--xx-primary-dark);
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  align-self:auto!important;
  justify-self:stretch!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  margin:0!important;
  padding:18px 14px!important;
  background:var(--xx-shop-bg)!important;
  border:0!important;
  border-radius:12px!important;
  box-shadow:none!important;
  color:#fff!important;
  font-family:inherit!important;
  font-size:1.05rem!important;
  line-height:1.35!important;
  font-weight:900!important;
  text-align:center!important;
  text-decoration:none!important;
  transition:transform .15s ease,background .15s ease!important;
  overflow:visible!important;
}
.xxcn-shops > .xxcn-shop-btn span{
  display:block!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  color:#fff!important;
  font-family:inherit!important;
  font-size:1em!important;
  line-height:1.35!important;
  font-weight:900!important;
}
.xxcn-shops > .xxcn-shop-btn small{
  display:block!important;
  width:auto!important;
  height:auto!important;
  margin:6px 0 0!important;
  padding:0!important;
  color:#fff!important;
  opacity:.9!important;
  font-family:ui-monospace,Menlo,Consolas,monospace!important;
  font-size:.9rem!important;
  line-height:1.35!important;
  font-weight:800!important;
  letter-spacing:0!important;
}
.xxcn-shops > .xxcn-shop-btn:hover,
.xxcn-shops > .xxcn-shop-btn:focus{
  background:var(--xx-shop-hover)!important;
  color:#fff!important;
  transform:translateY(-3px)!important;
}

/* Contact */
.xxcn-contact{
  display:block!important;
  width:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:0 20px 20px!important;
}
.xxcn-c-item{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  width:100%!important;
  min-height:0!important;
  margin:12px 0 0!important;
  padding:14px!important;
  background:linear-gradient(180deg,#ffffff,#f9fafb)!important;
  border:1px solid var(--xx-border)!important;
  border-radius:14px!important;
  box-shadow:none!important;
}
.xxcn-c-icon{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 42px!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:12px!important;
  color:#fff!important;
  font-family:inherit!important;
  font-size:.95rem!important;
  line-height:1!important;
  font-weight:900!important;
}
.xxcn-c-icon.xxcn-line{background:#22c55e!important}
.xxcn-c-icon.xxcn-wechat{background:#10b981!important}
.xxcn-c-main{
  display:block!important;
  flex:1 1 auto!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
.xxcn-c-main b{
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:var(--xx-text)!important;
  font-size:.9rem!important;
  line-height:1.35!important;
  font-weight:900!important;
}
.xxcn-c-id{
  display:inline-block!important;
  width:auto!important;
  min-height:0!important;
  margin:4px 0 0!important;
  padding:6px 10px!important;
  background:#f1f5f9!important;
  border:0!important;
  border-radius:999px!important;
  color:var(--xx-text)!important;
  font-family:ui-monospace,Menlo,Consolas,monospace!important;
  font-size:.9rem!important;
  line-height:1.25!important;
  font-weight:800!important;
}
.xxcn-c-actions{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0!important;
  padding:0!important;
}
.xxcn-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:8px 12px!important;
  background:none!important;
  border:0!important;
  border-radius:10px!important;
  box-shadow:none!important;
  color:var(--xx-text)!important;
  font-family:inherit!important;
  font-size:.85rem!important;
  line-height:1.2!important;
  font-weight:800!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:nowrap!important;
  cursor:pointer!important;
}
.xxcn-btn.xxcn-copy{background:#e5e7eb!important;color:var(--xx-text)!important}
.xxcn-btn.xxcn-go{background:#22c55e!important;color:#fff!important}

/* Guarantee */
.xxcn-guarantee{
  display:block!important;
  width:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:0 20px 22px!important;
}
.xxcn-guarantee h2{
  display:block!important;
  margin:14px 0 10px!important;
  padding:0!important;
  color:var(--xx-text)!important;
  font-family:inherit!important;
  font-size:1.05rem!important;
  line-height:1.4!important;
  font-weight:900!important;
  letter-spacing:0!important;
  text-align:center!important;
  text-transform:none!important;
}
.xxcn-g-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  margin:0!important;
  padding:0!important;
}
.xxcn-g-card{
  display:block!important;
  width:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:12px!important;
  background:#f9fafb!important;
  border:1px solid var(--xx-border)!important;
  border-radius:12px!important;
  box-shadow:none!important;
  color:var(--xx-muted)!important;
  font-family:inherit!important;
  font-size:.9rem!important;
  line-height:1.5!important;
  font-weight:400!important;
  text-align:center!important;
}

/* Footer */
.xxcn-footer{
  display:block!important;
  width:auto!important;
  min-height:0!important;
  margin:14px 0 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:var(--xx-muted)!important;
  font-family:inherit!important;
  font-size:.85rem!important;
  line-height:1.5!important;
  font-weight:400!important;
  text-align:center!important;
}

.xxcn-toast{
  position:fixed!important;
  left:50%!important;
  bottom:calc(16px + var(--xx-safe))!important;
  transform:translateX(-50%)!important;
  z-index:999999!important;
  margin:0!important;
  padding:10px 14px!important;
  background:#111827!important;
  border:0!important;
  border-radius:12px!important;
  box-shadow:none!important;
  color:#fff!important;
  font-family:inherit!important;
  font-size:.85rem!important;
  line-height:1.4!important;
}
.xxcn-toast[hidden]{display:none!important}
.xxcn-shell :focus-visible{outline:3px solid rgba(255,122,0,.3)!important;outline-offset:3px!important}

@media(max-width:520px){
  .xxcn-shell{padding:12px!important}
  .xxcn-g-grid{grid-template-columns:1fr!important}
  .xxcn-c-item{align-items:flex-start!important;flex-wrap:wrap!important}
  .xxcn-c-actions{width:100%!important;justify-content:flex-end!important}
}