/* =====================================================================
   WTSC Self-Care Tools — all rules scoped under .wtsc-tool so nothing
   leaks into, or is clobbered by, the GeneratePress theme.

   BRAND TOKENS — edit to match wellnessthroughselfcare.com exactly.
   Real values live in: Appearance -> Customize -> Colors (GeneratePress
   Global Colors), or the wtsc-child style.css.
   ===================================================================== */
.wtsc-tool{
  --ink:#33302b;        /* main text — warm charcoal */
  --ink-soft:#6a6459;   /* secondary text */
  --paper:#f8f3ea;      /* panel background — warm ivory */
  --card:#fffdf8;       /* inner card — soft cream */
  --line:#e4ddcf;       /* borders / hairlines — warm sand */
  --sage:#94a683;       /* primary calm green */
  --sage-deep:#5e6e52;  /* deep green — buttons, ink accents */
  --clay:#c77e63;       /* warm clay accent (CTAs) */
  --rose:#c58a7e;       /* soft dusty rose */
  --honey:#d3a05a;      /* warm honey */
  --focus:#5e6e52;
  --radius:18px;
  --shadow:0 1px 2px rgba(51,48,43,.05), 0 10px 30px rgba(51,48,43,.07);

  max-width:720px;
  margin-inline:auto;
  color:var(--ink);
  font-family:"Nunito Sans",system-ui,-apple-system,sans-serif;
  font-size:17px;
  line-height:1.6;
}
.wtsc-tool *{box-sizing:border-box;}
.wtsc-tool h1,.wtsc-tool h2,.wtsc-tool h3{
  font-family:"Fraunces",Georgia,serif;font-weight:500;line-height:1.15;
  letter-spacing:-.01em;margin:0;color:var(--ink);
}
.wtsc-tool h1{font-size:clamp(2rem,6vw,2.9rem);}
.wtsc-tool h1 em{font-style:italic;font-weight:400;color:var(--sage-deep);}
.wtsc-tool p{margin:0 0 1em;}
.wtsc-tool .lead{color:var(--ink-soft);font-size:1.08rem;max-width:46ch;}
.wtsc-tool .wtsc-muted{color:var(--ink-soft);}
.wtsc-tool .eyebrow{font-family:"Fraunces",serif;font-style:italic;color:var(--clay);font-size:1.05rem;margin-bottom:10px;}

/* screens */
.wtsc-tool .wtsc-screen{display:none;}
.wtsc-tool .wtsc-screen.wtsc-active{display:block;animation:wtsc-fade .5s ease both;}
@keyframes wtsc-fade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

/* intro */
.wtsc-tool .wtsc-mark{width:46px;height:46px;margin-bottom:18px;}
.wtsc-tool .wtsc-mark circle,.wtsc-tool .wtsc-mark path{fill:none;stroke:var(--sage-deep);stroke-width:1.4;}
.wtsc-tool .wtsc-mark-dot{fill:var(--sage-deep);stroke:none;}
.wtsc-tool .wtsc-meta{display:flex;gap:22px;flex-wrap:wrap;margin:24px 0 28px;color:var(--ink-soft);font-size:.95rem;}
.wtsc-tool .wtsc-meta span{display:inline-flex;align-items:center;gap:8px;}
.wtsc-tool .wtsc-dot{width:7px;height:7px;border-radius:50%;background:var(--sage);display:inline-block;}
.wtsc-tool .wtsc-h2{font-size:1.7rem;margin-bottom:6px;}
.wtsc-tool .wtsc-note-line{color:var(--ink-soft);font-size:.9rem;margin:0 0 24px;}

/* buttons */
.wtsc-tool .wtsc-btn{
  font-family:"Nunito Sans",sans-serif;font-size:1rem;font-weight:700;color:#fff;background:var(--sage-deep);
  border:none;border-radius:100px;padding:15px 30px;cursor:pointer;text-decoration:none;display:inline-block;
  transition:background .18s ease,transform .18s ease;box-shadow:var(--shadow);
}
.wtsc-tool .wtsc-btn:hover{background:#4f5e45;color:#fff;}
.wtsc-tool .wtsc-btn:active{transform:translateY(1px);}
.wtsc-tool .wtsc-btn.wtsc-ghost{background:transparent;color:var(--sage-deep);box-shadow:none;border:1.5px solid var(--line);}
.wtsc-tool .wtsc-btn.wtsc-ghost:hover{background:var(--paper);border-color:var(--sage);}
.wtsc-tool .wtsc-btn:focus-visible{outline:3px solid var(--focus);outline-offset:3px;}
.wtsc-tool .wtsc-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px;}

/* question fields */
.wtsc-tool .wtsc-field{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin-bottom:16px;}
.wtsc-tool .wtsc-field-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;}
.wtsc-tool .wtsc-field h3{font-size:1.22rem;}
.wtsc-tool .wtsc-helper{color:var(--ink-soft);font-size:.92rem;margin:3px 0 16px;}
.wtsc-tool .wtsc-val{font-family:"Fraunces",serif;font-size:1.5rem;color:var(--sage-deep);min-width:2ch;text-align:right;}
.wtsc-tool input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:100px;
  background:linear-gradient(90deg,var(--sage) var(--pct,50%),#e6e0d3 var(--pct,50%));outline:none;margin:4px 0;padding:0;
}
.wtsc-tool input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;
  border:3px solid var(--sage-deep);cursor:pointer;box-shadow:0 2px 6px rgba(51,48,43,.18);transition:transform .12s ease;
}
.wtsc-tool input[type=range]::-webkit-slider-thumb:active{transform:scale(1.12);}
.wtsc-tool input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--sage-deep);cursor:pointer;}
.wtsc-tool input[type=range]:focus-visible{outline:3px solid var(--focus);outline-offset:6px;border-radius:100px;}
.wtsc-tool .wtsc-scale-ends{display:flex;justify-content:space-between;color:var(--ink-soft);font-size:.8rem;margin-top:4px;}

