/* ----- Desktop/Default ------- */

.coop-newsfeed-title {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 24px;
}

.coop-newsfeed-card {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 9px 0 #e6eaed78;
    padding: 22px 32px 22px 28px;
    margin-bottom: 22px;
}

.coop-announcement-header,
.coop-featured-badge {
    font-size: 1.08rem;
    display: flex;
    color: #585858;
    font-weight: 700;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.coop-announcement-title,
.coop-featured-title,
.coop-blogpost-title {
    font-size: 1.14rem;
    font-weight: 700;
    margin-bottom: 5px;
}

.coop-announcement-validity,
.coop-featured-highlight,
.coop-featured-public {
    font-size: 0.98rem;
}

.coop-newsfeed-meta {
    color: #6b6b6b;
    font-size: 0.93rem;
}

.coop-featured-content,
.coop-blogpost-content {
    display: flex;
    gap: 20px;
    margin: 13px 0 7px 0;
    align-items: center;
}

.coop-featured-img,
.coop-blogpost-img {
    border-radius: 10px;
    width: 300px;
    height: 160px;
    object-fit: cover;
}

.coop-featured-text,
.coop-blogpost-text {
    font-size: 1rem;
    color: #252525;
    flex: 1;
}

.coop-newsfeed-row {
    display: flex;
    gap: 20px;
    margin-top: 8px;
}

.coop-survey-card,
.coop-discussion-card {
    flex: 1;
    padding: 20px 20px 18px 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.coop-btn {
    padding: 9px 0;
    border: none;
    border-radius: 6px;
    font-size: 1rem;
    width: 100%;
    margin-top: 8px;
    cursor: pointer;
    font-weight: 600;
}

.coop-btn-primary {
    background: #202325;
    color: #fff;
    transition: background 0.15s;
}

.coop-btn-primary:hover {
    background: #1e2223;
}

.coop-btn-secondary {
    background: #fff;
    color: #202325;
    border: 1.5px solid #c4c6ca;
    transition: background 0.15s, border 0.15s;
}

.coop-featured-badge .fa-star,
.coop-announcement-header .fa-bullhorn {
    color: #fdad2b;
}

.coop-btn-secondary:hover {
    background: #eeeeee;
    border-color: #bdbdbd;
}


/* ------ Desktop/Default ------- */

@media (max-width: 1100px) {
    .coop-newsfeed-wrap {
        max-width: 97vw;
        padding-left: 0;
        padding-right: 0;
    }
    .coop-newsfeed-card {
        padding: 16px 3vw 16px 3vw;
        margin-bottom: 16px;
    }
    .coop-newsfeed-title {
        font-size: 1.44rem;
        margin-bottom: 16px;
    }
    .coop-featured-content,
    .coop-blogpost-content {
        gap: 12px;
    }
    .coop-featured-img,
    .coop-blogpost-img {
        width: 220px;
        height: 160px;
        max-width: 48vw;
    }
    .coop-featured-title,
    .coop-blogpost-title,
    .coop-announcement-title {
        font-size: 1.07rem;
    }
    .coop-featured-badge,
    .coop-announcement-header {
        font-size: 1rem;
    }
    .coop-btn {
        font-size: 0.95rem;
    }
}


/* ------ Tablet (max-width: 900px) ------- */

@media (max-width: 900px) {
    .coop-newsfeed-title {
        font-size: 1.5rem;
        margin-bottom: 18px;
    }
    .coop-newsfeed-card {
        padding: 14px 7vw;
        margin-bottom: 16px;
    }
    .coop-featured-content,
    .coop-blogpost-content {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start;
    }
    .coop-featured-img,
    .coop-blogpost-img {
        width: 100%;
        height: 300px;
        min-width: 0;
    }
    .coop-newsfeed-row {
        flex-direction: column;
        gap: 12px;
    }
    .coop-survey-card,
    .coop-discussion-card {
        padding: 12px 7vw;
    }
    .coop-announcement-header,
    .coop-featured-badge {
        font-size: 1rem;
        gap: 6px;
    }
    .coop-announcement-title,
    .coop-featured-title,
    .coop-blogpost-title {
        font-size: 1.04rem;
    }
    .coop-featured-text,
    .coop-blogpost-text {
        font-size: 0.97rem;
    }
    .coop-btn {
        font-size: 0.95rem;
        padding: 8px 0;
    }
}


/* ------ Small Tablets & Phones (max-width: 640px) ------ */

@media (max-width: 640px) {
    .coop-newsfeed-title {
        font-size: 1.15rem;
        margin-bottom: 10px;
        text-align: center;
    }
    .coop-newsfeed-card {
        padding: 7px 2.5vw 8px 2vw;
        margin-bottom: 11px;
        border-radius: 7px;
        box-shadow: 0 1px 7px #e6eaed63;
    }
    .coop-featured-content,
    .coop-blogpost-content {
        flex-direction: column;
        gap: 8px;
        margin: 6px 0 3px 0;
    }
    .coop-featured-img,
    .coop-blogpost-img {
        width: 100%;
        max-width: 100vw;
        height: 160px;
    }
    .coop-announcement-header,
    .coop-featured-badge {
        font-size: 0.98rem;
        gap: 4px;
    }
    .coop-announcement-title,
    .coop-featured-title,
    .coop-blogpost-title {
        font-size: 0.99rem;
    }
    .coop-featured-text,
    .coop-blogpost-text {
        font-size: 0.94rem;
    }
    .coop-newsfeed-row {
        flex-direction: column;
        gap: 4px;
        margin-top: 4px;
    }
    .coop-btn {
        font-size: 0.91rem;
        padding: 8px 0;
        margin-top: 6px;
    }
    .coop-newsfeed-meta,
    .coop-announcement-validity,
    .coop-featured-public,
    .coop-featured-highlight {
        font-size: 0.88rem;
    }
}


/* ----------- Extra Small Phones (<=400px) ------------ */

@media (max-width: 400px) {
    .coop-featured-img,
    .coop-blogpost-img {
        height: 160px;
    }
    .coop-newsfeed-title {
        font-size: 0.98rem;
    }
    .coop-newsfeed-card {
        padding: 4px 1vw;
        margin-bottom: 20px
    }
    .coop-featured-title,
    .coop-blogpost-title,
    .coop-announcement-title {
        font-size: 0.93rem;
    }
    .coop-featured-text,
    .coop-blogpost-text {
        font-size: 0.89rem;
    }
}


/* Optional: Add horizontal scrolling for wide overflow content on small screens */

@media (max-width: 640px) {
    .coop-newsfeed-wrap {
        width: 100vw;
        padding: 0;
        max-width: 100vw;
        overflow-x: auto;
    }
}

/* Profile Page Tabs */
.profile-tabs {
    display: flex;
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
    border-bottom: 2px solid #eee;
    justify-content: flex-start;
  }
  
  .profile-tabs li {
    padding: 10px 25px;
    cursor: pointer;
    background: #f7f7f7;
    border: 1px solid #ddd;
    border-bottom: none;
    margin-right: 5px;
    /* border-radius: 6px 6px 0 0; */
    font-weight: 500;
    color: #333;
    transition: all 0.3s ease;
  }
  
  .profile-tabs li:hover {
    background: #eaeaea;
    color: #000;
  }
  
  .profile-tabs li.active {
    background: #b62727;
    color: #fff;
    border-color: #b62727;
    font-weight: 600;
    box-shadow: 0 -2px 6px rgba(0,0,0,0.1);
  }
  
 .page-id-51 .tab-content {
    display: none;
    /* border: 1px solid #ddd; */
    /* border-radius: 0 6px 6px 6px; */
    padding: 20px;
    background: #fff;
  }
  
  .page-id-51 .tab-content.active {
    display: block;
  }

.story-featured-image .picture {
    width: 180px !important;
    height: 180px !important;
    border-radius: 0px !important;
}