/* blocks/related-blogs/style.css - final */

/* container */
.bloom-related-blogs {
	padding: 50px 0;
	max-width: 1280px;
	width: 100%;
	margin: 0 auto;
}

/* header */
.bloom-related-blogs__header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; gap:12px; }
.bloom-related-blogs__title {
    color: #3B82F6;
    font-weight: 700;
    font-style: Bold;
    font-size: 36px;
    leading-trim: NONE;
    line-height: 48px;
    letter-spacing: 0%;
    vertical-align: middle;
}
  .bloom-card {
	padding: 27px 15px;
	background-color: #F4F9FF;
	box-shadow: 0px 0px 10px 2px #0000001A;
	border-radius: 8px !important;
}


/* arrows / controls */
.bloom-related-blogs__controls { display:flex; gap:44px; align-items:center; }
/* Base button style */
.bloom-related-blogs__arrow {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    background: #D9D9D9;   /* default grey */
    color: #5A5A5A;        /* grey arrow */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .25s ease, color .25s ease, opacity .25s ease;
}

/* ACTIVE state = ORANGE */
.bloom-related-blogs__arrow[aria-disabled="false"] {
    background: #FA4616 !important;
    color: #FFFFFF !important;
}

/* DISABLED state = GREY + low opacity */
.bloom-related-blogs__arrow[aria-disabled="true"] {
    background: #D9D9D9 !important;
    color: #A0A0A0 !important;
    opacity: 0.45;
    cursor: not-allowed;
}

/* Hover only when active */
.bloom-related-blogs__arrow[aria-disabled="false"]:hover {
    opacity: 0.85;
}

/* viewport/list */
.bloom-related-blogs__viewport{overflow:hidden;width:100%}
.bloom-related-blogs__list{display:flex;flex-wrap:nowrap;align-items:stretch;will-change:transform;transform:translateX(0);}

/* item & card */
.bloom-related-blogs__item{box-sizing:border-box;padding:0 12px;min-width:0;}
.bloom-card__excerpt {
	display: none;
}
/* image & body */
.bloom-card__image {
	height: 217px;
	background-size: cover;
	background-position: center;
	width: 100%;
}
    .bloom-card__body {
        padding: 14px;
        display: flex;
        flex-direction: column;
        padding-top: 36px;
    }
.bloom-card__title{
        font-weight: 400;
        font-style: Regular;
        font-size: 21px;
        leading-trim: NONE;
        line-height: 24px;
        letter-spacing: 0%;
        vertical-align: middle;
    }
.bloom-card__excerpt{margin:0;font-size:14px;color:#32445b;opacity:0.9;}

/* ===== GRID (<=3 posts) ===== */
.bloom-related-blogs--grid .bloom-related-blogs__grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
    align-items:start;
}
.bloom-related-blogs--grid .bloom-related-blogs__item { padding:0; }
.bloom-related-blogs--grid .bloom-card { height:100%; display:flex; flex-direction:column; }
.bloom-related-blogs--grid .bloom-card__image { height:160px; flex:0 0 auto; }
.bloom-related-blogs--grid .bloom-card__body { flex:1 1 auto; }
/* ===== Strong editor preview height fixes — paste at end of style.css ===== */


body.post-php .bloom-related-blogs, .editor-styles-wrapper .bloom-related-blogs, .block-editor__container .bloom-related-blogs {
	padding: 12px !important;
	height: 500px;
}

.bloom-related-blogs .swiper-wrapper {
	padding: 10px 0;
}
/* responsive */
@media (max-width:900px) {
    .bloom-related-blogs--grid .bloom-related-blogs__grid{grid-template-columns:1fr;}
    .bloom-related-blogs__item{padding:0 6px;}
    .bloom-card__image{height:140px;}
}

/* ===== SWIPER (slides) ===== */
.bloom-related-blogs__swiper .swiper-slide {
	box-sizing: border-box;
	padding: 0 5px;
}
.bloom-related-blogs__swiper .bloom-card{height:100%;display:block;}

/* Editor-specific fix: ensure preview shows 3-per-view until JS initializes */
.is-editor-view .bloom-related-blogs__swiper .swiper-wrapper { display:flex !important; }
.is-editor-view .bloom-related-blogs__swiper .swiper-slide { flex:0 0 calc(100%/3); max-width:calc(100%/3); box-sizing:border-box; }