/* results — overall gauge */
.wtsc-tool .wtsc-overall{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:28px 24px;text-align:center;margin-bottom:26px;}
.wtsc-tool .wtsc-gauge-wrap{width:230px;max-width:100%;margin:6px auto 2px;}
.wtsc-tool .wtsc-gauge-wrap svg{width:100%;height:auto;}
.wtsc-tool .wtsc-gauge-num{font-family:"Fraunces",serif;font-size:2.6rem;color:var(--ink);line-height:1;}
.wtsc-tool .wtsc-gauge-num small{font-size:1rem;color:var(--ink-soft);}
.wtsc-tool .wtsc-band{font-family:"Fraunces",serif;font-size:1.5rem;margin:10px 0 6px;}
.wtsc-tool .wtsc-overall p{max-width:44ch;margin:0 auto;color:var(--ink-soft);font-size:1rem;}

/* results — wheel */
.wtsc-tool .wtsc-wheel-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px 18px 12px;margin-bottom:26px;text-align:center;}
.wtsc-tool .wtsc-wheel-card h2{font-size:1.35rem;margin-bottom:4px;}
.wtsc-tool .wtsc-wheel-card .wtsc-muted{font-size:.9rem;margin-bottom:8px;}
.wtsc-tool #wtsc-wheel{width:100%;max-width:420px;height:auto;}

/* results — dimensions */
.wtsc-tool .wtsc-section-title{font-size:1.5rem;margin:34px 0 14px;}
.wtsc-tool .wtsc-dim{display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:start;padding:18px 0;border-top:1px solid var(--line);}
.wtsc-tool .wtsc-dim:first-of-type{border-top:none;}
.wtsc-tool .wtsc-score{font-family:"Fraunces",serif;font-size:1.35rem;color:#fff;width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;}
.wtsc-tool .wtsc-dim h3{font-size:1.1rem;margin-bottom:3px;}
.wtsc-tool .wtsc-reflection{color:var(--ink);font-size:.98rem;margin:0 0 10px;}
.wtsc-tool .wtsc-practice{display:flex;gap:9px;align-items:flex-start;background:var(--paper);border:1px dashed var(--line);border-radius:12px;padding:11px 14px;font-size:.93rem;color:var(--ink-soft);}
.wtsc-tool .wtsc-practice b{color:var(--sage-deep);font-weight:700;}
.wtsc-tool .wtsc-leaf{flex:none;margin-top:2px;color:var(--sage);}

.wtsc-tool .wtsc-disclaimer{font-size:.85rem;color:var(--ink-soft);border-left:3px solid var(--line);padding:2px 0 2px 14px;margin:30px 0;max-width:52ch;}

/* CTA */
.wtsc-tool .wtsc-cta{background:var(--sage-deep);color:#fff;border-radius:var(--radius);padding:26px 24px;margin:30px 0 6px;}
.wtsc-tool .wtsc-cta h3{color:#fff;font-size:1.35rem;margin-bottom:6px;}
.wtsc-tool .wtsc-cta p{color:#e5ebdf;margin-bottom:16px;max-width:46ch;}
.wtsc-tool .wtsc-cta .wtsc-btn{background:var(--clay);color:#fff;}
.wtsc-tool .wtsc-cta .wtsc-btn:hover{background:#b56d53;}
.wtsc-tool .wtsc-foot{margin-top:30px;text-align:center;}

/* editor copy printed below the tool (SEO/FAQ) */
.wtsc-tool-copy{max-width:720px;margin:40px auto 0;}

/* ---- card grid ([wtsc_tools] shortcode + /tools/ archive) ---- */
.wtsc-grid{display:grid;grid-template-columns:repeat(var(--cols,3),1fr);gap:18px;max-width:1040px;}
.wtsc-card{
  position:relative;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:24px 22px;text-decoration:none;color:var(--ink);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;box-shadow:var(--shadow);
}
.wtsc-card:hover{transform:translateY(-3px);box-shadow:0 12px 34px rgba(51,48,43,.12);border-color:var(--sage);}
.wtsc-card-ico{font-size:1.8rem;margin-bottom:12px;line-height:1;}
.wtsc-card h3{font-family:"Fraunces",serif;font-size:1.3rem;margin:0 0 6px;}
.wtsc-card p{color:var(--ink-soft);font-size:.95rem;margin:0 0 16px;flex:1;}
.wtsc-card-cta{font-weight:700;color:var(--sage-deep);font-size:.95rem;}
.wtsc-card-min{position:absolute;top:18px;right:18px;font-size:.78rem;color:var(--ink-soft);background:var(--paper);border:1px solid var(--line);border-radius:100px;padding:3px 10px;}

/* archive header */
.wtsc-archive{max-width:1040px;}
.wtsc-archive-head{max-width:640px;margin:0 auto 34px;text-align:center;}
.wtsc-archive-head .eyebrow{margin-bottom:6px;}
.wtsc-archive-head .lead{margin-inline:auto;}

@media (max-width:820px){ .wtsc-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){
  .wtsc-tool{font-size:16px;}
  .wtsc-grid{grid-template-columns:1fr;}
  .wtsc-tool .wtsc-dim{grid-template-columns:38px 1fr;gap:12px;}
  .wtsc-tool .wtsc-score{width:38px;height:38px;font-size:1.15rem;}
}
@media (prefers-reduced-motion:reduce){
  .wtsc-tool .wtsc-screen.wtsc-active{animation:none;}
  .wtsc-tool *,.wtsc-card{transition:none !important;}
}
