/* ============================================================
   TutorLMS course page header — custom layout
   Enqueued separately
   ============================================================ */


/* ----------------------------------------------------------
   Left column: text content
   ---------------------------------------------------------- */
.tutor-course-details-header {
   margin-bottom: 32px;
   row-gap: 32px;
}

.ioct-course-header-content {
	display: flex;
	flex-direction: column;
}

/* Category above title */
.ioct-course-category {
  font-family: var(--body-font-family);
  font-size: var(--body-size-base);
  font-weight: var(--body-font-weight-strong);
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
}

.ioct-course-category a {
	color: var(--link-text-default);
	text-decoration: none;
	text-transform: uppercase;
}

.ioct-course-category a:hover {
	color: var(--link-text-hover);
}

.tutor-course-details-title {
  font-family: var(--heading-font-family);
  font-size: var(--heading-size);
  font-weight: var(--heading-font-weight);
  line-height: var(--heading-line-height);
  letter-spacing: var(--heading-letter-spacing);
}

@media (min-width: 992px) {
    .tutor-course-details-title {
        max-width: 100%; 
    }
}

/* Author line */
.ioct-course-author a {
	text-decoration: none;
	color: inherit;
}

.ioct-course-author img {
	width: var(--icon-medium);
	height: var(--icon-medium);
	border-radius: 50%;
}

/* ----------------------------------------------------------
   Right column: media (actions + thumbnail)
   ---------------------------------------------------------- */
.ioct-course-header-media {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

.ioct-course-thumbnail {
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: var(--radius-default);
	overflow: hidden;
	flex-shrink: 0;
}

.ioct-course-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* ----------------------------------------------------------
   Enroll row: entry box + icon buttons side by side
   ---------------------------------------------------------- */
.ioct-header-enroll {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 8px;
}

.ioct-header-enroll .tutor-card {
    background: none;
	padding: 0;
}

.ioct-header-enroll .tutor-card .tutor-card-body {
	padding-top: 0;
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
}
.ioct-header-enroll .tutor-card .tutor-card-body > div:first-child {
	width: 100%;
}

/* Make sure the enroll button doesn't go full-width here */
.ioct-header-enroll .tutor-btn,
.ioct-header-enroll .tutor-course-enroll-wrap,
.ioct-header-enroll form {
	display: inline-block;
}

.ioct-header-enroll .tutor-btn.tutor-mt-24 {
    margin-top: 0;
}

/* Share + Wishlist icon buttons */
.ioct-course-media-actions {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
}

.ioct-course-media-actions .tutor-course-wishlist-btn,
.ioct-course-media-actions .tutor-course-share-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background-color: var(--button-neutral-background-color);
	color: var(--button-neutral-text-color);
	border: var(--button-neutral-border-stroke) solid var(--button-neutral-border-color);
	border-radius: var(--button-neutral-border-radius);
	cursor: pointer;
	text-decoration: none;
	transition: all 0.3s ease;
}

.ioct-course-media-actions .tutor-course-wishlist-btn:hover,
.ioct-course-media-actions .tutor-course-share-btn:hover {
	background-color: var(--button-neutral-background-color-hover);
	color: var(--button-neutral-text-color-hover);
	border-color: var(--button-neutral-border-color-hover);
}

/* Hide any text labels the share template outputs — icon only */
.ioct-course-media-actions .ioct-course-media-actions .tutor-btn-text {
	display: none;
}
.ioct-course-media-actions .tutor-course-share-btn {
	color: transparent;
	justify-content: flex-start;
}
.ioct-course-media-actions .tutor-course-share-btn:hover {
	color: transparent;
}
.ioct-course-media-actions .tutor-course-share-btn span {
	color: var(--button-neutral-text-color);
}
.ioct-course-media-actions .tutor-course-share-btn:hover span {
	color: var(--button-neutral-text-color-hover);
}

/* Info banner */

.ioct-header-enroll .tutor-card .tutor-card .tutor-card-footer {
	padding: 0;
}

.ioct-header-enroll .tutor-card .tutor-card-footer .tutor-ul {
	display: flex;
	flex-flow: row wrap;
	gap: 48px;
	border-radius: var(--card-radius, 0);
    background: var(--neutrals-100, #F4F4F5);
    padding: 24px;
	align-items: center;
}

.ioct-header-enroll .tutor-card .tutor-card-footer .tutor-ul .tutor-d-flex.tutor-mt-12 {
	margin-top: 0px;
}


.ioct-header-enroll .tutor-icon-level:before,
.ioct-header-enroll .tutor-icon-clock-line:before,
.ioct-header-enroll .tutor-icon-ribbon-o:before  {
	color: var(--icon-primary);
}

/* ============================================================
   TutorLMS course details 
   ============================================================ */
@media (min-width: 980px){
   .tutor-course-details-page.tutor-container {
		padding: 0 32px;
   }
}

.tutor-course-details-page .tutor-row main .tutor-course-thumbnail {
	/* display: none; */
}

.tutor-course-details-tab.tutor-mt-32 {
	margin-top: 0;
}
.tutor-course-details-tab .tutor-btn-show-more {
	width: fit-content;
}
.tutor-course-details-tab .tutor-btn-show-more.tutor-mt-32 {
    margin-top: 24px;
	margin-bottom: 8px;
}

.tutor-course-details-tab .tutor-accordion-item,
.tutor-course-details-tab .tutor-accordion-item .tutor-accordion-item-header {
	color: var(--text-on-light-primary);
    background-color: var(--neutrals-100, #F4F4F5);
    border-radius: var(--radius-default);
	border-width: 0px;	
}
.tutor-course-details-tab .tutor-accordion-item .tutor-accordion-item-header.is-active {
	border: var(--button-stroke-default) solid var(--border-on-light);
}


.tutor-course-details-tab .tutor-accordion-item .tutor-accordion-item-body .tutor-course-content-list-item:last-child {
    border-radius: var(--radius-default);
}

.tutor-course-details-tab .tutor-accordion-item .tutor-accordion-item-body .tutor-course-content-list-item:hover {
	background-color: var(--neutrals-100, #F4F4F5);
} 

/* Sidebar */
.tutor-single-course-sidebar .tutor-card.tutor-sidebar-card {
	/* display: none; */
}


.tutor-single-course-sidebar-more {
	display: flex;
	flex-direction: column;
}

.tutor-single-course-sidebar-more>div:first-child,
.tutor-single-course-sidebar-more>div,
.tutor-single-course-sidebar-more>div:last-child {
	border-radius: var(--radius-default);
	border-width: 0;
	background-color: var(--neutrals-100, #F4F4F5);
	padding: 24px;
	margin-bottom: 24px;
}

.tutor-single-course-sidebar-more>div:first-child {
	order: 2;
}
.tutor-single-course-sidebar-more>div:nth-child(2) {
	order: 3;
}
.tutor-single-course-sidebar-more>div:last-child {
	order: 1;
}

.tutor-single-course-sidebar-more .tutor-tag-list li a {
    border: var(--button-stroke-default) solid var(--border-on-light);
    color: var(--text-on-light-primary);
	background-color: transparent;
    border-radius: var(--radius-default);
    margin-left: 15px;
    padding: var(--button-padding-top);
	font-family: var(--body-font-family);
	font-size: var(--body-size-base);
	font-weight: var(--body-font-weight-strong);
	line-height: var(--body-line-height);
	letter-spacing: var(--body-letter-spacing);
    text-decoration: none;
    transition: all .2s;
    display: block;
}
.tutor-single-course-sidebar-more .tutor-tag-list li a:hover {
	color: var(--text-on-dark);
	background: var(--background-neutral-dark);
}