@import url('https://fonts.googleapis.com/css2?family=Fjalla+One&family=Quicksand:wght@300..700&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Share+Tech&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

:root {--vp-ink: #090818; --vp-ink-soft: #4f4d63; --vp-heading: #12004a; --vp-light:#dddddd;
    --vp-muted: #77738a; --vp-on-dark: rgba(255, 255, 255, 0.88); --vp-night: #050513;
    --vp-purple: #3b0078; --vp-purple-2: #5a16c9; --vp-blue: #242378; --vp-magenta: #750c69;
    --vp-gold: #e4b91d; --vp-page: #f7f7fa;--vp-line: #eceaf3; --vp-light-grey:#ebebeb;
    --vp-card-shadow: 0 16px 40px rgba(10, 8, 24, 0.07); --vp-text-section: 1.05rem; 
    --vp-text-link: 0.9rem; --vp-text-item: 1rem; --vp-text-meta: 0.78rem; --vp-text-badge: 0.72rem; 
    --vp-text-media-title: 1.2rem; --vp-text-media-body: 0.92rem; --vp-text-feed-title: 1.18rem;
     --vp-text-feed-body: 0.94rem; --vp-text-feed-meta: 0.8rem; --vp-text-form: 0.95rem; 
     --bs-body-color: var(--vp-ink); --bs-body-bg: var(--vp-page); 
     --bs-body-font-family: "Outfit", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* Public pages use a dark theme with a slightly larger, readable type scale. */
html.vp-public-page, html.vp-auth-page-root {
    --vp-ink: #f5f2fa;
    --vp-ink-soft: #d4cfdd;
    --vp-heading: #ffffff;
    --vp-muted: #aaa4b8;
    --vp-page: #0c0c0c;
    --vp-line: rgba(255, 255, 255, 0.12);
    --vp-light-grey: #262626;
    --bs-body-color: var(--vp-ink);
    --bs-body-bg: var(--vp-page);
    --bs-secondary-color: #b8b2c3;
    --bs-tertiary-color: #a39dac;
    --bs-border-color: #404040;
    --vp-public-card-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
    font-size: 18px;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.24) transparent;
}

html.vp-public-page::-webkit-scrollbar, html.vp-auth-page-root::-webkit-scrollbar {
    width: 6px;
    height: 0;
}

html.vp-public-page::-webkit-scrollbar-track, html.vp-auth-page-root::-webkit-scrollbar-track  {
    background: transparent;
}

html.vp-public-page::-webkit-scrollbar-thumb, html.vp-auth-page-root::-webkit-scrollbar-thumb  {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.24);
}

html.vp-public-page::-webkit-scrollbar-thumb:hover {
    background: rgba(228, 185, 29, 0.65);
}

html.vp-public-page body {
    color: var(--vp-ink);
    /*background: var(--vp-page);*/
}

html.vp-public-page .card,
html.vp-public-page .card-body,
html.vp-public-page .card-footer,
html.vp-public-page .list-group {
    color: var(--vp-ink);
}

html.vp-public-page .list-group-item {
    color: var(--vp-ink);
    background-color: inherit;
    border-color: var(--vp-line);
}

html.vp-public-page .list-group-item-action:hover,
html.vp-public-page .list-group-item-action:focus {
    color: #fff;
    /*background-color: #202020;*/
}

html.vp-public-page .text-muted,
html.vp-public-page .text-secondary {
    color: var(--vp-muted) !important;
}

html.vp-public-page .form-control,
html.vp-public-page .form-select,
html.vp-public-page .modal-content {
    color: var(--vp-ink);
    background-color: #262626;
    border-color: #484848;
}

html.vp-public-page .form-control::placeholder,
html.vp-public-page input::placeholder,
html.vp-public-page textarea::placeholder {
    color: #aaa5b2;
    opacity: 1;
}

html.vp-public-page .form-control:focus,
html.vp-public-page .form-select:focus {
    color: #fff;
    background-color: #2b2b2b;
}

html.vp-public-page .form-select option {
    color: #fff;
    background: #262626;
}

html.vp-public-page .vp-item-meta,
html.vp-public-page .vp-post-meta {
    color: var(--vp-muted);
}

html.vp-public-page .vp-post-action,
html.vp-public-page .vp-item-arrow,
html.vp-public-page .vp-life-heading h2,
html.vp-public-page .vp-nearby-item,
html.vp-public-page .vp-nearby-copy strong,
html.vp-public-page .vp-session-item strong,
html.vp-public-page .vp-group-item strong,
html.vp-public-page .vp-upcoming strong,
html.vp-public-page .prayer-sessions strong,
html.vp-public-page .vp-support-form .form-label {
    color: #b7b7b7;
    font-family: 'Ubuntu';
    font-size: .85rem;
    font-weight: 700;
}

html.vp-public-page .vp-nearby-item,
html.vp-public-page .vp-session-item {
    border-bottom-color: var(--vp-line);
}

html.vp-public-page .vp-support-options button {
    color: var(--vp-ink-soft);
    background: #262626;
    border-color: #484848;
}

html.vp-public-page .vp-directory-page,
html.vp-public-page .vp-stories-page,
html.vp-public-page .vp-directory-toolbar h2,
html.vp-public-page .vp-directory-card h3,
html.vp-public-page .vp-directory-empty h3,
html.vp-public-page .vp-stories-hero h1,
html.vp-public-page .vp-stories-heading h2,
html.vp-public-page .vp-story-featured h2,
html.vp-public-page .vp-story-card h3,
html.vp-public-page .vp-share-story h2 {
    color: var(--vp-ink);
}

html.vp-public-page .vp-directory-hero p,
html.vp-public-page .vp-directory-toolbar p,
html.vp-public-page .vp-directory-card p,
html.vp-public-page .vp-directory-empty p,
html.vp-public-page .vp-stories-hero p,
html.vp-public-page .vp-stories-heading p,
html.vp-public-page .vp-story-featured blockquote,
html.vp-public-page .vp-story-card p,
html.vp-public-page .vp-share-story p,
html.vp-public-page .vp-story-person span,
html.vp-public-page .vp-story-card-header span {
    color: var(--vp-ink-soft);
}

html.vp-public-page .vp-story-featured,
html.vp-public-page .vp-story-card,
html.vp-public-page .vp-share-story {
    color: var(--vp-ink);
    background: #1a1a1a;
    border-color: var(--vp-line);
}

html.vp-public-page .vp-directory-back,
html.vp-public-page .vp-stories-back,
html.vp-public-page .vp-directory-kicker,
html.vp-public-page .vp-stories-kicker,
html.vp-public-page .vp-story-category,
html.vp-public-page .vp-life-heading a,
html.vp-public-page .vp-reminder-btn {
    color: var(--vp-gold);
}

html.vp-public-page .vp-nearby-item:hover,
html.vp-public-page .vp-nearby-item:focus,
html.vp-public-page .vp-support-options button:hover,
html.vp-public-page .vp-support-options button:focus {
    color: #fff;
}

html.vp-public-page .vp-support-options i,
html.vp-public-page .vp-session-item > i {
    color: #bba3ff;
}

/* Consistent card spacing and elevation across public pages. 
html.vp-public-page .vp-panel:not(.vp-feed),
html.vp-public-page .vp-prayer-request-panel,
html.vp-public-page .vp-directory-card,
html.vp-public-page .vp-story-featured,
html.vp-public-page .vp-story-card,
html.vp-public-page .vp-share-story,
html.vp-public-page .vp-life-panel {
    margin-bottom: 1rem;
    box-shadow: var(--vp-public-card-shadow);
}*/

html.vp-public-page .vp-feed .card-body {
    box-shadow: var(--vp-public-card-shadow);
}

html.vp-public-page .vp-btn-primary:hover,
html.vp-public-page .vp-btn-primary:focus,
html.vp-public-page .card-footer a:hover,
html.vp-public-page .card-footer a:focus {
    color: #fff;
    background: #5a16c9;
    border-color: #8d5bea;
    box-shadow: 0 0 0 0.18rem rgba(141, 91, 234, 0.22);
}

html.vp-public-page .vp-section-header a:hover,
html.vp-public-page .vp-section-header a:focus {
    color: var(--vp-gold);
    background: #2b2b2b;
}

html.vp-public-page .vp-search .btn {
    color: var(--vp-gold);
    background: #262626;
}

html.vp-public-page .vp-search .btn:hover,
html.vp-public-page .vp-search .btn:focus {
    color: #17120a;
    background: #f1c928;
    box-shadow: 0 0 0 0.15rem rgba(228, 185, 29, 0.24);
}

/* Authentication forms share the public dark palette without affecting portals. */
html.vp-auth-page-root {
    --vp-ink: #f5f2fa;
    --vp-ink-soft: #d4cfdd;
    --vp-heading: #ffffff;
    --vp-muted: #aaa4b8;
    --vp-page: #0c0c0c;
    --vp-line: rgba(255, 255, 255, 0.12);
    --bs-body-color: var(--vp-ink);
    --bs-body-bg: var(--vp-page);
    --bs-secondary-color: #b8b2c3;
    --bs-border-color: #484848;
    font-size: 17px;
}

