/* everything is prefixed with 'academicAdvisementReport' as this stylesheet gets loaded into the same context as the main page */
/* some rule selectors could be simplified when :is() is widely supported */
/* common elements */

academicAdvisementReport code {
	display: none
}
academicAdvisementReport description {
	display: block;
	overflow-wrap: anywhere;
	padding: 8px;
	white-space: pre-wrap;
}

/* report */
academicAdvisementReport {
	font-family: Roboto, Verdana, Arial, Helvetica, sans-serif;
	margin-right: 3px;
}

academicAdvisementReport, 
academicAdvisementReport institution, 
academicAdvisementReport academicCareer, 
academicAdvisementReport academicProgram, 
academicAdvisementReport academicPlan, 
academicAdvisementReport academicSubPlan, 
academicAdvisementReport requirements,
academicAdvisementReport requiredPlans, 
academicAdvisementReport requiredPlan {
	display: flex;
	flex-direction: column;
}
academicAdvisementReport > title, 
academicAdvisementReport > subtitle {
	display: inline-block;
	font-weight: bold;
	text-align: center;
}
academicAdvisementReport > title {
	font-size: 2em;
}
academicAdvisementReport > description {
	padding: 8px 50px;
}
academicAdvisementReport div.aar-refresh {
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
}
academicAdvisementReport academicCareer>description,
academicAdvisementReport institution>description {
	font-size:larger;
	font-weight: bold;
}
academicAdvisementReport institution,
academicAdvisementReport courseHistory{
	display:none;
}
academicAdvisementReport academicCareer,
academicAdvisementReport academicProgram,
academicAdvisementReport academicPlan,
academicAdvisementReport academicSubPlan {
	display: block;
	align-items: center;
	margin: 6px 0;
}

academicAdvisementReport academicCareer > description,
academicAdvisementReport academicProgram > description,
academicAdvisementReport academicPlan > description,
academicAdvisementReport academicSubPlan > description {
	padding: 0 8px;
}
academicAdvisementReport academicCareer > status,
academicAdvisementReport academicProgram > status,
academicAdvisementReport academicPlan > status,
academicAdvisementReport academicsubplan > status {
	margin-left: 10px;
    opacity: .65;
}

academicProgram>description::before {
	content: "Academic Program:";
	font-weight: normal;
	padding-right: 1em;
}
academicPlan>description::before {
	content: "Academic Plan:";
	font-weight: normal;
	padding-right: 1em;
}
academicSubPlan>description::before {
	content: "Academic Sub Plan:";
	font-weight: normal;
	padding-right: 1em;
}

academicAdvisementReport aarspecialcourses {
    display: block;
    margin: 10px;
}

academicAdvisementReport .expandable-all,
academicAdvisementReport .expandable-container {
    border: 3px solid #e8e8e8;
    margin: 4px;
    margin-top: 6px;
    border-radius: 4px;
    display: block;
}

academicAdvisementReport .expandable-all {
	padding:4px;
	display: grid;
	grid-template-columns: auto 32px;
	width: 150px;
	align-items:center;
	float:right;
}

academicAdvisementReport .expandable-all span {
	padding:4px 8px;
}

academicAdvisementReport .expandable-header {
    cursor: pointer;
	padding: 6px;	
	display:grid;
	grid-template-columns: 1fr 30% 32px;
}

academicAdvisementReport .expandable-header > div {
	grid-column:1;
	display:flex;
	flex-direction:column;
}

academicAdvisementReport .expandable-all:hover,
academicAdvisementReport .expandable-header:hover {
	background-color: #EBEBEB;
}
academicAdvisementReport requirementGroup > .expandable-container > .expandable-header {
	padding-right:20px;
}
academicAdvisementReport requirements .no-details {
	border: none;
	margin : 0;
}
academicAdvisementReport requirement > .expandable-container > .expandable-header, 
academicAdvisementReport requirement > .expandable-container.no-details requirementLine > .expandable-container > .expandable-header {
	padding-right:13px;
}
academicAdvisementReport requirements .aar-audit-expand i {
	transform: rotate(0deg);
	transition: transform 0.25s;
}

