@import "compass";
@import "mixins";

@import url(../../classic/css/custom_common.css);
@import url(custom_responsive.css);

$dockbarGradientEnd: #1273C7;
$dockbarGradientStart: #118ADE;

$dockbarOpenGradientEnd: #0993DD;
$dockbarOpenGradientStart: #0EA6F9;

.aui {
	/* ---------- Main ---------- */

	h2 {
		color: #555;
		font-size: 24px;
		font-weight: normal;
	}

	h3 {
		color: #8D8D8D;
		font-size: 20px;
		font-weight: normal;
	}

	label {
		input[type="checkbox"], input[type="radio"] {
			vertical-align: text-top;
		}
	}

	legend {
		color: #8D8D8D;
		font-size: 18px;
		font-weight: 200;
	}

	#wrapper {
		padding: 0;
	}

	.container-fluid.panel-manage-frontpage {
		padding: 0;
	}

	.panel-manage-apps, .panel-manage-configuration, .panel-manage-sites, .panel-manage-users {
		padding: 0 3em;

		.panel-page-application {
			margin: 0;
		}
	}

	.control-panel-home-actions-category .btn {
		margin-bottom: 0.5em;
	}

	.taglib-portal-message {
		margin-bottom: 0;
	}

	/* ---------- Control panel secondary nav ---------- */

	.control-panel-bar-secondary {
		margin-left: 10px;
		padding-top: 1.1em;

		&.nav-pills {
			li {
				margin-right: 20px;

				a {
					font-size: 15px;
					font-weight: normal;
					margin: 0;
					padding: 10px 10px 11px;

					&:hover {
						background: #E5F5FC;
					}
				}
			}

			> .active > a {
				background: #009AE5;
				color: #FFF;

				&:hover {
					background: #009AE5;
				}
			}
		}
	}

	/* ---------- Control panel home ---------- */

	.control-panel-home-menu {
		margin-top: 40px;

		a {
			color: #009AE5;
			font-size: 16px;
			text-decoration: none;

			&:active {
				color: #009AE5;
			}

			&:hover {
				color: #009AE5;
				text-decoration: underline;
			}

			&.taglib-icon .taglib-text {
				text-decoration: none;
			}
		}

		ul {
			padding-left: 47px;

			li {
				list-style: none;
				margin-bottom: 5px;

				a {
					font-weight: normal;
				}

				.control-panel-home-link img {
					display: none;
				}
			}
		}

		.control-panel-bar-main {
			font-size: 1.2em;
			font-weight: bold;
			margin-bottom: 5px;
		}

		.control-panel-bar-secondary {
			margin-bottom: 5px;
		}

		.control-panel-home-actions {
			margin-top: 100px;

			.control-panel-home-actions-category {
				color: #8D8D8D;
				padding-top: 10px;
			}
		}

		/* ---------- Control panel home category header ---------- */

		.control-panel-home-category-header a {
			background: none no-repeat 0 50%;
			border-bottom: 1px solid #D4D4D4;
			color: #009AE5;
			display: block;
			font-size: 24px;
			font-weight: 100;
			margin-bottom: 30px;
			padding-left: 47px;
		}

		#control-panel-home-category-headerapps a {
			background-image: url(../images/custom/home_apps.png);
		}

		#control-panel-home-category-headerconfiguration a {
			background-image: url(../images/custom/home_configuration.png);
		}

		#control-panel-home-category-headersites a {
			background-image: url(../images/custom/home_sites.png);
		}

		#control-panel-home-category-headerusers a {
			background-image: url(../images/custom/home_users.png);
		}
	}

	/* ---------- Dockbar ---------- */

	.dockbar {
		border-top: 1px solid #00AEFF;
		position: relative;

		.nav > li > a {
			margin: 3px 0;
			padding: 2px 15px;
		}

		.navbar-inner {
			background-color: $dockbarGradientEnd;
			color: #FFF;
			padding-left: 0;
			padding-right: 0;

			.brand {
				letter-spacing: 1px;

				&, h1, a {
					color: #FFF;
					font-weight: 100;
					text-shadow: none;
				}

				.control-panel-site-selector {
					font-size: inherit;
					margin-top: 0;
					vertical-align: baseline;

					a {
						text-decoration: none;
					}

					.caret {
						border-top-color: #FFF;
						margin-top: -4px;
					}
				}

				.control-panel-back-link {
					margin: 0 15px;

					&:hover, &:focus {
						text-decoration: none;
					}
				}
			}

			.nav-account-controls {
				float: right;

				li.open > .dropdown-toggle {
					margin: 0;
					padding: 5px 15px;
					background-color: $dockbarOpenGradientEnd;
				}
			}

			.nav-navigation {
				letter-spacing: 1px;

				> li {
					&.active a {
						border-radius: 4px;

						&:hover {
							background: #0066B3;
							color: #FFF;
						}
					}

					a:hover {
						background: #0993DD;
					}
				}

				li {
					margin-right: 5px;


					/* ---------- Menu icons ---------- */

					&.control-panel-apps, &.control-panel-configuration, &.control-panel-sites, &.control-panel-users {
						[class^="icon-"], [class*=" icon-"] {
							&:before {
								content: '';
							}
						}
					}

					.icon-cog, .icon-globe, .icon-list, .icon-th, .icon-user, .icon-arrow-left {
						background: none no-repeat 50%;
						height: 21px;
						width: 24px;
						vertical-align: top;
					}

					.icon-cog, .icon-globe, .icon-th, .icon-user {
						height: 26px;
						width: 29px;
					}

					.icon-arrow-left {
						background-image: url(../images/custom/dockbar_back.png);
						margin-top: 4px;
					}

					.icon-cog {
						background-image: url(../images/custom/dockbar_configuration.png);
					}

					.icon-globe {
						background-image: url(../images/custom/dockbar_sites.png);
					}

					.icon-list {
						background-image: url(../images/custom/dockbar_home.png);
						height: 24px;
						margin-top: 3px;
					}

					.icon-th {
						background-image: url(../images/custom/dockbar_apps.png);
					}

					.icon-user {
						background-image: url(../images/custom/dockbar_users.png);
						width: 40px;
					}
				}
			}

			.site-administration-menu li {
				list-style: none;

				a {
					display: block;
					padding: 3px 5px 3px 40px;

					&:hover {
						text-decoration: none;
					}

					i {
						font-size: 0.8em;
					}
				}
			}
		}
	}

	/* ---------- Form navigator ---------- */

	.portlet-journal {
		form {
			margin-bottom: 0;
		}

		.article-form-add {
			.taglib-header {
				margin-bottom: 0;
			}

			.journal-article-header-edit {
				border-top-width: 0;
			}
		}
	}

	/* ---------- General nav ---------- */

	.portlet-topper-toolbar {
		position: absolute;
		right: 8px;
		top: 23px;
	}

	.portlet-topper-titleless .portlet-topper-toolbar {
		bottom: 30px;
		top: auto;
	}

	.nav-list {
		li > a {
			&:focus, &:hover {
				background: #E5F5FC;
				color: #009AE5;
			}
		}

		> .active > a {
			&, &:focus, &:hover {
				background: #60BFEF;
			}
		}
	}

	.lfr-control-panel-help-content.alert {
		border-width: 1px 0;
		margin-bottom: 1em;
	}

	.portlet-title {
		display: inline-block;
		font-size: 25px;
		font-weight: 100;
		width: 85%;

		.taglib-icon-help {
			margin-left: -7px;
		}
	}

	/* ---------- Side accordion navigations ---------- */

	.lfr-title-scope-selector {
		padding: 0 15px 5px;
	}

	.panel-page-menu {
		position: relative;

		.accordion-toggle [class^="icon-"] {
			display: none;
		}

		.minimize-panels a {
			background: url(../images/custom/panel_close.png) no-repeat;
			display: none;
			color: #FFF;
			font-size: 20px;
			height: 17px;
			position: absolute;
			right: -18px;
			text-align: center;
			text-decoration: none;
			top: 7px;
			width: 24px;

			span {
				color: transparent;
				font-size: 0;
			}
		}

		&:hover {
			.minimize-panels a {
				display: block;
			}
		}

		.portlet-borderless-container {
			background: #FCFCFC;
			border-right: 1px solid #D3D3D3;
			padding: 15px 0 0;

			.accordion {
				border-right-width: 0;
				margin-bottom: 0;

				.accordion-group .category-portlets {
					list-style: none;
					margin: 0;

					li {
						a {
							display: block;
							font-size: 14px;
							padding: 3px 15px;

							&:focus, &:hover {
								background: #E5F5FC;
								color: #009AE5;
							}

							&.taglib-icon:hover .taglib-text {
								text-decoration: none;
							}
						}

						&.selected-portlet {
							a {
								background: #60BFEF;
								color: #FFF;
							}
						}
					}
				}
			}
		}

		.search-panels {
			padding: 0 10px 14px;
			position: relative;

			.icon-search {
				left: 18px;
				position: absolute;
				top: 8px;
			}

			.cancel-search {
				color: #f88;
				display: none;
				margin-top: -1em;
				position: absolute;
				right: 15px;
				top: 50%;

				&:hover {
					color: #F55;
					text-decoration: none;
				}
			}

			.icon-search {
				display: none;
			}

			.search-panels-bar {
				position: relative;

				&:after {
					background: url(../images/custom/search_panel_icon.png) no-repeat 0 50%;
					color: #D4D4D4;
					content: '';
					display: block;
					font-size: 0;
					height: 18px;
					margin-left: 8px;
					margin-top: 6px;
					position: absolute;
					top: 0;
					width: 27px;
				}

				.control-group {
					margin: 0;

					.search-panels-input {
						border-color: #CACACA;
						margin-bottom: 0;

						&:focus {
							border-color: rgba(0, 172, 255, 0.8);
						}
					}
				}

				input {
					padding-left: 28px;
				}
			}
		}

		.search-panel-active .search-panels .cancel-search {
			display: inline-block;
		}
	}

	.panels-minimized {
		.panel-page-menu {
			width: 50px;

			.accordion-group {
				&.open {
					.toggler-content {
						border: 1px solid #DDD;
						left: 49px;

						.accordion-inner {
							border-top-width: 0;
						}
					}

					.toggler-header {
						background-color: #DDD;
					}
				}
			}

			.accordion-toggle {
				position: relative;
				text-align: center;

				[class^="icon-"] {
					display: inline;
				}

				.title-text {
					display: none;
				}
			}

			.control-panel-tools {
				cursor: pointer;
				padding: 12px 0;

				&:hover {
					background-color: #DDD;
				}
			}

			.minimize-panels a {
				background-image: url(../images/custom/panel_open.png);
			}

			.portlet-borderless-container {
				padding: 0;

				.accordion {
					.toggler-header .accordion-toggle {
						background: none no-repeat right;
					}

					.accordion-group {
						background: #FFF;
						border: solid #D1D1D1;
						border-width: 0;
						margin-bottom: 0;
						position: relative;

						&:first-child {
							border-top-width: 1px;
						}

						&:last-child {
							.toggler-header-collapsed {
								border-bottom-width: 1px;
							}
						}
					}

					.accordion-heading {
						border-bottom: 1px solid #D1D1D1;
						border-top-width: 0;

						&:hover {
							background-color: #DDD;
						}
					}

					.toggler-header {
						padding: 14px 10px 10px;
					}
				}
			}

			.search-panels {
				padding: 0;
				text-align: center;

				.icon-search {
					display: block;
					position: static;
				}
			}

			.search-panels-bar {
				display: none;
			}

			.toggler-content {
				left: -250px;
				position: absolute;
				top: -1px;
				width: 225px;
				z-index: 1;
			}

			.toggler-content-collapsed {
				display: block;
			}
		}

		.span9.panel-page-body {
			width: 90%;
		}
	}

	/* ---------- Single site admin ---------- */

	.panel-manage-frontpage {
		#controlPanelSiteHeading {
			border-bottom: 1px solid #CFCFCF;
			padding: 17px 20px 5px;
			position: relative;
			z-index: 10;

			a:hover {
				text-decoration: none;
			}

			.control-panel-back-link {
				color: #30C8EE;
				display: inline-block;
				font-size: 21px;
				line-height: 21px;
				margin-right: 5px;
				text-decoration: none;
				vertical-align: middle;

				.control-panel-back-text {
					display: none;
				}
			}

			.control-panel-site-selector {
				font-size: inherit;

				a {
					&:focus, &:hover {
						.icon-caret-down {
							color: #8CD3FC;
						}
					}
				}

				[class^="icon-"], [class*="icon-"] {
					font-size: 21px;
					padding: 0 10px 0 0;
					vertical-align: top;
				}

				&.open {
					.dropdown-toggle {
						@include box-shadow(none);

						[class^="icon-"], [class*="icon-"] {
							color: #009AE5;
						}
					}
				}
			}

			.site-title {
				display: inline-block;
				font-size: 25px;
				font-weight: 300;
				line-height: 20px;
				margin: 0;
				padding: 0 28px 0 0;
				text-transform: capitalize;
				vertical-align: middle;
			}

			.visit-links {
				color: #8D8D8D;
				font-size: 12px;
				list-style: none;
				margin: 0;
				padding: 0 0 0 29px;

				li {
					display: inline-block;
					margin-left: 0;
					margin-right: 5px;
				}
			}
		}

		.form-navigator.well {
			background: #FCFCFC;
			border: 1px solid #D1D1D1;
			border-width: 0 0 0 1px;
			padding-top: 0;

			.nav-header {
				background: #F3F3F3;
				font-size: 14px;
				font-weight: 200;
				text-transform: none;
			}
		}
	}

	/* ---------- Control panel general ---------- */

	li.publish-link-container a:before {
		content: '';
		padding-left: 19px;
	}

	.control-panel-site-selector .caret {
		border-width: 6px;
		margin-top: 5px;
		vertical-align: middle;
	}

	.lfr-ctrl-panel {
		li.publish-link-container a:before {
			padding-left: 0;
		}

		.lfr-meta-actions {
			margin-right: 0;
		}
	}

	/* ---------- Vocabularies select box in sites categories ---------- */

	.portlet-asset-category-admin {
		.categories-admin-select-search {
			margin: 0 10px 0 0;
		}

		.control-group {
			margin-bottom: 0;
		}
	}

	.textboxlistentry-holder {
		margin-left: 0;
	}

	/* ---------- My account popup ---------- */

	button {
		&.delete-logo, &.edit-logo {
			background: #EEE;
			color: #777;
		}
	}

	.datepicker-button-wrapper {
		margin: 0 5px;

		button {
			background: #EEE;
			border: 1px solid #DDD;
			color: #777;
			line-height: normal;
			margin-top: 6px;
			padding: 7px;

			&:hover {
				background: #F4F4F4;
				color: #333;
			}
		}
	}

	/* ---------- Extras ---------- */

	button {
		&.delete-logo, &.edit-logo {
			@include box-shadow(0 2px 2px -1px #CBCBCB);
		}

		.datepicker-button-wrapper & {
			@include border-radius(4px);
		}
	}

	.btn-group.control-panel-site-selector.open a {
		@include box-shadow(none);
	}

	.dropdown-menu {
		@include box-shadow(none);
	}

	.panel-page-menu .portlet-borderless-container {
		&:after {
				background-color: #D1D1D1;

				@include background-image(linear-gradient(#FFF, #D1D1D1));

				content: '';
				display: block;
				height: 15px;
				position: absolute;
				right: -1px;
				top: 0;
				width: 1px;
		}

		.accordion .accordion-group {
			@include border-radius(0);
			@include box-shadow(-3px 0 2px -2px #F5F5F5);

			.accordion-heading {
				&.toggler-header-collapsed, &.toggler-header-expanded {
					@include border-radius(0);
				}
			}
		}

		.search-panels-input {
			@include border-radius(0);
		}
	}

	.lfr-control-panel-help-content {
		@include border-radius(0);
	}

	.control-panel-bar-secondary.nav-pills li a {
		@include border-radius(4px);
	}

	.alert {
		margin: 20px 0;
	}

	/* ---------- Extras dockbar ---------- */

	.dockbar {
		.navbar-inner {
			background-color: $dockbarGradientStart;

			@include background-image(linear-gradient(top, $dockbarGradientStart, $dockbarGradientEnd));
			@include filter-gradient($dockbarGradientStart, $dockbarGradientEnd, vertical);

			ul.nav-account-controls {
				li.open > .dropdown-toggle {
					background-color: $dockbarGradientStart;

					@include background-image(linear-gradient(top, $dockbarOpenGradientStart, $dockbarOpenGradientEnd));
					@include box-shadow(none);
					@include filter-gradient($dockbarOpenGradientStart, $dockbarOpenGradientEnd, vertical);
				}
			}

			ul.nav-navigation {
				> li a:hover {
					@include border-radius(4px);
				}
			}
		}
	}

	.nav-list {
		> .active > a {
			@include text-shadow(none);
		}
	}

	.panel-page-menu .portlet-static.portlet-static-end {
		@include box-shadow(3px 0 2px -2px #F5F5F5);
	}

	.panel-manage-frontpage {
		#controlPanelSiteHeading {
			@include box-shadow(0 3px 4px -3px #DFDFDF);
		}

		.form-navigator.well {
			@include border-radius(0);
			@include box-shadow(-3px 0 2px -2px #F5F5F5);
		}
	}

	/* ---------- Media queries ---------- */

	@include respond-to(phone, tablet) {
		ul.form-navigator.well {
			.button-holder {
				padding-bottom: 20px;
				position: absolute;
				top: 100%;
			}
		}

		.portlet-journal {
			.journal-article-header-edit {
				border-top-width: 1px;
			}
		}

		.nav-list .nav-header {
			margin-left: 0;
			margin-right: 0;
		}

		.taglib-form-navigator .tabbable-content {
			position: relative;
		}

		.taglib-form-navigator .nav.form-navigator.well {
			border-top-width: 0;
			margin-top: 0;
			padding: 0;

			.nav-header {
				@include box-sizing(border-box);

				width: 100%;
			}
		}
	}

	@include respond-to(phone) {

		/* ---------- Panel page menu ---------- */

		.panel-page-menu {
			.minimize-panels a {
				display: block;
				opacity: 1;
			}
		}

		.panels-minimized {
			.panel-page-body.span9 {
				width: 100%;

				&:before {
					content: ".";
					clear: both;
					display: block;
					height: 0;
					visibility: hidden;
				}
			}

			.panel-page-menu {
				float: left;
				width: 100%;

				.control-panel-tools {
					float: left;
					width: 20%;
				}

				.minimize-panels {
					display: none;
				}

				.portlet-borderless-container {
					background: transparent;
					border: 1px solid #D3D3D3;
					float: left;
					margin-top: 20px;
					width: 100%;
					z-index: 400;

					&:after {
						background-image: none;
					}

					.accordion {
						border-width: 0;
						float: left;
						width: 80%;

						.toggler-header .accordion-toggle {
							background-position: center;
							right: auto;
						}

						.accordion-group {
							@include box-shadow(none);

							float: left;
							position: static;
							width: 25%;

							&:first-child {
								border-top-width: 0;
							}

							&:last-child {
								.toggler-header {
									border-bottom-width: 0;
								}
							}

							&.open {
								.toggler-content {
									left: -1px;
									margin-top: 0 !important;
									position: absolute;
									width: 100%;
								}
							}
						}

						.accordion-heading {
							border-bottom-width: 0;
						}
					}
				}

				.search-panels {
					background-position: center;
					right: auto;
				}

				.toggler-content {
					margin-top: 3px;
					top: auto;
				}

				.toggler-header {
					border-left: 1px solid #D3D3D3;
				}
			}
		}

		.span6 {
			&.article-structure, &.article-template {
				float: left;
				width: 45%;
			}
		}

		.panel-manage-apps, .panel-manage-configuration, .panel-manage-sites, .panel-manage-users {
			padding: 0;
		}
	}
}