:host {
  display: inline-block;
}

.gux-calendar {
  margin-block-start: 2px;
  border-radius: 8px;
  box-shadow: var(--gse-ui-calendarMenu-boxShadow);
}
.gux-calendar .gux-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  block-size: var(--gse-ui-calendarMenu-month-single-header-height);
  padding: var(--gse-ui-calendarMenu-header-padding);
  font-style: normal;
  font-weight: var(--gse-ui-calendarMenu-month-currentText-fontWeight);
  color: var(--gse-ui-calendarMenu-header-foregroundColor);
  text-align: center;
  background-color: var(--gse-ui-calendarMenu-header-backgroundColor);
  border-radius: var(--gse-ui-calendarMenu-single-header-borderRadius);
}
.gux-calendar .gux-header .gux-header-month-and-year {
  inline-size: var(--gse-ui-calendarMenu-month-single-header-textWidth);
  font-family: var(--gse-ui-calendarMenu-month-headerText-fontFamily);
  font-size: var(--gse-ui-calendarMenu-month-headerText-fontSize);
  line-height: var(--gse-ui-calendarMenu-month-headerText-lineHeight);
  color: var(--gse-ui-calendarMenu-month-selected-foregroundColor);
}
.gux-calendar .gux-header .gux-left,
.gux-calendar .gux-header .gux-right {
  block-size: 100%;
  color: var(--gse-ui-calendarMenu-header-foregroundColor);
  cursor: pointer;
  outline: none;
  background: none;
  border: none;
}
.gux-calendar .gux-header .gux-left:focus-visible,
.gux-calendar .gux-header .gux-right:focus-visible {
  outline: var(--gse-semantic-focusOutline-md-borderWidth) solid var(--gse-semantic-border-focus);
  outline-offset: var(--gse-semantic-focusOutline-offset);
}
.gux-calendar .gux-header .gux-month-list {
  display: flex;
  justify-content: space-between;
  inline-size: 100%;
  font-family: var(--gse-ui-calendarMenu-month-headerText-fontFamily);
  font-size: var(--gse-ui-calendarMenu-month-headerText-fontSize);
  line-height: var(--gse-ui-calendarMenu-month-headerText-lineHeight);
}
.gux-calendar .gux-header .gux-month-list label {
  inline-size: 100%;
  text-align: center;
}
.gux-calendar .gux-content {
  display: flex;
  align-items: flex-start;
  block-size: var(--gse-ui-calendarMenu-height);
  padding: var(--gse-ui-calendarMenu-dateBody-padding);
  color: var(--gse-ui-calendarMenu-month-default-foregroundColor);
  background-color: var(--gse-ui-calendarMenu-backgroundColor);
  border-radius: var(--gse-ui-calendarMenu-single-body-borderRadius);
}
.gux-calendar .gux-content table {
  inline-size: var(--gse-ui-calendarMenu-day-input-width);
  text-align: start;
  -ms-user-select: none;
  user-select: none;
  table-layout: fixed;
  border-spacing: 0;
}
.gux-calendar .gux-content table:not(:last-child) {
  padding-inline-end: 24px;
}
.gux-calendar .gux-content table tr {
  block-size: var(--gse-ui-calendarMenu-day-input-height);
}
.gux-calendar .gux-content table tr:empty {
  display: none;
}
.gux-calendar .gux-content table tr th,
.gux-calendar .gux-content table tr td {
  inline-size: var(--gse-ui-calendarMenu-day-date-size);
  block-size: var(--gse-ui-calendarMenu-day-date-size);
  padding: 0;
  margin: 0;
  text-align: center;
}
.gux-calendar .gux-content table tr th {
  font-family: var(--gse-ui-calendarMenu-day-headerText-fontFamily);
  font-size: var(--gse-ui-calendarMenu-day-headerText-fontSize);
  font-weight: var(--gse-ui-calendarMenu-day-headerText-fontWeight);
  line-height: var(--gse-ui-calendarMenu-day-headerText-lineHeight);
}
.gux-calendar .gux-content table tr td {
  font-family: var(--gse-ui-calendarMenu-date-defaultText-fontFamily);
  font-size: var(--gse-ui-calendarMenu-date-defaultText-fontSize);
  font-weight: var(--gse-ui-calendarMenu-date-defaultText-fontWeight);
  line-height: var(--gse-ui-calendarMenu-date-defaultText-lineHeight);
  color: var(--gse-ui-calendarMenu-date-default-foregroundColor);
  cursor: pointer;
}
.gux-calendar .gux-content table tr td.gux-hovered {
  background-color: var(--gse-ui-calendarMenu-date-range-backgroundColor);
}
.gux-calendar .gux-content table tr td.gux-selected {
  color: var(--gse-ui-calendarMenu-date-selected-foregroundColor);
  background-color: var(--gse-ui-calendarMenu-date-selected-backgroundColor);
  border-radius: var(--gse-ui-calendarMenu-month-borderRadius);
}
.gux-calendar .gux-content table tr td.gux-selected:hover:not(.gux-calendar .gux-content table tr td.gux-selected.gux-start-date):not(.gux-calendar .gux-content table tr td.gux-selected.gux-end-date) {
  background-color: var(--gse-ui-calendarMenu-date-selected-hoverBackgroundColor);
}
.gux-calendar .gux-content table tr td.gux-start-date, .gux-calendar .gux-content table tr td.gux-end-date {
  background-color: var(--gse-ui-calendarMenu-date-range-backgroundColor);
}
.gux-calendar .gux-content table tr td.gux-start-date .gux-date, .gux-calendar .gux-content table tr td.gux-end-date .gux-date {
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: var(--gse-ui-calendarMenu-day-date-size);
  block-size: var(--gse-ui-calendarMenu-day-date-size);
  background-color: var(--gse-ui-calendarMenu-date-selected-backgroundColor);
  border-radius: var(--gse-ui-calendarMenu-month-borderRadius);
}
.gux-calendar .gux-content table tr td.gux-start-date .gux-date:hover, .gux-calendar .gux-content table tr td.gux-end-date .gux-date:hover {
  background-color: var(--gse-ui-calendarMenu-date-selected-hoverBackgroundColor);
}
.gux-calendar .gux-content table tr td.gux-start-date {
  border-radius: var(--gse-ui-calendarMenu-range-date-startDate-borderRadius);
}
.gux-calendar .gux-content table tr td.gux-end-date {
  border-radius: var(--gse-ui-calendarMenu-range-date-endDate-borderRadius);
}
.gux-calendar .gux-content table tr td:hover:not(.gux-calendar .gux-content table tr td.gux-start-date):not(.gux-calendar .gux-content table tr td.gux-end-date):not(.gux-calendar .gux-content table tr td.gux-hovered):not(.gux-calendar .gux-content table tr td.gux-selected) {
  background-color: var(--gse-ui-calendarMenu-date-hover-backgroundColor);
  border-radius: var(--gse-ui-calendarMenu-month-borderRadius);
}
.gux-calendar .gux-content table tr td.gux-disabled {
  pointer-events: none;
  opacity: var(--gse-ui-calendarMenu-disabled-opacity);
}
.gux-calendar .gux-content table tr td.gux-not-in-month {
  opacity: var(--gse-ui-calendarMenu-disabled-opacity);
}
.gux-calendar .gux-content table tr td.gux-not-in-month:hover {
  background-color: var(--gse-ui-calendarMenu-date-hover-backgroundColor);
}
.gux-calendar .gux-content table tr td.gux-not-in-month.gux-hidden {
  visibility: hidden;
}
.gux-calendar .gux-content table tr td.gux-current-date {
  font-family: var(--gse-ui-calendarMenu-date-currentText-fontFamily);
  font-size: var(--gse-ui-calendarMenu-date-currentText-fontSize);
  font-weight: var(--gse-ui-calendarMenu-date-currentText-fontWeight);
  line-height: var(--gse-ui-calendarMenu-date-currentText-lineHeight);
}
.gux-calendar .gux-content table tr td:focus-visible {
  border-radius: var(--gse-ui-calendarMenu-month-borderRadius);
  outline: var(--gse-semantic-focusOutline-md-borderWidth) solid var(--gse-semantic-border-focus);
  outline-offset: var(--gse-semantic-focusOutline-offset);
}