/* $hinge-default-error-color: #CB0029;
$hinge-default-error-background: #FFFFFF;
$hinge-default-focus-color: $aig-blue; */
.dbp-datepicker input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cpath d='M21 6V4h2v2h5v22H4V6h5V4h2v2h4V4h2v2h4zm0 2h-4v2h-2V8h-4v2H9V8H6v4h20V8h-3v2h-2V8zm5 6H6v12h20V14z' fill='%234F00CA' fill-rule='nonzero'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: calc(100% - 15px) center;
  padding-right: 50px;
}
.dbp-datepicker .optional {
  font-style: italic;
  font-weight: 500;
  margin-left: 4px;
}

.datepicker {
  border-color: #B9C6D4;
  border-radius: 6px;
}
.datepicker .table-condensed > thead > tr > th,
.datepicker .table-condensed > tbody > tr > th,
.datepicker .table-condensed > tfoot > tr > th,
.datepicker .table-condensed > thead > tr > td,
.datepicker .table-condensed > tbody > tr > td,
.datepicker .table-condensed > tfoot > tr > td {
  padding: 0 5px;
}
.datepicker table tr td {
  vertical-align: middle;
  border-radius: 50%;
}
.datepicker table tr td:hover, .datepicker table tr td:focus {
  background-color: #4F00CA;
  color: #fff;
}
.datepicker table tr th {
  vertical-align: middle;
  border-radius: 50%;
  font-size: 1rem;
  color: #343741;
  font-weight: normal;
}
.datepicker table tr th.prev, .datepicker table tr th.next {
  font: 0/0 a;
  text-shadow: none;
  color: transparent;
  background: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' data-name='Layer 1' viewBox='0 0 48 48'%3e%3cpath fill='%234F00CA' d='M30.59 8L32 9.41 18.83 24 32 38.59 30.59 40 16 24 30.59 8z'/%3e%3c/svg%3e") no-repeat center center;
  background-size: 50%;
}
.datepicker table tr th.prev:hover, .datepicker table tr th.prev:focus, .datepicker table tr th.next:hover, .datepicker table tr th.next:focus {
  background: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' data-name='Layer 1' viewBox='0 0 48 48'%3e%3cpath fill='%234F00CA' d='M30.59 8L32 9.41 18.83 24 32 38.59 30.59 40 16 24 30.59 8z'/%3e%3c/svg%3e") no-repeat center center;
  background-size: 50%;
}
.datepicker table tr th.next {
  -webkit-transform: rotate(-180deg);
      -ms-transform: rotate(-180deg);
          transform: rotate(-180deg);
}
.datepicker table tr th.datepicker-switch {
  color: #4F00CA;
  font-size: 1.125rem;
  border-radius: 100px;
  -webkit-box-shadow: inset 0 0 0 1px #4F00CA;
          box-shadow: inset 0 0 0 1px #4F00CA;
}
.datepicker table tr th.datepicker-switch:hover, .datepicker table tr th.datepicker-switch:focus {
  background-color: #4F00CA;
  color: #fff;
}
.datepicker table tr th.clear {
  border-radius: 4px;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  color: #4F00CA;
}
.datepicker table tr th.clear:before {
  content: "";
  display: block;
  margin-bottom: 0.5rem;
  height: 1px;
  width: 100%;
}
.datepicker table tr th.clear:hover, .datepicker table tr th.clear:focus {
  background-color: transparent;
  text-decoration: underline;
}
.datepicker table tr td {
  color: #001871;
}
.datepicker table tr td.day:hover, .datepicker table tr td.day:focus {
  background-color: #4F00CA;
  color: #fff;
}
.datepicker table tr td.active {
  border: none;
  background-color: #4F00CA;
  color: #fff;
  text-shadow: none;
}
.datepicker table tr td.active.active {
  background-color: #4F00CA;
  color: #fff;
}
.datepicker table tr td:hover.active:hover, .datepicker table tr td:hover.active:focus, .datepicker table tr td:focus.active:hover, .datepicker table tr td:focus.active:focus {
  background-color: #4F00CA;
  color: #fff;
}
.datepicker table tr td:hover.active.active:hover, .datepicker table tr td:hover.active.active:focus, .datepicker table tr td:focus.active.active:hover, .datepicker table tr td:focus.active.active:focus {
  background-color: #4F00CA;
  color: #fff;
}
.datepicker table tr td.range-start, .datepicker table tr td.range, .datepicker table tr td.range-end, .datepicker table tr td.range:active, .datepicker table tr td.range:active:hover {
  background-color: #4F00CA;
  color: #fff;
}
.datepicker table tr td.range-start {
  border-radius: 50% 0 0 50%;
}
.datepicker table tr td.range-start.range-end {
  border-radius: 50%;
}
.datepicker table tr td.range {
  border-radius: 0;
  color: #fff;
  background-color: #D03FF7;
}
.datepicker table tr td.range-end {
  border-radius: 0 50% 50% 0;
}
.datepicker table tr td.disabled {
  color: #B9C6D4;
  background-color: #EEEEEE;
}
.datepicker table tr td.disabled.old {
  background-color: transparent;
}
.datepicker table tr td.disabled:hover, .datepicker table tr td.disabled:focus, .datepicker table tr td.disabled.today, .datepicker table tr td.disabled.today:hover, .datepicker table tr td.disabled.today:focus {
  background-color: #EEEEEE;
  color: #B9C6D4;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.datepicker table tr td.today {
  background-color: #D03FF7;
  border-radius: 50%;
  color: #001871;
}
.datepicker table tr td.today:focus, .datepicker table tr td.today:hover, .datepicker table tr td.today:focus, .datepicker table tr td.today:active, .datepicker table tr td.today:active:hover {
  background-color: #4F00CA;
  color: #fff;
}
.datepicker table tr td.old, .datepicker table tr td.new {
  color: #aaa;
}
.datepicker table tr td[colspan] {
  border-radius: 4px;
}
.datepicker table tr td[colspan="7"] span:hover, .datepicker table tr td[colspan="7"] span:focus, .datepicker table tr td[colspan="7"] span.focused:hover, .datepicker table tr td[colspan="7"] span.active:hover.active:hover, .datepicker table tr td.old span:hover, .datepicker table tr td.old span:focus, .datepicker table tr td.old span.focused:hover, .datepicker table tr td.old span.active:hover.active:hover {
  background-color: #4F00CA;
  color: #fff;
}
.datepicker table tr td[colspan="7"] span.focused, .datepicker table tr td.old span.focused {
  background-color: #C0E7F7;
  color: #001871;
}
.datepicker-dropdown {
  padding: 1rem;
  margin: 20px 0;
}
.datepicker-dropdown.datepicker-orient-top:after, .datepicker-dropdown.datepicker-orient-top:before {
  content: "";
  width: 18px;
  height: 20px;
  position: absolute;
}
.datepicker-dropdown.datepicker-orient-top:before {
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  bottom: -20px;
  border-top: 12px solid #B9C6D4;
}
.datepicker-dropdown.datepicker-orient-top:after {
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  bottom: -20px;
  border-top: 11px solid #fff;
}
.datepicker-dropdown.datepicker-orient-bottom:after, .datepicker-dropdown.datepicker-orient-bottom:before {
  content: "";
  width: 18px;
  height: 20px;
  position: absolute;
}
.datepicker-dropdown.datepicker-orient-bottom:before {
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  top: -20px;
  border-bottom: 12px solid #B9C6D4;
}
.datepicker-dropdown.datepicker-orient-bottom:after {
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  top: -20px;
  border-bottom: 11px solid #fff;
}

.datepicker-switch {
  color: #4F00CA;
  font-size: 1.25rem;
}

.input-daterange .input-flex input {
  text-align: left;
}
.input-daterange .input-flex .dbp-textbox {
  margin-bottom: 0.5rem;
}
@media (min-width: 600px) {
  .input-daterange .input-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
  }
  .input-daterange .input-flex .dbp-textbox {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    margin-bottom: 0;
    width: 50%;
  }
}