academicAdvisementReport requirements .expanded > .aar-audit-expand > i {
	transform: rotate(180deg);
	transition: transform 0.25s;
}
academicAdvisementReport requirements title {
	font-weight: bold;
	font-size: larger;
}
academicAdvisementReport requirements status {
 	min-width: 100px;
 	min-height: 16px;
 	margin-top:4px;
 	padding-left:20px;
	background-repeat: no-repeat;
}
academicAdvisementReport requirements button {
	grid-column:3;
}

academicAdvisementReport requirementProgress {
	display: flex;
	flex-direction: column;
	padding: 10px 50px;
}
academicAdvisementReport requirementProgress units, 
academicAdvisementReport requirementProgress courses,
academicAdvisementReport requirementProgress gpa {
	display: list-item;
	list-style-type:">";
	padding: 3px 3px 3px 10px;
}
academicAdvisementReport requirementProgress units::marker,
academicAdvisementReport requirementProgress courses::marker,
academicAdvisementReport requirementProgress gpa::marker {
	font-weight:bold;
/* 	color:green; */
}
academicAdvisementReport courseList > description {
    margin-bottom: 0.75em;
    padding: 6px;	
}

academicAdvisementReport courseList courses {
	display:flex;
	flex-direction: column;
    margin: 8px 6px;
    border: 1px solid rgb(211, 211, 211);
	border-radius: 4px;
}

academicAdvisementReport .courses-header {
	 background-color: rgb(240, 240, 240);	
}
academicAdvisementReport .courses-header > span {
	grid-row: 1;
}
academicAdvisementReport .courses-column-title > span {
	padding: 2px;
}
academicAdvisementReport course,
academicAdvisementReport .courses-header {
	display: grid;
	grid-template-columns: 100px auto 50px 100px 50px 100px 92px;
	min-height: 2.4em;
	padding: 0.4em;
	text-align: left;
}
academicAdvisementReport course[wildcard] {
	display: flex;
	flex-direction: column;
}
academicAdvisementReport course[wildcard] .course-details {
	display: grid;
	grid-template-columns: 100px 1fr 32px;
}
academicAdvisementReport course {
	border-top: 1px solid rgb(211, 211, 211);
}

academicAdvisementReport course subject {
	padding-right: 4px;
}

academicAdvisementReport .expandable-header > div.course-catalogId,
academicAdvisementReport course > .course-catalogId {
	grid-column: 1;
	padding: 2px;
	display: block;
}

academicAdvisementReport course > description {
	grid-column: 2;
	padding: 0;
}

academicAdvisementReport course > units {
	grid-column: 3;
	padding: 2px;
}

academicAdvisementReport course > termTaken,
academicAdvisementReport course > typicallyOffered {
	grid-column: 4;
	grid-row: 1; /* Avoid causing a new row despite out of order */
	padding: 2px;
}

academicAdvisementReport course > grade {
	grid-column: 5;
	padding: 2px;
}

