/************************************************************/
/*************** PROACTECH CUSTOM STYLES ********************/
/************************************************************/

/*
 * Add Custom Styles
 *
 * @author Bari
 * @date 02/10/2025
 * @version 23/10/2025
 */

:root {
	--green-light: #91CA3D;
	--green-dark: #5A7D26;
	--blue-dark: #225977;
	--blue-light: #318EAD;
	--gray-dark: #212529;
	--gray-light: #8898AA;
	--megenta: #9E005D;
	--orange: #F15A24;
	--biege: #FFD49C;
	
	--primary-color: var(--green-light);
	--secondary-color: var(--blue-dark);
	--disabled-color: var(--gray-light);
	--text-color: var(--gray-dark);

	--login-logo-width: 15rem;
	--login-panel-width: 25rem;
	--fancybox-bg: rgba(0, 0, 0, 0.35);
}



/*----------------- GLOBAL -----------------*/

.btn-primary {
/* 	background: var(--primary-color); */
	color: var(--text-color);
}


/*----------------- LOGIN -----------------*/

#page-login-index {
    background-size: cover;
	background-repeat: no-repeat;
	background-position-x: calc( 100% - var(--login-pandel-width) );
}

#page-login-index .login-container {
	
	/* Center Login Panel */
	& .card-block {
		margin: auto;
	}
	
	/* Login Panel Container */
	& {
		background-color: transparent;
		max-width: var(--login-panel-width);
		border: none;
		box-shadow: none;
	}
	
	& .login-card,
	& .card-header {
		background: none;
		border: none;
		box-shadow: none;
	}
	
	/* Set Logo */
	& .card-header img {
		max-width: var(--login-logo-width);
	}
	
	/* Set Login & Password Inputs */
	& .input-username-wrapper,
	& .input-password-wrapper {
		
		/* Background & Border */
		& input {
			background: rgba(79, 181, 255, 0.1);
			border-radius: 0.25rem;
			border: 2px solid #4fb5ff73;
		}
		
		/* Icon Color */
		&::before {
			color: var(--secondary-color);
		}
	}
}

/* Set Background for Arabic */
html[dir='rtl'] #page-login-index {
/* 	background-image: url("/local/proactech/login-bg-rtl.png") !important; */
/* 	background-position-x: right; */
}


/*----------------- BREADCRUMB -----------------*/

/* Hide My Courses Link */
.breadcrumb .breadcrumb-item:has(a[href$='my/courses.php']) {
	display: none;
}


/*----------------- DRAWERS -----------------*/

.drawer-toggles .drawer-toggler .btn {
	background: var(--primary-color);
	color: var(--text-color);
}


/*----------------- COLLAPSE ICONS FIX -----------------*/
.collapsible-actions {
	text-align: left ;
}

.collapsemenu .collapseall,
.collapsemenu.collapsed .expandall {
	padding: 0.125rem 0.25rem;
}

.collapsible-actions .collapseexpand::before {
	font-weight: 600;
	content: "";
	transform: rotateX(180deg);
}

.collapsible-actions .collapsed::before {
	transform: none;
}

fieldset.collapsible legend a.fheader::after {
	font-weight: 600;
}


/*----------------- TEXT EDITOR FIX -----------------*/

/* Set Min Height of Text Editor */
html {
	& .editor_atto_content, & .tox-tinymce {
		min-height: 350px !important;
	}
}


/*----------------- MENU -----------------*/

/* Increase NavBar Logo Height */
nav.navbar .logo img {
	/*     max-height: 54px; */
}

/* Hide Top Menu Buttons */
.primary-navigation .nav-item[data-key='home'],
.primary-navigation .nav-item[data-key='mycourses'] {
	display: none;
}

/* Set TopRight Menu on Top of Right Drawer */
.drawer.drawer-right.show {
	/* 	z-index: 990; */
}

/* Hide Top Menu User Profile Preferences Item */
.usermenu {
	& a[href$="preferences.php"],
	& a[href$="preferences.php"] + .dropdown-divider {
		display: none;
	}
}

/* Hide User Profile Page Widgets ONLY for Non-Admins */
html:not(.admin) #page-user-profile {
	
	/* Hide User Profile Page Widgets ONLY for Non-Admins */
	
	& .node_category:has(a[href*="mod/customcert"]),
	& .node_category:has(a[href*="report/usersessions"]),
	& .node_category:has(a[href*="https://download.moodle.org/mobile"]) {
		display: none !important;
	}
	
	/* Hide User Profile Page Menu Items ONLY for Non-Admins */
	
	& .menubar .dropdown-item:has(a[href*="user/contentbank.php"]),
	& .menubar .dropdown-item:has(a[href*="message/edit.php"]),
	& .menubar .dropdown-item:has(a[href*="message/notificationpreferences.php"]) {
		display: none;
	}
}