html.vp-auth-page-root body {
    color: var(--vp-ink);
    background: var(--vp-page);
}

html.vp-auth-page-root .vp-signup-card,
html.vp-auth-page-root .vp-auth-card {
    color: var(--vp-ink);
    background: #1a1a1a;
    /*border: 1px solid var(--vp-line) !important;*/
}

html.vp-auth-page-root .vp-signup-title,
html.vp-auth-page-root .vp-auth-card h1,
html.vp-auth-page-root .vp-form-field .form-label,
html.vp-auth-page-root label.form-label.independent,
html.vp-auth-page-root .form-check-label {
    color: var(--vp-ink);
}

html.vp-auth-page-root .vp-signup-intro,
html.vp-auth-page-root .vp-signup-heading p,
html.vp-auth-page-root .vp-signup-consent,
html.vp-auth-page-root .vp-signup-login,
html.vp-auth-page-root .vp-form-field > small {
    color: var(--vp-ink-soft);
}

html.vp-auth-page-root .vp-signup-heading-brand,
html.vp-auth-page-root .vp-signup-heading-brand .vp-brand-tagline {
    color: #fff;
}

html.vp-auth-page-root .vp-signup-heading-icon,
html.vp-auth-page-root .vp-signup-heading-icon a,
html.vp-auth-page-root .vp-password-field > i,
html.vp-auth-page-root .vp-password-field button {
    color: #c8b5ff;
}

html.vp-auth-page-root .vp-signup-heading-icon a:hover,
html.vp-auth-page-root .vp-signup-heading-icon a:focus,
html.vp-auth-page-root .vp-password-field button:hover,
html.vp-auth-page-root .vp-password-field button:focus {
    color: var(--vp-gold);
}

html.vp-auth-page-root .vp-form-field .form-control,
html.vp-auth-page-root .vp-form-field .form-select,
html.vp-auth-page-root .vp-form-field .input-group-text {
    color: var(--vp-ink);
    background-color: #262626;
    border-color: #484848;
}

html.vp-auth-page-root .vp-form-field .form-control::placeholder {
    color: #aaa5b2;
    opacity: 1;
}

html.vp-auth-page-root .vp-form-field .form-control:focus,
html.vp-auth-page-root .vp-form-field .form-select:focus {
    color: #fff;
    background-color: #2b2b2b;
    border-color: var(--vp-gold);
    box-shadow: 0 0 0 0.12rem rgba(228, 185, 29, 0.22);
}

html.vp-auth-page-root .vp-form-field .form-select option {
    color: #fff;
    background: #262626;
}

html.vp-auth-page-root .vp-signup-tabs {
    border-bottom-color: var(--vp-line);
}

html.vp-auth-page-root .vp-signup-tabs a,
html.vp-auth-page-root .vp-signup-tabs .nav-link {
    color: var(--vp-ink-soft);
    background: transparent;
    border-color: transparent;
}

html.vp-auth-page-root .vp-signup-tabs a:hover,
html.vp-auth-page-root .vp-signup-tabs a:focus,
html.vp-auth-page-root .vp-signup-tabs .nav-link.active {
    color: #fff;
    background: #262626;
    border-bottom-color: var(--vp-gold);
}

html.vp-auth-page-root .vp-logo-upload {
    color: var(--vp-ink-soft);
    background: #202020;
    border-color: #7866a8;
}

html.vp-auth-page-root .vp-logo-upload:hover,
html.vp-auth-page-root .vp-logo-upload:focus-within {
    color: #fff;
    background: #292929;
    border-color: var(--vp-gold);
}

html.vp-auth-page-root .vp-logo-upload > i,
html.vp-auth-page-root .vp-logo-upload span,
html.vp-auth-page-root .vp-signup-consent a,
html.vp-auth-page-root .vp-signup-login a:not(.btn),
html.vp-auth-page-root form a:not(.btn) {
    color: var(--vp-gold);
}

html.vp-auth-page-root .vp-logo-upload .vp-upload-file-name {
    color: var(--vp-ink-soft);
    background: #303030;
}

html.vp-auth-page-root .vp-logo-upload.has-file {
    color: #d8f5e2;
    background: #16271d;
    border-color: #4c9d6a;
}

html.vp-auth-page-root .vp-logo-upload.has-file > i,
html.vp-auth-page-root .vp-logo-upload.has-file .vp-upload-file-name {
    color: #9ce0b5;
}

html.vp-auth-page-root .vp-logo-upload.has-file .vp-upload-file-name {
    background: #203a2a;
}

html.vp-auth-page-root .form-check-input {
    background-color: #262626;
    border-color: #77717f;
}

html.vp-auth-page-root .form-check-input:checked {
    background-color: var(--vp-purple-2);
    border-color: #aa8cff;
}

html.vp-auth-page-root .invalid-feedback,
html.vp-auth-page-root .text-danger {
    color: #ff9ba4 !important;
}

html.vp-auth-page-root .alert-danger {
    color: #ffd7da;
    background: #481c22;
    border-color: #7f3039;
}

html.vp-auth-page-root .alert-success {
    color: #d8f5e2;
    background: #163523;
    border-color: #2c6e45;
}

html.vp-auth-page-root .vp-btn-primary:hover,
html.vp-auth-page-root .vp-btn-primary:focus,
html.vp-auth-page-root .vp-signup-login a.btn:hover,
html.vp-auth-page-root .vp-signup-login a.btn:focus {
    color: #fff;
    background: #5a16c9;
    border-color: #8d5bea;
    box-shadow: 0 0 0 0.18rem rgba(141, 91, 234, 0.24);
}

html.vp-auth-page-root .vp-signup-submit:hover,
html.vp-auth-page-root .vp-signup-submit:focus {
    color: #17120a;
    background: var(--vp-gold);
    border-color: #f1c928;
    box-shadow: 0 0 0 0.18rem rgba(228, 185, 29, 0.22);
}

body {
    font-family: var(--bs-body-font-family); color: var(--vp-ink); 
    text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; margin: 0;
    height: 100vh; background:rgba(12, 12, 12, 0.96);
}

a { text-decoration: none;}

.site-main { padding: 1.5rem 1rem 2rem;}
.vp-page-shell { max-width: 1800px;}
.vstack.gap-4 {padding-bottom: 20px;
}
aside.left-sidebar,
aside.right-sidebar {
    position: sticky;
    top: calc(68px + 1rem);
    align-self: flex-start;
    height: calc(100vh - 68px - 2rem);
    height: calc(100dvh - 68px - 2rem);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
}

aside.left-sidebar:hover,
aside.right-sidebar:hover {
    scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}

aside.left-sidebar::-webkit-scrollbar, aside.right-sidebar::-webkit-scrollbar {
    width: 4px;
    height: 0;
}aside.left-sidebar::-webkit-scrollbar-thumb, aside.right-sidebar::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: transparent;
}
aside.left-sidebar:hover::-webkit-scrollbar-thumb,
aside.right-sidebar:hover::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.22);
}

@media (max-width: 1199.98px) {
    aside.left-sidebar,
    aside.right-sidebar {
        position: static;
        height: auto;
        overflow: visible;
        scrollbar-gutter: auto;
    }
}

button.see_more_link {display: inline-flex; align-items: center; background: inherit;
    border: none; gap: .75rem; font-weight: 700; color: #FFF; font-size: .9rem;
    margin-top: .2rem; width: 100%; padding: 0.7rem 1rem;
    transition: background-color 160ms ease, transform 160ms ease;
}button.see_more_link i{ width:32px; height:32px; display: inline-flex;
    justify-content: center; align-items: center; background: #232323;
    border-radius: 1rem;
}

/* ================ Navigation Bar =============
================================================ */
.vp-navbar { min-height: 68px;  padding: 0 1rem; background: #101010;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    /*box-shadow: 0 12px 30px rgba(4, 3, 14, 0.18);*/  backdrop-filter: blur(14px);   
}
.vp-brand {display: inline-flex; align-items: center; gap: 0.75rem;  color: #fff;
    min-width: 215px; font-family: "Ubuntu", sans-serif;  font-optical-sizing: auto;
    font-style: normal;
}
.vp-brand:hover,
.vp-brand:focus { color: #fff;
}
.vp-brand-logo {width: 40px; height: 40px; display: block; flex-shrink: 0;
    border-radius: 50%; object-fit: cover; box-shadow: 0 14px 30px rgba(122, 11, 115, 0.26);
}
.vp-brand-mark {width: 40px; height: 40px; border-radius: 1rem; display: inline-flex;
    align-items: center; justify-content: center; flex-shrink: 0;
    background: linear-gradient(135deg, var(--vp-gold), var(--vp-purple));
    color: #fff; font-size: 1.35rem; font-weight: 800; letter-spacing: 0;
    box-shadow: 0 14px 30px rgba(122, 11, 115, 0.26);
}
.vp-brand-copy { display: grid; line-height: 1.12;
}
.vp-brand-name { font-size: 1.1rem; font-weight: 800;
}
.vp-brand-tagline {color: rgba(255, 255, 255, 0.72);
    font-size: 0.88rem; font-weight: 500;
}

