/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/

/*
	COLORS
	purple = #462049
	light purple = #d5cdd8
	blue = #00adef
*/

/* PAGE TRANSITIONS */
.animation {
  animation-duration: 0.5s;
  animation-fill-mode: both;
}
.animation-fast {
  animation-duration: 0.25s;
  animation-fill-mode: both;
}
@keyframes slideOutLeft {
    from {
			transform: translate3d(-100%, 0, 0);
    }
    to {
			transform: translate3d(0, 0, 0);
      visibility: visible;
    }
}
.slideOutLeft {
  animation-name: slideOutLeft;
}

/* NAVIGATION - HIDING MENUS AT MOBILE */
@media (max-width: 767px) {
	/* .main-navigation {
		display: none;
	} */
	.bb-mobile-panel-inner hr {
		display: none;
	}
	#menu-buddypanel {
		margin-top:20px;
	}
}

/* HOME PAGE */
figure.wp-block-embed {
	padding:0 10px;
}
.wp-block-columns h2, .wp-block-columns h3, .wp-block-columns h4 {
	padding-left:10px;
	padding-right:10px;
}
.wp-block-columns p {
	margin-bottom:1em;
}
.boxes {
	margin-bottom:0;
}
.boxes .wp-block-column {
	background: #d5cdd8;
	padding:25px;
	margin-bottom:1.75em;
}
@media (min-width: 768px) {
	/* adjust position of profile box which seems a little off */
	.home-page .ld-profile-avatar {
		margin-top:-30px;
		width:175px !important;
	}
	.learndash-wrapper #ld-profile .ld-profile-summary .ld-profile-card .ld-profile-heading {
		bottom:95px;
	}
}
.boxes .fas {
	font-size:5rem;
	margin-left:10px;
	position:relative;
	top:-10px;
	color:#462049;
}

/* ANNOUNCEMENTS BANNER */
.announcement-block {
	background:#462049;
	color:#fff;
	padding:30px;
	text-align: center;
	margin:0 -30px;
}
.announcement-block.urgent {
	background:#19b2ee;
}
.announcement-block a {
	color:#fff;
	font-weight:#fff;
}

.od-get-started-banner {
  background:#19b2ee;
  color:#fff;
  padding:30px;
  text-align:left;
  margin:0 -30px;
}

.od-get-started-banner a {
  color:#fff;
  text-decoration:underline;
}

.od-get-started-banner .alert {
  margin:0;
}

.od-get-started-banner ol {
  margin:10px 0 0 20px;
}

.od-get-started-banner li + li {
  margin-top:4px;
}

/* but don't show announcement on the Learndash course pages */
.learndash-template-ld30 .announcement-block {
	display:none !important;
}

.learndash-template-ld30 .od-get-started-banner,
.single-sfwd-courses .od-get-started-banner,
.single-sfwd-lessons .od-get-started-banner,
.single-sfwd-topic .od-get-started-banner,
.single-sfwd-quiz .od-get-started-banner,
.post-type-archive-sfwd-courses .od-get-started-banner {
	display:none !important;
}


/* MEDIA ICONS ON COMMENTING */
.bpfb_actions_container.bpfb-theme-new .bpfb_toolbarItem {
	color:#00adef;
}

/* TAB COUNTS */
.bp-navs ul li .count {
	background:#d5cdd8;
}

/* GROUP BANNERS ON GROUPS PAGE */
.bs-group-cover a {
	background:#230560;
	padding-top:42%;
}
.bs-group-cover img, #buddypress #header-cover-image .header-cover-img {
	min-height: auto;
}
body #buddypress #header-cover-image.cover-large {
	height:219px;
}


/* Group lozenge */
.item-header-wrap .bp-group-meta .group-type {
  background:#00adef;
}

/* Join Group button */
.groups-header #item-header-content .generic-button .group-button {
  background: #462049 !important;
  color:#fff !important;
}
/* Group button on groups page */
#groups-list.bp-list.grid.bb-cover-enabled .item-avatar .generic-button .group-button {
  color:#00adef !important;
  font-weight: bold;
}

/* GROUP Whereby meetings */
.video-box {
	border:1px solid #d5cdd8;
	border-radius:3px;
	padding:10px;
}
.video-box-inner {
	position:relative;
	overflow:hidden;
	padding-top:75%;
  background: #d5cdd8;
}
.video-box iframe {
	border:0;
	display:block;
	position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border: 0;
}


/* Streamyard button */
.launch-button {
	display:inline-block;
	background:#462049;
	color:#fff;
	padding:20px;
	font-size:1rem;
	margin:10px 0;
	border-radius: 5px;
}
.launch-button:hover, .launch-button:focus, .launch-button:active {
	background:#00adef;
	color:#fff;
}
@media (min-width: 1200px) {
  .launch-button {
    padding:20px 30px;
  	font-size:1.4rem;
  }
}


/* Learndash hide date */
.bb-course-banner-inner .course-date {
  display: none;
}

/* Onboarding course: hide volume widget */
body.od-onboarding-course .bb-course-volume {
  display: none !important;
}