/* Hide User Preferences Page Links ONLY for Non-Admins */
html:not(.admin) #page-user-preferences {
	& .card .card-text a[href*="user/contentbank.php"],
	& .card .card-text a[href*="message/edit.php"],
	& .card .card-text a[href*="message/notificationpreferences.php"] {
		display: none;
	}
}

/* Hide Notifications Setting */
html:not(.admin) #page-message-notificationpreferences {
	& .preferences-container th[data-processor-name="email"] i {
		display: none;
	}
	
	& .preferences-container th[data-processor-name="email"] a {
		pointer-events: none;
	}
}


/*----------------- SLIDER DASHBORAD -----------------*/
ul.uk-slideshow-items {
	border-top-left-radius: 0.375rem;
	border-top-right-radius: 0.375rem;
}


/*----------------- COURSE OVERVIEW DASHBORAD -----------------*/

/* Add Hover Effect on Course Card Hover */
.block_myoverview .card.dashboard-card:hover {
	box-shadow: 0 0 5px 1px var(--gray);
	transition: 0.2s all;
}

/* Show Category like Badge */
.block .block-cards span.categoryname {
	font-size: small;
	padding: 0.1rem 0.5rem;
	border: 1px solid #e9ecef;
	border-radius: 0.25rem;
	background-color: #f7fafc;
	text-transform: uppercase;
}

/* Hide Course Filter  */
.block_myoverview [data-region="filter"] {
	display: none !important;
}

/* Hide Sort List & Force Sorting by Course Shortname */
#sortingdropdown {
	display: none;
}

/* Category DIV */
.category {
	min-width: 97%;
	margin: 0 auto 1rem;
	font-size: large;
	font-weight: bold;
	padding: 0.5rem 0 0.25rem 0;
	border-bottom: 1px solid #e9ecef;
	border-radius: 0.25rem;
	text-transform: uppercase;
}


/*----------------- BAGDE BLOCK DASHBORAD -----------------*/

.block_badges .badges {
	/* 	text-align: center; */
}

.block_badges .badges li {
	/* 	width: 45%; */
}


/*----------------- UPCOMMING EVENTS BLOCK DASHBORAD -----------------*/
.block_calendar_upcoming .event {
	padding: 0 !important;
	border-bottom: none !important;
}


/*----------------- COURSE CONTACT BLOCK -----------------*/

/* Limit Select Width to prevent Overlflow */
.block_course_contacts .custom-select {
	width: 20rem !important;
}

/* Fix Contact Icons Layout */
.block_course_contacts {
	
	/* Hide Group Select For Tutor/Student */
	
	& .groupselector:not(:has(form)) {
		display: none !important;
	}
	
	& .ccard {
		width: 100%;
		display: inline-flex;
		padding: 0.25rem 0;
		
		& .userpicture, & .userinitials {
			min-width: 50px;
			min-height: 50px;
			margin-right: 0.5rem;
		}
		
		& .info {
			width: 100%;
			
			& .status {
				margin-top: 0.25rem !important;
			}
			
			& hr {
				display: none;
			}
			
			& .comms {
				margin: 0 !important;
			}
		}
	}
}


/*----------------- COURSE INTRO -----------------*/

.block_purity_course_intro.style2 {
	
	/* Change Course Info Color & Set Width */
	& .course-intro-info {
		color: var(--default);
		width: 43%;
    	top: 0;
	}
	
	/* Decrease Opacity of Image Overlay */
	& .course-intro-media .course-intro-media-overlay::after {
		opacity: 0.6;
		/* 	background: linear-gradient( to bottom, rgba(0,0,0,0) 0, rgba(0,0,0,.15) 20%, rgba(0,0,0,.8) 100% ); */
	}
	
	/* Change Course Title Color */
	& .course-intro-info .course-intro-name {
		color: var(--primary-color);
	}
	
	/* Disbale Autolink Activity */
	& a.autolink {
		pointer-events: none;
		color: inherit;
	}
	
	/* Set Course Summary */
	& .course-intro-summary {
		font-size: smaller;
	}
}

/* Force LTR Layout on Arabic Language  */
html[dir='rtl'] .block_purity_course_intro.style2 .course-intro-info {
	direction: ltr;
	text-align: left;
	left: 0;
}

