/* Scope by ID so we beat Bootstrap */
input#cb-perplexity-toggle.form-check-input{
  background-color:#2b3357 !important;     /* OFF track */
  border-color:#3c4a8a !important;
  background-image:none !important;        /* kill BS5 switch SVG that hides color */
  box-shadow:none !important;
  opacity:1 !important;                    /* avoid washed-out look on dark bg */
}
input#cb-perplexity-toggle.form-check-input:checked{
  background-color:#6f42c1 !important;     /* ON track (your purple) */
  border-color:#6f42c1 !important;
}
input#cb-perplexity-toggle.form-check-input:focus{
  box-shadow:0 0 0 0.2rem rgba(111,66,193,.25) !important;
}

/* Label color swap */
input#cb-perplexity-toggle + label.form-check-label{
  color:#8A93A6 !important;                /* OFF label */
}
input#cb-perplexity-toggle:checked + label.form-check-label{
  color:#BDA6FF !important;                /* ON label */
}

/* SUMMARY page toggle — force colors over Bootstrap */
input#sum-perplexity-toggle.form-check-input{
  background-color:#2b3357 !important;   /* OFF track */
  border-color:#3c4a8a !important;
  background-image:none !important;      /* hide BS5 switch svg */
  box-shadow:none !important;
  opacity:1 !important;
}
input#sum-perplexity-toggle.form-check-input:checked{
  background-color:#6f42c1 !important;   /* ON track (purple) */
  border-color:#6f42c1 !important;
}
input#sum-perplexity-toggle.form-check-input:focus{
  box-shadow:0 0 0 0.2rem rgba(111,66,193,.25) !important;
}

/* Label color swap */
input#sum-perplexity-toggle + label.form-check-label{ color:#8A93A6 !important; }
input#sum-perplexity-toggle:checked + label.form-check-label{ color:#BDA6FF !important; }


/* ---
   *** NEW GENERIC SWITCH STYLE ***
   Applied to RadioItems (follow-up-source-radio) by adding
   className="custom-purple-switch"
--- */

/* Target all inputs within our custom class wrapper */
.custom-purple-switch .form-check-input {
  background-color:#2b3357 !important;     /* OFF track */
  border-color:#3c4a8a !important;
  background-image:none !important;        /* kill BS5 switch SVG that hides color */
  box-shadow:none !important;
  opacity:1 !important;
}

.custom-purple-switch .form-check-input:checked {
  background-color:#6f42c1 !important;     /* ON track (your purple) */
  border-color:#6f42c1 !important;
}

.custom-purple-switch .form-check-input:focus {
  box-shadow:0 0 0 0.2rem rgba(111,66,193,.25) !important;
}

/* Label color swap */
/* By default, all labels are OFF color */
.custom-purple-switch .form-check-label {
  color:#8A93A6 !important;                /* OFF label */
}

/* When the input is checked, its *sibling* label changes color */
.custom-purple-switch .form-check-input:checked + .form-check-label {
  color:#BDA6FF !important;                /* ON label */
}