.q-month-table {
  width: 100%;
  padding: 10px 0 20px;
  table-layout: fixed;
  font-size: 12px;

  &__cell-wrapper {
    text-align: center;
    cursor: pointer;

    .cell {
      position: relative;
      display: block;
      width: 40px;
      height: 40px;
      font-weight: var(--font-weight-base);
      color: var(--color-primary-blue);
      border: none;
      border-radius: var(--border-radius-base);
      box-shadow: var(--box-shadow-secondary);

      &:hover:not([disabled]):not(.cell_in-range):not(.cell_current) {
        color: var(--color-primary-black);
        background-color: var(--color-tertiary-gray);
      }

      &[data-focus-visible-added] {
        &:not(.cell_disabled) {
          color: var(--color-tertiary-white);
          background-color: var(--color-primary-blue);
          box-shadow: var(--box-shadow-pressed);
          transform: scale(1.1);
          transition: transform 0.2s;
        }
      }

      &_today {
        color: var(--color-primary);

        &.cell_current {
          color: var(--color-tertiary-white);
        }

        &::before {
          content: '';
          position: absolute;
          top: -5px;
          left: 19px;
          display: block;
          width: 2px;
          height: 2px;
          background-color: var(--color-primary);
          border-radius: 50%;
        }
      }

      &[disabled] {
        color: var(--color-tertiary-gray-ultra-dark);
        background-color: var(--color-tertiary-gray-lighter);
        cursor: not-allowed;

        &:hover {
          color: var(--color-tertiary-gray-ultra-dark);
        }
      }

      &_in-range {
        color: #fff;
        background-color: var(--color-primary-blue);
        box-shadow: var(--box-shadow-pressed);
      }

      &_current:not(.disabled) {
        color: #fff;
        background-color: var(--color-primary-blue);
        box-shadow: var(--box-shadow-pressed);
      }
    }
  }
}
