/* ============================================
   TripCarib booking widget v2
   OneTravel-style: horizontal icon tiles,
   white card, bold search CTA
   ============================================ */
:root {
  --tc-primary: #0e7c86;
  --tc-primary-dark: #0a5c64;
  --tc-cta: #ff7a1a;
  --tc-cta-dark: #e5690f;
  --tc-ink: #1a2b3c;
}

/* --- White card --- */
body .tg-booking-form-item.tourex-service-form-card {
  background: #ffffff !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 32px rgba(10, 30, 50, 0.16) !important;
  padding: 20px 16px !important;
}

/* --- Tab row: horizontal, OneTravel-style tiles --- */
body .tg-booking-form-tabs.tourex-service-tabs {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-around !important;
  align-items: flex-start !important;
  gap: 10px !important;
  background: transparent !important;
  padding: 0 0 4px 0 !important;
  margin-bottom: 18px !important;
}

body .tourex-service-tab {
  flex: 1 1 0 !important;
  width: auto !important;
  max-width: 120px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  font-weight: 700 !important;
  font-size: 12.5px !important;
  line-height: 1.25 !important;
  text-align: center !important;
  color: #5a6b7b !important;
  cursor: pointer !important;
}

/* The square icon tile */
body .tourex-service-tab .tourex-tab-icon {
  width: 62px !important;
  height: 62px !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  border: 1.5px solid #e3eaf1 !important;
  box-shadow: 0 3px 10px rgba(10, 30, 50, 0.08) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all .2s ease !important;
}

body .tourex-service-tab .tourex-tab-icon img {
  width: 32px !important;
  height: 32px !important;
  object-fit: contain !important;
}

/* Active tile: filled, label colored */
body .tourex-service-tab.active {
  color: var(--tc-primary) !important;
}

body .tourex-service-tab.active .tourex-tab-icon {
  background: var(--tc-primary) !important;
  border-color: var(--tc-primary) !important;
  box-shadow: 0 6px 16px rgba(14, 124, 134, 0.38) !important;
}

body .tourex-service-tab.active .tourex-tab-icon img {
  filter: brightness(0) invert(1) !important;
}

body .tourex-service-tab:hover:not(.active) .tourex-tab-icon {
  border-color: var(--tc-primary) !important;
  transform: translateY(-2px) !important;
}

/* --- Field labels --- */
body .tg-booking-form-title {
  font-size: 12px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  color: var(--tc-ink) !important;
  margin-bottom: 6px !important;
}

/* --- Inputs --- */
body .tourex-home-field .input,
body .tourex-home-field input,
body .tourex-home-field select {
  border: 1.5px solid #dde5ec !important;
  border-radius: 12px !important;
  min-height: 52px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--tc-ink) !important;
  background: #ffffff !important;
}

body .tourex-home-field .input:focus,
body .tourex-home-field input:focus {
  border-color: var(--tc-primary) !important;
  box-shadow: 0 0 0 3px rgba(14, 124, 134, 0.15) !important;
  outline: none !important;
}

/* --- Search button --- */
body .bk-search-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 56px !important;
  background: var(--tc-cta) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 14px !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  box-shadow: 0 6px 18px rgba(255, 122, 26, 0.4) !important;
  transition: all .2s ease !important;
  cursor: pointer !important;
}

body .bk-search-button:hover,
body .bk-search-button:active {
  background: var(--tc-cta-dark) !important;
}

body .bk-search-button i,
body .bk-search-button .tourex-search-icon {
  color: #ffffff !important;
}

/* --- Mobile tuning --- */
@media (max-width: 767px) {
  body .tg-booking-form-item.tourex-service-form-card {
    padding: 16px 12px !important;
  }
  body .tourex-service-tab .tourex-tab-icon {
    width: 56px !important;
    height: 56px !important;
    border-radius: 14px !important;
  }
  body .tourex-service-tab {
    font-size: 12px !important;
  }
  body .tourex-home-field {
    margin-right: 0 !important;
    width: 100% !important;
  }
  body .bk-search-button {
    min-height: 58px !important;
  }
}

/* ============================================
   v3: OneTravel first-screen layout on mobile
   Hide hero photo, clean headline, widget first
   ============================================ */
