:root
{
   --am-timetables-bg: transparent;
   --am-timetables-padding: 0;
   --am-timetables-margin: 0 0 1rem 0;
   --am-timetables-border-radius: 0;
   --am-timetables-box-shadow: none;
   --am-timetables-gutter: 1rem;

   --am-selectable-item-gap: 0.5rem;
   --am-selectable-item-padding-y: 0.75rem;
   --am-selectable-item-padding-x: 0.75rem;
   --am-selectable-item-font-family: inherit;
   --am-selectable-item-font-size: 0.85rem;
   --am-selectable-item-line-height: 1;
   --am-selectable-item-text-color: currentColor;
   --am-selectable-item-border-width: 1px;
   --am-selectable-item-border-color: #EBE9E9;
   --am-selectable-item-bg: #FFFFFF;
   --am-selectable-item-border-radius: 4px;

   --am-selectable-item-hover-text-color: #222;
   --am-selectable-item-hover-bg: #EBE9E9;
   --am-selectable-item-hover-border-color: #DADADA;

   --am-selectable-item-active-text-color: white;
   --am-selectable-item-active-bg: #007bff;
   --am-selectable-item-active-border-color: #007bff;

   --am-selectable-item-disabled-text-color: #999;
   --am-selectable-item-disabled-bg: #FAFAFA;
   --am-selectable-item-disabled-border-width: 1px;
   --am-selectable-item-disabled-border-color: #F0F0F0;

   --am-timeslots-bg: #FAF9F9;
   --am-timeslots-padding-y: 15px;
   --am-timeslots-padding-x: 15px;
   --am-timeslots-border-width: 1px;
   --am-timeslots-border-style: solid;
   --am-timeslots-border-color: rgba(0, 0, 0, .1);
   --am-timeslots-border-radius: 5px;
   --am-timeslots-box-shadow: inset 0 2px 4px rgb(0 0 0 / 6%);
   --am-timeslots-column-gutter: 30px;

   --am-timeslots-notice-color: #808080;

   --am-timeslots-slots-label-font-family: inherit;
   --am-timeslots-slots-label-font-size: 1.125rem;
   --am-timeslots-slots-label-font-weight: bold;
   --am-timeslots-slots-label-font-style: inherit;
   --am-timeslots-slots-label-color: currentColor;
   --am-timeslots-slots-label-margin-bottom: 15px;

   --am-timeslots-slots-max-width: 636px;
}


.am-timetables
{
   padding: var(--am-timetables-padding);
   margin: var(--am-timetables-margin);
   background-color: var(--am-timetables-bg);
   border-radius: var(--am-timetables-border-radius);
   box-shadow: var(--am-timetables-box-shadow);
}

.am-timetables .am-timetable-items
{
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   gap: var(--am-timetables-gutter);
}

.am-timetables .am-timetable-items .am-timetable-item
{
   display: block;
}

.am-timetables .am-timetable-items .am-timetable-item
{
   font-family: var(--am-timetables-timetable-font-family, var(--am-selectable-item-font-family));
   font-size: var(--am-timetables-timetable-font-size, var(--am-selectable-item-font-size));
   line-height:var(--am-timetables-timetable-line-height, var(--am-selectable-item-line-height));
   color: var(--am-timetables-timetable-text-color, var(--am-selectable-item-text-color));
   border: var(--am-timetables-timetable-border-width, var(--am-selectable-item-border-width)) solid var(--am-timetables-timetable-border-color, var(--am-selectable-item-border-color));
   background-color: var(--am-timetables-timetable-bg, var(--am-selectable-item-bg));
   border-radius: var(--am-timetables-timetable-border-radius, var(--am-selectable-item-border-radius));
   user-select: none;
   transition: color 250ms ease-in-out, background-color 250ms ease-in-out, border-color 250ms ease-in-out;
}

.am-timetables .am-timetable-items .am-timetable-item label
{
   display: inline-flex;
   gap: var(--am-timetables-timetable-gap, var(--am-selectable-item-gap));
   width: 100%;
   align-items: center;
   padding: var(--am-timetables-timetable-padding-y, var(--am-selectable-item-padding-y)) var(--am-timetables-timetable-padding-x, var(--am-selectable-item-padding-x));
   margin-bottom: 0;
   cursor: pointer;
}

