/* =========================================================
   SehVarta Premium Theme — Phase 5: Sidebar redesign + polish
   ========================================================= */

@media (min-width: 761px) {

/* ---------- 1. Fill available height cleanly, no dead gap ---------- */
.fb-feed {
    background: transparent;
}
.fb-feed > *:last-child {
    margin-bottom: 4px;
}

/* ---------- 2. LEFT RAIL: premium card sidebar ---------- */
.fb-left-rail, .social-left-rail {
    background: var(--glass-bg, rgba(255,255,255,.7)) !important;
    backdrop-filter: var(--glass-blur, blur(18px));
    -webkit-backdrop-filter: var(--glass-blur, blur(18px));
    border: 1px solid var(--glass-border, rgba(255,255,255,.5)) !important;
    border-radius: var(--r-lg, 24px) !important;
    box-shadow: var(--glass-shadow, 0 12px 40px rgba(37,99,235,.12)) !important;
    padding: 18px 14px !important;
    gap: 4px !important;
}

.sv-rail-profile {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center;
    gap: 8px !important;
    padding: 12px 8px 18px !important;
    margin: -4px -4px 10px !important;
    border-bottom: 1px solid var(--line, rgba(37,99,235,.12));
    border-radius: 0;
}
.sv-rail-profile span {
    width: 60px !important;
    height: 60px !important;
    font-size: 20px !important;
    box-shadow: 0 8px 22px rgba(124, 58, 237, .3);
}
.sv-rail-profile {
    font-size: 14.5px;
}

.fb-left-rail a, .social-left-rail a {
    position: relative;
    transition: background-color .18s var(--ease, ease), transform .18s var(--ease, ease), color .18s var(--ease, ease);
}
.fb-left-rail a:hover, .social-left-rail a:hover {
    transform: translateX(3px);
}
.fb-left-rail a:active, .social-left-rail a:active {
    transform: translateX(3px) scale(.98);
}
/* Divider before the last two utility links (Notifications/Settings) for section grouping */
.fb-left-rail a:nth-last-child(2), .social-left-rail a:nth-last-child(2) {
    margin-top: 8px;
    padding-top: 15px !important;
    border-top: 1px solid var(--line, rgba(37,99,235,.12));
}

/* Beautiful Create Post button pinned at the bottom of the left rail */
.fb-left-rail::after, .social-left-rail::after {
    content: "+  Create Post";
    display: block;
    margin: 12px 2px 2px;
    padding: 12px;
    text-align: center;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--sv-blue, #2563eb), var(--sv-purple, #7c3aed));
    color: #fff;
    font-weight: 800;
    font-size: 13.5px;
    letter-spacing: .01em;
    box-shadow: 0 10px 26px rgba(37, 99, 235, .28);
    cursor: pointer;
}
.fb-left-rail, .social-left-rail {
    position: relative;
}

/* ---------- 3. RIGHT RAIL: distinct elevated cards ---------- */
.fb-right-rail, .social-right-rail {
    gap: 16px !important;
}
.fb-right-rail > section, .social-right-rail > section {
    background: var(--glass-bg, rgba(255,255,255,.7)) !important;
    backdrop-filter: var(--glass-blur, blur(18px));
    -webkit-backdrop-filter: var(--glass-blur, blur(18px));
    border: 1px solid var(--glass-border, rgba(255,255,255,.5)) !important;
    border-radius: var(--r-lg, 24px) !important;
    box-shadow: var(--glass-shadow, 0 12px 40px rgba(37,99,235,.12)) !important;
    transition: box-shadow .2s var(--ease, ease), transform .2s var(--ease, ease);
}
.fb-right-rail > section:hover, .social-right-rail > section:hover {
    box-shadow: 0 18px 50px rgba(37, 99, 235, .18) !important;
}
.fb-right-rail h3::before, .social-right-rail h3::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: 8px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--sv-blue, #2563eb), var(--sv-purple, #7c3aed));
    vertical-align: middle;
}

/* Reward panel: wallet-style highlighted card */
.fb-reward-panel {
    background:
        linear-gradient(135deg, rgba(37,99,235,.14), rgba(124,58,237,.14)) !important;
}
.fb-reward-panel h3 { color: var(--sv-purple-dark, #6d28d9); }
.fb-reward-panel .button {
    margin-top: 8px;
    width: 100%;
}

/* ---------- 4. Generic card polish (applies everywhere) ---------- */
.fb-post-card, .sv-post-card-shell {
    transition: box-shadow .25s var(--ease, ease), transform .25s var(--ease, ease);
}

}