/* Set Course 8 Spacing to Show Category Badge */
body.course-8 .block_purity_course_intro.style2 {
	& .course-intro-summary {
		margin-top: 0.25rem;
	}
	
	& .course-intro-category,
	& .course-intro-details {
		margin-top: auto;
	}
}


/*----------------- COURSE CONTENT -----------------*/

/* Hide Course Content Card Title: 'Course Content' */
.course-content-title {
	display: none;
}


/* Hide Course Reports Logs Sources Menu */
select#menuorigin {
	display: none;
}


/*----------------- COURSE SECTIONS -----------------*/

/* Intro SECTION */
#section-0 .accordion .card {
	& .card-header {
	}
}

/* Disable Course Section Links  */
.course-content .section .sectionname a:not(.quickeditlink) {
	pointer-events: none;
}

/*----------------- ACTIVITY ICONS + TITLES -----------------*/

/* Show Border on Top of Activity */
.format-designer ul.designer .card.card-list {
    border-top: 1px solid #d8d8d8;
}

/* Change File Activity Icon for PDF & Others */
.activity.modtype_resource .activityiconcontainer .activityicon {
	content: url('/theme/purity/pix_plugins/mod/resource/monologo.png');
}

/* Set Activities Icons Bigger */
.activity img.activityicon {
	min-width: 1.5em;
	min-height: 1.5em;
	object-fit: contain;
	vertical-align: middle;
}

/* Remove Activity Icon Container Background */
.activityiconcontainer {
	/* padding: 0.5rem !important; */
	/* margin: 0 !important; */
	vertical-align: middle;
	/* margin: 1rem !important; */
	/* background: none !important; */
}

/* Remove Activity Icon Filter */
.activityiconcontainer .activityicon,
.activityiconcontainer .icon {
	filter: none !important;
}

.course-content .activity .activitytitle {
	
}

/* Remove Activity Type Text */
.course-content .activity .activitytitle .text-uppercase.small {
	    display: none;
}

/* Set Activities Titles Bigger & Underline */
.course-content .activity .activitytitle .activityname a.aalink {
	    color: var(--blue-dark) !important;
}

/* Set Activities Titles Hover Color */
.course-content .activity .activitytitle .activityname a.aalink:hover {
	color: var(--green-light) !important;
/* 	transition: all 0.1s ease 0.3s; */
}

/* Set Disabled Activity Title & Icon */
.course-content .activity.restricted .activitytitle {
	& .activityname > span {
		/*         color: lightgrey; */
	}
	
	& .activityicon {
		/*         opacity: 0.5; */
	}
}

/* Set Admin Only Hidden Badge */
.activity-item > div > .badge {
	/*     margin: 0 1rem 0.5rem auto; */
}

/* Set Activities Completion Badges */
.course-content .activity-information .automatic-completion-conditions {
	/* 	 margin: 0.5em 0 !important; */
	
	& .badge {
		/* 		margin: 0.25em 0 !important; */
	}
}

.section .activity .contentafterlink p {
	/*     font-size: small; */
}

/* Right Activity Conditions */
.activity-item .automatic-completion-conditions {
	/* 	padding: 0.5em 0; */
}

/* Remove Extra Margin Above Activity Description */
.description .course-description-item:first-child {
	/* 	margin-top: 0; */
}


/*----------------- ACTIVITY NAVIGATION -----------------*/

.activity-navigation {
	margin: 0 !important;
}

/* Make Activity Navigation Links as Button */
.activity-navigation #prev-activity-link,
.activity-navigation #next-activity-link {
	white-space: pre-wrap;
	color: var(--text-color);
	background-color: var(--primary-color);
	box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
  
	&:hover {
		color: lightblue;
		background-color: var(--secondary-color);
	}
}

/* Add Icon to Close Button */
#page-mod-scorm-player div[role=main] .btn-secondary::before {
	font-family: "Font Awesome 6 Free";
	content:"\f057";
}


/*----------------- SCORM PAGE -----------------*/

#page-mod-scorm-player {
	& h2, & #scormtop {
		display: none;
	}

	& #scorm_layout {
		margin: 0;
	}
}


/*----------------- QUESTIONNAIRE ACTIVITY -----------------*/

/* Hide Group Chart & Group Table Column */
#page .mod_questionnaire_reportpage {
	& canvas#cvs {
		display: flex;
		margin: 0 auto 3rem;
	}
	
	& canvas#cvs2 {
		display: none;
	}
	
	table.generaltable {
		& .header.c2,
		& .cell.c2 {
			display: none;
		}
	}
}

/* Enlarge Question Emoticons Size */
.mod_questionnaire_completepage .qn-container td.smalltext {
	font-size: x-large;
}

