/*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
$fab-rotate-start: 0;
$fab-rotate-end: 45deg;
$fab-rotate-duration: 150ms;
$fab-rotate-timing-function: ease-in-out;

@keyframes fab-spin {
	from {
		transform: rotate($fab-rotate-start);
	}
	to {
		transform: rotate($fab-rotate-end);
	}
}
@keyframes fab-reverse-spin {
	from {
		transform: rotate($fab-rotate-end);
	}
	to {
		transform: rotate($fab-rotate-start);
	}
}

.expandable-fab{
	position: fixed;
	bottom: 16px;
	right: 16px;

	mat-icon {
		transform: rotate($fab-rotate-start);
		animation: fab-reverse-spin $fab-rotate-duration $fab-rotate-timing-function;

		&.open {
			animation: fab-spin $fab-rotate-duration $fab-rotate-timing-function;
			transform: rotate($fab-rotate-end);
		}
	}
}

.cdk-menu {
	display: grid;
	row-gap: 16px;
	width: 56px;
	justify-items: center;
	position: relative;
}
