/**
 * #.# Styles
 *
 * CSS for both Frontend+Backend.
 */

$desktop : 769px;
$tablet : 768px;
$mobile : 736px;

body:not(.wp-admin) {

	.blockopts-show {
		display: none;
	}

	@media screen and (min-width: $desktop) {

		.blockopts-hide.blockopts-desktop,
		.editorskit-no-desktop {
			display: none;
		}

		.blockopts-show.blockopts-desktop {
			display: block;
		}
	}

	@media screen and (max-width: $tablet)
		and (min-width: $mobile + 1) {

		.blockopts-hide.blockopts-tablet,
		.editorskit-no-tablet {
			display: none;
		}

		.blockopts-show.blockopts-tablet {
			display: block;
		}

		.has-tablet-text-align-center {
			text-align: center;

			&.wp-block-buttons {
				justify-content: center;
			}
		}

		.has-tablet-text-align-right {
			text-align: right;

			&.wp-block-buttons {
				justify-content: right;
			}
		}

		.has-tablet-text-align-left {
			text-align: left;

			&.wp-block-buttons {
				justify-content: left;
			}
		}

		.has-tablet-text-align-justify {
			text-align: justify;
		}
	}

	@media screen and (max-width: $mobile) {

		.blockopts-hide.blockopts-mobile,
		.editorskit-no-mobile {
			display: none;
		}

		.blockopts-show.blockopts-mobile {
			display: block;
		}

		.has-mobile-text-align-center {
			text-align: center;

			&.wp-block-buttons {
				justify-content: center;
			}
		}

		.has-mobile-text-align-right {
			text-align: right;

			&.wp-block-buttons {
				justify-content: right;
			}
		}

		.has-mobile-text-align-left {
			text-align: left;

			&.wp-block-buttons {
				justify-content: left;
			}
		}

		.has-mobile-text-align-justify {
			text-align: justify;
		}
	}
}

//Utility styles
.mt-0 {
	margin-top: 0 !important;
}

.mb-0 {
	margin-bottom: 0 !important;
}

.pt-0 {
	padding-top: 0 !important;
}

.pb-0 {
	padding-bottom: 0 !important;
}