@media (max-width: 991px) {

  /* Hide the big hero photo + banner CTA button */
  body .tg-banner-3-big-content.include-bg,
  body .tg-banner-btn,
  body .tg-banner-shape,
  body .tg-banner-transparent-bg {
    display: none !important;
  }

  /* Collapse banner area spacing */
  body .tg-banner-area.tg-banner-space {
    padding-top: 10px !important;
    padding-bottom: 0 !important;
    min-height: 0 !important;
  }

  body .tg-banner-content {
    padding: 0 16px !important;
  }

  /* Headline: clean, dark, professional */
  body .tg-banner-title {
    font-size: 24px !important;
    line-height: 1.3 !important;
    color: var(--tc-ink) !important;
    margin-bottom: 4px !important;
    text-shadow: none !important;
  }

  /* Subtitle: small supporting line */
  body .tg-banner-subtitle {
    font-size: 14px !important;
    color: #5a6b7b !important;
    margin-bottom: 10px !important;
    text-shadow: none !important;
  }

  /* Pull the booking widget up tight under the headline */
  body .tg-booking-form-wrap.tg-booking-form-space {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  body .tg-booking-form-area {
    padding-top: 0 !important;
  }
}

/* ============================================
   v4: Remove hero entirely on mobile,
   serif headline above widget (OneTravel-style)
   ============================================ */
@media (max-width: 991px) {

  /* Kill the whole banner section */
  body .tg-banner-area {
    display: none !important;
  }

  /* Headline injected above the booking widget */
  body .tg-booking-form-wrap.tg-booking-form-space::before {
    content: "Book your Saint Lucia trip";
    display: block;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 27px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--tc-ink);
    text-align: center;
    padding: 18px 20px 4px;
  }

  /* Small supporting line under it */
  body .tg-booking-form-wrap.tg-booking-form-space::after {
    content: "Airport transfers, car rentals & island excursions";
    display: block;
    font-size: 13.5px;
    font-weight: 500;
    color: #5a6b7b;
    text-align: center;
    padding: 0 20px 14px;
    order: -1;
  }

  /* Widget container: flex so ::after sits under ::before */
  body .tg-booking-form-wrap.tg-booking-form-space {
    display: flex;
    flex-direction: column;
  }
  body .tg-booking-form-wrap.tg-booking-form-space::before { order: -2; }

  /* Clean sans for all widget UI text */
  body .tourex-service-tab,
  body .tg-booking-form-title,
  body .tourex-home-field .input,
  body .tourex-home-field input,
  body .bk-search-button {
    font-family: 'Poppins', 'Segoe UI', -apple-system, sans-serif !important;
  }
}

/* v5: field overflow fix (travel date) */
@media (max-width: 991px) {
  body .tourex-home-field,
  body .tg-booking-form-parent-inner {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  body .tourex-home-field input,
  body .tourex-home-field .input,
  body .tg-booking-add-input-date input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    height: 52px !important;
  }
}

/* ============================================
   v6: Brand-blue search button (matches Login),
   Travel Date containment fix
   ============================================ */

/* Search button: brand light blue, all screens */
body .bk-search-button,
body .bk-search-button:hover,
body .bk-search-button:focus {
  background: #4BA7F0 !important;
  border-color: #4BA7F0 !important;
  color: #ffffff !important;
}
body .bk-search-button:hover {
  filter: brightness(0.93);
}

@media (max-width: 991px) {
  /* Nothing inside the card may escape its edges */
  body .tg-booking-form-item.tourex-service-form-card {
    overflow: hidden !important;
  }

  /* Travel Date: the input AND its wrapper, whatever the markup */
  body .tg-booking-add-input-date,
  body .tg-booking-add-input-date > div,
  body .tg-booking-add-input-date input,
  body .tg-booking-form-item input.flatpickr-input,
  body .tg-booking-form-item .flatpickr-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Safety net: no child of the card wider than the card */
  body .tg-booking-form-item.tourex-service-form-card * {
    max-width: 100% !important;
  }
}

/* ============================================
   v7: The mobile hero is tg-hero-2, not banner.
   Hide it below 992px, keep desktop untouched.
   ============================================ */
@media (max-width: 991px) {
  body .tg-hero-2-content,
  body .tg-hero-2-area,
  body .tg-hero-2-space,
  body .tg-hero-2-wrap,
  body section[class*="tg-hero-2"] {
    display: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: 0 !important;
  }
}

/* ============================================
   v8: Brand palette variables, yellow active tab,
   dropdowns contained on mobile
   ============================================ */
:root {
  --tc-blue: #4BA7F0;
  --tc-yellow: #FFC63B;
}