.vp-search-wrap {flex: 1 1 520px; max-width: 820px; margin-inline: 0.5rem 1rem;
}
.vp-search .form-control { min-height: 42px; border: 0; border-radius: 1rem 0 0 1rem;
    padding-inline: 1.15rem; font-size: var(--vp-text-feed-body); 
}
.vp-search .btn { min-width: 42px; border: 0; border-radius: 0 1rem 1rem 0; color: var(--vp-purple);
}
.vp-search .form-control:focus {
    box-shadow: 0 0 0 0.15rem rgba(228, 185, 29, 0.24);
}
.vp-icon-nav { align-items: center; gap: 0.5rem;  flex: 0 0 auto;
}
.vp-icon-link,
.vp-menu-btn,
.vp-btn-ghost { color: rgba(255, 255, 255, 0.85); border: 1px solid rgba(255, 255, 255, 0.15);
    background: transparent;
}
.vp-icon-link { width: 42px; height: 42px; display: inline-flex; align-items: center;
    justify-content: center; border-radius: 0.75rem; font-size: 1rem;
    transition: color 160ms ease, border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.vp-icon-link:hover,
.vp-icon-link:focus,
.vp-menu-btn:hover,
.vp-menu-btn:focus,
.vp-btn-ghost:hover,
.vp-btn-ghost:focus { color: var(--vp-gold); border-color: rgba(228, 185, 29, 0.65);
    background: rgba(255, 255, 255, 0.1);
}

.vp-menu-btn,
.vp-btn-ghost,
.vp-btn-gold { min-height: 42px; border-radius: 0.75rem; align-items: center; gap: 0.25rem;
    font-weight: 600; font-size: .8rem; font-family: "Quicksand", sans-serif;
}

.vp-menu-btn { width: 40px; padding: 0; font-size: 1.5rem;
}

.vp-btn-gold { background: var(--vp-gold); color: #111;
    border: 1px solid var(--vp-gold); box-shadow: 0 12px 24px rgba(228, 185, 29, 0.22);
}

.vp-btn-gold:hover,
.vp-btn-gold:focus {background: #f1c928; border-color: #f1c928;
    color: #111;
}

.vp-btn-primary { min-height: 44px; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 1.5rem; background: var(--vp-blue);  color: #fff;
    border: 1px solid var(--vp-blue); font-weight: 100;
}

.vp-btn-primary:hover,
.vp-btn-primary:focus { background: var(--vp-heading); color: #fff;
}

.vp-offcanvas { background: var(--vp-night); color: #fff;
}

.vp-mobile-links .list-group-item { display: flex; align-items: center; gap: 0.75rem;
    background: transparent;  color: rgba(255, 255, 255, 0.86);
    border-color: rgba(255, 255, 255, 0.1); padding: 1rem 0;
}

.vp-mobile-links .list-group-item:hover,
.vp-mobile-links .list-group-item:focus { color: var(--vp-gold);
}

/* ================ Panel & Card  ==============
================================================ */
.vp-panel {
    /*border: 1px solid var(--vp-line);
    border-radius: 1rem;
    box-shadow: var(--vp-card-shadow);*/
    overflow: hidden;
}.card{border: none !important; background: inherit}

/*html.vp-public-page .vp-page-shell .vp-panel:not(.vp-feed) {
    border: 1px solid var(--vp-line) !important;
    border-radius: 1rem;
    background: #111;
}*/

.card-footer { padding: 5px 0; text-align: left; background:inherit;}

.card-footer a {background: var(--vp-blue); padding: 7px;  border-radius: 5px;
    color: white;  font-family: sans-serif;  font-size: .85rem;
}.card-footer a:hover{background: var(--vp-heading);}

.vp-section-header {display: flex; align-items: center; justify-content: space-between;
    gap: 1rem; margin-bottom: 1rem;
}.vp-section-header .form-control {background: #262626; border-radius: 0.95rem;
    border: 1px solid #404040;
}

.vp-section-header h2,
.vp-form-title { margin: 0; color: #FFF;  font-size: var(--vp-text-section);
    font-weight: 500; font-family: "Roboto Condensed", sans-serif;
    font-optical-sizing: auto; font-style: normal;
}
.vp-section-header a {color: #9f9f9f;  font-size: var(--vp-text-link);
    font-weight: 400; font-family: sans-serif; display: none; /*Hide hidden link*/
    padding: 0.3rem; transition: background-color 0.5s ease; border-radius: 0.4rem;
}.vp-section-header a:hover{color: #3f3f3f; background-color: rgb(224, 224, 224); 
}
.vp-panel:hover .hidden_link { /*show hideen link*/
    display: block;
  }

.vp-section-header a.btn.btn-primary {color: #FFF; font-weight: 100;
    padding: 3px 7px 3px 7px;  background: var(--vp-blue); border: none;
}

.vp-church-list { margin-inline: -1.25rem;
}
.vp-church-item { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto;
    align-items: center; gap: 0.95rem; padding: 0.85rem 1.25rem; border: none;
    background-color: inherit;
}

.vp-plugs-items { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 0.7rem; padding: 0.7rem 1rem; 
}.vp-plugs-items .vp-avatar img {border-radius: 50%;}
.vp-plugs-items .vp-avatar {width: 40px; height: 40px;border-radius: 50%;}

.vp-church-list a:nth-child(n+6) {
    display: none;
}

/*.vp-church-item:hover,
.vp-church-item:focus { background: #faf9ff;
}*/
.list-group a.vp-church-item:hover,.vp-church-list button.see_more_link:hover {
    background: rgb(29, 29, 29); border-radius: .5rem;
}

.vp-avatar {width: 56px; height: 56px; border-radius: 10%; display: inline-flex;
    align-items: center; justify-content: center; color: var(--vp-gold);  font-weight: 800;
    flex: 0 0 56px; background: #FFF;
}.vp-avatar img {border-radius: 10%;}
.vp-church-copy { min-width: 0;
}
.vp-item-title { display: block; color: #b7b7b7; font-size: var(--vp-text-feed-meta);
    font-family: "Ubuntu", sans-serif; font-optical-sizing: auto;  font-weight: 600;
    font-style: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.vp-item-meta {
    display: grid;
    /*flex-wrap: wrap;
    gap: 0.45rem 0.7rem;
    margin-top: 0.2rem;*/
    color: #79787a;
    font-size: var(--vp-text-meta);
    font-weight: 400;
}

.vp-item-meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-family: 'Roboto Condensed';
    font-size: .8rem;
}

.vp-item-arrow {
    color: var(--vp-heading);
}

.vp-home-directory .card-body {
    padding: 1rem;
}

.vp-home-directory .vp-church-list {
    margin-inline: 0;
}

.vp-directory-filter {
    position: relative;
    margin-bottom: 0.75rem;
}

.vp-directory-filter > i {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 0.9rem;
    color: var(--vp-gold);
    transform: translateY(-50%);
}

.vp-directory-filter .form-control {
    min-height: 46px;
    padding-left: 2.6rem;
    border-color: #474747;
}

.vp-home-directory .vp-church-item {
    padding: 0.7rem 0.55rem;
    border-radius: 0.7rem;
    transition: background-color 160ms ease, transform 160ms ease;
}

.vp-home-directory .vp-church-item:hover,
.vp-home-directory .vp-church-item:focus {
    background: #202020;
    transform: translateX(3px);
}

.vp-feature-card,
.vp-spotlight {
    position: relative;
    overflow: hidden;
    border-radius: 1rem;
    background: #111;
    min-height: 0;
    /*box-shadow: var(--vp-card-shadow);*/
}

.vp-feature-card {
    aspect-ratio: 5 / 8;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: var(--vp-public-card-shadow);
    transition: transform 180ms ease, border-color 180ms ease;
}

.vp-feature-card:hover,
.vp-feature-card:focus-within {
    border-color: rgba(228, 185, 29, 0.5);
    transform: translateY(-3px);
}

.vp-feature-carousel {
    border-radius: 1rem;
    /*padding-bottom: 1.65rem;*/
}

.vp-feature-carousel .carousel-inner,
.vp-feature-carousel .carousel-item {
    border-radius: 1rem;
}

.vp-feature-carousel .carousel-indicators {
    bottom: -0.5rem;
    margin-bottom: 0;
    gap: 0.4rem;
}

.vp-feature-carousel .carousel-indicators [data-bs-target] {
    width: 10px;
    height: 10px;
    border: 0;
    border-radius: 50%;
    background-color: #fff;
    opacity: 0.55;
}

.vp-feature-carousel .carousel-indicators .active {
    background-color: var(--vp-gold);
    opacity: 1;
}

.vp-carousel-control {
    top: 50%;
    width: 44px;
    height: 44px;
    margin-inline: 0.3rem;
    border-radius: 50%;
    background: rgba(5, 5, 19, 0.72);
    color: #fff;
    opacity: 1;
    transform: translateY(calc(-50% - 0.8rem));
}

.vp-carousel-control:hover,
.vp-carousel-control:focus {
    background: var(--vp-gold);
    color: #111;
}

.vp-carousel-control i {
    font-size: 1.45rem;
    line-height: 1;
}

.vp-feature-card img,
.vp-spotlight img,
.vp-post-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.vp-feature-card img,
.vp-spotlight img {
    position: absolute;
    inset: 0;
}

.vp-media-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(5, 5, 19, 0.06), rgba(5, 5, 19, 0.34) 38%, rgba(5, 5, 19, 0.94));
}

