/*
 * Curriculum Field
 */

.curriculum {
	width: 100%;
	background: #EEEEEE;
	font: 12px Arial;
}

.curriculum .legend,
.curriculum legend {
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 4px 5px 3px 0;
	width: 20%;
	color: #888888;
	text-align: right;
	font-weight: bold;
}

.curriculum.ckeditor p {
	line-height: 0em !important;
}

.schema,
.courses {
	float: right;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding-left: 0;
	width: 80%;
}


/*
 * Course List Items
 */

 .course-list-container {
 	margin-bottom: 10px;
 }

 .course-list {
 	margin-bottom: 5px;
 	min-height: 27px;
 	border: 1px solid #E6E6E6;
 	background: #FFFFFF;
 }

 .core-list > li.no-data,
 .course-list > li.no-data {
 	display: block;
 	padding: 20px 5px;
 }

 .course-list-label {
 	display: block !important; /* FIXME */
 	padding: 4px 5px 3px 0;
 	color: #888888;
 	letter-spacing: 0.4px;
 	font-weight: bold;
 }


 .schema .course-list {
 	padding: 3px;
 }

 .schema .course,
 .schema .custom-text {
 	border: 1px dotted #BBB;
 	border-radius: 6px;
 	margin: 3px auto;
 }
 .schema .custom-text {
 	display: -webkit-box;
   display: -moz-box;
   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;
	 min-height: 25px;
 }

 .empty-list {
 	color: #CCCCCC;
 }

 .course {
 	font-weight: bold;
 }

 .course:hover,
 .custom-text:hover {
 	background: #EEEEEE;
 }

.custom-text,
.course,
.empty-list {
	position: relative;
	padding: 5px;
	overflow: hidden;
}

.course .course-name {
	float: left;
	max-width: calc(85% - 30px);
}
.schema .course .course-name {
	margin-left: 52px;
	max-width: calc(90% - 107px);
}
.schema .course.with-status .course-name {
	max-width: none;
}

.adhoc-position-preview {
	float: left;
	margin-right: 5px;
	text-transform: capitalize;
	width: 50px;
}

.adhoc-position-preview span {
	text-transform: capitalize;
	display: inline-block;
}

.course .course-credits {
	float: right;
	margin-right: 30px;
	max-width: calc(15% - 30px);
}
.schema .course .course-credits {
	margin-right: 55px;
}
.course .course-credits.static {
	margin-right: 0;
}

.section-fieldset .ckeditor.custom-text {
	padding: 0 !important;
}

.adhoc-position {
	background-color: #DDD;
	border-radius: 6px;
	margin-right: 2px;
	min-width: 50px;
	padding-left: 3px;
	padding-top: 2px;
	text-transform: capitalize;
}


.adhoc-credits,
.adhoc-text.flex-fill {
	margin-right: 60px;
}

.adhoc-credits.static {
	margin-right: 0;
}

.adhoc-text.flex-fill,
.adhoc-flex-fill {
	-webkit-box-flex:1;
  -ms-flex-positive:1;
  flex-grow:1
}

.adhoc-text {
	max-width: calc(90% - 105px);
	overflow-y: auto;
	max-height: 200px;
	box-sizing: border-box;
	padding-right: 5px;
}

.adhoc-credits {
	font-weight: bold;

}
.course-list-button-container {
	position: absolute;
	top: 2px;
	right: 2px;
}

