/*
 * SMATHI-Cloud brand override — recolor Hyper's primary from indigo (#727cf5)
 * to cyan (#39afd1, Hyper's "info" color).
 *
 * TRIAL / UNCOMMITTED: loaded after app.min.css in the layouts. To revert,
 * remove the <link> to this file in views/layouts/{layout,auth-layout}.ejs
 * (or delete this file). Hyper bakes the primary hex into a few component
 * rules instead of reading the variable, so those are restated below.
 */

:root,
[data-bs-theme="light"] {
  --ct-primary: #39afd1;
  --ct-primary-rgb: 57, 175, 209;
  --ct-link-color: #39afd1;
  --ct-link-color-rgb: 57, 175, 209;
  --ct-link-hover-color: #33a0bf;
  --ct-link-hover-color-rgb: 51, 160, 191;
}

/* Left sidebar (light menu): active item, hover, condensed flyout bg, help box */
html[data-menu-color="light"] {
  --ct-menu-item-hover-color: #39afd1;
  --ct-menu-item-active-color: #39afd1;
  --ct-menu-condensed-link-bg: #39afd1;
  --ct-help-box-bg: #39afd1;
}
/* Topbar icon hover (light topbar) */
html[data-topbar-color="light"] {
  --ct-topbar-item-hover-color: #39afd1;
}

/* Solid primary button (e.g. the sign-in submit) — hex is compiled in */
.btn-primary {
  --ct-btn-bg: #39afd1;
  --ct-btn-border-color: #39afd1;
  --ct-btn-hover-bg: #33a0bf;
  --ct-btn-hover-border-color: #33a0bf;
  --ct-btn-focus-shadow-rgb: 87, 187, 216;
  --ct-btn-active-bg: #33a0bf;
  --ct-btn-active-border-color: #33a0bf;
  --ct-btn-disabled-bg: #39afd1;
  --ct-btn-disabled-border-color: #39afd1;
}

/* Outline primary button */
.btn-outline-primary {
  --ct-btn-color: #39afd1;
  --ct-btn-border-color: #39afd1;
  --ct-btn-hover-bg: #39afd1;
  --ct-btn-hover-border-color: #39afd1;
  --ct-btn-focus-shadow-rgb: 57, 175, 209;
  --ct-btn-active-bg: #39afd1;
  --ct-btn-active-border-color: #39afd1;
}

/* Checked checkboxes / radios / switches (e.g. "Remember me") */
.form-check-input:checked {
  background-color: #39afd1;
  border-color: #39afd1;
}
.form-check-input:focus {
  border-color: #8cd2e4;
  box-shadow: 0 0 0 0.15rem rgba(57, 175, 209, 0.25);
}
.form-range::-webkit-slider-thumb { background-color: #39afd1; }
.form-range::-moz-range-thumb { background-color: #39afd1; }

/* Focus ring on text inputs */
.form-control:focus,
.form-select:focus {
  border-color: #8cd2e4;
  box-shadow: 0 0 0 0.15rem rgba(57, 175, 209, 0.25);
}

/* Selected widget/source row in the add-widget wizard + active chart period button: use brand cyan, not Bootstrap's baked primary purple. */
.aw-select-row.active { background-color: #39afd1; border-color: #39afd1; color: #fff; }
.period-btn.active { background-color: #39afd1; border-color: #39afd1; color: #fff; }