.vp-feature-badge,
.vp-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 0.45rem;
    background: var(--vp-purple-2);
    color: #fff;
    font-size: var(--vp-text-badge);
    font-weight: 800;
    line-height: 1;
}

.vp-feature-badge {
    position: absolute;
    z-index: 2;
    top: 1rem;
    left: 1rem;
    padding: 0.45rem 0.7rem;
    backdrop-filter: blur(8px);
}

.vp-feature-copy,
.vp-spotlight-copy {
    position: absolute;
    z-index: 2;
    left: 1.15rem;
    right: 1.15rem;
    bottom: 1.15rem;
    color: #fff;
}

.vp-feature-copy h2,
.vp-spotlight-copy h3 {
    margin: 0;
    font-size: var(--vp-text-media-title);
    font-weight: 800;
}

.vp-feature-copy p,
.vp-spotlight-copy p {
    margin: 0.5rem 0 1rem;
    color: var(--vp-on-dark);
    font-size: var(--vp-text-media-body);
}

.vp-feature-copy {
    left: 0.85rem;
    right: 0.85rem;
    bottom: 0.85rem;
}

.vp-feature-copy h2 {
    font-size: 1rem;
    line-height: 1.15;
}

.vp-feature-copy p {
    margin: 0.35rem 0 0.7rem;
    font-size: 0.78rem;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.vp-feature-copy .btn {
    min-height: 34px;
    padding: 0.35rem 0.65rem;
    font-size: 0.7rem;
    font-weight: 800;
}

.vp-feature-card .vp-feature-badge {
    font-size: 0.65rem;
}

.vp-dots {
    display: flex;
    justify-content: center;
    gap: 0.45rem;
}

.vp-dots span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #d6d2df;
}

.vp-dots .is-active {
    background: var(--vp-gold);
}

.vp-dots .is-purple {
    background: var(--vp-purple);
}

.vp-feed .card-body {
    background: #202020;
    border-radius: 0.7rem;
    margin-bottom: 1rem;
    overflow: hidden;
    /*border: 1px solid rgba(255, 255, 255, 0.08);*/
}
section.card.vp-panel.vp-feed {
    background: none;
    /* margin: 10px; */
    box-shadow: none;
}

.vp-home-feed-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 0.85rem 1rem;
    /*border: 1px solid var(--vp-line);*/
    border-radius: 0.85rem;
    background: #202020;
    /*background: #111;
    box-shadow: var(--vp-public-card-shadow);*/
}

.vp-home-feed-heading span {
    display: block; margin-bottom: 0.15rem; color: var(--vp-gold);
    font-size: var(--vp-text-badge); font-weight: 800;
    letter-spacing: 0.08em; text-transform: uppercase; font-family: 'Quicksand';
}

.vp-home-feed-heading h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.15rem, 2.2vw, 1.55rem);
    font-weight: 800; font-family: 'Ubuntu';
}

.vp-home-feed-heading > i {
    color: var(--vp-gold);
    font-size: 1.35rem;
}

.vp-post {
    display: grid;
    grid-template-columns: minmax(160px, 65%) minmax(0, 1fr) auto;
    gap: 1.2rem;
    align-items: center;
    padding: 1rem;
    /*border-bottom: 1px solid #f0eef6;*/
    transition: background-color 160ms ease;
}

.vp-post-body {
    min-width: 0;
    padding-block: 0.2rem;
}

.vp-post-body p a {
    color: var(--vp-heading);
}

.vp-post:last-child {
    border-bottom: 0;
}

/*.vp-post:hover {
    background: #faf9ff;
}*/

.vp-post-image {
    aspect-ratio: 16 / 10;
    border-radius: 0;
}

.post-gallery-img{ width:100%; height:145px; object-fit:cover; /*border-radius:8px;*/
}
.post-gallery-img.single{height:265px;
}
.post-gallery-img.tall{ height:294px;
}
.post-gallery-img.double{  height:265px;
}
.post-overlay{ position:absolute; inset:0; background:rgba(0,0,0,.55);
    color:#fff;  display:flex;  align-items:center;  justify-content:center;
    font-size:2rem;  font-weight:bold;  /*border-radius:8px;*/
}
.post-overlay a { color: #FFF;
}
.gallery-placeholder{position:relative;
    overflow: hidden;
    /*border-radius: 0.65rem;*/
}
.gallery-overlay{ position:absolute; inset:0; display:flex; align-items:center;
    justify-content:center; padding:25px;  text-align:center;
    background:rgba(0,0,0,.45);  color:#fff;  border-radius:10px;
}
.gallery-overlay p{  margin:0; font-weight:600;  line-height:1.4; color: #cdcdcd !important;
    /* Responsive text */
    font-size:clamp(1.15rem, 2vw + 0.5rem, 2rem);
}

.play-icon{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    width:60px; height:60px;  border-radius:50%;  background:rgba(0,0,0,.55);
    color:#fff; display:flex; justify-content:center;  align-items:center;
    font-size:2rem; pointer-events:none;
}

.post-buttons {display: flex; flex-wrap: wrap; gap: 0.45rem; font-size: .8rem; margin-top: 1rem;
}.post-icons {display: inline-flex; align-items: center; gap: 0.35rem; border: 1px solid rgba(255,255,255,.1);
    color: #FFF; background: #1b1b1b; font-family: "Share Tech", sans-serif; font-weight: 400;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
    padding: 0.3rem 0.5rem; border-radius: 0.45rem;
}.post-icons:hover,.post-icons:focus {background-color: var(--vp-magenta); 
    /*border-color: var(--vp-gold);*/ color: var(--vp-gold);

}

.vp-badge-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-bottom: 0.55rem;
}

.vp-badge {
    padding: 0.4rem 0.55rem;
}

.vp-post h2 {margin: 0; color: rgb(218, 218, 218); font-weight: 800; font-size: .95rem;
    font-family: 'Roboto Condensed', sans-serif; text-overflow: ellipsis;
    white-space: nowrap; overflow: hidden;
}

.vp-post p {
    max-width: 42rem;
    margin: 0.35rem 0 0;
    color: #bbbbbb;
    font-size: .84rem;
}

.vp-post-meta {
    margin-top: 0.2rem;
    color: var(--vp-muted);
    font-size: var(--vp-text-feed-meta);
    font-weight: 600;
}

.vp-post-action {
    color: var(--vp-heading);
    font-size: 1.25rem;
    border: 0;
}

.vp-spotlight {
    min-height: 260px;
}

.vp-testimony {display: flex; align-items: center; gap: 1.25rem; border: 1px solid var(--vp-line);
    padding: .38rem; border-radius: .8rem;
}
.vp-testimony img {width: 112px; height: 112px; flex: 0 0 112px;
    border-radius: 50%; object-fit: cover;
}
.vp-testimony p {margin: 0;color: #bbbbbb; font-size: 0.88rem; font-weight: 600;
}
.vp-testimony span,
.vp-muted { color: var(--vp-muted);  font-size: 0.88rem;
}
.vp-testimony span { display: inline-block; margin-top: 0.65rem;
}
.vp-testimony.card-footer { border: none;
}

.vp-prayer-form {
    display: grid;
    gap: 0.8rem;
    margin-top: 1rem;
}

.vp-prayer-form .form-control,
.vp-prayer-form .form-select {color: #bbbbbb; border-color: #2a2a2a;
    border-radius: 0.85rem; padding: 0.85rem 1rem; font-size: var(--vp-text-form);
    background: #262626;
}

.vp-prayer-form .form-control:focus,
.vp-prayer-form .form-select:focus {
    border-color: var(--vp-gold);
    box-shadow: 0 0 0 0.1rem var(--vp-magenta);
}

/* Homepage prayer request card. */
.vp-prayer-request-panel {
    position: relative;
    overflow: hidden;
    padding: 1.15rem;
    border: 1px solid var(--vp-line);
    border-radius: 1rem;
    /*background: linear-gradient(160deg, #181818 0%, #111111 48%, var(--vp-page) 100%);*/
}

.vp-prayer-request-panel .vp-section-header {
    margin-bottom: 0.5rem;
}

.vp-prayer-request-panel .vp-form-title {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    color: #fff;
}

