/*
 * Vanillabox
 * (C) 2013 cocopon.
 *
 * Licensed under the MIT license:
 * http://www.opensource.org/licenses/mit-license.php
 */
@import 'mixins';


// Name
$root: 'vnbx';
$prefix: 'vnbx-';

// Geometry
$min-content-height: 150px;
$min-content-width: 200px;
$mask-z-index: 999;


.#{$root} * {
	@include box-sizing(content-box);
}


// Mask
.#{$prefix}mask {
	left: 0;
	overflow: auto;
	position: absolute;
	top: 0;
	z-index: $mask-z-index;
}
// Frame
.#{$prefix}frame {
	position: absolute;
}


// Button
.#{$prefix}button {
	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
}
.#{$prefix}prev,
.#{$prefix}next {
	visibility: hidden;
}
.#{$prefix}group {
	.#{$prefix}prev,
	.#{$prefix}next {
		visibility: visible;
	}
}


// Label
.#{$prefix}pager {
	visibility: hidden;
}
.#{$prefix}group .#{$prefix}pager {
	visibility: visible;
}


// Container
.#{$prefix}container {
	overflow: hidden;
	position: relative;
}


// Content
.#{$prefix}content {
	display: block;
	left: 50%;
	position: absolute;
	top: 50%;

	& > img {
		vertical-align: middle;
	}

	& > iframe {
		border-width: 0;
		vertical-align: middle;
	}

	.#{$prefix}ios & {
		overflow: auto;
		-webkit-overflow-scrolling: touch;

		& > iframe {
			display: block;
			height: 100%;
			width: 100%;
		}
	}
}
.#{$prefix}empty {
	height: $min-content-height;
	width: $min-content-width;
}
.#{$prefix}loading,
.#{$prefix}error {
	height: $min-content-height;
	width: $min-content-width;

	& > img,
	& > iframe {
		display: none;
		height: $min-content-height;
		width: $min-content-width;
	}
}