/* Active service tab: yellow tile (was teal), blue label */
body .tourex-service-tab.active .tourex-tab-icon,
body .tourex-service-tab.is-active .tourex-tab-icon,
body .tourex-service-tab.selected .tourex-tab-icon,
body .tourex-service-tab[aria-selected="true"] .tourex-tab-icon {
  background: var(--tc-yellow) !important;
  border-color: var(--tc-yellow) !important;
}
body .tourex-service-tab.active,
body .tourex-service-tab.is-active,
body .tourex-service-tab.selected,
body .tourex-service-tab[aria-selected="true"] {
  color: var(--tc-blue) !important;
}

@media (max-width: 991px) {
  /* Card must NOT clip open dropdowns (undoes v6 overflow:hidden) */
  body .tg-booking-form-item.tourex-service-form-card {
    overflow: visible !important;
  }

  /* nice-select style dropdowns: full card width, list scrolls */
  body .nice-select {
    width: 100% !important;
    max-width: 100% !important;
  }
  body .nice-select .list {
    width: 100% !important;
    min-width: 0 !important;
    left: 0 !important;
    right: 0 !important;
    max-height: 55vh;
    overflow-y: auto;
  }

  /* select2 style dropdowns, if the theme uses them anywhere */
  body .select2-container,
  body .select2-dropdown,
  body .select2-container--open .select2-dropdown {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
  }

  /* Travel Date: force the input itself, whatever wrapper it's in */
  body .tg-booking-form-item input,
  body .tg-booking-form-item .form-control {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

/* ============================================
   v9: Active tab keeps full-color icon
   (fixes blank Car Rentals tile),
   date inputs: normal height, inside the card
   ============================================ */

/* Kill the white-out filter on active tab icons */
body .tourex-service-tab.active .tourex-tab-icon img,
body .tourex-service-tab.active img,
body .tourex-service-tab[aria-selected="true"] .tourex-tab-icon img {
  filter: none !important;
  -webkit-filter: none !important;
  opacity: 1 !important;
}

@media (max-width: 991px) {
  /* Any date-related wrapper: full width, natural height */
  body .tourex-service-form-card [class*="date"],
  body .tourex-service-form-card [class*="Date"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
  }

  /* The date inputs themselves: match other fields (52px) */
  body .tourex-service-form-card input[class*="date"],
  body .tourex-service-form-card input[name*="date"],
  body .tourex-service-form-card input[id*="date"],
  body .tourex-service-form-card [class*="date"] input,
  body .tourex-service-form-card .flatpickr-input,
  body .tourex-service-form-card input[readonly] {
    width: 100% !important;
    max-width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    padding: 12px 44px 12px 16px !important;
    box-sizing: border-box !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
  }
}

/* ============================================
   v10: Date field fixed via exact markup,
   stray calendar popups hidden, compact layout
   ============================================ */
@media (max-width: 991px) {

  /* Wrapper: kill the mr-15 that pushed it past the card edge */
  body .tourex-home-field.tourex-home-field-date,
  body .tourex-home-field-date {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
  }
  body .tg-booking-add-input-date {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* The actual input: neat 52px row like every other field */
  body .tg-booking-add-input-date input.datepicker,
  body input.input.datepicker {
    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    padding: 12px 44px 12px 16px !important;
    box-sizing: border-box !important;
    border-radius: 14px !important;
    background: #f7f9fc !important;
    font-size: 15px !important;
  }

  /* Calendar icon: vertically centered inside the input */
  body .tg-booking-add-input-date > span {
    position: absolute !important;
    right: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    line-height: 0 !important;
  }

  /* Calendar popups: invisible until genuinely opened */
  body .flatpickr-calendar:not(.open),
  body .datepicker-dropdown:not(.show):not(.active),
  body .daterangepicker:not(.show-calendar) {
    display: none !important;
  }
  /* When open: fit the phone screen */
  body .flatpickr-calendar.open,
  body .datepicker-dropdown.show {
    max-width: calc(100vw - 32px) !important;
    left: 16px !important;
    right: auto !important;
  }

  /* ---- Compact mobile polish ---- */
  body .tg-booking-form-wrap.tg-booking-form-space::before {
    font-size: 23px;
    padding: 12px 20px 2px;
  }
  body .tg-booking-form-wrap.tg-booking-form-space::after {
    font-size: 13px;
    padding: 0 20px 10px;
  }
  body .tourex-tab-icon {
    width: 62px !important;
    height: 44px !important;
  }
  body .tourex-service-form-card {
    padding: 16px 16px 18px !important;
  }
  body .tourex-home-field,
  body .tg-booking-form-parent-inner {
    margin-bottom: 12px !important;
  }
  body .tg-booking-form-title {
    margin-bottom: 5px !important;
  }
}

/* ============================================
   v11: Date wrapper clamped to one field height
   (clips whatever is inside), open calendar
   floats fixed over the page, no x-wobble
   ============================================ */
@media (max-width: 991px) {

  /* Page never scrolls sideways */
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }

  /* THE CAGE: wrapper is exactly one field, like Passengers */
  body .tg-booking-add-input-date {
    height: 56px !important;
    max-height: 56px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    border: 1px solid #e3e9f0 !important;
    box-sizing: border-box !important;
  }

  /* Any input inside it: fill the cage exactly */
  body .tg-booking-add-input-date input {
    height: 54px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 44px 0 16px !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    box-sizing: border-box !important;
    font-size: 15px !important;
  }

  /* Icon centered in the cage */
  body .tg-booking-add-input-date > span {
    position: absolute !important;
    right: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    line-height: 0 !important;
    pointer-events: none !important;
  }

  /* Open calendar: escape the cage, float centered like a modal */
  body .flatpickr-calendar.open {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    max-width: calc(100vw - 32px) !important;
    z-index: 999999 !important;
    box-shadow: 0 12px 40px rgba(20, 40, 70, 0.25) !important;
    border-radius: 16px !important;
  }
}

/* ============================================
   v12: Calendar can open. Cage releases only
   while the picker is open, re-clamps after.
   ============================================ */
@media (max-width: 991px) {

  /* While a calendar is open inside the wrapper, un-clip it */
  body .tg-booking-add-input-date:has(.flatpickr-calendar.open) {
    overflow: visible !important;
  }

  /* Static-mode calendar (lives inside the wrapper):
     anchor it right below the field */
  body .flatpickr-calendar.static.open {
    display: block !important;
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: auto !important;
    transform: none !important;
    max-width: calc(100vw - 48px) !important;
    z-index: 99999 !important;
    box-shadow: 0 12px 40px rgba(20, 40, 70, 0.25) !important;
    border-radius: 16px !important;
  }

  /* Body-appended calendar (non-static): centered popup */
  body > .flatpickr-calendar.open {
    display: block !important;
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    max-width: calc(100vw - 32px) !important;
    z-index: 999999 !important;
  }
}

/* ============================================
   v13: Cage applies only to the date wrapper.
   Dropdown wrappers restored + styled to match.
   ============================================ */
@media (max-width: 991px) {

  /* Wrappers WITHOUT a datepicker: uncage completely */
  body .tg-booking-add-input-date:not(:has(input.datepicker)) {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    background: transparent !important;
    border: none !important;
  }

  /* Dropdown (nice-select) inside: look like every other field */
  body .tg-booking-add-input-date .nice-select,
  body .tourex-home-field .nice-select {
    width: 100% !important;
    height: 56px !important;
    line-height: 54px !important;
    padding: 0 44px 0 16px !important;
    border: 1px solid #e3e9f0 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    font-size: 15px !important;
    display: block !important;
  }
  body .nice-select .current {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* The options list: opens below the field, above everything */
  body .nice-select .list {
    position: absolute !important;
    top: calc(100% + 6px) !important;
    left: 0 !important;
    width: 100% !important;
    max-height: 55vh !important;
    overflow-y: auto !important;
    z-index: 99999 !important;
    background: #ffffff !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 40px rgba(20, 40, 70, 0.2) !important;
  }

  /* Native selects (if any field uses one directly) */
  body .tg-booking-add-input-date select,
  body .tourex-home-field select {
    width: 100% !important;
    height: 56px !important;
    padding: 0 16px !important;
    border: 1px solid #e3e9f0 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    font-size: 15px !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    color: #1c2b3a !important;
  }
}

/* ============================================
   v14: Final polish — balanced headline,
   WhatsApp bubble clear of the Search button
   ============================================ */
@media (max-width: 991px) {

  /* Headline: no stranded single word on line 2 */
  body .tg-booking-form-wrap.tg-booking-form-space::before {
    text-wrap: balance;
    max-width: 320px;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* WhatsApp bubble: smaller, tucked to the corner,
     below the reach of the Search button */
  body a[href*="wa.me"],
  body a[href*="whatsapp"],
  body [class*="whatsapp"] {
    width: 52px !important;
    height: 52px !important;
    right: 12px !important;
    bottom: 12px !important;
    transform: scale(0.92);
  }
}

/* ============================================
   v15: WhatsApp bubble — icon centered, uncut
   ============================================ */
@media (max-width: 991px) {

  /* Outer floating button only */
  body a[href*="wa.me"],
  body a[href*="whatsapp"] {
    width: 52px !important;
    height: 52px !important;
    right: 14px !important;
    bottom: 14px !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  /* Icon inside: natural proportions, centered */
  body a[href*="wa.me"] img,
  body a[href*="wa.me"] svg,
  body a[href*="wa.me"] i,
  body a[href*="whatsapp"] img,
  body a[href*="whatsapp"] svg,
  body a[href*="whatsapp"] i {
    width: 26px !important;
    height: 26px !important;
    max-width: 26px !important;
    margin: 0 !important;
    position: static !important;
    font-size: 26px !important;
    line-height: 1 !important;
  }
}

/* ============================================
   v16: Blog body links — brand blue, underlined,
   clearly distinct from plain bold text
   ============================================ */
body .tg-blog-details-content p a,
body .tg-blog-details-content li a,
body .blog-details-content p a,
body .blog-details-content li a,
body .blog-description p a,
body .blog-description li a,
body .post-content p a,
body .post-content li a {
  color: var(--tc-blue, #4BA7F0) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
  font-weight: 600;
  transition: color 0.15s ease;
}
body .tg-blog-details-content p a:hover,
body .blog-details-content p a:hover,
body .blog-description p a:hover,
body .post-content p a:hover {
  color: #2f8ede !important;
}

/* v17: blog links — corrected to the theme's real wrapper */
body .tg-blog-details-wrap p a,
body .tg-blog-details-wrap li a {
  color: var(--tc-blue, #4BA7F0) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
  font-weight: 600;
  transition: color 0.15s ease;
}
body .tg-blog-details-wrap p a:hover,
body .tg-blog-details-wrap li a:hover {
  color: #2f8ede !important;
}

/* v18: every link in the article column is blue+underlined... */
body .tg-blog-details-wrap a {
  color: var(--tc-blue, #4BA7F0) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
  transition: color 0.15s ease;
}
body .tg-blog-details-wrap a:hover {
  color: #2f8ede !important;
}

/* ...EXCEPT: tag pills keep their pill style */
body .tg-blog-details-wrap .tg-blog-details-tag a,
body .tg-blog-details-wrap .tg-blog-details-tag a:hover {
  text-decoration: none !important;
}

/* ...EXCEPT: social icons untouched */
body .tg-blog-details-wrap .tg-blog-details-social a,
body .tg-blog-details-wrap .tg-blog-details-social a:hover {
  color: inherit !important;
  text-decoration: none !important;
}

/* ...EXCEPT: linked headings keep theme color, hover-only change */
body .tg-blog-details-wrap h1 a, body .tg-blog-details-wrap h2 a,
body .tg-blog-details-wrap h3 a, body .tg-blog-details-wrap h4 a,
body .tg-blog-details-wrap h5 a, body .tg-blog-details-wrap h6 a {
  color: inherit !important;
  text-decoration: none !important;
}

/* v19: bold text INSIDE links must be blue too
   (theme's strong rule was beating inheritance) */
body .tg-blog-details-wrap a strong,
body .tg-blog-details-wrap a b {
  color: var(--tc-blue, #4BA7F0) !important;
}
body .tg-blog-details-wrap a:hover strong,
body .tg-blog-details-wrap a:hover b {
  color: #2f8ede !important;
}

/* headings still exempt, even with bold inside links */
body .tg-blog-details-wrap h1 a strong, body .tg-blog-details-wrap h2 a strong,
body .tg-blog-details-wrap h3 a strong, body .tg-blog-details-wrap h4 a strong,
body .tg-blog-details-wrap h5 a strong, body .tg-blog-details-wrap h6 a strong {
  color: inherit !important;
}

/* v20: blog links — blue only, no underline (per owner preference) */
body .tg-blog-details-wrap a,
body .tg-blog-details-wrap a strong,
body .tg-blog-details-wrap a b {
  text-decoration: none !important;
}
/* subtle underline appears on hover as a click affordance */
body .tg-blog-details-wrap a:hover,
body .tg-blog-details-wrap a:hover strong {
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* v21: no underline at rest — matches/exceeds v16-v18 specificity */
body .tg-blog-details-wrap a,
body .tg-blog-details-wrap p a,
body .tg-blog-details-wrap li a,
body .tg-blog-details-wrap p a strong,
body .tg-blog-details-wrap a strong,
body .tg-blog-details-wrap a b {
  text-decoration: none !important;
}
/* underline only on hover */
body .tg-blog-details-wrap a:hover,
body .tg-blog-details-wrap p a:hover,
body .tg-blog-details-wrap li a:hover,
body .tg-blog-details-wrap p a:hover strong,
body .tg-blog-details-wrap a:hover strong {
  text-decoration: underline !important;
  text-underline-offset: 3px;
}