/* ==========================================================
   OSMembership Plans (Journey Plan) — Stable “don’t break” CSS
   - Stops white backgrounds from inner layout layers
   - Preserves left accent strip (NO border-left resets)
   - Title link: #dedede -> hover #C9A24A, no underline
   - CTAs: Quest-like, second hover text #dedede
   ========================================================== */

/* 1) STOP the white box: force transparency on the real containers
      AND the inner layers that were painting white */
.osm-item-heading-box,
.osm-item-description{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

.osm-item-heading-box,
.osm-item-description{
 padding: 22px 18px !important;
 border: 1px solid rgba(255,255,255,0.16) !important;
border-radius: 20px !important;
 background: linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.03)) !important;
 box-shadow: var(--shadow) !important;
 background: radial-gradient(circle at 20% 20%, rgba(170,195,255,0.18), transparent 50%),
              radial-gradient(circle at 80% 25%, rgba(208,176,255,0.14), transparent 55%),
              radial-gradient(circle at 50% 90%, rgba(255,255,255,0.06), transparent 55%) !important; 
}

/* The “it only changed half” + “tab” issues were caused by children/pseudos */
.osm-item-heading-box::before,
.osm-item-heading-box::after,
.osm-item-heading-box > *,
.osm-item-description::before,
.osm-item-description::after,
.osm-item-description > *{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Kill any leftover overlay stripes/shadows/gradients INSIDE description
   (does NOT touch border-left so your left strip stays) */
.osm-item-description *::before,
.osm-item-description *::after{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Contain any overlays so nothing “peeks” out */
.osm-item-wrapper{
  overflow: hidden !important;
}

/* 2) TITLE (reverse colors) + remove underline (real or fake underline) */
.com-osmembership.view-plans .osm-item-title,
.com-osmembership.view-plans .osm-item-heading-box .osm-item-title{
  color: #C9A24A !important;
}

.com-osmembership.view-plans .osm-item-title a,
.com-osmembership.view-plans .osm-item-heading-box a{
  color: #dedede !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

.com-osmembership.view-plans .osm-item-title a:hover,
.com-osmembership.view-plans .osm-item-heading-box a:hover{
  color: #dedede !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* 3) CTA list -> button row (ONLY inside plan wrapper) */
.com-osmembership.view-plans .osm-item-wrapper ul{
  list-style: none !important;
  padding-left: 0 !important;
  margin: 10px 0 22px !important;
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
.com-osmembership.view-plans .osm-item-wrapper ul li{
  margin: 0 !important;
  padding: 0 !important;
}

/* Base “Quest-like” button feel */
.com-osmembership.view-plans .osm-item-wrapper ul li a{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 16px !important;
  border-radius: 12px !important;

  font-family: "Work Sans","Nunito",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: .2px !important;
  font-size: 14px !important;
  line-height: 1 !important;

  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;

  transition: transform .14s ease, background .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease !important;
}

/* Primary CTA (first link) — translucent filled (NOT white) */
.com-osmembership.view-plans .osm-item-wrapper ul li:first-child a{
  background: rgba(242,230,200,.14) !important;
  border: 1px solid rgba(242,230,200,.28) !important;
  color: #f2e6c8 !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.28) !important;
}
.com-osmembership.view-plans .osm-item-wrapper ul li:first-child a:hover{
  transform: translateY(-1px) !important;
  background: rgba(242,230,200,.18) !important;
  border-color: rgba(242,230,200,.40) !important;
  color: #f2e6c8 !important;
}

/* Secondary CTA (second link) — ghost + hover text #dedede */
.com-osmembership.view-plans .osm-item-wrapper ul li:nth-child(2) a{
  background: transparent !important;
  border: 1px solid rgba(242,230,200,.26) !important;
  color: #f2e6c8 !important;
}
.com-osmembership.view-plans .osm-item-wrapper ul li:nth-child(2) a:hover{
  transform: translateY(-1px) !important;
  background: rgba(242,230,200,.10) !important;
  border-color: rgba(242,230,200,.38) !important;
  color: #dedede !important;
}

.osm-item-title a {color: #C9A24A !important; text-decoration: none;}
.osm-item-title a:hover {color: #dedede !important; text-decoration: none;}

.tm-main {background-color: transparent !important;}

/* ==========================================================
   Radio buttons + mobile form fixes
   ========================================================== */

/* Selected radio: gold dot + gold ring */
input[type="radio"]{
  accent-color: #C9A24A !important;
}

/* Fallback styling for themes/extensions that override accent-color */
input[type="radio"]:checked{
  border-color: #C9A24A !important;
  background-color: #C9A24A !important;
}

/* Mobile: remove white form background and make labels white */
@media (max-width: 767px){
  .com-osmembership form,
  .com-osmembership .form,
  .com-osmembership .osm-form,
  .com-osmembership .os_form,
  .com-osmembership fieldset,
  .com-osmembership .control-group,
  .com-osmembership .form-group,
  .com-osmembership .controls,
  .com-osmembership .control-label{
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
  }

  .com-osmembership label,
  .com-osmembership .control-label,
  .com-osmembership .form-label,
  .com-osmembership .radio,
  .com-osmembership .checkbox{
    color: #dedede !important;
  }
}
/* ==========================================================
   OSMembership form — mobile glass background + stronger radios
   ========================================================== */

/* Radio buttons: bigger, white ring, gold selected dot */
.com-osmembership input[type="radio"]{
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 1.3rem !important;
  height: 1.3rem !important;
  border: 2px solid rgba(255,255,255,0.92) !important;
  border-radius: 50% !important;
  background: transparent !important;
  display: inline-grid !important;
  place-content: center !important;
  vertical-align: middle !important;
  cursor: pointer !important;
  margin-right: .5rem !important;
  box-shadow: none !important;
}

.com-osmembership input[type="radio"]::before{
  content: "" !important;
  width: .72rem !important;
  height: .72rem !important;
  border-radius: 50% !important;
  transform: scale(0) !important;
  transition: transform .14s ease !important;
  background: #C9A24A !important;
}

.com-osmembership input[type="radio"]:checked{
  border-color: #C9A24A !important;
}

.com-osmembership input[type="radio"]:checked::before{
  transform: scale(1) !important;
}

/* Keep labels readable */
.com-osmembership label,
.com-osmembership .control-label,
.com-osmembership .form-label,
.com-osmembership .radio,
.com-osmembership .checkbox{
  color: #dedede !important;
}

/* Mobile form: kill the white box and restyle it like the desktop glass cards */
@media (max-width: 767px){

  .com-osmembership form,
  .com-osmembership .form,
  .com-osmembership .osm-form,
  .com-osmembership .os_form,
  .com-osmembership #osm_form,
  .com-osmembership .membership-form,
  .com-osmembership .cb-form,
  .com-osmembership fieldset,
  .com-osmembership .form-group,
  .com-osmembership .control-group,
  .com-osmembership .controls,
  .com-osmembership .control-label,
  .com-osmembership .radio,
  .com-osmembership .checkbox,
  .com-osmembership .payment-information,
  .com-osmembership .billing-information,
  .com-osmembership .osm-container,
  .com-osmembership .osm-wrapper{
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  /* Rebuild the visible form container */
  .com-osmembership #osm_form,
  .com-osmembership form#osm_form,
  .com-osmembership .osm-form,
  .com-osmembership .membership-form{
    padding: 22px 18px !important;
    border: 1px solid rgba(255,255,255,0.16) !important;
    border-radius: 20px !important;
    background:
      radial-gradient(circle at 20% 20%, rgba(170,195,255,0.18), transparent 50%),
      radial-gradient(circle at 80% 25%, rgba(208,176,255,0.14), transparent 55%),
      radial-gradient(circle at 50% 90%, rgba(255,255,255,0.06), transparent 55%),
      linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.03)) !important;
    overflow: hidden !important;
  }

  /* Inputs can still carry white from Bootstrap/browser styles */
  .com-osmembership input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]),
  .com-osmembership select,
  .com-osmembership textarea{
    background: rgba(255,255,255,0.08) !important;
    background-color: rgba(255,255,255,0.08) !important;
    color: #dedede !important;
    border: 1px solid rgba(255,255,255,0.20) !important;
  }

  .com-osmembership input::placeholder,
  .com-osmembership textarea::placeholder{
    color: rgba(222,222,222,0.72) !important;
  }
}