/**
 * Draft keeper — the "We kept your unsaved text" bar (16 Oct 2026).
 * Values from the trace page tokens (assets/css/inquiry-trace.css): card #fff,
 * border #e5e5e5, muted #737373, radius 0.75rem / 0.5rem, violet #7700FF,
 * navy #090920. Light only. Buttons follow .ss-btn (violet pill + outline);
 * two-class selectors so the Traveler theme's gold .btn / button cannot win.
 */
.ss-draft-note {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    box-sizing: border-box;
    width: 100%;
    margin: 0 0 12px;
    padding: 10px 14px;
    font-family: "Google Sans", system-ui, -apple-system, sans-serif;
    font-size: 13.5px;
    line-height: 1.45;
    color: #090920;
    background: #f7f2ff;              /* violet #7700FF at a soft tint */
    border: 1px solid #e5e5e5;
    border-left: 3px solid #7700FF;
    border-radius: 0.5rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    text-align: left;
}
.ss-draft-note .ss-draft-note__icon { display: inline-flex; color: #7700FF; flex: 0 0 auto; }
.ss-draft-note .ss-draft-note__icon svg { width: 16px; height: 16px; }
.ss-draft-note .ss-draft-note__text { flex: 1 1 200px; min-width: 0; }
.ss-draft-note .ss-draft-note__actions { display: inline-flex; gap: 8px; flex: 0 0 auto; }

.ss-draft-note button.ss-draft-note__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 6px 16px;
    min-height: 32px;
    font-family: "Google Sans", system-ui, -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
    border-radius: 999px;
    border: 1px solid #7700FF;
    box-shadow: none;
    cursor: pointer;
    width: auto;
    height: auto;
}
.ss-draft-note button.ss-draft-note__btn.ss-btn--primary { background: #7700FF; color: #fff; }
.ss-draft-note button.ss-draft-note__btn.ss-btn--primary:hover { background: #6300d6; border-color: #6300d6; color: #fff; }
.ss-draft-note button.ss-draft-note__btn.ss-btn--outline { background: #fff; color: #7700FF; }
.ss-draft-note button.ss-draft-note__btn.ss-btn--outline:hover { background: #f5f1ff; color: #7700FF; }
.ss-draft-note button.ss-draft-note__btn:focus-visible { outline: 2px solid #7700FF; outline-offset: 2px; }

@media (max-width: 480px) {
    .ss-draft-note { padding: 10px 12px; font-size: 13px; }
    .ss-draft-note .ss-draft-note__actions { width: 100%; }
    .ss-draft-note .ss-draft-note__actions .ss-draft-note__btn { flex: 1 1 0; }
}
/* Restore read black on the verification form (a form-wide button rule won): the main answer is always white on
   violet (Chiran, 31 Oct 2026). */
html body .ss-draft-note button.ss-draft-note__btn.ss-btn--primary,
html body .sdb .vfr .ss-draft-note button.ss-draft-note__btn.ss-btn--primary { color: #fff !important; background: linear-gradient(90deg, #5A00C8, #7700FF) !important; border-color: transparent !important; }