.vp-prayer-request-panel .vp-form-title i {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(228, 185, 29, 0.38);
    border-radius: 0.7rem;
    color: var(--vp-gold);
    background: rgba(228, 185, 29, 0.08);
}

.vp-prayer-intro {
    margin: 0;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-feed-body);
    line-height: 1.55;
}

.vp-public-prayer-form {
    gap: 0.9rem;
    margin-top: 1.1rem;
}

.vp-prayer-field {
    display: grid;
    gap: 0.4rem;
}

.vp-prayer-field label {
    color: var(--vp-ink);
    font-size: var(--vp-text-feed-meta);
    font-weight: 700;
}

.vp-prayer-field label span {
    margin-left: 0.25rem;
    color: var(--vp-muted);
    font-size: 0.75rem;
    font-weight: 500;
}

.vp-public-prayer-form .form-control,
.vp-public-prayer-form .form-select {
    min-height: 52px;
    padding: 0.75rem 0.85rem;
    border: 1px solid #48464d;
    border-radius: 0.7rem;
    color: var(--vp-ink);
    background-color: #26252a;
    font-size: var(--vp-text-form);
    color-scheme: dark;
}

.vp-public-prayer-form textarea.form-control {
    min-height: 140px;
    line-height: 1.5;
    resize: vertical;
}

.vp-public-prayer-form .form-control::placeholder {
    color: #9f99a8;
    opacity: 1;
}

.vp-public-prayer-form .form-control:hover,
.vp-public-prayer-form .form-select:hover {
    border-color: #68636f;
}

.vp-public-prayer-form .form-control:focus,
.vp-public-prayer-form .form-select:focus {
    color: #fff;
    background-color: #2b2a30;
    border-color: var(--vp-gold);
    box-shadow: 0 0 0 0.18rem rgba(228, 185, 29, 0.16);
}

.vp-public-prayer-form .form-select option {
    color: #fff;
    background: #26252a;
}

.vp-prayer-note {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    margin: 0;
    color: var(--vp-muted);
    font-size: var(--vp-text-meta);
    line-height: 1.45;
}

.vp-prayer-note i {
    flex: 0 0 auto;
    color: #9ce0b5;
}

.vp-public-prayer-form .vp-btn-primary {
    gap: 0.55rem;
    /*min-height: 48px;
    margin-top: 0.1rem;
    border-color: #7650d2;
    background: #48209f;
    font-weight: 800;*/
}

/*html.vp-public-page .vp-public-prayer-form .vp-btn-primary:hover,
html.vp-public-page .vp-public-prayer-form .vp-btn-primary:focus {
    color: #17120a;
    background: var(--vp-gold);
    border-color: #f1c928;
    box-shadow: 0 0 0 0.18rem rgba(228, 185, 29, 0.2);
}*/

@media (max-width: 575.98px) {
    .vp-prayer-request-panel {
        padding: 1rem;
    }
}

.vp-simple-page,
.vp-auth-page {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.vp-simple-page .card-body,
.vp-auth-card .card-body {
    padding: clamp(1.5rem, 4vw, 3rem);
}

.vp-simple-page h1,
.vp-auth-card h1 {
    color: var(--vp-heading);
    font-weight: 800;
}

.vp-simple-page p {
    max-width: 46rem;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-section);
}

.vp-auth-card {
    max-width: 520px;
    margin-inline: auto;
}

/* --------------------------------------------------------------------------
   Signup page
   -------------------------------------------------------------------------- */

.vp-signup-page {min-height: 100vh; min-height: 100dvh; display: flex; justify-content: center;
    align-items: flex-start; padding: clamp(1rem, 4vw, 3rem) 1rem;
}
.vp-signup-page > .row {width: 100%; justify-content: center; margin: 0;
}
.vp-signup-panel {position: relative; width: min(100%, 700px); padding: 0;
}
.vp-signup-panel .vp-panel{box-shadow: none;}

.vp-signup-card { width: min(100%, 960px); border-radius: 1rem;
    /*box-shadow: 0 20px 55px rgba(0, 0, 0, 0.32);*/
}
.vp-login-card {width: min(100%, 520px);
}
.vp-signup-card > .card-body { padding: clamp(1.25rem, 2.5vw, 2rem);
}
.vp-signup-tabs {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    border-bottom: 1px solid var(--vp-line); text-transform: uppercase; 
    font-family: "Ubuntu", sans-serif; font-weight: 400;
}
.vp-signup-tabs .nav-link {min-height: 58px; display: inline-flex; align-items: center;
    justify-content: center; gap: 0.5rem; border-bottom: 3px solid transparent;
    color: var(--vp-ink-soft); font-size: var(--vp-text-form); border-radius: 0;
}.vp-signup-tabs .nav-link{border-radius: 0%;}

.vp-signup-tabs .nav-link:hover,.vp-signup-tabs .nav-link:focus { border-bottom-color: var(--vp-purple);
    color: var(--vp-magenta); font-weight: 500;
    background: #e9e8e8;
}
.vp-signup-tabs .nav-link.active { color: var(--vp-blue); font-weight: 500;
}

.vp-signup-panel .vp-signup-heading {padding: 0; border: none;}

.vp-signup-panel .vp-signup-heading-icon {width: auto; height: auto; flex: 0 0 auto;
    font-size: 0.82rem;
}

.vp-signup-panel .vp-signup-heading-icon a {display: inline-flex; padding: 0.45rem 0.65rem;
    border: 1px solid #4d4854; border-radius: 0.55rem; color: var(--vp-ink-soft);
}

.vp-signup-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding-bottom: 1.25rem; border-bottom: 1px solid var(--vp-line);
}

.vp-signup-heading-icon { flex: 0 0 52px;
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--vp-purple); font-size: 2rem;
}.vp-signup-heading-icon a {color: var(--vp-blue);}
.vp-signup-heading-icon a:hover{color: var(--vp-heading);}

.vp-signup-heading-brand{ display: flex; gap: 0.5rem; color: var(--vp-blue); 
    font-family: 'Ubuntu', sans-serif;;
}
.vp-signup-heading-brand .vp-brand-tagline {color: var(--vp-blue); text-align: center;
font-family: 'Ubuntu', sans-serif;
}

.vp-signup-heading h1, h1.vp-signup-heading { margin: 0; color: var(--vp-magenta);
    font-size: 1.5rem; font-weight: 600; font-family: 'Quicksand', sans-serif;
}

.vp-signup-heading p, p.vp-signup-heading  {
    margin: 0.5rem 0 1rem;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-item);
}

.vp-signup-title {margin: 0; color: var(--vp-heading); font-size: clamp(1.65rem, 4vw, 2.35rem);
    font-weight: 800; letter-spacing: -0.025em;
}

.vp-signup-intro {max-width: 640px; margin: 0.55rem 0 0; color: var(--vp-ink-soft);
    line-height: 1.6;
}

.vp-signup-assurance {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.6rem 1rem;
    margin: 1rem 0 1.25rem; color: var(--vp-muted); font-size: var(--vp-text-meta);
}

.vp-signup-assurance span {display: inline-flex; align-items: center; gap: 0.4rem;
}

.vp-signup-assurance i {color: #9ce0b5;
}
.vp-signup-form {
    display: grid;
    /*grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.5rem;*/
    gap: 0;
    margin-top: 1.25rem;
}

.vp-form-field {
    min-width: 0; width: 100%; margin-top: 1rem;
}

.vp-form-field.is-full,
.vp-signup-consent,
.vp-signup-submit,
.vp-signup-login {
    grid-column: 1 / -1;
}

.vp-form-field .form-label {margin-bottom: 0.4rem; color: var(--vp-ink);
    font-size: var(--vp-text-section); font-weight: 100; font-family: 'Quicksand', sans-serif;
}

.form-label.independent { display: block; color: var(--vp-ink); font-size: var(--vp-text-section);
    padding-top: 1.25rem; margin: 0; font-weight: 100;
    font-family: 'Quicksand', sans-serif;;
}

.vp-form-field .form-label span, .form-label.independent span {
    color: #cf1627;
}

.vp-form-field > small {
    display: block;
    margin: -0.2rem 0 0.65rem;
    color: var(--vp-muted);
    font-size: var(--vp-text-meta);
}

.vp-form-field .form-control,
.vp-form-field .form-select,
.vp-form-field .input-group-text {
    min-height: 52px;
    border-color: #dcd8e7;
    border-radius: 0.75rem;
    font-size: var(--vp-text-form);
}

.vp-form-field .input-group-text {
    border-right: 0;
    background: #fff;
    color: var(--vp-purple);
}

.vp-form-field .input-group .form-control {
    border-left: 0;
}

.vp-form-field .form-control:focus,
.vp-form-field .form-select:focus {
    border-color: rgba(75, 0, 130, 0.45);
    box-shadow: 0 0 0 0.02rem var(--vp-blue);
}

.vp-password-field {
    position: relative;
}

.vp-password-field > i {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 0.85rem;
    color: var(--vp-purple);
    transform: translateY(-50%);
}

.vp-password-field .form-control {
    padding-left: 0.9rem;
    padding-right: 4rem;
}

