:root {
    /* Shared background for the light-mode wedding sidebar and save bars. */
    --brand-admin-surface-light: #f5f5f5;
}

.sidebar-menu-item__link.couple-wedding-sidebar-title {
    color: var(--w-color-text-label-menus-default);
    cursor: default;
    min-height: auto;
    padding: 0.75rem 1.25rem 0.5rem;
    pointer-events: none;
}

.couple-wedding-sidebar-title .menuitem-label {
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.3;
    margin-inline-start: 0;
    text-align: start;
    white-space: normal;
}

.sidebar--slim .couple-wedding-sidebar-title {
    display: none;
}

.w-theme-light.w-contrast-more :is(.sidebar, .sidebar-loading) {
    border-inline-end: 1px solid var(--w-color-border-furniture-more-contrast);
}

.w-theme-light :is(.account-settings #w-editor-form, #wedding-page-form) .footer__container {
    background-color: var(--brand-admin-surface-light);
    color:var(--w-color-text-label);
}

.w-theme-light :is(.account-settings #w-editor-form, #wedding-page-form) .footer__save-warning span {
    color:inherit;
}

.w-theme-light .wedding-sidebar-view #wagtail-sidebar {
    --w-color-surface-menu-item-active: #dedede;
    --w-color-surface-menu-item-hover: #e8e8e8;
    --w-color-text-label-menus-default: #404040;
    --w-color-text-label-menus-active: #292929;
    --w-color-text-label-menus-hover: #292929;
    background-color: var(--brand-admin-surface-light);
}

.w-theme-light .wedding-sidebar-view #wagtail-sidebar :is(.sidebar, .sidebar-loading, .sidebar__inner, .sidebar-loading__inner, .sidebar-footer, .sidebar-footer__account, .sidebar-nav-toggle--mobile, .sidebar-close-menu-button) {
    background-color: var(--brand-admin-surface-light);
}

.w-theme-light .wedding-sidebar-view #wagtail-sidebar :is(.sidebar-nav-toggle--mobile, .sidebar-close-menu-button):hover,
.w-theme-light .wedding-sidebar-view #wagtail-sidebar .sidebar-footer__account:is(:hover, :focus) {
    background-color: var(--w-color-surface-menu-item-active);
}

.w-theme-light .wedding-sidebar-view #wagtail-sidebar :is(.c-page-explorer__item__link, .c-page-explorer__item__action, .c-page-explorer__header__title):is(:hover, :focus),
.w-theme-light .wedding-sidebar-view #wagtail-sidebar .c-page-explorer__header__select {
    background-color: var(--brand-admin-surface-light);
}

.w-theme-light .wedding-sidebar-view #wagtail-sidebar :is(.c-page-explorer__item, .c-page-explorer__header),
.w-theme-light .wedding-sidebar-view #wagtail-sidebar .c-page-explorer__item > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--brand-admin-surface-light);
}

.w-theme-light .wedding-sidebar-view #wagtail-sidebar .sidebar-menu-item__link:is(:hover, :focus),
.w-theme-light .wedding-sidebar-view #wagtail-sidebar .sidebar-menu-item--active,
.w-theme-light .wedding-sidebar-view #wagtail-sidebar .sidebar-sub-menu-item--open > .sidebar-menu-item__link {
    text-shadow: none;
}

.w-theme-light .wedding-sidebar-view #wagtail-sidebar .sidebar-menu-item__link:hover {
    font-weight: 700;
}

.w-theme-light .wedding-sidebar-view #wagtail-sidebar .sidebar-menu-item__link.couple-wedding-sidebar-title {
    color: var(--w-color-primary);
}

@media (prefers-color-scheme: light) {
    .w-theme-system :is(.account-settings #w-editor-form, #wedding-page-form) .footer__container {
        background-color: var(--brand-admin-surface-light);
        color:var(--w-color-text-label);
    }

    .w-theme-system :is(.account-settings #w-editor-form, #wedding-page-form) .footer__save-warning span {
        color:inherit;
    }

    .w-theme-system .wedding-sidebar-view #wagtail-sidebar {
        --w-color-surface-menu-item-active: #dedede;
        --w-color-surface-menu-item-hover: #e8e8e8;
        --w-color-text-label-menus-default: #404040;
        --w-color-text-label-menus-active: #292929;
        --w-color-text-label-menus-hover: #292929;
        background-color: var(--brand-admin-surface-light);
    }

    .w-theme-system .wedding-sidebar-view #wagtail-sidebar :is(.sidebar, .sidebar-loading, .sidebar__inner, .sidebar-loading__inner, .sidebar-footer, .sidebar-footer__account, .sidebar-nav-toggle--mobile, .sidebar-close-menu-button) {
        background-color: var(--brand-admin-surface-light);
    }

    .w-theme-system .wedding-sidebar-view #wagtail-sidebar :is(.sidebar-nav-toggle--mobile, .sidebar-close-menu-button):hover,
    .w-theme-system .wedding-sidebar-view #wagtail-sidebar .sidebar-footer__account:is(:hover, :focus) {
        background-color: var(--w-color-surface-menu-item-active);
    }

    .w-theme-system .wedding-sidebar-view #wagtail-sidebar :is(.c-page-explorer__item__link, .c-page-explorer__item__action, .c-page-explorer__header__title):is(:hover, :focus),
    .w-theme-system .wedding-sidebar-view #wagtail-sidebar .c-page-explorer__header__select {
        background-color: var(--brand-admin-surface-light);
    }

    .w-theme-system .wedding-sidebar-view #wagtail-sidebar :is(.c-page-explorer__item, .c-page-explorer__header),
    .w-theme-system .wedding-sidebar-view #wagtail-sidebar .c-page-explorer__item > :not([hidden]) ~ :not([hidden]) {
        border-color: var(--brand-admin-surface-light);
    }

    .w-theme-system .wedding-sidebar-view #wagtail-sidebar .sidebar-menu-item__link:is(:hover, :focus),
    .w-theme-system .wedding-sidebar-view #wagtail-sidebar .sidebar-menu-item--active,
    .w-theme-system .wedding-sidebar-view #wagtail-sidebar .sidebar-sub-menu-item--open > .sidebar-menu-item__link {
        text-shadow: none;
    }

    .w-theme-system .wedding-sidebar-view #wagtail-sidebar .sidebar-menu-item__link:hover {
        font-weight: 700;
    }

    .w-theme-system .wedding-sidebar-view #wagtail-sidebar .sidebar-menu-item__link.couple-wedding-sidebar-title {
        color: var(--w-color-primary);
    }
}

.wedding-context-container {
    padding-top: 20px;
}

.current-wedding-banner {
    align-items: center;
    background: #f5f5f5;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 20px;
    padding: 14px 16px;
}

.current-wedding-banner__couple { color: #666; }

.planning-preview-banner { flex-wrap: wrap; }
.planning-preview-banner > div { flex: 1 1 20rem; }
.planning-preview-banner > .button { flex-shrink: 0; }

.w-theme-dark .current-wedding-banner {
    background: var(--w-color-surface-menus);
    border-color: var(--w-color-grey-200);
    color: var(--w-color-white);
}

.w-theme-dark .current-wedding-banner__couple { color: var(--w-color-grey-200); }

@media (prefers-color-scheme: dark) {
    .w-theme-system .current-wedding-banner {
        background: var(--w-color-surface-menus);
        border-color: var(--w-color-grey-200);
        color: var(--w-color-white);
    }

    .w-theme-system .current-wedding-banner__couple { color: var(--w-color-grey-200); }
}