/* Profile photo guidance on change-avatar screen */
.od-profile-photo-guidance {
  margin-top: 20px;
}

.od-profile-photo-guidance-title {
  margin-bottom: 12px;
}

.od-profile-photo-guidance img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}


/* Hiding pre-filled fields on the Attendance form */
.hidden-field {
  display: none;
}

/* Other buttons - like push-engage opt-in */
.btn {
  display: inline-block;
}
.btn-primary {
  background:#462049;
  color:#fff;
  border-radius: 100px;
padding: 10px 20px;
font-weight: 200;
}
.btn-primary:hover, input[type="submit"]:hover, .btn-primary:active, input[type="submit"]:active {
  background:#00adef;
  color:#fff;
  border-color:#00adef;
}

/* Hide Learndash status warnings like "Free" until ready to show them */
.ld-status {
  display: none;
}
.bb-course-type-free {
  display:none !important;
}

/* Hide leaderboard table until we're ready to show it */
.ld-achievements-leaderboard {
  display: none;
}

/* Learndash start course button */
body .learndash-wrapper .btn-join, body .learndash-wrapper #btn-join, .bb-single-course-sidebar a.btn-advance {
  background:#462049 !important
}

/* Lesson Tab styling */
.ld-tab .ld-text {
  color:#462049 !important;
  font-weight:bold;
  font-size:1.1rem;
}
.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab.ld-active:after {
  height:3px;
  background:#462049 !important;
}

/* Hiding lesson date */
.bb-about-instructor-date {
  display: none;
}


/* Sponsorship */
.copyright {

}
.sponsored-by img {
	display: block;
	max-width: 200px;
	margin:20px auto;
}
.sponsored-by span {
	font-size: 0.8rem;
}
@media (min-width: 992px) {
	.copyright {
		display: flex;
		align-items: center;
	}
	.sponsored-by {
		margin-right:20px;
	}
	.sponsored-by img {
		margin-top:10px;
	}
}
@media (min-width: 1200px) {
	.sponsored-by img {
		width:160px;
	}
}

/* Register page role picker */
body.registration #signup-form .field_member-type {
	display: none !important;
}

body.registration #signup-form.od-role-pending .register-section,
body.registration #signup-form.od-role-pending .input-options,
body.registration #signup-form.od-role-pending .submit {
	display: none;
}

body.registration .od-role-picker {
	margin: 0 0 24px;
	padding: 24px;
	border: 1px solid #d5cdd8;
	border-radius: 10px;
	background: #fff;
}

body.registration .od-role-picker-hidden {
	display: none;
}

body.registration .od-role-picker-title {
	margin: 0 0 16px;
	font-size: 1.4rem;
	color: #462049;
}

body.registration .od-role-picker-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

body.registration .od-role-picker-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 140px;
	padding: 18px;
	border: 2px solid #d5cdd8;
	border-radius: 12px;
	background: #f8f6f9;
	color: #462049;
	transition: all .2s ease;
}

body.registration .od-role-picker-student {
	grid-column: 1 / -1;
	min-height: 156px;
	background: linear-gradient(135deg, #462049 0%, #6d3671 100%);
	border-color: #462049;
	color: #fff;
}

body.registration .od-role-picker-student:hover,
body.registration .od-role-picker-student:focus {
	border-color: #00adef;
	background: linear-gradient(135deg, #462049 0%, #00adef 100%);
	color: #fff;
}

body.registration .od-role-picker-card:hover,
body.registration .od-role-picker-card:focus {
	border-color: #00adef;
	background: #eef9ff;
	color: #462049;
}

body.registration .od-role-picker-icon {
	font-size: 2rem;
	line-height: 1;
}

body.registration .od-role-picker-label {
	font-size: 1.1rem;
	font-weight: 700;
}

@media (max-width: 767px) {
	body.registration .od-role-picker-grid {
		grid-template-columns: 1fr;
	}
}

/* Register page Career Interests pills */
body.registration .od-career-pillified select[multiple],
body.registration .od-career-pillified .select2 {
	display: none !important;
}

body.registration .od-boolean-pillified select:not([multiple]),
body.registration .od-boolean-pillified .select2 {
	display: none !important;
}

body.registration .od-career-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 8px;
	margin-bottom: 24px;
}

body.registration #signup-form .od-career-pill {
	display: inline-flex;
	align-items: center;
	padding: 0 15px !important;
	border: 1px solid #ccc !important;
	border-radius: 999px;
	background: #fff !important;
	color: var(--bb-body-text-color) !important;
	min-height: 44px;
	font-size: 0.95rem;
	line-height: 1.2;
	transition: all .2s ease;
}

body.registration #signup-form .od-career-pill:hover,
body.registration #signup-form .od-career-pill:focus {
	border-color: #00adef;
	background: #eef9ff;
	color: #462049;
}

body.registration #signup-form .od-career-pill.is-active {
	border-color: #462049 !important;
	background: #462049 !important;
	color: #fff !important;
}