.vp-password-field button {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: 0.75rem;
    padding: 0 0.65rem;
    border: 0;
    background: transparent;
    color: var(--vp-muted);
    font-size: 0.75rem;
    font-weight: 700;
    transform: translateY(-50%);
}

.vp-logo-field {
    grid-row: span 3;
}

.vp-logo-upload {
    min-height: 170px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 1rem;
    border: 1px dashed var(--vp-purple-2);
    border-radius: 0.55rem;
    color: var(--vp-ink-soft);
    text-align: center;
    cursor: pointer;
}

.vp-logo-upload:hover,
.vp-logo-upload:focus-within {
    background: #faf9ff;
    border-color: var(--vp-purple);
}

.vp-logo-upload > i {
    color: var(--vp-purple);
    font-size: 2.25rem;
}

.vp-logo-upload strong {
    font-size: var(--vp-text-item);
    font-weight: 500;
}

.vp-logo-upload span {
    color: var(--vp-purple);
    font-weight: 700;
}

.vp-logo-upload small {
    color: var(--vp-muted);
    font-size: var(--vp-text-meta);
}

.vp-logo-upload .vp-upload-file-name {
    display: block;
    max-width: 100%;
    margin-top: 0.35rem;
    padding: 0.4rem 0.65rem;
    overflow: hidden;
    border-radius: 0.35rem;
    background: #f1eef8;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-meta);
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vp-logo-upload.has-file {
    border-color: #24834a;
    background: #f4fbf6;
}

.vp-logo-upload.has-file > i,
.vp-logo-upload.has-file .vp-upload-file-name {
    color: #176b3a;
}

.vp-logo-upload.has-file .vp-upload-file-name {
    background: #e1f4e7;
}

.vp-church-details-stack {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 0 1rem;
}

.vp-signup-consent {
    display: grid;
    gap: 0.8rem;
    margin-top: 1.25rem;
    padding: 1rem;
    border: 1px solid var(--vp-line);
    border-radius: 0.75rem;
    background: #202020;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-meta);
}

.vp-signup-consent p {margin: 0; line-height: 1.55;
}

.vp-consent-check {display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start;
    gap: 0.65rem; line-height: 1.5;
}

.vp-signup-consent .form-check-input {
    flex: 0 0 auto;
    margin-top: 0.15rem;
}

.vp-signup-consent a,
.vp-signup-login a:not(.btn) {color: var(--vp-blue); font-weight: 600;
}

.vp-signup-login a:hover {background: #e1e1ff; color: var(--vp-heading); border: 1px solid #242378;
}


.vp-signup-submit {
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 0.55rem;
    border: 1px solid var(--vp-purple);
    border-radius: 0.45rem;
    background: var(--vp-purple);
    color: #fff;
    font-weight: 700;
}

.vp-signup-submit:hover,
.vp-signup-submit:focus {
    border-color: #5100a2;
    background: #5100a2;
    color: #fff;
}

.vp-signup-secondary {min-height: 48px; display: inline-flex; align-items: center; justify-content: center;
    gap: 0.5rem; border: 1px solid #56515e; color: var(--vp-ink-soft); background: #202020;
    font-weight: 700;
}

.vp-signup-secondary:hover,
.vp-signup-secondary:focus {border-color: #8d5bea; color: #fff; background: #30244a;
    box-shadow: 0 0 0 0.18rem rgba(141, 91, 234, 0.18);
}

.vp-signup-login {
    margin: 0;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-item);
    text-align: center;
}

/* --------------------------------------------------------------------------
   Church directory page
   -------------------------------------------------------------------------- */

.vp-directory-page {
    width: 100%;
    color: var(--vp-ink);
}

.vp-directory-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(1.5rem, 7vw, 2rem) 1rem;
    border: 1px solid var(--vp-line);
    border-radius: 1.35rem;
    background:
        radial-gradient(circle at 82% 18%, rgba(90, 22, 201, 0.34), transparent 32%),
        radial-gradient(circle at 12% 92%, rgba(228, 185, 29, 0.12), transparent 30%),
        linear-gradient(145deg, #111015 0%, #17131f 52%, #0f0e12 100%);
}

.vp-directory-hero::after {
    position: absolute;
    z-index: -1;
    top: -7rem;
    right: -5rem;
    width: 18rem;
    height: 18rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
    content: "";
}

.vp-directory-hero .container,
.vp-directory-content {
    max-width: 1240px;
}

.vp-directory-back {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 2rem;
    color: var(--vp-on-dark);
    font-size: var(--vp-text-link);
    font-weight: 700;
}

.vp-directory-back:hover,
.vp-directory-back:focus {
    color: var(--vp-gold);
}

.vp-directory-kicker {
    display: table;
    margin-bottom: 0.85rem;
    padding: 0.38rem 0.7rem;
    border: 1px solid rgba(228, 185, 29, 0.42);
    border-radius: 999px;
    color: var(--vp-gold);
    background: rgba(228, 185, 29, 0.08);
    font-size: var(--vp-text-badge);
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.vp-directory-hero h1 {
    max-width: 780px;
    margin: 0;
    color: #fff;
    font-size: clamp(2.25rem, 5vw, 4.8rem);
    font-weight: 800;
    letter-spacing: -0.045em;
    line-height: 0.98;
    font-family: 'Share Tech';
}

.vp-directory-hero > .container > p {
    max-width: 660px;
    margin: 1rem 0 0;
    color: var(--vp-ink-soft);
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    line-height: 1.65;
}

.vp-directory-search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    max-width: 760px;
    min-height: 58px;
    margin-top: 2rem;
    padding: 0.35rem 0.55rem 0.35rem 1rem;
    border: 1px solid #4a4650;
    border-radius: 1rem;
    background: rgba(28, 27, 31, 0.96);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.24);
}

.vp-directory-search:focus-within {
    border-color: var(--vp-gold);
    box-shadow: 0 0 0 0.18rem rgba(228, 185, 29, 0.18);
}

.vp-directory-search > i {
    color: var(--vp-gold);
    font-size: 1.15rem;
}

.vp-directory-search input {
    width: 100%;
    min-width: 0;
    padding: 0.65rem 0;
    border: 0;
    outline: 0;
    color: var(--vp-ink);
    background: transparent;
    font: inherit;
}

.vp-directory-search input::placeholder {
    color: var(--vp-muted);
    opacity: 1;
}

.vp-directory-search button {
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 0.7rem;
    color: var(--vp-ink-soft);
    background: #343238;
}

.vp-directory-search button:hover,
.vp-directory-search button:focus {
    color: #17120a;
    background: var(--vp-gold);
}

.vp-directory-content {
    padding-top: clamp(2rem, 5vw, 3.5rem);
    padding-bottom: 3rem;
}

.vp-directory-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--vp-line);
}

.vp-directory-toolbar h2 {
    margin: 0;
    color: var(--vp-ink);
    font-size: clamp(1.35rem, 2.5vw, 1.8rem);
    font-weight: 800;
}

.vp-directory-toolbar p {
    margin: 0.35rem 0 0;
    color: var(--vp-muted);
}

.vp-directory-filters {
    flex: 0 1 280px;
}

.vp-directory-filters label,
.vp-directory-filters label > span {
    display: grid;
}

.vp-directory-filters label > span {
    margin-bottom: 0.4rem;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-meta);
    font-weight: 700;
}

.vp-directory-filters .form-select {
    min-height: 49px;
    border-color: #484848;
    border-radius: 0.7rem;
    color: var(--vp-ink);
    background-color: #222125;
}

.vp-directory-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
    gap: 1.15rem;
}

.vp-directory-card {
    min-width: 0;
    min-height: 330px;
    display: flex;
    flex-direction: column;
    padding: 1.25rem;
    border: 1px solid var(--vp-line);
    border-radius: 1rem;
    color: var(--vp-ink);
    background: #19181c;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.16);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.vp-directory-card:hover,
.vp-directory-card:focus-within {
    border-color: rgba(228, 185, 29, 0.55);
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.28);
    transform: translateY(-3px);
}

.vp-directory-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.15rem;
}

.vp-directory-logo {
    width: 68px;
    height: 68px;
    flex: 0 0 68px;
    overflow: hidden;
    padding: 0.3rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.85rem;
    background: #fff;
}

.vp-directory-logo img {
    width: 100%;
    height: 100%;
    border-radius: 0.55rem;
    object-fit: cover;
}

.vp-directory-type {
    padding: 0.35rem 0.6rem;
    border: 1px solid rgba(148, 112, 229, 0.45);
    border-radius: 999px;
    color: #d8c9ff;
    background: rgba(90, 22, 201, 0.16);
    font-size: var(--vp-text-badge);
    font-weight: 800;
}

.vp-directory-card-body {
    min-width: 0;
}

.vp-directory-card-body h3 {
    margin: 0 0 1rem;
    overflow-wrap: anywhere;
    color: var(--vp-ink);
    font-size: 1.2rem;
    font-weight: 800;
    line-height: 1.25;
}