academicAdvisementReport course > status {
	min-height: 16px;
	padding: 2px;
 	padding-left:20px;
	background-repeat: no-repeat;
	grid-column: 6;
	margin-top: 0;
}
academicAdvisementReport requirements status[code=complete], 
academicAdvisementReport course > status[code=taken] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Ccircle fill='%2354890A' cx='7.7' cy='8' r='7.5'/%3E%3Cpath fill='%23FFF' d='M12.5 5.7l-1-1-4.8 4.7-2.1-2.1-1.1 1.1 3.2 3.2z'/%3E%3C/svg%3E");
	background-size: 16px 16px;
}
academicAdvisementReport requirements status[code=incomplete], 
academicAdvisementReport course > status[code=inprogress] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath fill='%23F39C12' d='M13.3 8L8 16 2.7 8 8 0z'/%3E%3C/svg%3E");
	background-size: 16px 16px;
}
academicAdvisementReport course > status[code=planned] {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath fill='%23F39C12' d='M13.3 8L8 16 2.7 8 8 0z'/%3E%3C/svg%3E");
	background-size: 16px 16px;
}
academicAdvisementReport requirements status[code=exempt]{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath fill='%23F39C12' d='M13.3 8L8 16 2.7 8 8 0z'/%3E%3C/svg%3E");
	background-size: 16px 16px;
}
academicAdvisementReport course > .aar-button-panel {
	grid-column: 7;
}
academicAdvisementReport course > courses > query { display:none; }
academicAdvisementReport course > searchCatalog,
academicAdvisementReport course > courses {
    grid-row: 2;
    grid-column: 1 / 7;
    padding: 0 0 6px 0;
}
academicAdvisementReport button.aar-refresh,
academicAdvisementReport course button.aar-class-select,
academicAdvisementReport course button.aar-class-remove {
	width: 88px;
}

academicAdvisementReport div.charts { 
	display:flex;
	flex-direction: column;
	grid-column:2; 
}

academicAdvisementReport .chart { 
	display:grid;
	grid-template-columns: 25% 45% 30%;
}

#aar-audit-popup-root #chart-template { 
	display:none; 
}

availableTerms {
	display:none;
}

academicAdvisementReport .chart-title-text {
	opacity: .8;
    font-size: .9em;
    white-space: nowrap;
	text-align: left;
}
academicAdvisementReport .chart-container {
	position:relative;
	white-space:nowrap;
	height:15px;
	padding:0;
	margin:0;
	border:0;
	min-width:100px;
}

academicAdvisementReport .chart-background {
	display: block;
	position: absolute;
	top: 0px;
	left: 0;
	width: 100%;
	height: 13px;
	background-color: #c1c1c1;
}

academicAdvisementReport .chart-fill {
	display: block;
	position: absolute;
	top: 0px;
	left: 0%;
	width: 32%;
	height: 100%;
	background: rgba(237, 102, 71, 1) none repeat top left;
}

academicAdvisementReport .chart-target {
	display: block;
	position: absolute;
	top: -5px;
	left: 50%;
	width: 1px;
	height: 23px;
}

academicAdvisementReport .chart-target-tick {
	display: block;
	width: 1px;
	height: 19px;
	position: absolute;
	top: 0;
	left: -1px;
	background: #555555;
}

academicAdvisementReport .chart-target-text  {
	margin-left: 6px;
    opacity: .8;
    font-size: .9em;
    white-space: nowrap;
}

academicAdvisementReport .chart .chart-target {
	width: 100%;
	left: 0;
}

@media only screen and (max-width:768px) { /* Under 768px wide */
	academicAdvisementReport course > .course-data,
	academicAdvisementReport .courses-header {
		display: none;
	}
	academicAdvisementReport course > .course-data-mobile {
		display: unset;
	}
	academicAdvisementReport courseList description,
	academicAdvisementReport courseList termtaken,
	academicAdvisementReport courseList units,
	academicAdvisementReport courseList typicallyoffered,
	academicAdvisementReport courseList grade,
	academicAdvisementReport courseList status
	{
	    padding: 6px 0;
	    margin: 6px 6px;
    	padding: 0;
    	display: block;
	}
	academicAdvisementReport courseList termtaken::before {
		content: "Term Taken: ";
	}
	academicAdvisementReport courseList units::before {
		content: "Units: ";
	}
	academicAdvisementReport courseList grade::before {
		content: "Grade: ";
	}
	academicAdvisementReport courseList status::before {
		content: "Status: ";
	}
}
@media only screen and (max-width:490px) { /* Under 490px wide */
	academicAdvisementReport .header {
		flex-direction: column;
	}

	academicAdvisementReport requirementLine status {
 		min-width: 0;
		width: unset;
	}
}

@media print {
	#aarPopup .aar-audit-expand {
		display: none;
	}
}