.am-timetables .am-timetable-items .am-timetable-item:hover
{
   color: var(--am-timetables-timetable-hover-text-color, var(--am-selectable-item-hover-text-color));
   background-color: var(--am-timetables-timetable-hover-bg, var(--am-selectable-item-hover-bg));
   border-color: var(--am-timetables-timetable-hover-border-color, var(--am-selectable-item-hover-border-color));
}

.am-timetables .am-timetable-items .am-timetable-item:has(input[type="radio"]:checked)
{
   color: var(--am-timetables-timetable-active-text-color, var(--am-selectable-item-active-text-color));
   background-color: var(--am-timetables-timetable-active-bg, var(--am-selectable-item-active-bg));
   border-color: var(--am-timetables-timetable-active-border-color, var(--am-selectable-item-active-border-color));
}

.am-timetables .am-timetable-items .am-timetable-item.disabled
{
   pointer-events: none;
   color: var(--am-timetables-timetable-disabled-text-color, var(--am-selectable-item-disabled-text-color));
   background-color: var(--am-timetables-timetable-disabled-bg, var(--am-selectable-item-disabled-bg));
   border-color: var(--am-timetables-timetable-disabled-border-color, var(--am-selectable-item-disabled-border-color));
}

.am-timetables .am-timetable-items .am-timetable-item.disabled input[type="radio"]
{
   opacity: 0.25;
}

.am-timetables label > input[type="radio"],
.am-timeslots label > input[type="radio"]
{
   position: inherit;
   opacity: 1;
   z-index: auto;
   width: 1.15em;
   height: 1.15em;
   cursor: pointer;
}

.am-timeslots
{
   display: block;
   width: 100%;
   padding: var(--am-timeslots-padding-y) var(--am-timeslots-padding-x);
   border: var(--am-timeslots-border-width) var(--am-timeslots-border-style) var(--am-timeslots-border-color);
   background-color: var(--am-timeslots-bg);
   border-radius: var(--am-timeslots-border-radius);
   -moz-border-radius: var(--am-timeslots-border-radius);
   -webkit-border-radius: var(--am-timeslots-border-radius);
   box-shadow: var(--am-timeslots-box-shadow);
   -moz-box-shadow: var(--am-timeslots-box-shadow);
   -webkit-box-shadow: var(--am-timeslots-box-shadow);
}

.am-timeslots .am-timeslots-row
{
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   gap: var(--am-timeslots-column-gutter);
}

.am-timeslots .am-timeslots-date-container
{
   flex: 1 1 250px;
   max-width: 550px;
}

.am-timeslots .am-timeslots-slots-container
{
   flex: 1 1 280px;
}

.am-timeslots .am-notice
{
   color: var(--am-timeslots-notice-color);
   font-style: italic;
}

.am-timeslots .am-datepicker .datepicker-picker
{
   width: 100%;
}

.am-timeslots .am-datepicker .datepicker-picker .datepicker-grid
{
   width: 100%;
}

.am-timeslots .am-datepicker .datepicker-header .datepicker-controls .button
{
   padding-top: 1.5rem;
   padding-bottom: 1.5rem;
}

.am-timeslots .am-datepicker .datepicker-main .days .days-of-week > span
{
   text-transform: uppercase;
}

.am-timeslots .am-datepicker .datepicker-main .days .datepicker-grid > span
{
   flex-grow: 0;
   flex-shrink: 0;
}

.am-timeslots .timeslots-label
{
   font-family: var(--am-timeslots-slots-label-font-family);
   font-size: var(--am-timeslots-slots-label-font-size);
   font-weight: var(--am-timeslots-slots-label-font-weight);
   font-style: var(--am-timeslots-slots-label-font-style);
   color: var(--am-timeslots-slots-label-color);
   margin-bottom: var(--am-timeslots-slots-label-margin-bottom);
}

