/*
 * Doctor.bd Community page aligned with the Doctors Directory layout.
 * The document keeps normal page scrolling while both desktop side rails stay sticky.
 */
body.community-directory-page {
    --db-header-height: 74px;
    --community-directory-blue: #0868f7;
    --community-directory-blue-dark: #0757cf;
    --community-directory-blue-soft: #edf5ff;
    --community-directory-ink: #10213f;
    --community-directory-muted: #667085;
    --community-directory-border: #e2e8f0;
    --community-directory-page: #f4f7fb;
    --community-directory-shadow: 0 8px 28px rgba(30, 64, 112, 0.07);
    --community-directory-shadow-hover: 0 14px 34px rgba(30, 64, 112, 0.12);
    background: var(--community-directory-page);
}

body.community-directory-page .doctorbd-main,
body.community-directory-page .community-directory-redesign,
body.community-directory-page .community-directory-shell {
    background: var(--community-directory-page) !important;
}

body.community-directory-page .community-directory-redesign {
    color: var(--community-directory-ink);
    font-weight: 500;
}

body.community-directory-page .community-directory-container {
    width: 100%;
    max-width: 1540px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 24px;
    padding-left: 24px;
}

body.community-directory-page .doctorbd-header,
body.community-directory-page .doctorbd-header .navbar {
    min-height: var(--db-header-height);
}

body.community-directory-page .doctorbd-header .container-xl {
    max-width: 1540px;
}

body.community-directory-page .doctorbd-brand-mark {
    width: 42px;
    height: 42px;
    border-radius: 10px;
}

body.community-directory-page .doctorbd-brand-text {
    font-size: 1.25rem;
}

body.community-directory-page .doctorbd-header-search {
    width: min(360px, 29vw);
}

body.community-directory-page .doctorbd-primary-nav .nav-link.active {
    color: var(--community-directory-blue);
    border-bottom-color: var(--community-directory-blue);
}

/* Keep every sticky containing block open and as tall as the centre feed. */
body.community-directory-page .doctorbd-main,
body.community-directory-page .community-directory-redesign,
body.community-directory-page .community-directory-shell,
body.community-directory-page .community-directory-container,
body.community-directory-page .community-directory-row,
body.community-directory-page .community-left-column,
body.community-directory-page .community-right-column {
    overflow: visible !important;
}

body.community-directory-page .community-directory-row {
    min-width: 0;
}

body.community-directory-page .community-left-column,
body.community-directory-page .community-right-column {
    align-self: stretch !important;
    min-width: 0;
}

body.community-directory-page .community-feed-column {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    min-width: 0;
    position: relative;
    z-index: 1;
}

/* Existing community stack remains a simple card stack; the outer rail owns sticky behaviour. */
body.community-directory-page .community-directory-sticky-rail .community-sticky-stack {
    position: static !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
    z-index: auto !important;
}

body.community-directory-page .community-sticky-stack {
    display: grid;
    gap: 1rem;
}

/* Card treatment mirrors the doctors directory. */
body.community-directory-page .community-side-card,
body.community-directory-page .community-composer,
body.community-directory-page .community-post,
body.community-directory-page .community-empty-card,
body.community-directory-page .community-feed-loader {
    border: 1px solid var(--community-directory-border) !important;
    border-radius: 1rem !important;
    background: rgba(255, 255, 255, 0.99);
    box-shadow: var(--community-directory-shadow) !important;
}

body.community-directory-page .community-composer,
body.community-directory-page .community-post {
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

body.community-directory-page .community-composer:hover,
body.community-directory-page .community-post:hover {
    border-color: #cbd9ea !important;
    box-shadow: var(--community-directory-shadow-hover) !important;
}

body.community-directory-page .community-profile-cover {
    border-radius: 1rem 1rem 0 0;
}

body.community-directory-page .community-profile-links .list-group-item:last-child {
    border-radius: 0 0 1rem 1rem;
}

body.community-directory-page .community-composer-trigger {
    border-color: #d6dfeb;
    background: #f8fafc;
}

body.community-directory-page .community-composer-trigger:hover,
body.community-directory-page .community-composer-trigger:focus {
    border-color: #9fc5ff;
    background: var(--community-directory-blue-soft);
    box-shadow: 0 0 0 3px rgba(8, 104, 247, 0.09);
}

body.community-directory-page .community-dashboard-button,
body.community-directory-page .community-join-card .btn {
    background: var(--community-directory-blue);
    border-color: var(--community-directory-blue);
}

body.community-directory-page .community-dashboard-button:hover,
body.community-directory-page .community-dashboard-button:focus,
body.community-directory-page .community-join-card .btn:hover,
body.community-directory-page .community-join-card .btn:focus {
    background: var(--community-directory-blue-dark);
    border-color: var(--community-directory-blue-dark);
}

/* The same sticky rail model used by the Doctors Directory page. */
@media (min-width: 992px) {
    body.community-directory-page .community-directory-left-rail {
        position: sticky !important;
        top: calc(var(--db-header-height) + 16px) !important;
        height: fit-content;
        max-height: calc(100vh - var(--db-header-height) - 32px);
        max-height: calc(100dvh - var(--db-header-height) - 32px);
        padding-right: 2px;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: transparent transparent;
        z-index: 12;
    }

    body.community-directory-page .community-directory-left-rail:hover,
    body.community-directory-page .community-directory-left-rail:focus-within {
        scrollbar-color: #b9c4d1 transparent;
    }
}

@media (min-width: 1200px) {
    body.community-directory-page .community-directory-right-rail {
        position: sticky !important;
        top: calc(var(--db-header-height) + 16px) !important;
        height: fit-content;
        max-height: calc(100vh - var(--db-header-height) - 32px);
        max-height: calc(100dvh - var(--db-header-height) - 32px);
        padding-right: 2px;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: transparent transparent;
        z-index: 12;
    }

    body.community-directory-page .community-directory-right-rail:hover,
    body.community-directory-page .community-directory-right-rail:focus-within {
        scrollbar-color: #b9c4d1 transparent;
    }
}

@media (max-width: 1199.98px) {
    body.community-directory-page .community-directory-container {
        max-width: 1180px;
    }
}

@media (max-width: 991.98px) {
    body.community-directory-page .community-directory-left-rail,
    body.community-directory-page .community-directory-right-rail {
        position: static !important;
        top: auto !important;
        max-height: none !important;
        padding-right: 0;
        overflow: visible !important;
    }

    body.community-directory-page .community-left-column {
        margin-top: 0.25rem;
    }
}

@media (max-width: 575.98px) {
    body.community-directory-page .community-directory-container {
        padding-right: 0;
        padding-left: 0;
    }

    body.community-directory-page .community-directory-row {
        --bs-gutter-x: 0;
    }

    body.community-directory-page .community-side-card {
        margin-right: 10px;
        margin-left: 10px;
    }

    body.community-directory-page .community-post,
    body.community-directory-page .community-composer,
    body.community-directory-page .community-empty-card,
    body.community-directory-page .community-feed-loader {
        border-right: 0 !important;
        border-left: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
}