/* WhatsApp Message Score Checker — bulksmsind.in (tool script: js/wa-score.js). Uses the site tokens from home-v2.css. */
.ws-sec { padding-top: 34px; }
.ws { --ink: var(--text, #1B2A44); --soft: var(--paper, #F4F7FC); --card: #fff; --font: var(--body); --r: 18px; }
.ws-checks, .ws-bands { --ink: var(--text, #1B2A44); --card: #fff; --r: 16px; }
.ws-bands { margin-top: 18px; }
.ws-check h3, .ws-band h3 { font-family: var(--display); color: var(--ink, #0F2147); }
.ws-pts { color: var(--blue, #3172FF); }
/* ---------- Free tool: WhatsApp message score (wa-score.js) ---------- */
.ws { --ws-ink: var(--ink, #0a1a33); --ws-muted: var(--muted, #4f5f77); --ws-line: var(--line, #d9e1ec); --ws-card: var(--card, #fff); --ws-soft: var(--soft, #f2f5f9); --ws-accent: var(--blue, #0067d6);
  background: var(--ws-card); color: var(--ws-ink); border: 1px solid var(--ws-line); border-radius: 18px; box-shadow: 0 24px 60px -30px rgba(6, 32, 74, .45); overflow: hidden; }
.ws-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); }
.ws-input { padding: 28px; display: flex; flex-direction: column; gap: 10px; align-self: start; position: sticky; top: 76px; }
.ws-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ws-row label, .ws-label { font-weight: 600; font-size: .95rem; }
.ws select, .ws textarea { font: inherit; color: inherit; background: var(--ws-card); border: 1.5px solid var(--ws-line); border-radius: 10px; padding: 10px 12px; }
.ws select { flex: 1 1 220px; }
.ws textarea { width: 100%; resize: vertical; min-height: 220px; line-height: 1.5; font-size: 1rem; }
.ws select:focus, .ws textarea:focus { outline: 3px solid color-mix(in srgb, var(--ws-accent) 35%, transparent); border-color: var(--ws-accent); }
.ws-meta { display: flex; justify-content: space-between; gap: 12px; font-size: .85rem; color: var(--ws-muted); }
.ws-meta .over { color: #c0392b; font-weight: 700; }
.ws-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 4px; }
.ws-btn { font: 600 1rem/1.2 var(--font, inherit); background: var(--ws-accent); color: #fff; border: 0; border-radius: 10px; padding: 13px 22px; cursor: pointer; }
.ws-btn:hover { filter: brightness(.92); }
.ws-try { font-size: .88rem; color: var(--ws-muted); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ws-try button { font: inherit; font-size: .85rem; background: var(--ws-soft); color: var(--ws-ink); border: 1px solid var(--ws-line); border-radius: 999px; padding: 4px 11px; cursor: pointer; }
.ws-try button:hover { border-color: var(--ws-ink); }
.ws-privacy { font-size: .82rem; color: var(--ws-muted); margin-top: auto; padding-top: 6px; }
.ws-out { padding: 28px; background: var(--ws-soft); min-height: 420px; border-left: 1px solid var(--ws-line); }
.ws-wait { height: 100%; display: grid; place-items: center; align-content: center; gap: 14px; text-align: center; color: var(--ws-muted); max-width: 32ch; margin: 0 auto; }
.ws-dial { --deg: 0deg; --c: var(--ws-accent); width: 104px; height: 104px; flex: none; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(closest-side, var(--ws-soft) 78%, transparent 79% 100%), conic-gradient(var(--c) var(--deg), var(--ws-line) 0); }
.ws-dial span { display: flex; flex-direction: column; align-items: center; line-height: 1; }
.ws-dial b { font: 800 2rem/1 var(--display, inherit); letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.ws-dial small { color: var(--ws-muted); font-size: .72rem; margin-top: 3px; }
.ws-dial.is-empty span { font-size: 2rem; color: var(--ws-muted); }
.ws-head { display: flex; gap: 20px; align-items: center; }
.ws-head h3 { font: 800 1.45rem/1.15 var(--display, inherit); letter-spacing: -0.02em; }
.ws-head p { color: var(--ws-muted); margin-top: 4px; font-size: .95rem; }
.ws-great .ws-dial { --c: #1e9e57; } .ws-great h3 { color: #157a43; }
.ws-good .ws-dial { --c: #5aa31b; } .ws-good h3 { color: #3d7a06; }
.ws-fair .ws-dial { --c: #e08a00; } .ws-fair h3 { color: #a86400; }
.ws-poor .ws-dial { --c: #d6402a; } .ws-poor h3 { color: #b3321f; }
.ws-bars { list-style: none; padding: 0; margin: 22px 0 6px; display: grid; gap: 9px; }
.ws-bars li { display: grid; grid-template-columns: 118px 1fr 44px; align-items: center; gap: 10px; font-size: .9rem; }
.ws-bars b { text-align: right; font-variant-numeric: tabular-nums; }
.ws-track { height: 8px; border-radius: 99px; background: var(--ws-line); overflow: hidden; }
.ws-track i { display: block; height: 100%; border-radius: 99px; transition: width .4s ease; }
.ws-track .ok { background: #1e9e57; } .ws-track .mid { background: #e08a00; } .ws-track .low { background: #d6402a; }
.ws-out h4 { font: 700 1rem/1.3 var(--display, inherit); margin: 20px 0 8px; }
.ws-tips { list-style: none; padding: 0; margin: 0; display: grid; gap: 7px; }
.ws-tips li { position: relative; padding: 9px 12px 9px 34px; border-radius: 10px; background: var(--ws-card); border: 1px solid var(--ws-line); font-size: .92rem; line-height: 1.45; }
.ws-tips li::before { position: absolute; left: 12px; top: 9px; font-weight: 800; }
.ws-tips .bad::before { content: "!"; color: #d6402a; } .ws-tips .bad { border-left: 3px solid #d6402a; }
.ws-tips .warn::before { content: "•"; color: #e08a00; } .ws-tips .warn { border-left: 3px solid #e08a00; }
.ws-tips .info::before { content: "i"; color: var(--ws-accent); font-style: italic; } .ws-tips .info { border-left: 3px solid var(--ws-line); }
.ws-tips code, .ws-check code { font-family: var(--mono, monospace); font-size: .85em; background: var(--ws-soft); padding: 1px 5px; border-radius: 5px; }
.ws-pass { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.ws-pass span { font-size: .82rem; color: #157a43; background: color-mix(in srgb, #1e9e57 12%, transparent); padding: 3px 10px; border-radius: 99px; }
.ws-phone { background: var(--chat-bg, #efeae2); border-radius: 14px; padding: 16px; }
.ws-bubble { background: var(--bubble-in, #fff); color: var(--bubble-ink, #111b21); border-radius: 0 10px 10px 10px; padding: 8px 10px 6px; max-width: 92%; font-size: .93rem; line-height: 1.45; box-shadow: 0 1px .5px rgba(11, 20, 26, .13); overflow-wrap: anywhere; }
.ws-bubble small { display: block; text-align: right; font-size: .7rem; color: #667781; margin-top: 2px; }
.ws-var { background: #fff3c4; color: #5c4400; border-radius: 4px; padding: 0 3px; }
.ws-note { font-size: .78rem; color: var(--ws-muted); margin-top: 12px; }
.ws-checks { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; }
.ws-check { display: flex; gap: 16px; padding: 20px; border: 1px solid var(--line); border-radius: var(--r, 14px); background: var(--card); }
.ws-pts { font: 800 2rem/1 var(--display); letter-spacing: -0.03em; color: var(--blue); min-width: 2.2ch; }
.ws-pts small { display: block; font: 600 .72rem/1.4 var(--font); color: var(--muted); letter-spacing: 0; }
.ws-check h3 { font-size: 1.12rem; } .ws-check p { color: var(--muted); margin-top: 6px; font-size: .96rem; }
.ws-bands { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.ws-band { border-radius: var(--r, 14px); padding: 18px; background: var(--card); border: 1px solid var(--line); border-top: 5px solid; }
.ws-band b { font: 800 1.4rem/1 var(--display); } .ws-band h3 { font-size: 1.05rem; margin-top: 8px; } .ws-band p { color: var(--muted); font-size: .92rem; margin-top: 4px; }
.ws-band.ws-great { border-top-color: #1e9e57; } .ws-band.ws-good { border-top-color: #5aa31b; } .ws-band.ws-fair { border-top-color: #e08a00; } .ws-band.ws-poor { border-top-color: #d6402a; }
@media (max-width: 900px) {
  .ws-grid { grid-template-columns: 1fr; } .ws-input { position: static; } .ws-out { border-left: 0; border-top: 1px solid var(--ws-line); }
  .ws-bands { grid-template-columns: 1fr 1fr; } @media (max-width: 520px) { .ws-input, .ws-out { padding: 18px; } .ws-bands { grid-template-columns: 1fr; } .ws-head { flex-direction: column; align-items: flex-start; } .ws-bars li { grid-template-columns: 96px 1fr 40px; } }
@media (prefers-reduced-motion: reduce) { .ws-track i { transition: none; } }
.ws-input { top: 112px; }
