/* ---- plan widgets (purchase window and Manage Plan) ---- */
.pw-section-title { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-4); margin-bottom: 4px; }
.pw-note { margin: 0 0 8px; font-size: 12px; line-height: 1.5; color: var(--text-4); }
.pw-addon { display: grid; grid-template-columns: 1fr auto auto; gap: 14px; align-items: center; padding: 11px 12px; margin-bottom: 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-bg); }
.pw-addon.on { border-color: var(--accent); }
.pw-toggle { cursor: pointer; }
.pw-addon-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pw-addon-text strong { font-size: 13px; color: var(--text); }
.pw-addon-text span { font-size: 12px; color: var(--text-4); }
.pw-addon-text .pw-addon-effect { color: var(--accent); }
.pw-addon-price { font-size: 12px; color: var(--text-3, var(--text-4)); white-space: nowrap; }
.pw-check { width: 18px; height: 18px; accent-color: var(--accent); cursor: pointer; }
.pw-stepper { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.pw-stepper button { width: 30px; height: 30px; border: 0; background: var(--bg-sunken); color: var(--text); font-size: 16px; cursor: pointer; }
.pw-stepper button:hover { background: var(--accent); color: #fff; }
.pw-stepper output { min-width: 34px; text-align: center; font-size: 13px; font-weight: 700; color: var(--text); }
.pw-summary-box { margin-top: 4px; }
.pw-summary-title { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-4); margin: 6px 0 2px; }
.pw-summary { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.pw-summary th { text-align: left; width: 38%; padding: 6px 0; color: var(--text-4); font-weight: 600; border-bottom: 1px solid var(--line); vertical-align: top; }
.pw-summary td { padding: 6px 0; color: var(--text); border-bottom: 1px solid var(--line); }
.pw-dim { color: var(--text-4); font-size: 11.5px; }
@media (max-width: 560px) { .pw-addon { grid-template-columns: 1fr auto; } .pw-addon-price { grid-column: 1; } }

/* ---- buttons used inside the Plan tab (self-contained: the profile page does not load pricing.css) ---- */
.mp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 8px 14px; border-radius: 8px;
  border: 1px solid var(--line); background: var(--panel-bg); color: var(--text); font-size: 12.5px; font-weight: 600;
  cursor: pointer; text-decoration: none;
}
.mp-btn:hover { border-color: var(--accent); }
.mp-btn:disabled { opacity: .5; cursor: default; }
.mp-btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.mp-btn-primary:hover { filter: brightness(1.08); }