/* =========================================================
   TopiaryTree — hardiness zone module (zone.css)
   Product pages only, and only for a live boxwood with a confirmed cultivar.
   ========================================================= */
.tt-zone{display:flex;gap:14px;align-items:flex-start;background:var(--tt-bg-alt);border:1px solid var(--tt-line);
  border-radius:6px;padding:14px 16px;margin:var(--tt-s4) 0;font-family:var(--tt-sans);}
.tt-zone__badge{flex:0 0 auto;width:62px;height:62px;border-radius:50%;background:var(--tt-green-700);color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1;}
.tt-zone__badge small{font-size:8px;letter-spacing:.09em;text-transform:uppercase;color:#fff;opacity:.85;white-space:nowrap;}
.tt-zone__badge b{font-family:var(--tt-serif);font-size:19px;font-weight:600;color:#fff !important;line-height:1;}
.tt-zone__body{flex:1 1 auto;min-width:0;font-size:var(--tt-t-sm);line-height:1.55;color:var(--tt-muted);}
.tt-zone__msg{margin:0 0 8px;color:var(--tt-ink);}
.tt-zone__msg b{font-weight:600;}
.tt-zone__msg a{color:var(--tt-green-700);}
.tt-zone__ask{margin:0 0 8px;color:var(--tt-muted);font-size:var(--tt-t-xs);}
.tt-zone__hint{margin:6px 0 0;font-size:var(--tt-t-xs);color:#8f5a2b;}
.tt-zone__hint[hidden]{display:none;}
.tt-zone__fine{margin:8px 0 0;font-size:11px;color:var(--tt-faint);}
.tt-zone__form{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;}
.tt-zone__lab{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.tt-zone__zip{width:8em !important;max-width:8em;flex:0 0 auto;font:inherit;font-variant-numeric:tabular-nums;padding:7px 9px;border:1px solid var(--tt-line);
  border-radius:3px;background:#fff;color:var(--tt-ink);}
.tt-zone__zip:focus{outline:2px solid var(--tt-brass);outline-offset:1px;border-color:var(--tt-brass);}
.tt-zone__go{font:inherit;font-weight:600;padding:7px 12px;border:1px solid var(--tt-green-900);border-radius:3px;
  background:var(--tt-green-900);color:var(--tt-bg);cursor:pointer;}
.tt-zone__go:hover{background:var(--tt-green-700);border-color:var(--tt-green-700);}
.tt-zone__go:disabled{opacity:.6;cursor:progress;}
.tt-zone__go[aria-busy="true"]{opacity:.75;cursor:progress;}
.tt-zone__reset{font:inherit;font-size:var(--tt-t-xs);color:var(--tt-green-700);background:none;border:0;padding:0;
  text-decoration:underline;text-underline-offset:2px;cursor:pointer;}
.tt-zone__alt{margin:8px 0 0;padding:8px 11px;background:var(--tt-paper);border:1px dashed var(--tt-brass);border-radius:4px;
  font-size:var(--tt-t-xs);color:var(--tt-muted);}
.tt-zone__alt a{color:var(--tt-brass);font-weight:600;}
.tt-zone__alt[hidden],.tt-zone__reset[hidden],.tt-zone__form[hidden]{display:none;}

/* Resolved states. Warm, not red: the piece is not faulty, the climate is. */
.tt-zone.is-ok .tt-zone__badge{background:var(--tt-green-700);}
.tt-zone.is-ok .tt-zone__msg{color:var(--tt-green-900);}
.tt-zone.is-no{border-color:#b8763f;}
.tt-zone.is-no .tt-zone__badge{background:#b8763f;}
.tt-zone.is-no .tt-zone__msg b:first-child{color:#8f5a2b;}
.tt-zone.is-err .tt-zone__msg{color:var(--tt-muted);}

.tt-zone__maplink{white-space:nowrap;font-size:var(--tt-t-xs);color:var(--tt-green-700);}

/* ---- The map band, below the summary. */
.tt-zonemap{font-family:var(--tt-sans);background:var(--tt-bg-alt);border-top:1px solid var(--tt-line);border-bottom:1px solid var(--tt-line);
  padding:clamp(32px,5vw,56px) 0;margin:var(--tt-s7) 0 0;scroll-margin-top:90px;}
.tt-zonemap__inner{max-width:1080px;margin:0 auto;padding-inline:clamp(20px,5vw,56px);}
.tt-zonemap__head{max-width:62ch;margin-bottom:var(--tt-s5);}
.tt-zonemap__h{font-family:var(--tt-serif);font-weight:600;font-size:var(--tt-t-xl);line-height:1.12;margin:0 0 8px;color:var(--tt-ink);text-wrap:balance;}
.tt-zonemap__sub{margin:0;color:var(--tt-muted);font-size:var(--tt-t-base);line-height:1.6;}
.tt-zonemap__stage{background:var(--tt-paper);border:1px solid var(--tt-line);border-radius:8px;padding:clamp(10px,2vw,22px);}
.tt-zonemap__canvas{display:block;width:100%;height:auto;max-width:100%;}
.tt-zonemap__legend{list-style:none;display:flex;flex-wrap:wrap;gap:8px 26px;margin:var(--tt-s4) 0 0;padding:0;font-size:var(--tt-t-sm);color:var(--tt-ink);}
.tt-zonemap__legend li{display:flex;align-items:center;gap:8px;margin:0;}
.tt-zonemap__legend li[hidden]{display:none;}
.tt-zonemap__swatch{display:inline-block;width:14px;height:14px;border-radius:3px;border:1px solid rgba(29,36,32,.18);}
.tt-zonemap__swatch.is-ok{background:#7c9a72;}
.tt-zonemap__swatch.is-no{background:#e0d6c2;}
.tt-zonemap__swatch.is-you{background:var(--tt-brass);border-radius:50%;box-shadow:0 0 0 2px #fff,0 0 0 3px var(--tt-brass);width:10px;height:10px;margin:2px;}
.tt-zonemap__note{margin:var(--tt-s3) 0 0;font-size:var(--tt-t-xs);color:var(--tt-faint);max-width:80ch;line-height:1.55;}
.tt-zonemap__note a{color:var(--tt-green-700);white-space:nowrap;}

/* ---- Two columns under the product: the zone card beside description + reviews.
   The product is a 12-column grid; the wrapper spans it and lays out its own two
   columns. Tabs are printed first in the DOM (description first on a phone), the
   card is ordered before them on wide screens. */
.single-product div.product > .tt-pdp-below{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:var(--tt-s6) var(--tt-s7);align-items:start;margin-top:var(--tt-s7);}
.tt-pdp-below > .woocommerce-tabs{order:2;grid-column:auto;margin:0;padding:0;width:auto;max-width:none;}
.tt-pdp-below > .tt-zonemap{order:1;margin:0;padding:22px 22px 20px;background:var(--tt-bg-alt);border:1px solid var(--tt-line);border-radius:8px;}
.tt-pdp-below .tt-zonemap__inner{max-width:none;padding:0;}
.tt-pdp-below .tt-zonemap__head{margin-bottom:var(--tt-s4);}
.tt-pdp-below .tt-zonemap__h{font-size:var(--tt-t-lg);}
.tt-pdp-below .tt-zonemap__sub{font-size:var(--tt-t-sm);}
.tt-pdp-below .tt-zonemap__stage{padding:10px;}
.tt-pdp-below .tt-zonemap__legend{gap:6px 18px;font-size:var(--tt-t-xs);}
.tt-pdp-below .tt-zonemap__note{font-size:11px;}
@media (max-width:900px){
  .single-product div.product > .tt-pdp-below{grid-template-columns:1fr;gap:var(--tt-s6);}
  .tt-pdp-below > .woocommerce-tabs{order:1;}
  .tt-pdp-below > .tt-zonemap{order:2;padding:18px 16px;}
}