.am-timeslots .am-timeslots-slots
{
   display: flex;
   flex-wrap: wrap;
   gap: var(--am-timeslots-gutter, var(--am-timetables-gutter));
   max-width: var(--am-timeslots-slots-max-width, none);
}

.am-timeslots .am-timeslots-slots > span
{
   display: block;
}

.am-timeslots .am-timeslots-slots .slot
{
   display: inline-flex;
   width: 100%;
   align-items: center;
   gap: var(--am-timeslots-slot-gap, var(--am-selectable-item-gap));
   padding: var(--am-timeslots-slot-padding-y, var(--am-selectable-item-padding-y)) var(--am-timeslots-slot-padding-x, var(--am-selectable-item-padding-x));
   margin-bottom: 0;
   font-family: var(--am-timeslots-slot-font-family, var(--am-selectable-item-font-family));
   font-size: var(--am-timeslots-slot-font-size, var(--am-selectable-item-font-size));
   line-height: var(--am-timeslots-slot-line-height, var(--am-selectable-item-line-height));
   color: var(--am-timeslots-slot-text-color, var(--am-selectable-item-text-color));
   border: var(--am-timeslots-slot-border-width, var(--am-selectable-item-border-width)) solid var(--am-timeslots-slot-border-color, var(--am-selectable-item-border-color));
   background-color: var(--am-timeslots-slot-bg, var(--am-selectable-item-bg));
   border-radius: var(--am-timeslots-slot-border-radius, var(--am-selectable-item-border-radius));
   cursor: pointer;
   user-select: none;
   transition: color 250ms ease-in-out, background-color 250ms ease-in-out, border-color 250ms ease-in-out;
}

.am-timeslots .am-timeslots-slots .slot:hover
{
   color: var(--am-timeslots-slot-hover-text-color, var(--am-selectable-item-hover-text-color));
   background-color: var(--am-timeslots-slot-hover-bg, var(--am-selectable-item-hover-bg));
   border-color: var(--am-timeslots-slot-hover-border-color, var(--am-selectable-item-hover-border-color));
}

.am-timeslots .am-timeslots-slots .slot.active,
.am-timeslots .am-timeslots-slots .slot:has(input[type="radio"]:checked)
{
   color: var(--am-timeslots-slot-active-text-color, var(--am-selectable-item-active-text-color));
   background-color: var(--am-timeslots-slot-active-bg, var(--am-selectable-item-active-bg));
   border-color: var(--am-timeslots-slot-active-border-color, var(--am-selectable-item-active-border-color));
}

.am-timeslots .am-timeslots-slots .slot.disabled
{
   pointer-events: none;
   color: var(--am-timeslots-slot-disabled-text-color, var(--am-selectable-item-disabled-text-color));
   background-color: var(--am-timeslots-slot-disabled-bg, var(--am-selectable-item-disabled-bg));
   border-color: var(--am-timeslots-slot-disabled-border-color, var(--am-selectable-item-disabled-border-color));
}

.am-timeslots .am-timeslots-slots .slot.disabled > input
{
   opacity: 0.25;
}

.am-timeslots .am-loader,
.am-timeslots .am-loader::after
{
   border-radius: 50%;
   width: 1em;
   height: 1em;
   flex-shrink: 0;
}

.am-timeslots .am-loader-container
{
   display: flex;
   align-items: center;
}

.am-timeslots .am-loader
{
   font-size: 1em;
   position: relative;
   text-indent: -9999em;
   border-top: 2px solid rgba(0,0,0, 0.2);
   border-right: 2px solid rgba(0,0,0, 0.2);
   border-bottom: 2px solid rgba(0,0,0, 0.2);
   border-left: 2px solid rgba(0,0,0, 0.7);
   -webkit-transform: translateZ(0);
   -ms-transform: translateZ(0);
   transform: translateZ(0);
   -webkit-animation: am-loader 1.1s infinite linear;
   animation: am-loader 1.1s infinite linear;
}

.am-timeslots .am-loader-text
{
   margin-left: 8px;
}

@-webkit-keyframes am-loader
{
   0% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
   }
   100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
   }
}

@keyframes am-loader
{
   0% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
   }
   100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
   }
}