@import url("https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css");
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css");


body {
    /*padding-top: 3.5rem;*/
}

.fa-2 {
    font-size: 2em;
}

.fa-3 {
    font-size: 3em;
}

.flush-green {
    background-color: #C3D898 !important;
    border-color: #C3D898 !important;
}

.flush-light-blue {
    background-color: #69A2B0 !important;
    border-color: #69A2B0 !important;
}

.flush-dark-blue {
    background-color: #1C3144 !important;
    border-color: #1C3144 !important;
}

.flush-pink {
    background-color: #D4ADCF !important;
    border-color: #D4ADCF !important;
}

.flush-brown {
    background-color: #96705B !important;
    border-color: #96705B !important;
}

.jumbotron {
    background-color: transparent;
    padding: 2rem 1rem;
    /*margin-bottom: 2rem;*/
    /*border-radius: .3rem;*/
}

.main-color {
    background-color: #5effb8;
}

.podcast-links {
    text-align: center;
    padding: 10px;
    margin: 10px;
}

.podcast-link {
    padding: 10px;
    margin: 10px;
}

#footer {
    height: calc(100vh - 540px);
    padding-top: 10px;
}

#footer-my-info-container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
    text-align: center;
}

/* Compact thread context blocks on post/feed pages */
.parent-context.card,
.root-context.card {
    background-color: #f8f9fa; /* subtle gray */
    border-color: #e9ecef;     /* light border */
    border-radius: .5rem;
}

/* Emphasize hierarchy by varying the left border color */
.root-context.card {
    border-left: 3px solid #cfd4da; /* lighter for root */
}

.parent-context.card {
    border-left: 3px solid #6c757d; /* darker for immediate parent */
}

.parent-context .card-body,
.root-context .card-body {
    padding: .5rem .75rem; /* tighter spacing */
}

.parent-context .small,
.root-context .small {
    line-height: 1.2;
}

.parent-context a.small,
.root-context a.small {
    color: #6c757d; /* muted link for context actions */
}

/* Vertical connector between root-context and parent-context */
.parent-context.card { position: relative; }
.root-context.card + .parent-context.card::before {
    content: "";
    position: absolute;
    left: 0;            /* align with border-left */
    top: -12px;         /* match adjusted gap */
    width: 3px;         /* same as border-left width */
    height: 12px;       /* fit entirely within the gap */
    background-color: #6c757d; /* same as parent-context border */
    pointer-events: none;      /* avoid blocking clicks */
}

/* Increase gap between root and parent to accommodate connector */
.root-context.card { margin-bottom: 0.75rem !important; }

/* Feed usernames: blue link without underline by default; underline on hover */
.list-group-item .fw-semibold > a {
    text-decoration: none !important;
}
.list-group-item .fw-semibold > a:hover {
    text-decoration: underline !important;
}

/* Post text: no underline; darken entire text on hover of item */
.post-item .post-link {
    text-decoration: none !important;
}
.post-item:hover .post-link {
    color: #212529 !important; /* dark body color */
    text-decoration: none !important;
}

/* Make entire post area feel clickable and provide hover affordance */
.post-item {
    cursor: pointer;
    transition: background-color .15s ease-in-out;
}
.post-item:hover {
    background-color: #f8f9fa; /* subtle hover */
}