/* Home page layout pass: every section reads like "Buy again" (web brief, slides 17–18) —
   compact bold titles, small pink "View All" pills level with the title, green add buttons,
   even spacing between sections. Loaded on the home page only. */

/* ── Section rhythm ──────────────────────────────────────────────────────────────── */
.hp-me { margin-bottom: 36px; }
.category-slider,
.sl-teaser-section,
.vq-teaser-section,
#hp-recommended,
.offer-section,
.new-products,
.popular-products,
.healthjourney-section { padding-top: 28px !important; padding-bottom: 28px !important; margin-top: 0 !important; margin-bottom: 0 !important; }

/* ── Titles ───────────────────────────────────────────────────────────────────────── */
.dawamain .section-heading,
.dawamain .healthjourney-heading {
    font-family: "Figtree-Bold", sans-serif !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    color: #1f2937 !important;
    letter-spacing: 0 !important;
    margin-bottom: 14px !important;
    text-transform: none;
}
.dawamain .healthjourney-subheading { font-size: 14px !important; line-height: 1.5 !important; color: #6b7280 !important; margin-bottom: 14px !important; }
/* the title rows: title and "View All" on one line */
.offer-section .d-flex.justify-content-between,
.new-products .d-flex.justify-content-between,
.popular-products .d-flex.justify-content-between,
#hp-recommended .d-flex.justify-content-between { align-items: center !important; margin-bottom: 14px; }
.offer-section .d-flex.justify-content-between .section-heading,
.new-products .d-flex.justify-content-between .section-heading,
.popular-products .d-flex.justify-content-between .section-heading,
#hp-recommended .d-flex.justify-content-between .section-heading { margin-bottom: 0 !important; }

/* ── "View All": the small pink pill of "All orders" ─────────────────────────────── */
.dawamain .sec-viewall {
    display: inline-flex !important; align-items: center; gap: 4px;
    font-size: 12px !important; line-height: 1 !important; color: #e61b77 !important;
    border: 1px solid #f3c2d8 !important; border-radius: 20px !important; background: #fff !important;
    padding: 6px 12px !important; height: auto !important; margin: 0 !important; text-decoration: none; box-shadow: none !important;
}
.dawamain .sec-viewall svg { width: 11px; height: 11px; }
.dawamain .sec-viewall:hover { background: #e61b77 !important; color: #fff !important; border-color: #e61b77 !important; }

/* ── Chips and tabs (Popular …, My Health Center) ────────────────────────────────── */
.dawamain .pop-tab-btn,
.dawamain .healthjourney-section .tab-button {
    height: 34px !important; padding: 0 14px !important; font-size: 13px !important; line-height: 1 !important;
    border-radius: 20px !important; border: 1px solid #f3c2d8 !important; background: #fff !important; color: #1f2937 !important;
    font-family: "Figtree-Medium", sans-serif; white-space: nowrap; box-shadow: none !important;
}
.dawamain .pop-tab-btn.pop-tab-active,
.dawamain .pop-tab-btn:hover,
.dawamain .healthjourney-section .tab-button.tab-active,
.dawamain .healthjourney-section .tab-button:hover {
    background: #e61b77 !important; border-color: #e61b77 !important; color: #fff !important;
}
.dawamain .pop-tabs-nav,
.dawamain .healthjourney-section .tabs-navigation { gap: 8px !important; margin-bottom: 16px !important; }

/* ── Get Started: laid out like the "Buy again" header — title left, its buttons as small
      pills on the right (their own dark and green) ─────────────────────────────── */
.category-slider .d-flex.flex-column.flex-lg-row { flex-direction: row !important; align-items: center !important; justify-content: space-between;
    gap: 12px; margin-bottom: 14px; }
.category-slider .section-heading { margin-bottom: 0 !important; }
.category-slider .d-flex.mb-4.ps-lg-4 { margin: 0 !important; padding: 0 !important; gap: 8px; }
.category-slider .gs-action-btn {
    height: 30px !important; padding: 0 14px !important; margin: 0 !important; font-size: 12px !important; line-height: 1 !important;
    border-radius: 20px !important; display: inline-flex !important; align-items: center; gap: 6px; font-family: "Figtree-SemiBold", sans-serif; white-space: nowrap;
}
.category-slider .gs-action-btn svg { width: 13px; height: 13px; }

@media (max-width: 767.98px) {
    .hp-me { margin-bottom: 24px; }
    .category-slider,
    .sl-teaser-section,
    .vq-teaser-section,
    #hp-recommended,
    .offer-section,
    .new-products,
    .popular-products,
    .healthjourney-section { padding-top: 20px !important; padding-bottom: 20px !important; }
    .dawamain .section-heading,
    .dawamain .healthjourney-heading { font-size: 17px !important; margin-bottom: 12px !important; }
    .dawamain .pop-tab-btn,
    .dawamain .healthjourney-section .tab-button { height: 32px !important; font-size: 12px !important; padding: 0 12px !important; }
    /* phones: title on its own line, the two buttons side by side under it */
    .category-slider .d-flex.flex-column.flex-lg-row { flex-direction: column !important; align-items: stretch !important; }
    /* the brief (slide 17): both buttons full width, one under the other */
    .category-slider .d-flex.mb-4.ps-lg-4 { display: flex !important; flex-direction: column; gap: 10px; }
    .category-slider .gs-action-btn { height: 46px !important; width: 100%; justify-content: center; font-size: 15px !important; border-radius: 24px !important; }
    .category-slider .gs-action-btn svg { width: 16px; height: 16px; }
    /* the tile carousel already carries space under the tiles */
    .category-slider { padding-bottom: 0 !important; }
}

/* ── Trust strip (Authentic / Free Shipping / Easy Returns): compact, like the rest ─── */
.feature-section { padding: 24px 0 !important; }
.feature-section .feature-item { align-items: center; gap: 14px; }
.feature-section .icon { width: 52px !important; height: 52px !important; min-width: 52px; margin: 0 !important; }
.feature-section .icon { display: flex !important; align-items: center; justify-content: center; }
.feature-section .icon img, .feature-section .icon svg { width: 30px !important; height: 30px !important; object-fit: contain; }
.feature-section .text-col h4, .feature-section .text-col h5, .feature-section .text-col h3,
.feature-section .text-col strong { font-family: "Figtree-Bold", sans-serif !important; font-size: 16px !important; margin: 0 0 2px !important; color: #1f2937 !important; }
.feature-section .text-col p, .feature-section .text-col span { font-size: 13px !important; line-height: 1.45 !important; color: #6b7280 !important; margin: 0 !important; }
.feature-section .col-lg-4 { margin-bottom: 0 !important; }
@media (max-width: 991.98px) {
    .feature-section .col-lg-4 + .col-lg-4 { margin-top: 14px !important; }
}

/* Trust strip icons: drawn icons in a soft pink circle, sized to the text beside them */
.feature-section .tf-icon { width: 52px !important; height: 52px !important; min-width: 52px; border-radius: 50% !important;
    background: #fde8f1 !important; color: #e61b77; box-shadow: none !important; }
.feature-section .tf-icon svg { width: 26px !important; height: 26px !important; }
@media (max-width: 767.98px) {
    /* category tiles: the carousel box hugs the tiles (it kept ~50px of empty space under them) */
    /* mobilemenu.css fixes the strip at 130px; the tiles are 80px */
    .category-slider #category-carousel .owl-stage { height: auto !important; display: flex !important; align-items: flex-start; }
    .category-slider .owl-stage-outer { height: auto !important; }
    .category-slider .owl-carousel { margin-bottom: 0 !important; }
}
