/* WellnessShop Blocks — Text Image block styles
   Structure generated by render_text_image():
   <section class="wsb-text-image wsb-text-image--left|right">
     <div class="wsb-text-image__inner">
       <div class="wsb-text-image__media"><img src="..." alt="" /></div>
       <div class="wsb-text-image__content">
         <div class="wsb-text-image__logo"><img src="..." alt="" /></div>
         <h2 class="wsb-text-image__title">Title</h2>
         <div class="wsb-text-image__description">Description HTML</div>
         <ul class="wsb-text-image__features">
           <li class="wsb-text-image__feature">Feature</li>
         </ul>
         <div class="wsb-text-image__buttons">
           <a class="wsb-text-image__button wsb-text-image__button--primary" href="#">Primary</a>
           <a class="wsb-text-image__button wsb-text-image__button--secondary" href="#">Secondary</a>
         </div>
         <p class="wsb-text-image__disclaimer">Test</p>
       </div>
     </div>
   </section>
*/

.wsb-text-image { margin: 0; }

.wsb-text-image__inner {
  max-width: 1440px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: center;
}

.wsb-text-image__content{
    padding: 64px;
    background: #F6F6F6;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.wsb-text-image__media{
    height: 100%;
}

.wsb-text-image__media img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; }

.wsb-text-image__logo img { max-height: 24px; width: auto; display: block; margin-bottom: 24px; }

.wsb-text-image__title { margin: 0; font-size: 40px !important; line-height: 1.2 !important; font-weight: 700 !important; color: #000 !important; }

.wsb-text-image__description { margin: 8px 0 24px; color: #000 !important; font-size: 16px !important; line-height: 1.36 !important; font-weight: 400 !important; }

.wsb-text-image__features-header { font-weight: 700 !important; margin: 24px 0 0; font-size: 20px !important; line-height: 1.2 !important; color: #000 !important; }

.wsb-text-image__features { margin: 16px 0 24px; list-style: none; }
.wsb-text-image__feature { display: flex; gap: 12px; align-items: center; margin: 8px 0; font-size: 16px !important; line-height: 1.2 !important; font-weight: 700 !important; color: #000 !important; }

.wsb-text-image__buttons { display: flex; gap: 16px; flex-wrap: wrap; }
.wsb-text-image__button { display: inline-flex; text-transform: uppercase !important; color: #000 !important; align-items: center; justify-content: center; padding: 10px 24px; border-radius: 4px; text-decoration: none; font-weight: 600; border: 1.5px solid #000; }
.wsb-text-image__button--primary { background: #F9C811; border-color: #F9C811; }
.wsb-text-image__button--secondary { background: transparent; }

.wsb-text-image__disclaimer { margin-top: 12px; font-size: 16px !important; color: #000 !important; line-height: 1.2 !important; }

.wsb-text-image__disclaimer i{ display: inline-flex; align-items: center; gap: 8px;}

@media (max-width: 800px) {
  .wsb-text-image__inner { grid-template-columns: 1fr; }
    .wsb-text-image__title{ font-size: 32px !important; }
    .wsb-text-image__button{ width: 100%; display: block; text-align: center;}
    .wsb-text-image__content{padding: 24px;}
}
