/* Silverman Patron Ticker — account page form */

/* ────────────────────────────────────────────
   My Account menu link — matches existing SSS pattern
   (icon + colours follow your woocommerce-MyAccount-navigation rules)
   ──────────────────────────────────────────── */
.woocommerce-MyAccount-navigation-link--credit-settings a::before {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2 14.5 8 21 8.5 16.2 12.8 17.7 19 12 15.7 6.3 19 7.8 12.8 3 8.5 9.5 8z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2 14.5 8 21 8.5 16.2 12.8 17.7 19 12 15.7 6.3 19 7.8 12.8 3 8.5 9.5 8z'/%3E%3C/svg%3E");
}

/* ────────────────────────────────────────────
   Form
   ──────────────────────────────────────────── */
.spt-account {
    max-width: 640px;
    font-family: 'Lexend', sans-serif;
    color: #464646;
}

.spt-account__intro p {
    color: #555;
    font-size: .9rem;
    margin-bottom: .75rem;
    line-height: 1.6;
}

.spt-account__status {
    background: linear-gradient(135deg, rgba(68,158,144,0.06), rgba(144,68,158,0.06));
    border-radius: 4px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
    padding: .8rem 1rem;
    font-size: .9rem;
    margin: 1rem 0 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
}

.spt-status {
    padding: .15rem .55rem;
    border-radius: 3px;
    font-size: .8rem;
    font-weight: 600;
}
.spt-status--active   { background: #e6f7f5; color: #2F6E64; }
.spt-status--warning  { background: #fff7e0; color: #b48400; }
.spt-status--inactive { background: #f0f0f0; color: #666;     }

.spt-status-pledge { color: #888; font-size: .85rem; }

.spt-account__field { margin-bottom: 1.1rem; }

.spt-account__field label {
    display: block;
    font-weight: 500;
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #464646;
    margin-bottom: .35rem;
}

.spt-hint {
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    color: #888;
    font-size: .8rem;
}
.spt-hint--below {
    display: block;
    margin-top: .3rem;
}
.spt-counter {
    float: right;
    color: #aaa;
    font-size: .75rem;
    font-family: 'DM Mono', ui-monospace, monospace;
}

.spt-input {
    width: 100%;
    box-sizing: border-box;
    font-family: 'Lexend', sans-serif;
    font-size: .9rem;
    padding: .55rem .75rem;
    border: 1px solid #dde4e3;
    border-radius: 4px;
    background: #fafcfc;
    color: #464646;
    transition: border-color .15s, box-shadow .15s;
}
.spt-input:focus {
    border-color: #449E90;
    outline: none;
    box-shadow: 0 0 0 3px rgba(68,158,144,.12);
}

.spt-toggle {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-size: .9rem;
    cursor: pointer;
    user-select: none;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 500;
}
.spt-toggle input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #449E90;
    cursor: pointer;
}

.spt-account__notice {
    font-size: .8rem;
    color: #666;
    background: rgba(68,158,144,0.06);
    padding: .6rem .75rem;
    border-radius: 4px;
    margin: 1rem 0;
    line-height: 1.5;
}
.spt-account__notice code {
    background: rgba(0,0,0,0.05);
    padding: 1px 5px;
    border-radius: 3px;
    font-family: 'DM Mono', ui-monospace, monospace;
    font-size: .85em;
}

.spt-result {
    padding: .75rem 1rem;
    border-radius: 4px;
    font-size: .875rem;
    margin: 1rem 0;
}
.spt-result--success { background: #e6f7f5; color: #2F6E64; border-left: 3px solid #449E90; }
.spt-result--error   { background: #fff0f0; color: #cc4444; border-left: 3px solid #FF6060; }

.spt-submit {
    background: #449E90;
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: .6rem 1.5rem;
    font-family: 'Lexend', sans-serif;
    font-size: .9rem;
    font-weight: 500;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,.12);
    transition: opacity .15s, transform .1s;
}
.spt-submit:hover  { opacity: .85; }
.spt-submit:active { transform: translateY(1px); }
.spt-submit:disabled { opacity: .5; cursor: not-allowed; }

/* ────────────────────────────────────────────
   Preview wrapper — minimal scaffolding only.

   v1.5.0: Dedicated preview styling has been removed. The preview
   inherits .spt-wrap / .spt-ticker / .spt-patron / tier styles from
   the global theme CSS so the visuals stay aligned with the live
   ticker without drift. The only rules below are layout shims to
   stop the preview animating itself or being clipped by the
   overflow mask.
   ──────────────────────────────────────────── */
.spt-account__preview-wrap {
    margin-top: 2rem;
}
.spt-preview-label {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #888;
    margin-bottom: .4rem;
}
.spt-account__preview-wrap .spt-ticker--preview {
    overflow: visible;
    -webkit-mask-image: none;
            mask-image: none;
}
.spt-account__preview-wrap .spt-ticker-track--preview {
    animation: none !important;
    transform: none !important;
}

/* ────────────────────────────────────────────
   Inline notice (still used for tier/declined info)
   ──────────────────────────────────────────── */
.spt-account__notice--info {
    font-size: .85rem;
    color: #555;
    background: rgba(68,158,144,0.04);
    padding: .65rem .85rem;
    border-radius: 4px;
    border-left: 3px solid rgba(68,158,144,0.4);
    margin: 1rem 0 1.5rem;
    line-height: 1.55;
}

/* ────────────────────────────────────────────
   Tier-locked fields (v1.1.0)
   ──────────────────────────────────────────── */
.spt-account__field--locked {
    opacity: 0.85;
}
.spt-locked-field {
    background: linear-gradient(135deg, rgba(144,68,158,0.06), rgba(68,158,144,0.06));
    border-radius: 4px;
    padding: .8rem 1rem;
    font-size: .85rem;
    color: #555;
    line-height: 1.5;
    box-shadow: inset 0 0 0 1px rgba(144,68,158,0.15);
    display: flex;
    align-items: flex-start;
    gap: .6rem;
}
.spt-lock-icon {
    flex-shrink: 0;
    font-size: 1.1rem;
    line-height: 1;
    margin-top: 1px;
}

/* ────────────────────────────────────────────
   Unlinked account / connect-to-Patreon prompt (v1.1.0)
   ──────────────────────────────────────────── */
.spt-account--unlinked {
    max-width: 640px;
}
.spt-account--unlinked h3 {
    color: #2F6E64;
    font-family: 'Lexend', sans-serif;
    font-weight: 600;
}
.spt-account--unlinked p {
    margin: 0 0 .85rem;
    line-height: 1.6;
    font-size: .95rem;
}
.spt-account__cta {
    margin: 1.25rem 0 1rem;
}
.spt-submit--patreon {
    display: inline-block;
    background: #FF424D; /* Patreon's brand red */
    color: #fff !important;
    text-decoration: none !important;
    padding: .7rem 1.5rem;
    border-radius: 4px;
    font-family: 'Lexend', sans-serif;
    font-size: .95rem;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(255,66,77,0.3);
    transition: opacity .15s, transform .1s;
}
.spt-submit--patreon:hover {
    opacity: .88;
    color: #fff !important;
}
.spt-submit--patreon:active { transform: translateY(1px); }

/* ────────────────────────────────────────────
   Live-view link in save success message (v1.3.0)
   ──────────────────────────────────────────── */
.spt-result-link {
    display: inline-block;
    margin-left: .35rem;
    color: #2F6E64;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.spt-result-link:hover { color: #449E90; }