/* === EW Blogging Plugin Styles === */

/* Reactions */
.ewbp-reactions {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
    margin: 1rem 0;
}

.ewbp-reactions button {
    border: 1px solid #e3e6ef;
    padding: 0.4rem 0.9rem;
    border-radius: 999px;
    cursor: pointer;
    background: #fff;
    font-size: 1.00rem;
    color: #253B7C;
    transition: all 0.2s ease;
}

.ewbp-reactions button:hover {
    background: #f3f6ff;
    border-color: #c7d2fe;
}

.ewbp-react-count {
    font-size: 1.00rem;
    color: #555;
    margin-right: 0.6rem;
}

/* Badges */
.ewbp-badge {
    display: inline-block;
    font-size: 1.00rem;
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
    margin-left: 0.4rem;
    margin-top:1rem;
    margin-bottom:1rem;
    background: #f3f6ff;
    border: 1px solid #d9e2ff;
    color: #253B7C; /* match Expo Win primary */
}

/* Blog List */
.ewbp-card {
    border: 1px solid #ddd;
    border-radius: 12px;
    padding: 10px;
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.ewbp-grid {
    display: grid;
    gap: 16px;
}

@media (min-width: 700px) {
    .ewbp-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Filters */
.ewbp-filters {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.ewbp-filters select,
.ewbp-filters button {
    padding: 0.5rem;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    font-size: 1.40rem;
    cursor: pointer;
}

.ewbp-filters button {
    background: #253B7C!important;
    color: #fff;
    border-color: #253B7C;
	border-radius:4px;
    transition: background 0.2s ease;
}

.ewbp-filters button:hover {
    background: #AF1F24;
    border-color: #AF1F24;
}

.ewbp-card-title {
    font-size: 1.60rem;
}

.ewbp-card-excerpt{
    font-size: 1.20rem;
    color: #333;
}

/* Blog Card Image */
.ewbp-card-image {
    width: 100%;
    height: 200px; /* Fixed height for uniform look */
    overflow: hidden;
    border-radius: 8px;
    margin-bottom: 12px;
}

.ewbp-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Crop to fit without distortion */
    display: block;
}


/* Pagination */
.ewbp-pagi {
    display: flex;
    gap: 8px;
    margin-top: 16px;
}

.ewbp-pagi a,
.ewbp-pagi span {
    padding: 0.4rem 0.7rem;
    border: none;
    border-radius: 8px;
    text-decoration: none;
    font-size: 1.40rem;
    background: #fff;
    color: #253B7C;
    transition: all 0.2s ease;
}



.ewbp-pagi a:hover {
    background: #253B7C;
    color: #fff;
    border-color: #253B7C;
}

/* Poll */
.ewbp-poll {
    padding-bottom:12px;
    padding-right:12px;
    padding-left:12px;
    margin: 0;
    background: #ffffff00;
}

.ewbp-poll strong {
    display: block;
    margin-bottom: 0.5rem;
    color: #253B7C;
    font-size: 1.80rem;
}

.ewbp-poll label {
    display: block;
    margin: 0.3rem 0;
    font-size: 1.40rem;
}

.ewbp-poll button {
    margin-top: 8px;
    padding: 0.4rem 0.8rem;
    background: #253B7C;
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1.40rem;
    transition: background 0.2s ease;
}

.ewbp-poll button:hover {
    background: #AF1F24;
}

/* Poll Results */
.ewbp-poll-results-bar {
    height: 8px;
    background: #f3f4f6;
    border-radius: 6px;
    overflow: hidden;
}

.ewbp-poll-results-bar-fill {
    height: 8px;
    background: #c7d2fe;
}

/* Utilities */
.ewbp-badges {
    display: flex;
    gap: 0.3rem;
    flex-wrap: wrap;
}