/**
 * Invitea Luxury Sidebar Visual Refinement
 * Version 0.68.15
 *
 * Final visual pass for the Invitea app sidebar. Scoped to the standalone
 * Invitea app only; it does not affect the public site or /i/{slug} pages.
 */

body.invitea-standalone-app-page {
    --invitea-sidebar-width: 300px;
    --invitea-luxury-ink: #2b2430;
    --invitea-luxury-muted: #7b6b73;
    --invitea-luxury-gold: #c78226;
    --invitea-luxury-gold-deep: #8d510d;
    --invitea-luxury-rose: #c9556b;
    --invitea-luxury-rose-soft: #fff0ef;
    --invitea-luxury-cream: #fffaf5;
    --invitea-luxury-border: rgba(202, 135, 58, .26);
    --invitea-luxury-shadow: 24px 0 70px rgba(93, 56, 23, .105);
}

/* Ivory glass sidebar panel with subtle frame and depth. */
body.invitea-standalone-app-page .invitea-v9-sidebar,
body.invitea-standalone-app-page .invitea-app-shell__sidebar {
    padding: 38px 22px 24px !important;
    border-right: 1px solid var(--invitea-luxury-border) !important;
    background:
        radial-gradient(circle at 50% -10%, rgba(255, 232, 207, .95) 0%, rgba(255, 232, 207, .20) 34%, transparent 62%),
        radial-gradient(circle at 0% 92%, rgba(255, 230, 225, .72) 0%, rgba(255, 230, 225, .18) 34%, transparent 62%),
        linear-gradient(180deg, #fffdf9 0%, #fff8f1 46%, #fffaf6 100%) !important;
    box-shadow: var(--invitea-luxury-shadow) !important;
}

body.invitea-standalone-app-page .invitea-v9-sidebar::before,
body.invitea-standalone-app-page .invitea-app-shell__sidebar::before {
    content: "";
    position: absolute;
    inset: 14px 12px 14px 12px;
    border: 1px solid rgba(202, 135, 58, .12);
    border-radius: 0 38px 38px 0;
    pointer-events: none;
    z-index: -1;
    background:
        linear-gradient(180deg, rgba(255,255,255,.30), transparent 30%),
        radial-gradient(circle at 80% 8%, rgba(255,255,255,.65), transparent 28%);
}

/* Decorative side rail: thin, premium, and not noisy. */
body.invitea-standalone-app-page .invitea-v9-sidebar > .invitea-v9-brand::after,
body.invitea-standalone-app-page .invitea-app-shell__brand::after {
    content: "";
    width: 54px;
    height: 1px;
    margin-top: 15px;
    display: block;
    background: linear-gradient(90deg, transparent, rgba(201,132,43,.55), transparent);
}

/* Stronger luxury brand mark. */
body.invitea-standalone-app-page .invitea-v9-brand,
body.invitea-standalone-app-page .invitea-app-shell__brand {
    margin-bottom: 34px !important;
    padding-bottom: 14px !important;
}

body.invitea-standalone-app-page .invitea-v9-brand::before,
body.invitea-standalone-app-page .invitea-app-shell__brand::before {
    content: "∞" !important;
    width: 34px !important;
    height: 24px !important;
    margin-bottom: 2px !important;
    color: var(--invitea-luxury-gold) !important;
    font-family: var(--invitea-font-logo, 'Cormorant Garamond', Georgia, serif) !important;
    font-size: 28px !important;
    font-weight: 700;
    line-height: 1;
    filter: drop-shadow(0 9px 18px rgba(201,132,43,.18));
}

body.invitea-standalone-app-page .invitea-v9-brand strong,
body.invitea-standalone-app-page .invitea-app-shell__brand strong {
    font-family: var(--invitea-font-logo, 'Cormorant Garamond', Georgia, serif) !important;
    font-style: italic !important;
    font-size: 48px !important;
    font-weight: 700 !important;
    letter-spacing: -.055em !important;
    color: transparent !important;
    background: linear-gradient(135deg, #7f4507 0%, #c47b20 32%, #e8c47e 57%, #9d5c0d 86%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    text-shadow: 0 18px 34px rgba(201,132,43,.13) !important;
}

body.invitea-standalone-app-page .invitea-v9-brand span,
body.invitea-standalone-app-page .invitea-app-shell__brand small {
    margin-top: 6px;
    color: var(--invitea-luxury-gold-deep) !important;
    font-family: var(--invitea-font-body, 'Poppins', sans-serif) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .27em !important;
}

/* Menu: more refined icon boxes, stronger hover, cleaner active item. */
body.invitea-standalone-app-page .invitea-v9-nav,
body.invitea-standalone-app-page .invitea-app-shell__nav {
    gap: 9px !important;
}

body.invitea-standalone-app-page .invitea-v9-nav__item,
body.invitea-standalone-app-page .invitea-app-shell__nav-item {
    min-height: 54px !important;
    padding: 12px 13px !important;
    gap: 13px !important;
    border-radius: 17px !important;
    font-size: 14.5px !important;
    font-weight: 650 !important;
    color: #302936 !important;
}

body.invitea-standalone-app-page .invitea-v9-nav__item span,
body.invitea-standalone-app-page .invitea-app-shell__nav-item span {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    border-radius: 13px !important;
    color: #6f6571 !important;
    background: rgba(255, 255, 255, .78) !important;
    border: 1px solid rgba(47, 38, 49, .08) !important;
    box-shadow: 0 8px 20px rgba(93, 56, 23, .045), inset 0 1px 0 rgba(255,255,255,.9);
}

body.invitea-standalone-app-page .invitea-v9-nav__item:hover,
body.invitea-standalone-app-page .invitea-app-shell__nav-item:hover {
    transform: translateX(4px) !important;
    background: rgba(255, 245, 243, .78) !important;
    border-color: rgba(201,132,43,.15) !important;
    color: var(--invitea-luxury-rose) !important;
    box-shadow: 0 10px 24px rgba(216,107,122,.07) !important;
}

body.invitea-standalone-app-page .invitea-v9-nav__item.is-active,
body.invitea-standalone-app-page .invitea-app-shell__nav-item.is-active {
    color: #b9485b !important;
    border-color: rgba(216,107,122,.18) !important;
    background:
        linear-gradient(135deg, rgba(255,238,238,.98), rgba(255,247,243,.95) 58%, rgba(255,252,248,.98)) !important;
    box-shadow: 0 18px 38px rgba(216,107,122,.13), inset 0 1px 0 rgba(255,255,255,.92) !important;
}

body.invitea-standalone-app-page .invitea-v9-nav__item.is-active::before,
body.invitea-standalone-app-page .invitea-app-shell__nav-item.is-active::before {
    left: 0 !important;
    width: 4px !important;
    height: 32px !important;
    border-radius: 0 999px 999px 0 !important;
    background: linear-gradient(180deg, #d86b7a, #c78226) !important;
    opacity: 1 !important;
}

body.invitea-standalone-app-page .invitea-v9-nav__item.is-active span,
body.invitea-standalone-app-page .invitea-app-shell__nav-item.is-active span {
    color: #c9556b !important;
    border-color: rgba(216,107,122,.25) !important;
    background: #fff !important;
    box-shadow: 0 10px 24px rgba(216,107,122,.12), inset 0 1px 0 rgba(255,255,255,.96) !important;
}

/* Replace the bottom card feel with a luxury membership tile. */
body.invitea-standalone-app-page .invitea-v9-sidebar-bottom-card,
body.invitea-standalone-app-page .invitea-v9-scope-card,
body.invitea-standalone-app-page .invitea-app-shell__scope-card--refined,
body.invitea-standalone-app-page .invitea-app-shell__scope-card {
    margin-top: 32px !important;
    padding: 18px 16px 16px !important;
    border-radius: 26px !important;
    border: 1px solid rgba(201,132,43,.34) !important;
    background:
        radial-gradient(circle at 50% -6%, rgba(255,234,207,.95), rgba(255,234,207,.18) 46%, transparent 68%),
        linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,249,242,.98)) !important;
    box-shadow: 0 20px 42px rgba(93,56,23,.09), inset 0 1px 0 rgba(255,255,255,.98) !important;
}

body.invitea-standalone-app-page .invitea-v9-scope-card__badge,
body.invitea-standalone-app-page .invitea-app-shell__scope-card-icon {
    width: 42px !important;
    height: 42px !important;
    margin: -3px auto 11px !important;
    color: #a96312 !important;
    background:
        linear-gradient(135deg, #fff4df, #fff),
        radial-gradient(circle at 34% 26%, rgba(255,255,255,.9), transparent 34%) !important;
    border: 1px solid rgba(201,132,43,.29) !important;
    box-shadow: 0 12px 26px rgba(201,132,43,.15) !important;
}

body.invitea-standalone-app-page .invitea-v9-scope-card__eyebrow,
body.invitea-standalone-app-page .invitea-app-shell__scope-card--refined strong {
    color: var(--invitea-luxury-gold-deep) !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: .18em !important;
}

body.invitea-standalone-app-page .invitea-v9-scope-card__rule,
body.invitea-standalone-app-page .invitea-app-shell__scope-card--refined {
    border-color: rgba(201,132,43,.15) !important;
}

body.invitea-standalone-app-page .invitea-v9-scope-card__rule strong,
body.invitea-standalone-app-page .invitea-v9-scope-card__rule span,
body.invitea-standalone-app-page .invitea-app-shell__scope-card--refined span {
    font-family: var(--invitea-font-heading, 'Playfair Display', Georgia, serif) !important;
    font-size: 15.5px !important;
    font-weight: 700 !important;
    color: var(--invitea-luxury-ink) !important;
}

body.invitea-standalone-app-page .invitea-v9-scope-card__plan {
    background: rgba(255, 249, 241, .92) !important;
    border-color: rgba(201,132,43,.18) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.86);
}

body.invitea-standalone-app-page .invitea-v9-scope-card__link,
body.invitea-standalone-app-page .invitea-app-shell__scope-card--refined a {
    min-height: 38px !important;
    background: linear-gradient(135deg, #dc942d, #b86a17 56%, #9c570c) !important;
    box-shadow: 0 12px 24px rgba(184,107,24,.18) !important;
    letter-spacing: .01em;
}

/* More wedding-like floral corner; no abstract dots. */
body.invitea-standalone-app-page .invitea-v9-sidebar::after,
body.invitea-standalone-app-page .invitea-app-shell__sidebar::after {
    left: -8px !important;
    right: auto !important;
    bottom: -20px !important;
    width: 220px !important;
    height: 205px !important;
    opacity: .56 !important;
    background:
        radial-gradient(ellipse at 44% 62%, rgba(232, 158, 142, .44) 0 8%, transparent 9%),
        radial-gradient(ellipse at 37% 55%, rgba(255, 221, 211, .74) 0 8%, transparent 9%),
        radial-gradient(ellipse at 52% 55%, rgba(255, 221, 211, .72) 0 8%, transparent 9%),
        radial-gradient(ellipse at 43% 47%, rgba(244, 187, 166, .52) 0 7%, transparent 8%),
        radial-gradient(ellipse at 50% 47%, rgba(244, 187, 166, .48) 0 7%, transparent 8%),
        radial-gradient(ellipse at 27% 74%, rgba(158, 178, 126, .35) 0 6%, transparent 7%),
        radial-gradient(ellipse at 66% 78%, rgba(158, 178, 126, .30) 0 6%, transparent 7%),
        linear-gradient(55deg, transparent 34%, rgba(201,132,43,.22) 35%, transparent 36%),
        linear-gradient(80deg, transparent 42%, rgba(201,132,43,.13) 43%, transparent 45%) !important;
    filter: blur(.05px) !important;
}

/* Give the main app more room by preventing the sidebar from visually feeling cramped. */
body.invitea-standalone-app-page .invitea-dashboard-v9,
body.invitea-standalone-app-page .invitea-app-shell {
    grid-template-columns: var(--invitea-sidebar-width) minmax(0, 1fr) !important;
}

@media (max-width: 1024px) {
    body.invitea-standalone-app-page .invitea-v9-sidebar,
    body.invitea-standalone-app-page .invitea-app-shell__sidebar {
        padding: 14px 16px !important;
        background: linear-gradient(180deg, #fffdf9, #fff8f1) !important;
    }

    body.invitea-standalone-app-page .invitea-v9-brand,
    body.invitea-standalone-app-page .invitea-app-shell__brand {
        margin-bottom: 12px !important;
        padding-bottom: 4px !important;
    }

    body.invitea-standalone-app-page .invitea-v9-brand::before,
    body.invitea-standalone-app-page .invitea-app-shell__brand::before,
    body.invitea-standalone-app-page .invitea-v9-brand::after,
    body.invitea-standalone-app-page .invitea-app-shell__brand::after {
        display: none !important;
    }

    body.invitea-standalone-app-page .invitea-v9-brand strong,
    body.invitea-standalone-app-page .invitea-app-shell__brand strong {
        font-size: 32px !important;
    }

    body.invitea-standalone-app-page .invitea-v9-nav__item,
    body.invitea-standalone-app-page .invitea-app-shell__nav-item {
        min-height: 44px !important;
        padding: 9px 12px !important;
    }

    body.invitea-standalone-app-page .invitea-v9-nav__item span,
    body.invitea-standalone-app-page .invitea-app-shell__nav-item span {
        width: 26px !important;
        min-width: 26px !important;
        height: 26px !important;
    }

    body.invitea-standalone-app-page .invitea-v9-sidebar::after,
    body.invitea-standalone-app-page .invitea-app-shell__sidebar::after {
        content: none !important;
    }
}