@use 'sass:map';
@use 'sass:math';
@use 'vuetify/tools';
@use 'vuetify/settings';

/*
 * @source vuetify/packages/vuetify/src/styles/tools/_functions.sass
 */
@function breakpoint-min ($name, $breakpoints) {
	$min: map.get($breakpoints, $name);

	@return if(sass($min != 0): $min);
}

/*
   * @source vuetify/packages/vuetify/src/styles/tools/_display.sass
   */
@mixin media-breakpoint-up($name, $breakpoints: settings.$grid-breakpoints) {
	$min: breakpoint-min($name, $breakpoints);

	@if $min {
		@container v-resize-drawer (min-width: #{$min}) {
			@content;
		}
	}
}

/*
 * @source vuetify/packages/vuetify/src/components/VGrid/_mixins.sass
 */
@mixin make-col($size, $columns: settings.$grid-columns) {
	flex: 0 0 math.percentage(math.div($size, $columns));
	max-width: math.percentage(math.div($size, $columns));
}

@mixin make-grid-columns($columns: settings.$grid-columns, $gutter: settings.$grid-gutter, $breakpoints: settings.$grid-breakpoints) {
	@each $breakpoint in map.keys($breakpoints) {
		$infix: tools.breakpoint-infix($breakpoint, $breakpoints);

		@include media-breakpoint-up($breakpoint, $breakpoints) {
			@for $i from 1 through $columns {
				.v-col#{$infix}-#{$i} {
					@include make-col($i, $columns);
				}
			}
		}
	}
}

/*
* @source vuetify/packages/vuetify/src/styles/utilities/_display.sass
*/
@mixin make-grid-columns-hidden() {
	$display: map.get(settings.$utilities, 'display');

	@each $size,
		$media_query in settings.$display-breakpoints {

		/* stylelint-disable-next-line container-name-pattern */
		@container v-resize-drawer #{$media_query} {
			.hidden-#{$size} {
				display: none !important;
			}
		}

		/* stylelint-disable-next-line container-name-pattern */
		@container v-resize-drawer #{$media_query} {
			@each $val in map.get($display, 'values') {
				.#{map.get($display, 'class')}-#{$size}-#{$val} {
					display: $val !important;
				}
			}
		}
	}
}
