@import '~styles/variables'
@import '~styles-lib/mixins'

.modal-header
	padding: $modal-padding-xs
	padding-bottom: 0
	min-height: ($modal-title-padding + $modal-title-line-height)

.modal-controls
	clearfix()
	padding-right: ($grid-gutter-width-xs / 2)
	text-align: right

	.button
		border-top: 0 !important
		border-top-left-radius: 0 !important
		border-top-right-radius: 0 !important

// Title text within header
.modal-title
	margin-top: 0

.modal-body
	position: relative
	padding: $modal-padding-xs

.modal-footer
	clearfix() // clear it in case folks use .pull-* classes on buttons
	padding: $modal-padding-xs
	padding-top: 0
	text-align: center

	@media $media-sm-up
		text-align: right

@media $media-sm-up
	.modal-header
		padding: $modal-padding
		padding-bottom: 0

	.modal-controls
		padding-right: ($grid-gutter-width / 2)

	.modal-body
		padding: $modal-padding

	.modal-footer
		padding: $modal-padding
		padding-top: 0