/* Hide Badge of Completion Condition */
.path-mod-questionnaire .activity-information:has( .completion-info .automatic-completion-conditions .alert-success ) {
	display: none;
}

/* Quiz Admin Review */
#page-mod-quiz-review {
	
	/* Hide Right Answer Div for MultiChoice Question */
	
	& .multichoice .outcome:has(.rightanswer) {
		display: none;
	}
	
	/* Hide Response History  */
	
	& .que .history {
		display: none;
	}
}

/* Fix Questionnaire Extra-Large buttons */
#page-mod-questionnaire-questions .qn-container input[type=image] {
	max-width: 0.75rem;
	margin: 0 0.25rem;
}


/*----------------- ATTENDANCE ACTIVITY -----------------*/

/* Hide Second Tabs: Show All Courses */
#page-mod-attendance-view #page-content ul.nav li:nth-child(2) {
	display: none;
}

/* Hide 3rd Collapse Panel: Student Recording settings */
#page-mod-attendance-sessions [aria-controls='id_headerstudentmarkingcontainer'] {
	display: none;
}

/* Hide Checkbox for Create calendar event for session */
#page-mod-attendance-sessions #id_general div.fitem:has(#id_calendarevent) {
	visibility: hidden;
}

/* Hide Session Export Users List */
#page-mod-attendance-export {
	& #fitem_id_selectedusers, & #fitem_id_users {
		display: none;
	}
}


/*----------------- QUIZ ACTIVITY -----------------*/
#page-mod-quiz-attempt .que .formulation {
	
	/* Change Quiz Question Bg Color */
	border-color: #607D8B;
	background-color: rgb(73, 195, 253, 0.15);
	
	/* Hide Check button */
	
	& .im-controls button.submit {
		display: none;
	}
}


/*----------------- H5P ACTIVITY -----------------*/

/* Force Video Player to Max 75% */
.h5p-iframe-wrapper {
	/*     width:75% !important; */
	/*     margin-left: auto; */
	/*     margin-right: auto; */
}


/*----------------- TILES FORMAT -----------------*/

/* Fix Arabic Progress Text Alignment */
.format-tiles .progress-indic svg text {
	/*     direction: ltr; */
}


/*----------------- DESIGNER FORMAT -----------------*/


/* Hide First Section Title & Button, Show Only Description */
.format-designer .course-content .designer #section-head-0 > :not(.summary) {
	display: none;
}

/* Show Hand Cursor for Section Arrow Collapse Icon */
.format-designer .course-content .designer li.section .section-header-content span.section-collapse-icon::before,
.format-designer .course-content .course-type-collapsible.designer li.section .section-header-content span.section-collapse-icon::before {
	vertical-align: middle;
	cursor: pointer;
}

/* Decrease Gap between Activity Rows */
.format-designer .designer .section .content .section.list-layout li.activity {
	margin: 0;
}

/* Remove Activity Row 3rd Column & Extra Row */
.format-designer .show-on-hover,
.format-designer .designer .section .content .section li.activity .mod-content {
	display: none;
}

/* Show Activity Name as Link with underline */
.format-designer  li.activity .activityinstance .aalink .instancename {
	text-decoration: underline;
}

/* Set Activity Completion Badges */
.format-designer ul.designer .badge.badge-completion {
	font-weight: normal;
}

/* RTL Fixes */
html[dir="rtl"] .format-designer .designer .section.img-text .activity .activityinstance {
	/*     padding: 0; */
}


/*----------------- POPUP ACTIVITY FORMAT -----------------*/

/* Remove Extra Padding on left of Sections */
.popups.purity-collapsible[data-for=course_sectionlist] {
	padding-left: 0;
}

/* Increase Popup Size */
.modal.show .modal-dialog {
	min-width: 80%;
	min-height: 45%;
	height: auto;
}

/* SCORM Activity */
iframe#format_popups_scorm_iframe {
	height: 70vh;
	border: none;
}

#page-mod-scorm-player #scormpage #scorm_object {
	width: 100%;
/* 	height: 92.3%; */
}


/*----------------- POPUP ACTIVITY FORMAT -----------------*/

