//------------------------------------------------------------------------------
// @generic: Global
//------------------------------------------------------------------------------
// @author: hanakin -- midaym
// @version: 1.1.0
// @description:
//
// A thin layer on top of normalize.css that provides a starting point more
// suitable for web applications.
//
//------------------------------------------------------------------------------

//
// #scss

//
// 1. Force scrollbars to always be visible to prevent awkward ‘jumps’ when
//    navigating between pages that do/do not have enough content to produce
//    scrollbars naturally.
// 2. Ensure the page always fills at least the entire height of the viewport.
// 3. Fonts on OSX will look more consistent with other systems that do not
//    render text using sub-pixel anti-aliasing.
// 4. Changes the default tap highlight to be completely transparent in iOS.
// 5. Set touch-action to avoid touch delay on mobile IE
// 6. Make html take up the entire screen
//
html {
	-moz-osx-font-smoothing: grayscale;  // [3]
	-webkit-font-smoothing: antialiased;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0); // [4]
	overflow-y: scroll; // [1]
	width: 100%; // [6]
	height: 100%; // [6]
	min-height: 100%;  // [2]
	-ms-touch-action: manipulation; // [5]
	touch-action: manipulation;
	-ms-overflow-style: -ms-autohiding-scrollbar; // [1] Edge 12+, IE 11
}

//
// 1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
//
body {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; // [1]
	width: 100%;
	min-height: 100%;
}

//
// Removes the default spacing and border for appropriate elements.
//
iframe {
	border: 0;
}

//
// Remove the gap between audio, canvas, iframe,
// images, videos and the bottom of their containers:
// https://github.com/h5bp/html5-boilerplate/issues/440
//
audio,
canvas,
iframe,
img,
svg,
video {
	vertical-align: middle;
}

//
// Avoid 300ms click delay on touch devices that support the `touch-action`
// CSS property.
//
// In particular, unlike most other browsers, IE11+Edge on Windows 10 on touch
// devices and IE Mobile 10-11 DON'T remove the click delay when
// `<meta name='viewport' content='width=device-width'>` is present.
//
// However, they DO support removing the click delay via
// `touch-action: manipulation`.
//
// See:
// * http://caniuse.com/#feat=css-touch-action
// * http://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay
//
a,
area,
button,
[role='button'],
input,
label,
select,
summary,
textarea,
[tabindex] {
	touch-action: manipulation;
}

//
// Add the correct display in Chrome and Safari.
//
summary {
	display: list-item;
}

//
// Remove text-shadow in selection highlight:
// https://twitter.com/miketaylr/status/12228805301
//
// These selection rule sets have to be separate.
// Customize the background color to match your design.
//
::-moz-selection {
	background: $blue-200;
	text-shadow: none;
}

::selection {
	background: $blue-200;
	text-shadow: none;
	color: $white;
}

//
// use current current as the default fill of svg elements
//
svg {
	fill: currentcolor;
}

//
// specify the progress cursor of updating elements
//
[aria-busy='true'] {
	cursor: progress;
}

//
// specify the pointer cursor of trigger elements
//
[aria-controls] {
	cursor: pointer;
}

//
// specify the un-styled cursor of disabled, not-editable, or otherwise
// inoperable elements
//
[aria-disabled] {
	cursor: default;
}

//
// specify the style of visually hidden yet accessible elements
//
[hidden][aria-hidden='false'] {
	position: absolute;
	display: inherit;
	clip: rect(0 0 0 0);

	&:focus {
		clip: auto;
	}
}

//
// from bootstrap grid...not sure if we need this
//
/* stylelint-disable at-rule-no-vendor-prefix */
@-ms-viewport {
	width: device-width;
}
/* stylelint-enable at-rule-no-vendor-prefix */
