@adobe/spectrum-css/dist/components/inputgroup/colorStops/light.css

The Spectrum CSS top-level backwards compatible package

.spectrum-InputGroup.is-focused:not(.is-invalid) .spectrum-InputGroup-field:not(:disabled):not(.is-invalid) {
        border-color: rgb(38, 128, 235);
      }
.spectrum-InputGroup.is-focused:not(.is-invalid) .spectrum-InputGroup-field:not(:disabled):not(.is-invalid) ~ .spectrum-FieldButton {
          border-color: rgb(38, 128, 235);
        }
.spectrum-InputGroup:hover:not(.is-invalid):not(.is-focused) .spectrum-InputGroup-field:not(:disabled):not(.is-invalid) {
        border-color: rgb(202, 202, 202);
      }
.spectrum-InputGroup:hover:not(.is-invalid):not(.is-focused) .spectrum-InputGroup-field:not(:disabled):not(.is-invalid) ~ .spectrum-FieldButton {
          border-color: rgb(202, 202, 202);
        }
.spectrum-InputGroup:hover:not(.is-invalid):not(.is-focused) .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):focus {
          border-color: rgb(38, 128, 235);
        }
.spectrum-InputGroup:hover:not(.is-invalid):not(.is-focused) .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):focus ~ .spectrum-FieldButton {
            border-color: rgb(38, 128, 235);
          }
.spectrum-InputGroup-field:focus ~ .spectrum-FieldButton {
    border-color: rgb(38, 128, 235);
  }
.spectrum-InputGroup-field:focus.is-invalid ~ .spectrum-FieldButton, .spectrum-InputGroup-field:focus:invalid ~ .spectrum-FieldButton {
      border-color: rgb(215, 55, 63);
    }
.spectrum-InputGroup-field.focus-ring ~ .spectrum-FieldButton {
    box-shadow: 0 0 0 1px rgb(38, 128, 235);
  }
.spectrum-InputGroup-field.focus-ring.is-invalid ~ .spectrum-FieldButton, .spectrum-InputGroup-field.focus-ring:invalid ~ .spectrum-FieldButton {
      box-shadow: 0 0 0 1px rgb(215, 55, 63);
    }
.spectrum-InputGroup--quiet .spectrum-FieldButton,
    .spectrum-InputGroup--quiet .spectrum-FieldButton:hover,
    .spectrum-InputGroup--quiet .spectrum-FieldButton:focus,
    .spectrum-InputGroup--quiet .spectrum-FieldButton:active,
    .spectrum-InputGroup--quiet .spectrum-FieldButton.is-selected,
    .spectrum-InputGroup--quiet .spectrum-FieldButton:invalid,
    .spectrum-InputGroup--quiet .spectrum-FieldButton.is-invalid,
    .spectrum-InputGroup--quiet .spectrum-FieldButton:disabled,
    .spectrum-InputGroup--quiet .spectrum-FieldButton:disabled:hover {
      border-color: rgb(225, 225, 225);
    }
.spectrum-InputGroup--quiet:hover:not(.is-invalid) .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):not(:focus) ~ .spectrum-FieldButton {
        border-color: rgb(202, 202, 202);
      }
.spectrum-InputGroup--quiet .spectrum-InputGroup-field.is-invalid ~ .spectrum-FieldButton, .spectrum-InputGroup--quiet .spectrum-InputGroup-field:invalid ~ .spectrum-FieldButton {
        border-color: rgb(215, 55, 63);
      }
.spectrum-InputGroup--quiet .spectrum-InputGroup-field:focus ~ .spectrum-FieldButton {
        box-shadow: 0 1px 0 rgb(38, 128, 235);
        border-color: rgb(38, 128, 235);
      }
.spectrum-InputGroup--quiet .spectrum-InputGroup-field:focus.is-invalid ~ .spectrum-FieldButton, .spectrum-InputGroup--quiet .spectrum-InputGroup-field:focus:invalid ~ .spectrum-FieldButton {
          box-shadow: 0 1px 0 rgb(215, 55, 63);
          border-color: rgb(215, 55, 63);
        }
.spectrum-Datepicker--range .spectrum-InputGroup-field.focus-ring {
      box-shadow: none !important;
    }
.spectrum-Datepicker--range .spectrum-InputGroup-field[disabled] ~ .spectrum-Datepicker--rangeDash {
        color: rgb(179, 179, 179);
      }
.spectrum-Datepicker--range .focus-ring ~ .spectrum-Datepicker-focusRing {
      box-shadow: 0 0 0 1px rgb(38, 128, 235);
    }
.spectrum-Datepicker--range .focus-ring:invalid ~ .spectrum-FieldButton, .spectrum-Datepicker--range .focus-ring.is-invalid ~ .spectrum-FieldButton {
        box-shadow: 0 0 0 1px rgb(215, 55, 63);
      }
.spectrum-Datepicker--range .focus-ring:invalid ~ .spectrum-Datepicker-focusRing, .spectrum-Datepicker--range .focus-ring.is-invalid ~ .spectrum-Datepicker-focusRing {
        box-shadow: 0 0 0 1px rgb(215, 55, 63);
      }
.spectrum-Datepicker--range.is-invalid .spectrum-InputGroup-field {
      border-color: rgb(215, 55, 63) !important;
    }
.spectrum-Datepicker--range.is-invalid .focus-ring ~ .spectrum-Datepicker-focusRing {
        box-shadow: 0 0 0 1px rgb(215, 55, 63);
      }
.spectrum-Datepicker--range.is-invalid .focus-ring ~ .spectrum-FieldButton {
        border-color: rgb(215, 55, 63);
        box-shadow: 0 0 0 1px rgb(215, 55, 63);
      }
.spectrum-Datepicker--range.is-invalid .spectrum-FieldButton {
      border-color: rgb(215, 55, 63);
    }
.spectrum-Datepicker--range.is-invalid .spectrum-FieldButton.is-invalid.focus-ring {
          border-color: rgb(215, 55, 63);
          box-shadow: 0 0 0 1px rgb(215, 55, 63);
        }
.spectrum-Datepicker--range.spectrum-InputGroup--quiet.is-focused .spectrum-Datepicker-focusRing {
        box-shadow: 0 0 0 1px rgb(38, 128, 235);
      }
.spectrum-Datepicker--range.spectrum-InputGroup--quiet.is-focused.is-invalid .spectrum-FieldButton {
          box-shadow: none;
          border-color: rgb(215, 55, 63);
        }
.spectrum-Datepicker--range.spectrum-InputGroup--quiet.is-focused.is-invalid .spectrum-FieldButton.is-invalid.focus-ring {
              box-shadow: 0 2px 0 0 rgb(215, 55, 63);
            }
.spectrum-Datepicker--range.spectrum-InputGroup--quiet.is-focused.is-invalid .spectrum-Datepicker-focusRing {
          box-shadow: 0 0 0 1px rgb(215, 55, 63);
        }