@import 'shared';

/* ACE Custom CSS */
.ace_editor {
	height: 800px;
}

textarea.snippet-main-content {
	height: 600px;
}

.ace-editor-settings {
	margin-bottom: 5px;
	text-align: right;
	label {
		font-weight: bold;
	}
}


/**
 * Controller
 */
.snippetcpt-wrap {
	background-color: rgba( 0, 0, 0, 0.25 );
	position: relative;
	min-height: 2em;

	&.no-toolbar {
		min-height: 0;
	}
}


.snippetcpt-ace-viewer {
	min-height: 2em;
}

.snippetcpt-wrap.no-toolbar .ace_content {
	padding: .25em;
}

.snippetcpt-footer .ace_content, .snippetcpt-footer .ace_gutter {
	padding-top: 3em;
}

.snippetcpt-wrap .snippet-button {
	text-decoration: none;
	color: #555;
	cursor: pointer;
	color: #888;
	padding: .25em .32em;
}

.snippetcpt-wrap .snippet-title {
	float: left;
	margin: 0 0.2em;
}

.ace_scrollbar, .snippet-buttons {
	-webkit-transition: opacity .3s ease-in-out;
	-moz-transition: opacity .3s ease-in-out;
	-ms-transition: opacity .3s ease-in-out;
	-o-transition: opacity .3s ease-in-out;
	transition: opacity .3s ease-in-out;
	opacity: 0;
}
.ace_editor:hover .ace_scrollbar {
	opacity: 1;
}

.snippetcpt-wrap .ace_layer.ace_cursor-layer {
	display: none !important;
}

.snippetcpt-footer,
.snippetcpt-footer .snippetcpt-wrap,
.snippetcpt-footer .snippetcpt-ace-viewer {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  margin: 0 !important;
}

.snippetcpt-footer {
	position: fixed;
	background: rgba(0,0,0,.5);
	z-index: 99999;
	opacity: .975;
}

.snippetcpt-footer .snippetcpt-wrap {
  max-height: 100%;
  overflow-y: auto;
}

.snippetcpt-footer .snippetcpt-ace-viewer {
  padding-top: 32px;
  padding-bottom: 32px;
  min-height: calc( 100% - 64px ); /* Compensate for padding-top/bottom */
  width: 100%; /* Compensate for pre.snippetcpt-ace-viewer padding */
}

.snippetcpt-footer .snippet-button.collapse,
.snippetcpt-footer .snippet-button.line-numbers {
	display: none;
}

.snippetcpt-footer .snippet-button {
  font-size: 32px;
  padding: 4px 5px;
  line-height: 32px;
  height: 28px;
  width: 32px;
}

.snippetcpt-footer .snippetcpt-wrap .snippet-buttons {
	position: fixed;
}