.vp-directory-card-body p {
    display: grid;
    grid-template-columns: 1.15rem minmax(0, 1fr);
    gap: 0.55rem;
    margin: 0 0 0.65rem;
    overflow-wrap: anywhere;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-meta);
    line-height: 1.45;
}

.vp-directory-card-body p i {
    color: var(--vp-gold);
}

.vp-directory-card-link {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 44px;
    margin-top: auto;
    padding: 0.65rem 0.85rem;
    border: 1px solid #7650d2;
    border-radius: 0.7rem;
    color: #fff;
    background: #48209f;
    font-size: var(--vp-text-link);
    font-weight: 800;
}

.vp-directory-card-link:hover,
.vp-directory-card-link:focus {
    color: #17120a;
    background: var(--vp-gold);
    border-color: #f1c928;
    box-shadow: 0 0 0 0.18rem rgba(228, 185, 29, 0.18);
}

.vp-directory-empty {
    margin-top: 1.25rem;
    padding: clamp(2rem, 6vw, 4rem) 1rem;
    border: 1px dashed #56515d;
    border-radius: 1rem;
    color: var(--vp-ink);
    background: #17161a;
    text-align: center;
}

.vp-directory-empty > i {
    display: block;
    margin-bottom: 0.75rem;
    color: var(--vp-gold);
    font-size: 2rem;
}

.vp-directory-empty h3 {
    margin-bottom: 0.45rem;
}

.vp-directory-empty p {
    margin: 0 auto 1.25rem;
    color: var(--vp-ink-soft);
}

@media (max-width: 767.98px) {
    .vp-directory-hero {
        padding: 2rem 0.35rem;
        border-radius: 1rem;
    }

    .vp-directory-back {
        margin-bottom: 1.5rem;
    }

    .vp-directory-hero h1 {
        font-size: clamp(2.1rem, 12vw, 3.2rem);
    }

    .vp-directory-search {
        min-height: 54px;
        margin-top: 1.5rem;
    }

    .vp-directory-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .vp-directory-filters {
        width: 100%;
        flex-basis: auto;
    }

    .vp-directory-grid {
        grid-template-columns: 1fr;
    }

    .vp-directory-card {
        min-height: 0;
    }
}

/* --------------------------------------------------------------------------
   Life Plug page
   -------------------------------------------------------------------------- */

.vp-life-panel {border-radius: 0.65rem; box-shadow: 0 8px 24px rgba(10, 8, 24, 0.05);
}
.vp-life-panel .card-body { padding: 1rem;
}

.vp-life-heading { display: flex; align-items: center;  justify-content: space-between;
    gap: 0.75rem;  margin-bottom: 0.8rem;
}
.vp-life-heading h2 { display: flex; align-items: center;  gap: 0.4rem;
    min-width: 0; margin: 0; color: var(--vp-heading); font-size: var(--vp-text-section);
    font-weight: 800; text-transform: uppercase;
}
.vp-life-heading a { flex: 0 0 auto;  color: var(--vp-purple);
    font-size: var(--vp-text-link); font-weight: 700;
}
.vp-nearby-list,
.vp-session-list {margin-inline: -0.35rem;
}

.vp-session-list button.see_more_link {border-bottom:1px solid var(--vp-line);
    border-radius: 0.65rem; padding: 0.75rem 0.4rem;
    transition: background-color 160ms ease, transform 160ms ease;
}.vp-session-list button.see_more_link:hover{ background: #1d1c20;
    transform: translateX(3px);
}

.vp-nearby-item { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center; gap: 0.7rem; padding: 0.58rem 0.35rem;
    color: var(--vp-ink); border-bottom: 1px solid #efedf5;
}
.vp-nearby-item:hover,
.vp-nearby-item:focus {color: var(--vp-purple);
}
.vp-life-avatar,
.vp-group-avatar { display: inline-flex; align-items: center;
    justify-content: center; border-radius: 50%;  background: #17005f;
    color: var(--vp-gold); font-weight: 800;
}
.vp-life-avatar { width: 44px; height: 44px; border: 2px solid #e7d890;
    font-size: 0.72rem;
}
.vp-nearby-copy { display: grid; min-width: 0;
}

.vp-nearby-copy strong,
.vp-session-item strong,
.vp-group-item strong,
.vp-upcoming strong { color: var(--vp-ink); font-size: var(--vp-text-item);
    font-weight: 700;
}

.vp-nearby-copy small,
.vp-session-item small,
.vp-group-item small,
.vp-upcoming small {
    display: block;
    color: var(--vp-muted);
    font-size: .75rem 
}
.prayer-sessions strong{font-family: "Share Tech", sans-serif; font-weight: 400;
color: var(--vp-ink); font-size: var(--vp-text-item);
}
.vp-life-primary {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 1px solid #35008d;
    border-radius: 0.4rem;
    background: #35008d;
    color: #fff;
    font-size: var(--vp-text-link);
    font-weight: 700;
}

.vp-life-primary:hover,
.vp-life-primary:focus {
    border-color: #4c09ad;
    background: #4c09ad;
    color: #fff;
}

.vp-support-form {
    display: grid;
    gap: 0.75rem;
}

.vp-support-form .form-label {
    margin-bottom: -0.35rem;
    color: var(--vp-ink);
    font-size: var(--vp-text-feed-meta);
    font-weight: 700;
}

.vp-support-form .form-control,
.vp-support-form .form-select {
    min-height: 46px;
    border-color: #e1ddea;
    border-radius: 0.4rem;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-form);
}

.vp-support-form textarea.form-control {
    min-height: 125px;
}

.vp-support-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
}

.vp-support-options button {
    min-height: 46px;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem;
    border: 1px solid #e3dfec;
    border-radius: 0.35rem;
    background: #fff;
    color: var(--vp-ink-soft);
    font-size: var(--vp-text-meta);
    text-align: left;
}

.vp-support-options button:hover,
.vp-support-options button:focus {
    border-color: #6a2fc1;
    color: #3d00a1;
}

.vp-support-options i {
    color: #5a16c9;
}

.vp-life-carousel {
    padding-bottom: 1.4rem;
}

.vp-life-feature {
    position: relative;
    min-height: 250px;
    overflow: hidden;
    border-radius: 0.55rem;
    background: #080711;
}

.vp-life-feature img,
.vp-life-story img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.vp-life-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(4, 3, 12, 0.08), rgba(4, 3, 12, 0.25) 38%, rgba(4, 3, 12, 0.94));
}

.vp-life-feature-top {
    position: absolute;
    top: 0.85rem;
    left: 0.85rem;
}

.vp-life-badge,
.vp-live-label {
    display: inline-flex;
    align-items: center;
    border-radius: 0.25rem;
    background: #4d18b9;
    color: #fff;
    font-size: var(--vp-text-badge);
    font-weight: 800;
    line-height: 1;
}

.vp-life-badge {
    padding: 0.35rem 0.45rem;
}

.vp-life-badge.is-live,
.vp-live-label {
    background: #f01827;
}

.vp-life-feature-copy {
    position: absolute;
    right: 0.85rem;
    bottom: 0.85rem;
    left: 0.85rem;
    color: #fff;
}

.vp-life-feature-copy h2 {
    margin: 0.45rem 0 0.2rem;
    font-size: var(--vp-text-media-title);
    font-weight: 800;
}

.vp-life-feature-copy p {
    margin: 0;
    color: var(--vp-on-dark);
    font-size: var(--vp-text-media-body);
}

.vp-life-feature-copy .btn {
    margin-top: 0.65rem;
}

.vp-life-carousel-arrow {
    top: 50%;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #fff;
    color: #3d00a1;
    box-shadow: 0 6px 18px rgba(10, 8, 24, 0.18);
    opacity: 1;
    transform: translateY(calc(-50% - 0.7rem));
}

.vp-life-carousel-arrow.is-prev {
    left: -18px;
}

.vp-life-carousel-arrow.is-next {
    right: -18px;
}

.vp-life-carousel-arrow:hover,
.vp-life-carousel-arrow:focus {
    background: var(--vp-gold);
    color: #111;
}

.vp-life-indicators {
    bottom: -0.2rem;
    margin-bottom: 0;
}

.vp-life-indicators [data-bs-target] {
    width: 8px;
    height: 8px;
    border: 1px solid #4d3e76;
    border-radius: 50%;
    background: transparent;
    opacity: 1;
}

.vp-life-indicators .active {
    border-color: var(--vp-gold);
    background: var(--vp-gold);
}

.vp-life-feed {
    display: grid;
    gap: 0.4rem;
}

.vp-life-story {
    position: relative;
    min-height: 142px;
    overflow: hidden;
    border-radius: 0.5rem;
    background: #080711;
}

.vp-life-story-copy {
    position: relative;
    z-index: 1;
    width: min(72%, 650px);
    padding: 1rem 4rem 1rem 1.25rem;
    color: #fff;
}

.vp-life-story-copy h2 {
    margin: 0.35rem 0 0.15rem;
    font-size: var(--vp-text-feed-title);
    font-weight: 800;
}

