/* =============================================================================
   JA Moments — Brand design tokens (source of truth)
   Loaded on Filament + public surfaces. Do not redefine these elsewhere.
   ============================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500&family=Outfit:wght@300;400;500;600;700&display=swap');

:root {
    /* Surfaces */
    --jm-black: #07080A;
    --jm-black-soft: #0B0E13;
    --jm-surface: #111620;
    --jm-surface-raised: #151B27;
    --jm-surface-hover: #1A2130;

    /* Text */
    --jm-ivory: #F6F0E6;
    --jm-ivory-muted: #D8D0C4;
    --jm-text: #F7F3EC;
    --jm-text-muted: #AFA99F;

    /* Accents */
    --jm-gold: #C9A45D;
    --jm-gold-light: #E3C781;
    --jm-gold-dark: #96733A;
    --jm-purple: #8B46E8;
    --jm-magenta: #D93B9D;

    /* Status */
    --jm-success: #24B47E;
    --jm-warning: #E6A93E;
    --jm-danger: #E45766;
    --jm-info: #4B9FFF;

    /* Borders / depth */
    --jm-border: rgba(201, 164, 93, 0.18);
    --jm-border-strong: rgba(201, 164, 93, 0.50);
    --jm-radius-sm: 10px;
    --jm-radius-md: 14px;
    --jm-radius-lg: 18px;
    --jm-shadow-card: 0 16px 45px rgba(0, 0, 0, 0.22);
    --jm-shadow-gold: 0 0 24px rgba(201, 164, 93, 0.14);

    /* Typography */
    --jm-font-sans: "Outfit", "Segoe UI", system-ui, sans-serif;
    --jm-font-serif: "Cormorant Garamond", "Times New Roman", Georgia, serif;

    /* Legacy aliases (kept for existing selectors in jm-ds / filament overlays) */
    --jm-bg: var(--jm-black);
    --jm-bg-2: var(--jm-black-soft);
    --jm-sidebar: var(--jm-surface);
    --jm-card: var(--jm-surface-raised);
    --jm-card-2: var(--jm-surface-hover);
    --jm-card-hover: var(--jm-surface-hover);
    --jm-muted: var(--jm-text-muted);
    --jm-gold-2: var(--jm-gold-light);
    --jm-gold-soft: rgba(201, 164, 93, 0.16);
    --jm-nav-active: rgba(201, 164, 93, 0.14);
    --jm-success-bg: rgba(36, 180, 126, 0.16);
    --jm-warn: var(--jm-warning);
    --jm-warn-bg: rgba(230, 169, 62, 0.16);
    --jm-danger-bg: rgba(228, 87, 102, 0.14);
    --jm-radius: var(--jm-radius-md);
    --jm-shadow: var(--jm-shadow-card);
    --jm-sidebar-width: 16.75rem;
    --jm-page-max: 78rem;
    --jm-gap: 1.15rem;
    --jm-field-h: 2.75rem;
    --jm-btn-h: 2.5rem;
    --jm-touch: 2.75rem;
}

/* ——— Logo sizing (transparent assets only) ——— */

.jm-logo {
    display: block;
    height: auto;
    max-width: 100%;
    object-fit: contain;
    background: transparent !important;
}

.jm-logo--horizontal,
.jm-logo--lockup {
    width: 11rem;
    height: auto;
}

.jm-logo--stacked,
.jm-logo--login {
    width: 9.25rem;
    height: auto;
}

.jm-logo--mark,
.jm-logo--monogram {
    width: 2.5rem;
    height: 2.5rem;
}

.jm-brand {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
}

.jm-brand img,
.jm-brand__lockup {
    display: block;
    object-fit: contain;
    background: transparent !important;
}

.jm-brand__lockup {
    width: auto;
    height: 2.45rem;
}

/* Guest / public signatures */
.jm-guest-sign {
    display: flex;
    justify-content: center;
    margin-top: 1.75rem;
    padding-top: 1rem;
    opacity: 0.88;
}

.jm-guest-sign .jm-logo--horizontal,
.jm-guest-sign .jm-logo--lockup {
    width: 8.25rem;
}

.jm-guest-sign--wedding {
    margin-top: 2rem;
    padding-bottom: 0.25rem;
    opacity: 0.72;
}

.jm-guest-sign--wedding .jm-logo--horizontal,
.jm-guest-sign--wedding .jm-logo--lockup {
    width: 7.25rem;
}

.stv-brand-sign,
.ws-brand-sign {
    position: absolute;
    right: 1.35rem;
    bottom: 1.1rem;
    z-index: 6;
    width: 2.65rem;
    height: 2.65rem;
    pointer-events: none;
    opacity: 0.78;
}

.stv-screen--preview .stv-brand-sign,
.ws-screen--preview .ws-brand-sign {
    width: 1.65rem;
    height: 1.65rem;
    right: 0.55rem;
    bottom: 0.45rem;
    opacity: 0.65;
}

.ctl-brand-lockup {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.ctl-brand-lockup .jm-logo--horizontal,
.ctl-brand-lockup .jm-logo--lockup {
    width: 9.5rem;
}

.ctl-login__logo {
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
}

.ctl-login__logo .jm-logo--stacked,
.ctl-login__logo .jm-logo--login {
    width: 8.5rem;
}

.jamoments-official-lockup {
    display: flex;
    justify-content: center;
    margin: 0 auto 1.25rem;
}

.jamoments-official-lockup .jm-logo--stacked,
.jamoments-official-lockup .jm-logo--login {
    width: min(11.5rem, 58vw);
}

@media (max-width: 480px) {
    .jm-guest-sign .jm-logo--horizontal,
    .jm-guest-sign .jm-logo--lockup {
        width: 7.5rem;
    }
}