.adhoc-position,
.adhoc-credits {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.course .btn-edit,
.course .btn-delete,
.custom-text .btn-edit,
.custom-text .btn-delete {
	position: relative;
	top: -3px;
	visibility: hidden;
	float: right;
}

.course:hover .btn-edit,
.course:hover .btn-delete,
.custom-text:hover .btn-edit,
.custom-text:hover .btn-delete {
	visibility: visible;
}

.course.with-status,
.with-status {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.with-status .course-name {
	-webkit-box-flex: 3 3 125px;
	    -ms-flex: 3 125px;
	        flex: 3 125px;
	float: none;
	max-width: none;
}

.with-status .course-status,
.course-credits {
	text-align: right;
}

.with-status .course-credits {
	-webkit-box-flex: 2 2 45px;
	    -ms-flex: 2 45px;
	        flex: 2 45px;
	float: none;
	margin-left: 5px;
	max-width: none;
}

.course-status {
	color: #888;
	-webkit-box-flex: 1 1 35px;
	    -ms-flex: 1 0 35px;
	        flex: 1 0 35px;
	margin-left: 5px;
}

.add-core-course-dialog .course-status {
	text-align: right;
	-webkit-box-flex: 1 1 111px;
	    -ms-flex: 1 0 111px;
	        flex: 1 0 111px;
}


.course-status em {
	font-style: italic;
}






/*
 * Course Form
 */

.add-course-form {
	margin: 5px;
	padding: 5px 0;
	border-top: 1px solid black;
}

.add-course-form input {
	width: 15% !important;
}


/*
 * CKEditor special style rules for curriculum
 * Note: first-of-type selector doesn't work with ie8;
 * unlaunched mode templates have classes .custom-text.ckeditor
 * active mode templates have classes .custom-text .ckeditor
 */

.course-list .custom-text .ckeditor p:first-of-type,
.course-list .custom-text.ckeditor p:first-of-type {
	margin: 0 !important;
}

/* remove when our stylesheet doesn't stink */
.section-fieldset .custom-text .ckeditor {
	padding: 5px !important;
}



/*
 * Icon Buttons
 */

 /* hide the core course-list buttons on the bucket view. */
 .courses > .course-list-container > .btn-add {
 	display: none;
 }

.btn-add {
	padding-left: 20px;
	border: 0;
	background: url(/images/icons/flat/add.png) no-repeat;
}

.btn-import {
	padding-left: 20px;
	border: 0;
	background: url(/images/icons/flat/import.png) no-repeat;
}

.btn-add:hover,
.btn-import:hover {
	text-decoration: underline;
	cursor: pointer;
}

.btn-delete {
	padding-left: 20px;
	width: 20px;
	height: 20px;
	border: 0;
	background: url(/images/icons/flat/delete.png) no-repeat;
}

.btn-edit {
	padding-left: 20px;
	width: 20px;
	height: 20px;
	border: 0;
	background: url(/images/icons/flat/edit.png) no-repeat;
}

.btn-delete:hover,
.btn-edit:hover {
	cursor: pointer;
}

.btn-add:active,
.btn-delete:active,
.btn-edit:active,
.btn-import:active {
	position: relative;
	top: 1px;
}

.btn {
	margin: 0px 2px;
	padding: 4px 6px;
	border: 1px solid #BBBBBB;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
			border-radius: 3px;
	background-color: #EEEEEE;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#EEEEEE), to(#D5D5D5));
	background-image: -webkit-linear-gradient(top, #EEEEEE, #D5D5D5);
	background-image:    -moz-linear-gradient(top, #EEEEEE, #D5D5D5);
	background-image:     -ms-linear-gradient(top, #EEEEEE, #D5D5D5);
	background-image:      -o-linear-gradient(top, #EEEEEE, #D5D5D5);
	background-image:         linear-gradient(top, #EEEEEE, #D5D5D5);
	-webkit-box-shadow: 0px 1px 2px #CCCCCC;
	   -moz-box-shadow: 0px 1px 2px #CCCCCC;
			box-shadow: 0px 1px 2px #CCCCCC;
	color: #232D3D;
	text-shadow: 0px 1px 0px #FFFFFF;
	font: bold 11px/15px Verdana, sans-serif;
	cursor: pointer;
}

.btn-preview-tools {
	width: 25px;
	height: 25px;
	border: none;
	-webkit-box-shadow: none;
	   -moz-box-shadow: none;
			box-shadow: none;

	background: transparent;
	padding: 0;
}

.btn:hover {
	color: #D85054;
}

.btn:active {
	position: relative;
	top: 1px;
}

/*
 * Curriculum switch buttons
 */

.switch-curriculum {
	float: left;
	text-align: right;
	width: 19%;
	margin-right: 1%;
}

.btn-schema,
.btn-courses,
.btn-preview-curriculum {
	overflow: hidden;
	width: 26px;
	height: 26px;
	border: 1px solid transparent;
	border-radius: 3px;
	background-color: transparent;
	background-position: 2px 2px;
	background-repeat: no-repeat;
	font-size: 0;
}

.btn-schema.active,
.btn-courses.active,
.btn-preview-curriculum.active {
	border: 1px solid #BBBBBB;
	background-color: white;
}

.btn-schema {
	background-image: url(/images/icons/flat/schema.png);
}

.btn-courses {
	background-image: url(/images/icons/flat/courselist.png);
}

.btn-preview-curriculum {
	background-image: url(/images/icons/flat/schema-preview.png);
}




/*
 * Curriculum Core
 */

.core fieldset {
	position: relative;
	display: block;
	margin: 0 0 3px 0;
	background: #F6F6F6;
	color: #333333;
	/*border: 1px solid #E6E6E6;*/
	border-radius: 3px;
}

/* TODO: merge these two rules */
.core-drag-handle {
	display: block;
	width: 20px;
	height: 20px;
	background: url("../images/icons/flat/drag.png") no-repeat scroll 0 0;
	cursor: move;
}

.core > fieldset > .core-drag-handle {
	position: absolute;
	top: 3px;
	left: -20px;
	visibility: hidden;
}

.core > fieldset:hover .core-drag-handle {
	visibility: visible;
}

.core-header {
	padding: 5px 0 5px 5px;
	border-radius: 3px 3px 0 0;
	background-color: #BBBBBB;
}

/* Add the locked icon to the core-header if this is a locked core. */
.core-locked .icon-locked {
	background: #BBBBBB url(/images/icons/flat/lock.png) no-repeat 0px 0px;
	position: absolute;
	right: 30px;
	top: 2px;
	width: 20px;
	height: 20px;
	border: 0;
}

.core-header > .core-title {
	color: #FFFFFF;
	font-weight: bold;
	max-width: calc(100% - 55px);
	display: inline-block;
}

.core-header > .core-title.with-status {
	max-width: calc(100% - 155px);
}

.core-header > .core-status {
    font-style: italic;
    color: #FFFFFF;
    font-weight: bold;
    display: inline-block;
    position: absolute;
    right: 50px;
}

.core-header > .btn-delete {
	visibility: hidden;
	float: right;
	margin-top: -3px;
	width: 20px;
	height: 20px;
	color: transparent;
}

.core-header:hover > .btn-delete {
	visibility: visible;
}

/* Modify the styles when the core is in a collapsed state. */
.core.collapsed > fieldset > .core-header {
	border: 0 none;
	border-radius: 3px;
}

.core.collapsed > fieldset > .core-content {
	display: none;
}

.core-title-field-label,
.core-description-field-label {
	display: block !important; /* FIXME */
	padding: 4px 5px 3px 0;
	color: #888888;
	letter-spacing: 0.4px;
	font-weight: bold;
}

.core-title-field,
.core-description-field {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
}

.core-title-field,
.core-description-field {
	padding: 5px;
	border: 1px solid #E6E6E6;
	background-color: #FFFFFF;
	/* FIXME We are overwriting styles here. Refactor styles.css */
	margin-bottom: 10px !important;
}

.core-content {
	padding: 5px;
}

.core-content > .course-list {
	margin: 10px 5px;
}

/* This is the placeholder element used by jQueryUI sortable. */
.core-sortable-highlight {
	margin-bottom: 3px;
	height: 24px;
	border-radius: 3px;
	background: #CCCCCC;
}


/* This shows the object status for Curriculum Preview with markup */
.curriculog-preview .core-block .core,
.curriculog-agenda-print .core-block .core {
	margin-bottom: 10px;
	padding: 15px;
	border: 1px solid #DDDDDD;
	background: #EEEEEE;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
}

.curriculog-preview .core-block.shared-core,
.curriculog-preview .core-block.locked .core,
.curriculog-agenda-print .core-block.shared-core,
.curriculog-agenda-print .core-block.locked .core {
	background: #E6EFF2;
	border-color: #AFD1DB;
}

.curriculog-preview .core-block.locked .core.core-courses,
.curriculog-agenda-print .core-block.locked .core.core-courses {
	background: #EFEFEF;
	border-color: #DEDEDE;
}

.curriculog-preview .core-block.locked .core.core-courses .course-list,
.curriculog-agenda-print .core-block.locked .core.core-courses .course-list {
	padding-left: 0px;
}

.curriculog-preview .core-block h3,
.curriculog-agenda-print .core-block h3 {
	font: 18px Verdana, sans-serif;
	/*text-decoration: underline;*/
	margin: 0 0 5px 0;
}

.curriculog-preview .core-block h3 p,
.curriculog-agenda-print .core-block h3 p {
	margin: 0;
}

.curriculog-preview .ckeditor p:first-of-type,
.curriculog-preview .course-list li p:first-of-type,
.curriculog-agenda-print .ckeditor p:first-of-type,
.curriculog-agenda-print .course-list li p:first-of-type {
	margin: 0 !important;
}

.curriculog-preview .core-block.locked h3,
.curriculog-agenda-print .core-block.locked h3 {
	padding: 0px;
	display: block;
	background: url("../images/icons/flat/lock.png") no-repeat scroll 0px 1px transparent;
	text-indent: 20px;
}

.curriculog-preview .core-block h3>i,
.curriculog-agenda-print .core-block h3>i,
.curriculog-preview .core-block.locked h3>i,
.curriculog-agenda-print .core-block.locked h3>i {
	font-style: italic;
	color: #8a8888;
}

.curriculog-preview .core-block h3 img,
.curriculog-agenda-print .core-block h3 img {
	vertical-align: text-bottom;
}

.curriculog-preview .core-block .description,
.curriculog-agenda-print .core-block .description {
	font: 12px Verdana, sans-serif;
	margin: 10px 0;
	line-height: 1.5em;
}

.curriculog-preview .core-block ol.course-list,
.curriculog-agenda-print .core-block ol.course-list {
	margin-left: 10px;
	list-style: none !important;
	background: transparent;
	border: 1px solid transparent;
}

.curriculog-preview .core-block ol.course-list li,
.curriculog-agenda-print .core-block ol.course-list li {
	padding: 2px 0px;
	font: 12px Verdana, sans-serif;
	overflow: hidden !important;
}

.curriculog-preview .core-block ol.course-list li .course-name,
.curriculog-agenda-print .core-block ol.course-list li .course-name {
	float: left;
	max-width: calc(70% - 50px);
}

.curriculog-preview .core-block ol.course-list li .course-credits,
.curriculog-agenda-print .core-block ol.course-list li .course-credits {
	float: right;
	max-width: calc(30% - 50px);
}

.curriculog-preview .core-block ol.course-list li.with-status .course-credits,
.curriculog-agenda-print .core-block ol.course-list li.with-status .course-credits {
	max-width: none;
}

.curriculog-preview .core-block ol.course-list li.type-customText,
.curriculog-agenda-print .core-block ol.course-list li.type-customText {
	font-style: italic;
	color: #999999;
}

.curriculog-preview .core-block.ckeditor ol.course-list li.type-customText p,
.curriculog-agenda-print .core-block.ckeditor ol.course-list li.type-customText p {
	margin: 0px !important;
}

/* Curriculum Preview with diff  */
.curriculog-preview.diff .ckeditor a,
.curriculog-preview.diff .ckeditor a,
.curriculog-agenda-print.diff .ckeditor a {
	color: black !important;
}

.curriculog-preview.diff .core-block.status-deleted > .core,
.curriculog-agenda-print.diff .core-block.status-deleted > .core {
	border-color: red;
	background: #E8C5C5;
	color: red;
	text-decoration: line-through;
}

.curriculog-preview.diff .core-block.status-inserted > .core,
.curriculog-agenda-print.diff .core-block.status-inserted  > .core {
	border-color: green;
	background: #BDF2BD;
}

.curriculog-preview.diff .course-list .status-deleted div,
.curriculog-agenda-print.diff .course-list .status-deleted div{
	color: #C40000 !important;
	font-weight: bold;
	text-decoration: line-through;
}

.curriculog-preview.diff .course-list .status-inserted,
.curriculog-agenda-print.diff .course-list .status-inserted,
.curriculog-preview.diff .course-list .status-inserted div,
.curriculog-agenda-print.diff .course-list .status-inserted div {
	color: #008000 !important;
	font-weight: bold;
}




/*
 * Subcore list
 *
 * The nestedSortable plugin removes the .sub-core class from the ol, so we
 * need to use both selectors here.
 */
.core > .sub-cores,
.core > ol {
	margin: 5px 0 0 20px;
}




/*
 * Reset the reset for CKE fields
 */

div[contenteditable="true"] strong {
	font-weight: bold;
}

div[contenteditable="true"] em {
	font-style: italic;
}




/* TODO: group these rules */


.add-course-form input {
	width: 5em !important;
}

.select-field {
	padding: 5px;
	border-radius: 3px;
}
.add-core-text-label {
	color: #777777;
	display: block;
	font-weight: bold;
	margin-top: 5px;
	text-align: left;
}
.input-text {
	box-sizing: border-box;
	display: block;
	margin-bottom: 5px;
	padding: 1px;
	width: 100%;
}
.input-text.plain-text,
.add-core-text-label.plain-text {
	box-sizing: content-box;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

.input-text.plain-text {
	padding: 2px;
}

textarea.input-custom-text {
	width: 90%;
	height: 100px;
}

.course-delete-dialog .ui-dialog-content {
	text-align: left;
	font: 12px/1.5 Verdana, Arial, sans-serif;
	text-shadow: none;
}

.course-delete-dialog ul {
	list-style: disc inside none;
}

#adhoc-name.error {
	border: 2px solid #A85903;
}
#adhoc-name + span.error {
	text-align: left;
}