:root {
  --outside-clr: #c0c0c0;
  --week-nr-clr: #3EAE85;
  --header-clr: #808080;
  --base-clr: #272727;
}

fx-date-picker {
  font-size: 1em;
  font-weight: normal;
  display: inline-block;
  position: relative;
  background: #fff;
}

fx-date-picker,
fx-date-picker * {
  box-sizing: border-box;
}

.goog-date-picker {
  font-size: 1em;
  outline: none;
  min-width: 250px;
  width: 250px;
  background: var(--background-color-base);
  position: relative;
}

.goog-popupdatepicker {
  position: absolute;
  min-width: auto;
  width: auto;
}

.goog-date-picker table {
   border: 1px solid #ccc;
   border-collapse: inherit;
   border-spacing: .5em;
   background: var(--background-color-base);
   width: 100%;
}

.goog-popupdatepicker table {
  border-spacing: .1em;
}

.goog-date-picker table tbody {
  text-align: right;
  cursor: pointer;
}

.goog-date-picker table tbody tr {
  cursor: pointer;
}

.goog-date-picker table td,
.goog-date-picker table th {
  font-weight: normal;
}

.goog-date-picker table thead td,
.goog-date-picker table thead th {
  width: auto;
  padding: 1em 0em;
}

.goog-date-picker table thead .goog-date-picker-monthyear {
  padding: 1em;
}

.goog-date-picker table tbody td,
.goog-date-picker table tbody th {
  width: auto;
  padding: .6em;
}

.goog-popupdatepicker table tbody td,
.goog-popupdatepicker table tbody th {
  padding: .4em;
}

.goog-date-picker table tbody tr:last-child th,
.goog-date-picker table tbody tr:last-child td {
  padding-bottom: 1em;
}

.goog-date-picker-wday {
  color: var(--header-clr);
}

.goog-date-picker-week {
  color: var(--week-nr-clr);
}

.goog-date-picker-other-month {
  color: var(--outside-clr);
}

.goog-date-picker-wkend-start,
.goog-date-picker-wkend-end {
  color: var(--header-clr);
}

.goog-date-picker table tbody .goog-date-picker-wday:last-child,
.goog-date-picker table tbody .goog-date-picker-wkend-end {
  padding-right: 1em;
}

.goog-date-picker table tbody th:first-child {
  padding-left: 1em;
}

.goog-date-picker-selected {
  background: #ddd;
}

.goog-date-picker-today {
  outline: 1px solid #c30;
}

.goog-date-picker-btn {
  border: none;
  background: #fff;
  color: #fff;
  position: relative;
}

.goog-date-picker-btn:after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  -webkit-mask-size: 1em 1em;
  mask-size: 1em 1em;
  background: var(--icon-background-color);
  width: 1em;
  height: 1em;
  opacity: 1;
  -webkit-mask: var(--triangle-mask);
  mask: var(--triangle-mask);
}

.goog-date-picker-previousMonth:after {
  transform: translateY(-50%) rotate(90deg);
}

.goog-date-picker-nextMonth:after {
  transform: translateY(-50%) rotate(-90deg);
}