.path-local-pcl_course .pcl-course-header-banner,
.path-local-pcl_course .pcl-category-footer-banner {
    box-sizing: border-box;
    max-width: none;
    width: 100%;
}

@media (min-width: 992px) {
    .path-local-pcl_course .pcl-category-footer-banner {
        margin-left: 365px !important;
        width: calc(100% - 365px) !important;
        max-width: calc(100% - 365px) !important;
        padding-right: 2rem;
    }

    body.pcl-sidebar-collapsed .path-local-pcl_course .pcl-category-footer-banner {
        margin-left: var(--pcl-sidebar-collapsed-width) !important;
        width: calc(100% - var(--pcl-sidebar-collapsed-width)) !important;
        max-width: calc(100% - var(--pcl-sidebar-collapsed-width)) !important;
        padding-right: 1rem;
    }
}

@media (max-width: 991.98px) {
    .path-local-pcl_course .pcl-category-footer-banner {
        margin-left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

.pcl-course-header-banner {
    margin: 0.5rem auto 0;
    padding: 0 1rem;
    text-align: center;
}

.pcl-course-header-banner img,
.pcl-course-header-banner picture,
.pcl-course-header-banner .editor_atto_content img {
    border-radius: 24px;
    box-shadow: 0 18px 40px rgba(19, 48, 66, 0.12);
    display: block;
    height: auto;
    margin: 0 auto;
    max-height: 140px;
    max-width: min(560px, 100%);
    object-fit: contain;
    width: auto;
}

.pcl-course-header-banner > p,
.pcl-course-header-banner .editor_atto_content > p,
.pcl-course-header-banner .editor_atto_content,
.pcl-course-header-banner .editor {
    margin: 0;
}

.pcl-category-footer-banner {
    margin: 2rem auto 0;
    padding: 0 1rem 1.5rem;
}

.pcl-category-footer-banner-image {
    border-radius: 24px;
    display: block;
    height: auto;
    margin: 0 auto;
    max-width: 100%;
    width: 100%;
    box-shadow: 0 18px 40px rgba(19, 48, 66, 0.12);
}

body.pcl-category-custom-color #region-main {
    border-top: 4px solid var(--pcl-category-accent);
    border-radius: 18px;
}

body.pcl-category-custom-color .page-header-headings h1,
body.pcl-category-custom-color .page-context-header h1,
body.pcl-category-custom-color .breadcrumb a,
body.pcl-category-custom-color a:not(.btn):not(.nav-link):not(.dropdown-item) {
    color: var(--pcl-category-ink);
}

body.pcl-category-custom-color .btn-primary,
body.pcl-category-custom-color .btn.btn-primary,
body.pcl-category-custom-color input[type="submit"].btn-primary,
body.pcl-category-custom-color button.btn-primary {
    background-color: var(--pcl-category-accent);
    border-color: var(--pcl-category-accent);
}

/* Course card grid — T068 */
.pcl-card-row {
    margin: 0.75rem 0;
}

.pcl-card.card {
    text-align: center;
    transition: box-shadow 0.2s ease;
}

.pcl-card.card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18) !important;
}

.pcl-card-icon {
    display: block;
    margin: 0 auto;
    max-width: 96px;
    max-height: 96px;
    width: 96px;
    height: 96px;
    object-fit: contain;
}

/* VCCE virtue images — fill card width at 300px height to match production */
.pcl-card.card .pcl-card-icon.pcl-card-icon--vcce {
    max-width: 100%;
    max-height: none;
    width: 100%;
    height: 300px;
    object-fit: contain;
}

.pcl-card-title {
    font-size: 1rem;
    word-break: break-word;
}

.pcl-card-btn {
    display: block;
    margin-top: 0.5rem;
}

/* Course section headings — blue to match production style */
.path-course-view .course-section [data-for="section_title"],
.path-course-view .course-section [data-for="section_title"] a {
    color: #126081!important;
    text-decoration: none;
}

/* Remove the Moodle page-context-header (course title bar) — not present in production */
.path-course-view .page-context-header {
    display: none !important;
}

/* #page-header on course/view.php contains only an empty breadcrumb list —
   hide it to eliminate the 24px dead band between the navbar and secondary nav */
.path-course-view #page-header {
    display: none !important;
}

/* Remove Boost Union's .main-inner left padding — sidebar offset handles the gap already */
.path-course-view .main-inner {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Boost Union reserves left space for the course-index drawer even when hidden;
   zero it out — the PCL sidebar margin on #topofscroll already provides the offset */
.path-course-view #region-main {
    margin-left: 0 !important;
}

/* Activity actions: left of the activity title.
   .activity-name-area is d-flex flex-column by default; switching to row places
   the action wrapper immediately left of the .activitytitle column. */
.path-course-view .activity-name-area.pcl-has-share,
.path-course-view .activity-name-area.pcl-has-course-actions {
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap;
    gap: 0.5rem;
}

/* Action wrappers must sit above the activity stretched-link overlay */
.path-course-view .pcl-course-row-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
}

/* Top-of-page course edit action. */
.path-course-view .pcl-course-top-actions {
    margin-bottom: 1rem;
}

/* Keep the top course edit button compact and aligned with the row actions. */
.path-course-view .pcl-course-edit-course-top {
    align-items: center;
    display: inline-flex;
    gap: 0.45rem;
    min-height: 2.25rem;
    justify-content: center;
    padding: 0 0.9rem;
    position: relative;
    width: auto;
    z-index: 2;
}

.path-course-view .pcl-course-edit-course-top .fa {
    font-size: 1rem;
}

.path-course-view .pcl-course-edit-course-label {
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1;
}

/* Quiz edit button should read as a compact action, not a full-width pill. */
.path-course-view .pcl-quiz-edit-quiz {
    align-items: center;
    display: inline-flex;
    height: 2.25rem;
    justify-content: center;
    padding: 0;
    position: relative;
    width: 2.25rem;
    z-index: 2;
}

.path-course-view .pcl-quiz-edit-quiz .fa {
    font-size: 1rem;
}

/* Share button must sit above the activity stretched-link overlay */
.path-course-view .shareactivity {
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

body.pcl-category-custom-color .btn-primary:hover,
body.pcl-category-custom-color .btn.btn-primary:hover,
body.pcl-category-custom-color input[type="submit"].btn-primary:hover,
body.pcl-category-custom-color button.btn-primary:hover {
    background-color: var(--pcl-category-accent-dark);
    border-color: var(--pcl-category-accent-dark);
}