.vp-life-story-copy p {
    margin: 0;
    color: var(--vp-on-dark);
    font-size: var(--vp-text-feed-body);
}

.vp-life-story-copy small {
    display: block;
    margin-top: 0.55rem;
    color: var(--vp-on-dark);
    font-size: var(--vp-text-feed-meta);
}

.vp-life-play {
    position: absolute;
    z-index: 2;
    right: 1.25rem;
    bottom: 1.25rem;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: #ffc400;
    color: #15100a;
    font-size: 1.35rem;
}

.vp-life-play:hover,
.vp-life-play:focus {
    background: #ffdc59;
    transform: scale(1.04);
}

.vp-now-playing {
    padding: 0.9rem;
    border-radius: 0.5rem;
    background: linear-gradient(145deg, #16002f, #2f0058);
    color: #fff;
}

.vp-now-playing h3 {
    margin: 0.85rem 0 0.15rem;
    font-size: 1.18rem;
    font-weight: 800;
    text-align: center;
}

.vp-now-playing p {
    margin-bottom: 1rem;
    color: var(--vp-on-dark);
    font-size: 0.92rem;
    text-align: center;
}

.vp-now-playing .progress {
    height: 5px;
    background: rgba(255, 255, 255, 0.22);
}

.vp-now-playing .progress-bar {
    background: #ffc400;
}

.vp-player-time {
    display: flex;
    justify-content: space-between;
    margin-top: 0.35rem;
    color: var(--vp-on-dark);
    font-size: 0.8rem;
}

.vp-player-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 0.35rem;
}

.vp-player-controls button {
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #fff;
}

.vp-player-controls .is-main {
    width: 43px;
    height: 43px;
    background: #ffc400;
    color: #16002f;
    font-size: 1.4rem;
}

.vp-session-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 22px;
    align-items: center;
    gap: 0.85rem;
    min-height: 80px;
    padding: 0.75rem 0.4rem;
    border-bottom: 1px solid var(--vp-line);
    border-radius: 0.65rem;
    transition: background-color 160ms ease, transform 160ms ease;
}

.vp-session-item:hover,
.vp-session-item:focus {
    background: #1d1c20;
    transform: translateX(3px);
}

.prayer-sessions {
    display: grid;
    gap: 0.22rem;
    min-width: 0;
}

.prayer-sessions strong,
.prayer-sessions small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vp-session-meta {
    display: grid;
    justify-items: end;
    gap: 0.42rem;
}

.vp-session-item time {
    color: var(--vp-ink-soft);
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
    font-family: 'Roboto Condensed';
}

.vp-session-status {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    /* min-height: 25px; */
    padding: 0.3rem;
    border: 1px solid transparent;
    border-radius: 0.3rem;
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.01em;
    line-height: 1;
}

.vp-session-status::before {
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: currentColor;
    content: "";
}

.vp-session-status.is-live {
    border-color: #ff536d;
    color: #fff;
    background: #f0183a;
    box-shadow: 0 0 0 4px rgba(240, 24, 58, 0.14), 0 6px 16px rgba(240, 24, 58, 0.24);
    animation: vp-live-pulse 1.8s ease-in-out infinite;
}

.vp-session-status.is-upcoming {
    border-color: rgba(228, 185, 29, 0.48);
    color: #f4d76d;
    background: rgba(228, 185, 29, 0.12);
}

.vp-session-status.is-scheduled {
    border-color: rgba(141, 91, 234, 0.48);
    color: #cbb7ff;
    background: rgba(90, 22, 201, 0.16);
}

.vp-session-count {
    color: var(--vp-muted);
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
}

.vp-session-item > i {
    color: #bba3ff;
    font-size: 0.78rem;
    transition: color 160ms ease, transform 160ms ease;
}

.vp-session-item:hover > i,
.vp-session-item:focus > i {
    color: var(--vp-gold);
    transform: translateX(2px);
}

@keyframes vp-live-pulse {
    0%, 100% {box-shadow: 0 0 0 3px rgba(240, 24, 58, 0.1), 0 6px 16px rgba(240, 24, 58, 0.2);}
    50% {box-shadow: 0 0 0 6px rgba(240, 24, 58, 0.18), 0 8px 20px rgba(240, 24, 58, 0.3);}
}

@media (prefers-reduced-motion: reduce) {
    .vp-session-status.is-live {
        animation: none;
    }
}

.vp-group-list {
    display: grid;
    gap: 0.75rem;
}

.vp-group-item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
}.vp-group-item strong { white-space: nowrap; text-overflow: ellipsis;
    overflow: hidden; font-optical-sizing: auto; display: block;
}

.vp-group-avatar {
    width: 38px;
    height: 38px;
    font-size: 0.65rem;
}

.vp-group-item > span:nth-child(2) {
    min-width: 0;
}

.vp-group-item .btn {
    border: 1px solid #a3a3a3;
    border-radius: 0.3rem;
    background: var(--vp-magenta);
    color: #fff;
    font-size: 0.8rem;
    display: none;
    transition: background-color 160ms ease, transform 160ms ease;
}
.vp-group-item:hover .btn { /*show hideen link*/
    display: block;
  }
.vp-group-item .btn:hover {
    background: rgb(49, 5, 44);
    transform: translateX(3px);
}.vp-group-item:hover{cursor: pointer;}

.vp-upcoming {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    align-items: center;
    gap: 0.7rem;
}

.vp-upcoming img {
    width: 68px;
    height: 78px;
    border-radius: 0.35rem;
    object-fit: cover;
}

.vp-reminder-btn {
    border: 1px solid #3d00a1;
    border-radius: 0.35rem;
    color: var(--vp-purple);
    font-size: 0.9rem;
    font-weight: 700;
}

.vp-reminder-btn:hover,
.vp-reminder-btn:focus {
    background: #3d00a1;
    color: #fff;
}

@media (max-width: 1399.98px) {
    .vp-feature-card {
        min-height: 185px;
    }

    .vp-life-feature {
        min-height: 240px;
    }
}

@media (max-width: 1199.98px) {
    .vp-brand {
        min-width: 0;
    }

    .vp-post {
        grid-template-columns: 220px minmax(0, 1fr) auto;
    }

    .vp-search-wrap {
        max-width: none;
    }
}

@media (max-width: 767.98px) {
    .site-main {
        padding-inline: 0.75rem;
    }

    .vp-brand-copy {
        display: none;
    }

    .vp-btn-gold {
        min-height: 44px;
        padding-inline: 0.8rem;
    }

    .vp-post {
        grid-template-columns: 1fr auto;
    }

    .vp-post-image {
        grid-column: 1 / -1;
    }

    .vp-testimony {
        align-items: flex-start;
    }

    .vp-signup-form {
        grid-template-columns: 1fr;
    }

    .vp-form-field,
    .vp-church-details-stack {
        grid-column: 1 / -1;
    }

    .vp-church-details-stack {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .vp-signup-page {
        padding: 0.75rem;
    }

    .vp-signup-card > .card-body {
        padding: 1.15rem;
    }
}

@media (max-width: 575.98px) {
    .vp-church-item {
        grid-template-columns: 48px minmax(0, 1fr) auto;
    }

    .vp-avatar {
        width: 48px;
        height: 48px;
    }

    .vp-feature-card {
        min-height: 240px;
    }

    .vp-feature-copy .btn {
        margin-top: 0.55rem;
    }

    .vp-testimony {
        flex-direction: column;
    }

    .vp-signup-heading {
        align-items: flex-start;
    }

    .vp-signup-heading-icon {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
        font-size: 1.6rem;
    }

    .vp-signup-heading h1 {
        font-size: 1.25rem;
    }

    .vp-signup-tabs .nav-link {
        font-size: var(--vp-text-meta);
    }

    .vp-life-story {
        min-height: 220px;
    }

    .vp-life-story-copy {
        width: 100%;
        padding: 1rem 3.8rem 1rem 1rem;
    }

    .vp-life-play {
        right: 0.9rem;
        bottom: 0.9rem;
    }

    .vp-life-carousel-arrow.is-prev {
        left: -8px;
    }

    .vp-life-carousel-arrow.is-next {
        right: -8px;
    }
}
/* Sign-in password visibility control */
.vp-password-field {
  position: relative;
}

.vp-password-field .form-control {
  padding-right: 3.25rem;
}

.vp-password-toggle {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: .65rem;
  color: rgba(255, 255, 255, .7);
  display: inline-flex;
  height: 2.5rem;
  justify-content: center;
  padding: 0 .65rem;
  position: absolute;
  right: .45rem;
  top: 50%;
  transform: translateY(-50%);
  transition: background-color .18s ease, color .18s ease;
  width: auto;
}

.vp-password-toggle:hover,
.vp-password-toggle:focus-visible {
  background: rgba(255, 255, 255, .09);
  color: #fff;
}

.vp-password-toggle:focus-visible {
  outline: 2px solid #e4b91d;
  outline-offset: 1px;
}