:host {
}

ui-calendar-header {
  @apply my-7;
}

// :host {
//   @apply block;
// }

// .calendar {
//   @apply my-0 mx-auto;
//   width: 95%;

//   .header {
//     @apply grid items-center;
//     grid-template-columns: 2.5fr 14fr;

//     .navigation {
//       @apply flex justify-between items-center mb-5;

//       .button {
//         @apply appearance-none border-none bg-transparent text-ucla-blue;

//         &:focus {
//           @apply outline-none;
//         }
//       }
//     }

//     .title {
//       @apply text-lg font-bold;
//     }
//   }

//   .body {
//     @apply w-full;

//     > *:not(:empty) {
//       @apply cursor-pointer;
//     }

//     .row {
//       @apply grid;
//       grid-template-columns: 2fr repeat(7, 2fr);
//       grid-template-rows: 5rem;

//       &:only-child {
//         grid-template-rows: 6rem;
//       }

//       .kw-cell {
//         @apply font-bold;
//         color: rgba(89, 100, 112, 1);
//       }

//       th {
//         @apply flex justify-center items-center;
//         color: rgba(89, 100, 112, 1);
//         border-top: 1px solid #555;
//       }

//       th:first-child {
//         @apply border-t-0;
//       }

//       th:first-child,
//       td:first-child {
//         border-right: 1px solid #555;
//       }

//       th,
//       td {
//         @apply text-center p-2;

//         &:first-child {
//           @apply text-left;
//         }
//       }

//       .day-cell.out-of-month {
//         .day,
//         .items,
//         .indicator {
//           @apply hidden;
//         }
//       }

//       .day-cell {
//         .day {
//           @apply text-lg;
//           color: rgba(0, 0, 0, 1);

//           &.is-sunday {
//             color: rgba(137, 148, 158, 1);
//           }

//           .selected {
//             @apply border rounded-full bg-active-branch text-white p-3;
//           }

//           .today {
//             @apply border rounded-full bg-cool-grey text-white p-3;
//           }
//         }

//         .items {
//           @apply flex justify-center;

//           .indicator {
//             @apply block m-1 text-white rounded-full;
//             height: 0.7rem;
//             width: 0.7rem;

//             &.info {
//               @apply flex items-center justify-center;
//               font-size: 0.6rem;
//             }
//           }
//         }
//       }
//     }
//   }
// }