.format-tiles .course-content { 
	
	& ul.tiles li {

	}
	
	& ul li.section.main.moveablesection {
		padding: 1rem 2rem 2rem;
  	}
	
  	& .sectiontitle h2 {
		margin: 0;
		padding: 0.5rem;
		border: none;
  	}

	& .pagesechead .col:has(.sectionbuttons) {
		padding: 0.5em 0;
		display: flex;
		align-items: end;
		justify-content: end;
	}

	& .sectionbuttons {
	
		& .sectionbutton {
			border-radius: 0.25rem;
			background: var(--secondary-color);
        	width: 2.5rem;
			height: 2.5rem;

			&::before {
				display: inline-flex;
				align-items: center;
				justify-content: center;
				height: 100%;
				width: 100%;
				color: #DDD;
				font-family: "Font Awesome 6 Free";
			}

			& img {
				display: none;	
			}

		}
		
		& button::before {
			content:"\f057";
		}
		
		& a::before {
			content:"\f044";
		}
		
	}

	& .completioncheckbox.completion-auto {
    	margin: 0.25rem;
		border-radius: 0.25rem;
  	}
}


/*----------------- COMPLETION PROGRESS -----------------*/
.block_completion_progress .progressEventInfo img {
	/*     width: 32px; */
	/*     height: 32px; */
}


/*----------------- POINT OF VIEW -----------------*/

/* Force Activity Title take max width */
#page-course-view-designer .format-designer .designer .section.img-text.list-layout .activity .activityinstance .activity-instance {
	/*     min-width: 100%; */
}

/* Fix Icons Layout */
#page-course-view-designer .block_point_view.reactions-container {
	/*     position: initial; */
}

/* Main Icon */
#page-course-view-designer .block_point_view.reactions-container .group {
	/* 	display: flex; */
	/*     align-items: center; */
	/* 	position: initial; */
}

/* Votes Number Spacing */
#page-course-view-designer .block_point_view.reactions-container .group_nb {
	/*     margin: auto 0.5em; */
}

/* Icons Container */
#page-course-view-designer .block_point_view.reactions-container .reactions {
	/*     display: flex; */
	/*     align-items: center; */
	/*     justify-content: flex-start; */
	/*     height: 100%; */
	/*     margin-left: -25%; */
	/*     margin: -0.25em -25%; */
}

/* Icons & Texts Spacing */
#page-course-view-designer .block_point_view.reactions-container .reactions span {
	/*     padding: 0 0.5em; */
}

#page-course-view-designer .block_point_view.reactions-container .withtooltip .tooltiptext {
	/* 	right: -30px; */
	/* 	font-size: 0.9rem; */
	/* 	font-weight: normal; */
	/* 	padding: 0.25em 1em !important; */
}


/*----------------- SIDEBAR -----------------*/

/* Prevent Scrollbar on Contact Form Widget */
.block_purity_custom_html form.cf * {
	max-width: 100%;
}

/* Hide Right Sidebar on Course Pages */
#page-course-view-topics [data-region="blocks-column"] {
	/*display: none;*/
}


/*----------------- HELP PAGES HIDE BREADCRUMB -----------------*/
body.course-12 .breadcrumb-item:nth-child(2),
body.course-12 .breadcrumb-item:nth-child(3),
body.course-12 .breadcrumb-item:nth-child(4),
body.course-14 .breadcrumb-item:nth-child(2),
body.course-14 .breadcrumb-item:nth-child(3),
body.course-14 .breadcrumb-item:nth-child(4) {
	/*     display: none; */
}


/*----------------- CALENDAR -----------------*/
.block .minicalendar td.calendar_event_course {
	/*     border: 1px solid #0B0B0B; */
}


/*----------------- FOOTER -----------------*/

/* Hide Footer Home, Login info Links */
.usertour,
.logininfo,
.homelink,
.mobilelink,
.tool_usertours-resettourcontainer {
	/*     display: none !important; */
}

footer #copyright {
	/*text-align: center;*/
	/*background: #F2F5FA;*/
	/*padding: 1rem;*/
	/*font-weight: bold;*/
}

footer .left-box {
	/*     display: flex; */
	/*     align-items: center; */
}

footer .right-box .social-icons img.appbadge {
	/*     height: 3em; */
}

footer .right-box .social-icons img.appqrcode {
	/*     width: 5em; */
	/*     height: 5em; */
}


/*----------------- FANCYBOX -----------------*/
.fancybox__content {
/* 		max-width: 32% !important; */
	border-radius: 0.5rem !important;
}

.fancybox__backdrop {
	--fancybox-bg: rgba(0, 0, 0, 0.35);
}

/* For compact mode */
.fancybox__container.is-compact .fancybox__slide.has-iframe .fancybox__content {
	width: 100%;
	height: 100%;
}

/* For all other cases */
.fancybox__slide.has-iframe .fancybox__content {
	width: 50vw;
/* 	height: 70vh; */
	height: 55vh;
}