/* =====================================================================
   Cover Type: one button divided in three.

   Individual / Family, Children Only and Group / SME are one control rather
   than three chips standing apart: the outer corners are rounded, the two
   seams between them are hairlines, and the whole control wears one outline.
   The thirds that are not chosen take the pale gold the engine's other
   unchosen selectors wear, and the chosen third keeps the deep green it has
   always worn, so the control reads as a single button with one third pressed.

   The doubled #quote-form is what carries these past the phone rules, which
   set the chips' own gap and radius.
   ===================================================================== */
#quote-form#quote-form .cover-type-toggle {
  gap: 0 !important;
  padding: 0 !important;
  border: 1.5px solid #016f6d !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #fdf8e6 !important;
  /* One third each, whatever the words inside them measure: the three cover
     types are the same size on the control as they are in the engine. */
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

#quote-form#quote-form .cover-type-toggle label {
  border: 0 !important;
  border-left: 1.5px solid #016f6d !important;
  border-radius: 0 !important;
  background: #fdf8e6 !important;
  color: #6b5a1f !important;
  box-shadow: none !important;
  transform: none !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* The first third opens the control, so it has no seam on its left. */
#quote-form#quote-form .cover-type-toggle label:first-of-type {
  border-left: 0 !important;
}

#quote-form#quote-form .cover-type-toggle label:hover {
  background: #fbf1cf !important;
  transform: none !important;
}

/* The chosen third keeps the house green, and the two beside it stay pale. */
#quote-form#quote-form .cover-type-toggle label:has(input:checked) {
  background: linear-gradient(90deg, #0b393b 0%, #14585c 58%, #1a6c70 100%) !important;
  color: #fff !important;
  box-shadow: none !important;
}

#quote-form#quote-form .cover-type-toggle label:has(input:checked),
#quote-form#quote-form .cover-type-toggle label:has(input:checked) span,
#quote-form#quote-form .cover-type-toggle label:has(input:checked) i {
  color: #fff !important;
}