/* Stock alerts plugin: structural styles. Colours come from the active theme's tokens. */
.sa-box {
    --sa-primary: var(--color-theme-primary, var(--theme-primary, #10b981));
    --sa-on-primary: var(--color-theme-on-primary, var(--theme-on-primary, #fff));
    --sa-text: var(--color-theme-text, var(--theme-text, #18181b));
    --sa-muted: var(--color-theme-muted, var(--theme-text-muted, #71717a));
    --sa-border: var(--color-theme-border, var(--theme-border, #e4e4e7));
    --sa-surface: var(--color-theme-surface, var(--theme-surface, #fff));
    margin-top: 1rem;
    padding: 1rem 1.125rem;
    border: 1px solid var(--sa-border);
    border-radius: .75rem;
    background: var(--sa-surface);
    color: var(--sa-text);
    text-align: left;
}
.sa-box *, .sa-box *::before, .sa-box *::after { box-sizing: border-box; }
.sa-title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .25rem; font-size: .95rem; font-weight: 700; color: var(--sa-text); }
.sa-title svg { width: 1.125rem; height: 1.125rem; color: var(--sa-primary); flex-shrink: 0; }
.sa-text { margin: 0 0 .75rem; font-size: .85rem; line-height: 1.5; color: var(--sa-muted); }
.sa-form { display: flex; flex-wrap: wrap; gap: .5rem; }
.sa-input {
    flex: 1 1 12rem; min-width: 0; height: 2.75rem; padding: 0 .875rem;
    border: 1px solid var(--sa-border); border-radius: .5rem;
    background: transparent; color: var(--sa-text); font-size: .9rem;
}
.sa-input:focus { outline: 2px solid var(--sa-primary); outline-offset: 1px; }
.sa-button {
    height: 2.75rem; padding: 0 1.25rem; border: 0; border-radius: .5rem; cursor: pointer;
    background: var(--sa-primary); color: var(--sa-on-primary); font-weight: 600; font-size: .9rem;
}
.sa-button:disabled { opacity: .6; cursor: wait; }
.sa-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.sa-error { width: 100%; margin: .25rem 0 0; font-size: .8rem; color: #dc2626; }
.sa-note { margin: .5rem 0 0; font-size: .75rem; color: var(--sa-muted); }
.sa-success { display: flex; gap: .5rem; align-items: flex-start; margin: 0; font-size: .875rem; line-height: 1.5; color: var(--sa-text); }
.sa-success svg { width: 1.25rem; height: 1.25rem; color: var(--sa-primary); flex-shrink: 0; }
