/* ADP-grade salary paycheck calculator widget. Brand teal #0d9488.
   Shared across master + state pages. Mounts on a form with id="sp-calc". */
.sp-grid{display:grid;grid-template-columns:1fr;gap:20px;margin:8px 0 28px;}
@media(min-width:980px){.sp-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:24px;align-items:start;}}
.sp-card{background:#fff;border:1px solid #e2e8f0;border-radius:14px;padding:18px 20px;box-shadow:0 1px 2px rgba(15,23,42,0.04);}
.sp-card+.sp-card{margin-top:14px;}
.sp-card h2{font-size:15px;font-weight:700;color:#0f172a;margin:0 0 14px;letter-spacing:-0.2px;}
.sp-card h3{font-size:13px;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:0.6px;margin:18px 0 10px;}
.sp-sticky{position:sticky;top:80px;}
.sp-row{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:10px;}
@media(min-width:560px){.sp-row.cols-2{grid-template-columns:1fr 1fr;}}
.sp-field label{display:block;font-size:12.5px;font-weight:600;color:#334155;margin-bottom:5px;}
.sp-field .hint{display:block;font-size:11.5px;color:#94a3b8;margin-top:4px;line-height:1.4;}
.sp-input,.sp-select{width:100%;padding:9px 11px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;font:inherit;font-size:14px;color:#0f172a;-webkit-appearance:none;appearance:none;}
.sp-input:focus,.sp-select:focus{outline:none;border-color:#0d9488;box-shadow:0 0 0 3px rgba(13,148,136,0.18);}
.sp-select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'><path fill='%2364748b' d='M6 8L0 0h12z'/></svg>");background-repeat:no-repeat;background-position:right 11px center;background-size:10px;padding-right:30px;}
.sp-input-prefix{position:relative;}
.sp-input-prefix input{padding-left:46px;}
.sp-input-prefix .sym{position:absolute;left:11px;top:50%;transform:translateY(-50%);font-size:13px;color:#64748b;font-weight:600;pointer-events:none;letter-spacing:.2px;}
.sp-input-suffix{position:relative;}
.sp-input-suffix input{padding-right:32px;}
.sp-input-suffix .sym{position:absolute;right:11px;top:50%;transform:translateY(-50%);font-size:13px;color:#64748b;font-weight:600;pointer-events:none;}
.sp-seg{display:inline-flex;background:#f1f5f9;border-radius:8px;padding:3px;gap:2px;}
.sp-seg button{flex:1;background:transparent;border:0;padding:7px 14px;border-radius:6px;font:inherit;font-size:12.5px;font-weight:600;color:#64748b;cursor:pointer;transition:background .12s,color .12s;}
.sp-seg button.on{background:#fff;color:#0d9488;box-shadow:0 1px 2px rgba(15,23,42,0.08);}
.sp-disclosure{margin-top:12px;border-top:1px solid #f1f5f9;padding-top:10px;}
.sp-disclosure summary{cursor:pointer;font-size:13px;font-weight:600;color:#0d9488;list-style:none;display:flex;align-items:center;gap:6px;padding:4px 0;}
.sp-disclosure summary::-webkit-details-marker{display:none;}
.sp-disclosure summary::before{content:"+";display:inline-block;width:16px;height:16px;line-height:14px;text-align:center;border:1px solid #0d9488;border-radius:50%;font-size:12px;font-weight:700;}
.sp-disclosure[open] summary::before{content:"−";}
.sp-disclosure-body{padding-top:12px;}
.sp-result-card{background:linear-gradient(135deg,#0f766e 0%,#0d9488 60%,#14b8a6 100%);color:#fff;border-radius:14px;padding:22px 22px 20px;box-shadow:0 12px 32px -8px rgba(13,148,136,0.35);}
.sp-result-card .sp-label{font-size:11.5px;text-transform:uppercase;letter-spacing:0.8px;opacity:0.85;margin:0 0 6px;font-weight:600;}
.sp-result-card .sp-big{font-family:'Poppins',sans-serif;font-size:clamp(34px,5.5vw,46px);font-weight:800;letter-spacing:-1px;margin:0;font-variant-numeric:tabular-nums;}
.sp-result-card .sp-sub{margin:4px 0 0;font-size:13px;opacity:0.9;font-variant-numeric:tabular-nums;}
.sp-result-card .sp-period-switch{display:inline-flex;background:rgba(255,255,255,0.18);border-radius:8px;padding:3px;gap:2px;margin-top:14px;}
.sp-result-card .sp-period-switch button{background:transparent;border:0;padding:5px 11px;border-radius:6px;font:inherit;font-size:11.5px;font-weight:600;color:rgba(255,255,255,0.85);cursor:pointer;}
.sp-result-card .sp-period-switch button.on{background:#fff;color:#0f766e;}
.sp-bd{width:100%;border-collapse:collapse;font-size:13.5px;font-variant-numeric:tabular-nums;}
.sp-bd td{padding:8px 4px;border-bottom:1px solid #f1f5f9;}
.sp-bd td:first-child{color:#334155;}
.sp-bd td:last-child{text-align:right;font-weight:600;color:#0f172a;}
.sp-bd tr.sp-bd-sub td{color:#64748b;font-size:12.5px;padding-left:20px;border-bottom:1px dashed #f1f5f9;}
.sp-bd tr.sp-bd-sub td:last-child{font-weight:500;color:#475569;}
.sp-bd tr.sp-bd-section td{padding-top:14px;font-weight:700;text-transform:uppercase;font-size:11.5px;letter-spacing:0.6px;color:#0d9488;border-bottom:1px solid #99f6e4;}
.sp-bd tr.sp-bd-total td{font-weight:700;font-size:14px;color:#0f172a;padding-top:12px;border-top:2px solid #0d9488;border-bottom:0;}
.sp-bd tr.sp-bd-net td{background:#f0fdfa;font-weight:800;color:#0f766e;font-size:15px;padding:12px 8px;}
.sp-bd .neg{color:#dc2626;}
.sp-bd .pos{color:#0f766e;}
.sp-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;}
.sp-chip{background:#f0fdfa;color:#0f766e;font-size:11.5px;font-weight:600;padding:5px 10px;border-radius:999px;border:1px solid #99f6e4;font-variant-numeric:tabular-nums;}
.sp-foot{font-size:11.5px;color:#94a3b8;text-align:center;margin:10px 0 0;line-height:1.5;}
.sp-reset{display:inline-flex;align-items:center;gap:5px;background:transparent;border:0;color:#0d9488;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;padding:6px 0;}
.sp-reset:hover{text-decoration:underline;}
.sp-card .sp-reset-row{display:flex;justify-content:flex-end;margin-top:6px;}