@charset "UTF-8";

/* ==========================================================================
   0. GLOBAL RESETS & VARIABLES
   ========================================================================== */
*, *::before, *::after {
    box-sizing: border-box;
}

html, body {
    overflow-x: hidden !important; /* Forces prevention of horizontal scrolling */
    max-width: 100%; /* Uses % instead of vw to accurately account for scrollbars */
}

#page {
    overflow-x: hidden !important; /* Critical: Clips Kadence rows before they break the right-side fixed header */
}

/* ==========================================================================
   1. GLOBAL PAGE SPACING & ELEMENT VISIBILITY OVERRIDES
   ========================================================================== */

/* Remove BuddyBoss Default Gaps on Course Pages */
body.single-sfwd-courses #content.site-content,
body.single-sfwd-courses #primary.content-area,
body.single-sfwd-courses .bb-grid.site-content-grid {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Neutralize the footprint of the LearnDash Login Modal wrapper causing the logged-out gap */
.learndash-wrapper-login-modal {
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
}

/* Zero out the Kadence rows to prevent block gap issues */
#page .content-area .kb-row-layout-wrap.alignfull {
    margin-top: 0;
    margin-bottom: 0;
}

body.page:not(.sfwd-courses):not(.sfwd-lessons):not(.sfwd-topic):not(.sfwd-quiz) .entry-header,
body.page:not(.sfwd-courses):not(.sfwd-lessons):not(.sfwd-topic):not(.sfwd-quiz) .bb-page-header,
body.page:not(.sfwd-courses):not(.sfwd-lessons):not(.sfwd-topic):not(.sfwd-quiz) .page-header,
body.single-post .entry-header,
body.single-post .bb-page-header,
body.single-post .page-header,
div #breadcrumbs {
    display: none;
}

/* Ensure LearnDash Login wrapper doesn't break grid */
.user_has_no_access {
    width: 100%;
    max-width: 100%;
}

/* ==========================================================================
   2. KADENCE BREAKOUT LAYOUT STRIPS
   ========================================================================== */
.kb-row-layout-wrap.alignfull,
.kb-row-layout-wrap.alignfull .kb-row-layout-wrap.alignfull {
    width: 100vw !important; /* Kept !important as breakout utilities require it to fight strict block containers */
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

.kb-row-layout-wrap.alignfull > .kt-row-column-wrap,
.kb-row-layout-wrap.alignfull .kb-row-layout-wrap.alignfull > .kt-row-column-wrap {
    max-width: 1290px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* ==========================================================================
   3. BUDDYBOSS CONTAINER DROPDOWNS & NAVIGATION ACCESSIBILITY
   ========================================================================== */

body:not(.logged-in) #site-navigation,
body:not(.logged-in) #primary-navbar,
body:not(.logged-in) .bb-primary-overflow {
    overflow: visible;
}

#header-aside .sub-menu-inner > li:first-child > a.user-link {
    background-color: var(--bb-primary-color);
    color: #ffffff;
}

#header-aside .sub-menu-inner > li:first-child > a.user-link .user-name,
#header-aside .sub-menu-inner > li:first-child > a.user-link .user-mention {
    color: #ffffff;
}

#header-aside .sub-menu-inner > li:first-child > a.user-link:hover {
    opacity: 0.9;
}

#header-aside .sub-menu-inner li a.ab-item,
#header-aside .sub-menu-inner li.logout-link a,
#header-aside .sub-menu-inner .ab-sub-wrapper .ab-submenu li a.ab-item {
    color: #333333;
    background-color: #ffffff;
    transition: all 0.2s ease-in-out;
}

#header-aside .sub-menu-inner li a.ab-item i,
#header-aside .sub-menu-inner li.logout-link a i {
    color: #888888;
}

#header-aside .sub-menu-inner li a.ab-item:hover,
#header-aside .sub-menu-inner li a.ab-item:focus,
#header-aside .sub-menu-inner li.menupop:hover > a.ab-item,
#header-aside .sub-menu-inner li.logout-link a:hover,
#header-aside .sub-menu-inner li.logout-link a:focus,
#header-aside .sub-menu-inner .ab-sub-wrapper .ab-submenu li a.ab-item:hover {
    background-color: var(--bb-primary-color);
    color: #ffffff;
}

#header-aside .sub-menu-inner li a.ab-item:hover i,
#header-aside .sub-menu-inner li.logout-link a:hover i {
    color: #ffffff;
}

.bb-template-v2 .buddypanel-menu > li > .bb-menu-item > i:not(.bb-icon-angle-down) { color: #ffffff; }

/* ==========================================================================
   4. FOXSY CORE CUSTOM LEARNDASH GRID CARDS
   ========================================================================== */
.foxsy-grid-card {
    background: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 100%;
}

.foxsy-grid-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.foxsy-card-thumbnail {
    display: block; /* Required for the <a> tag */
    width: 100%;
    padding-bottom: 0 !important;
    aspect-ratio: 16 / 9; /* Perfect 1920x1080 resolution */
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
}

.foxsy-card-thumbnail img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.3s ease;
}

.foxsy-grid-card:hover .foxsy-card-thumbnail img { transform: scale(1.05); }

.foxsy-card-content {
    padding: 16px 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.foxsy-card-reviews {
    display: flex;
    align-items: center;
    gap: 8px;
    order: -10;
    margin-bottom: 4px;
}

.foxsy-rating-stars {
    display: flex;
    gap: 2px;
    color: #ffa500;
    font-size: 16px;
    letter-spacing: 1px;
}

.foxsy-rating-stars .star.filled { color: #ffa500; }
.foxsy-rating-stars .star.half { color: #ffa500; opacity: 0.5; }
.foxsy-rating-stars .star.empty { color: #d0d0d0; }
.foxsy-rating-text { font-size: 13px; color: #999; font-weight: 500; }

.foxsy-card-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
    color: #1a1a1a;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 47px;
    order: -9;
}

.foxsy-card-title a { color: inherit; text-decoration: none; }
.foxsy-card-title a:hover { color: #027373; }

.foxsy-card-byline {
    font-size: 13px;
    color: #999;
    margin: 0;
    line-height: 1.4;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    order: -8;
}

.foxsy-instructor-link { color: #027373; text-decoration: none; font-weight: 500; transition: color 0.2s ease; }
.foxsy-instructor-link:hover { color: #015555; text-decoration: underline; }

.foxsy-card-description {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
    margin: 0;
    padding: 0;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
    order: -7;
    min-height: 72px;
}

.foxsy-access-badge-wrapper { margin-top: auto; padding-top: 12px; order: -6; }

.foxsy-access-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #027373 0%, #8faa7e 100%);
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    border: none;
}

.foxsy-badge-text { color: #ffffff; }

.foxsy-access-badge:hover {
    background: linear-gradient(135deg, #015555 0%, #7a9369 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(2, 115, 115, 0.3);
}

.foxsy-logo { height: 16px; width: auto; }

.foxsy-grid-card .foxsy-card-footer {
    padding: 16px 20px 24px 20px !important;
    margin-top: auto;
    flex-shrink: 0 !important;
    min-height: max-content !important;
}

.foxsy-cta-button {
    display: block;
    width: 100%;
    padding: 12px 20px;
    text-align: center;
    text-decoration: none;
    font-weight: 700;
    font-size: 16px;
    border-radius: 6px;
    transition: all 0.3s ease;
    cursor: pointer;
    box-sizing: border-box !important;
}

.foxsy-grid-card .foxsy-cta-button.foxsy-view-class {
    margin-bottom: 8px !important;
    background: transparent;
    color: #027373;
    border: 2px solid #027373 !important;
}

.foxsy-cta-button.foxsy-view-class:hover {
    background: #027373;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(2, 115, 115, 0.3);
}

.foxsy-grid-card .foxsy-cta-button.foxsy-get-pass {
    background-color: #6220a8 !important;
    border: 2px solid #6220a8 !important;
    color: #ffffff !important;
    margin-bottom: 8px !important;
}

.foxsy-grid-card .foxsy-cta-button.foxsy-get-pass:hover {
    background-color: #027373 !important;
    border-color: #027373 !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(2, 115, 115, 0.3);
}

.learndash-course-grid .load-more-button,
.learndash-course-grid button.load-more {
    background-color: #027373;
    color: #ffffff;
    border: none;
    font-weight: 700;
    padding: 12px 32px;
    border-radius: 6px;
}

.learndash-course-grid .load-more-button:hover,
.learndash-course-grid button.load-more:hover {
    background-color: #015555;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(2, 115, 115, 0.3);
}

/* ==========================================================================
   5. SAMCART BILLING ACCOUNTS INTERFACE
   ========================================================================== */
.foxsy-billing-dashboard { width: 100%; margin-top: 10px; }
.foxsy-billing-section { margin-bottom: 40px; }

.foxsy-billing-section h3 {
    border-bottom: 2px solid var(--bb-content-border-color, #e7e9ec);
    padding-bottom: 10px;
    margin-bottom: 20px;
    color: var(--bb-body-text-color);
}

.foxsy-billing-card {
    border: 1px solid var(--bb-content-border-color, #e7e9ec);
    border-radius: 8px;
    padding: 20px;
    background: var(--bb-content-background-color, #fff);
    margin-bottom: 15px;
}

.foxsy-billing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}

.foxsy-billing-label {
    font-size: 0.85em;
    color: var(--bb-body-text-color, #666);
    opacity: 0.8;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.foxsy-billing-value {
    font-size: 1.1em;
    font-weight: 600;
    color: var(--bb-body-text-color, #333);
}

.foxsy-cancel-btn {
    color: #d9534f;
    border: 1px solid #d9534f;
    background: transparent;
    transition: 0.2s all ease-in-out;
    cursor: pointer;
    padding: 8px 16px;
    border-radius: 4px;
}

.foxsy-cancel-btn:hover { background: #d9534f; color: #ffffff; }

.foxsy-table { width: 100%; border-collapse: collapse; margin-top: 10px; color: var(--bb-body-text-color); }
.foxsy-table th, .foxsy-table td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid var(--bb-content-border-color, #e7e9ec);
}
.foxsy-table th { background: var(--bb-body-background-color, #f8f9fa); font-weight: 600; font-size: 0.9em; }

.foxsy-action-bar {
    margin-top: 15px;
    border-top: 1px solid var(--bb-content-border-color, #e7e9ec);
    padding-top: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.foxsy-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    z-index: 9998;
    display: none;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(3px);
}

.foxsy-modal-content {
    background: var(--bb-content-background-color, #ffffff);
    padding: 40px;
    border-radius: 12px;
    max-width: 500px;
    width: 90%;
    z-index: 9999;
    position: relative;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    text-align: center;
}

.foxsy-modal-close {
    position: absolute;
    top: 15px;
    right: 15px;
    cursor: pointer;
    background: none;
    border: none;
    font-size: 1.5em;
    color: var(--bb-body-text-color);
    opacity: 0.6;
}
.foxsy-modal-close:hover { opacity: 1; }

.foxsy-modal-content h3 {
    margin-top: 0;
    color: var(--bb-primary-color, #204ce5);
    font-size: 1.6em;
    margin-bottom: 15px;
}

.foxsy-offer-text { font-size: 1.1em; line-height: 1.5; margin-bottom: 25px; }
.foxsy-btn-stack { display: flex; flex-direction: column; gap: 15px; align-items: center; }

.foxsy-link-btn {
    background: none;
    border: none;
    color: var(--bb-body-text-color);
    opacity: 0.8;
    text-decoration: underline;
    cursor: pointer;
    font-size: 0.95em;
    padding: 0;
}
.foxsy-link-btn:hover { opacity: 1; }

/* ==========================================================================
   6. INTERACTIVE ASSIGNMENT FEEDBACK INTERFACES
   ========================================================================== */
.foxsy-assignment-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
.foxsy-assignment-card {
    border: 1px solid var(--bb-content-border-color, #e7e9ec);
    border-radius: 8px;
    padding: 24px;
    background: var(--bb-content-background-color, #fff);
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}

.foxsy-assignment-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--bb-content-border-color, #e7e9ec);
    padding-bottom: 15px;
    margin-bottom: 15px;
}
.foxsy-assignment-title { margin: 0; font-size: 1.2em; font-weight: bold; color: var(--bb-headings-color); }

.foxsy-status-badge { padding: 4px 10px; border-radius: 20px; font-size: 0.85em; font-weight: 600; }
.foxsy-status-badge.status-approved { background: #d4edda; color: #155724; }
.foxsy-status-badge.status-pending { background: #fff3cd; color: #856404; }

.foxsy-assignment-meta { font-size: 0.9em; color: var(--bb-body-text-color, #666); opacity: 0.9; margin-bottom: 15px; }

.foxsy-feedback-area {
    background: var(--bb-body-background-color, #f8f9fa);
    padding: 20px;
    border-radius: 6px;
    margin-top: 20px;
}

.foxsy-comment { margin-bottom: 15px; padding: 15px; border-radius: 6px; }
.foxsy-comment:last-of-type { margin-bottom: 0; }
.foxsy-comment-instructor { background: #eef2ff; border-left: 4px solid var(--bb-primary-color, #204ce5); }
.foxsy-comment-student {
    background: var(--bb-content-background-color, #ffffff);
    border: 1px solid var(--bb-content-border-color, #e7e9ec);
    border-left: 4px solid #a0aec0;
}

.foxsy-comment-meta { font-size: 0.85em; color: #555; margin-bottom: 5px; }
.foxsy-reply-form {
    margin-top: 20px;
    border-top: 1px dashed var(--bb-content-border-color, #cbd5e0);
    padding-top: 20px;
}
.foxsy-reply-textarea {
    width: 100%;
    padding: 12px;
    margin-bottom: 10px;
    border: 1px solid var(--bb-content-border-color, #cbd5e0);
    border-radius: 4px;
    font-family: inherit;
    resize: vertical;
}

/* ==========================================================================
   7. LEARNDASH UI BUTTON NORMALIZATIONS & GRAVITY FORMS
   ========================================================================== */
.pagination .load-more {
    background-color: var(--bs-button-primary-bg, #007bff);
    color: #ffffff;
    border: none;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.pagination .load-more:hover {
    background-color: var(--bs-button-primary-hover, #0056b3);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 86, 179, 0.2);
}
.pagination .load-more:disabled, .pagination .load-more.loading { opacity: 0.6; cursor: not-allowed; }

.hide-required-indicator .gfield_required { display: none; }
.bold-radio-labels-14px .gfield_radio li label { font-weight: bold; font-size: 14px; }

/* ==========================================================================
   8. FORUMS ARCHIVE LANDSCAPE BANNER & WCA COHORT SHORTCODES
   ========================================================================== */
.kb-image-forums-hero { margin-bottom: 2rem; margin-top: 0; width: 100%; }
.kb-image-forums-hero img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 15px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}
.foxsy-wca-tracker img { display: block; margin: 0 auto; height: auto; }
.foxsy-wca-fullview img { width: 75%; }
.foxsy-wca-progressview img { width: 235px; height: 60px; margin-bottom: 10px; }

/* ==========================================================================
   9. ACF TEXT ENGINE DESIGN & COURSE HEADER ADJUSTMENTS
   ========================================================================== */

#page .foxsy-section-heading,
#page .foxsy-projects-heading,
#page #learndash_course_content_title,
#page .bb-about-instructor .bb-instructor-heading {
    font-size: 26px;
    line-height: 26px;
    margin: 0 0 20px 0;
    font-weight: 700;
    color: var(--bb-headings-color) !important;
    text-transform: none;
}

#page .foxsy-sidebar-box h4,
#page .bb-single-course-sidebar h4,
#page #course-reviews-section h3 {
    color: var(--bb-headings-color) !important;
}

#page .bb-ld-tabs .ld-tabs-navigation .ld-tab.ld-active,
#page .bb-ld-tabs .ld-tabs-navigation .ld-tab.ld-active span,
#page .bb-ld-tabs .ld-tabs-navigation .ld-tab.ld-active .ld-icon,
#page .bb-ld-tabs .ld-tabs-navigation .ld-tab:hover,
#page .bb-ld-tabs .ld-tabs-navigation .ld-tab:hover span,
#page .bb-ld-tabs .ld-tabs-navigation .ld-tab:hover .ld-icon {
    color: var(--bb-headings-color) !important;
    border-bottom-color: var(--bb-headings-color) !important;
}

.foxsy-checkmark, .foxsy-checkmark svg, .foxsy-checkmark svg path { color: #027373; fill: #027373; }
.foxsy-class-projects-section { margin: 0 0 40px 0; padding: 0; background: transparent; }
.foxsy-projects-intro { font-size: 16px; line-height: 1.6; margin: 0 0 25px 0; }

.foxsy-projects-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    padding: 0;
    margin: 0;
}

.project-image-wrap { position: relative; overflow: hidden; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
.project-image-wrap img { width: 100%; height: auto; display: block; border-radius: 8px; transition: transform 0.3s ease; }

.foxsy-custom-course-content .kt-svg-icon-list li { transition: transform 0.2s ease; }
.foxsy-custom-course-content .kt-svg-icon-list li:hover { transform: translateX(5px); }
.foxsy-projects-gallery .project-image-wrap:hover img { transform: scale(1.05); }
.foxsy-lightbox-trigger { cursor: zoom-in; }

/* ==========================================================================
   10. RESTRUCTURED CLASS DIRECTORY LESSON LOOPS
   ========================================================================== */
#page #lesson_heading { display: none; }
#learndash_lessons { background: transparent; padding: 0; border: none; }
#lessons_list { display: flex; flex-direction: column; gap: 12px; }

#lessons_list > div {
    background: #ffffff;
    border: 2px solid #E0E0E0;
    border-radius: 8px;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

#lessons_list > div:hover {
    border-color: #027373;
    box-shadow: 0 4px 12px rgba(2, 115, 115, 0.15);
    transform: translateX(5px);
}

#lessons_list .list-count {
    background: #027373;
    color: #ffffff;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
}

#lessons_list h4 { margin: 0; flex-grow: 1; font-size: 16px; font-weight: 600; }
#lessons_list h4 a { color: #333333; text-decoration: none; }
#lessons_list h4 a:hover { color: #027373; }
#lessons_list h4 a.completed::after { content: "✓"; display: inline-block; margin-left: 10px; color: #4CAF50; font-weight: bold; }
#lessons_list h4 a.notcompleted::after {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid #DDDDDD;
    border-radius: 50%;
    margin-left: 10px;
    vertical-align: middle;
}

/* ==========================================================================
   11. TIPPY TOOLTIPS CUSTOM THEMING
   ========================================================================== */
.tippy-box[data-theme~='foxsy'] {
    background-color: #ffffff;
    color: #000000;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    border: 2px solid #f2916d;
    max-width: 280px;
}
.tippy-box[data-theme~='foxsy'] .tippy-content { padding: 0; }
.tippy-box[data-theme~='foxsy'][data-placement^='top'] > .tippy-arrow::before { border-top-color: #f2916d; }
.tippy-box[data-theme~='foxsy'][data-placement^='bottom'] > .tippy-arrow::before { border-bottom-color: #f2916d; }
.tippy-box[data-theme~='foxsy'][data-placement^='left'] > .tippy-arrow::before { border-left-color: #f2916d; }
.tippy-box[data-theme~='foxsy'][data-placement^='right'] > .tippy-arrow::before { border-right-color: #f2916d; }
.tippy-box[data-theme~='foxsy'] .tippy-arrow { width: 16px; height: 16px; }

/* ==========================================================================
   12. RESPONSIVE MEDIA CONTROLS & MISC FIXES
   ========================================================================== */
@media (max-width: 768px) {
    .foxsy-custom-course-content .wp-block-columns { flex-direction: column; }
    .foxsy-projects-gallery { grid-template-columns: repeat(2, 1fr); }
    .kb-image-forums-hero img { border-radius: 12px; }
}
@media (max-width: 480px) {
    .foxsy-projects-gallery { grid-template-columns: 1fr; }
    .kb-image-forums-hero img { border-radius: 8px; }
}

#page #course-reviews-section {
    background-color: #ffffff !important;
    padding: 30px;
    border-radius: 8px;
    border: 1px solid #8C8BFF; 
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
    margin-top: 30px;
}

/* Membership pitch printed under the reviews for non-members (functions.php, 27b) */
#page .foxsy-course-membership-pitch {
    margin-top: 30px;
}

#page .bb-single-course-sidebar .foxsy-sidebar-box a.foxsy-btn-outline {
    background: transparent !important;
    color: #027373 !important;
    border: 2px solid #027373 !important;
}

#page .bb-single-course-sidebar .foxsy-sidebar-box a.foxsy-btn-outline:hover {
    background: #027373 !important;
    color: #ffffff !important;
}

.bb-assignment-response textarea,
.activity-update-form textarea,
#bp-message-content,
.foxsy-reply-textarea {
    resize: vertical;
    overflow-y: auto;
    min-height: 100px;
}

#page #bbpress-forums ul.bbp-replies li.bbp-body div.hentry:hover,
#page .activity-list li.activity-item:hover,
#page .activity-list li.comment-item:hover {
    background-color: #f8f9fa; 
    transition: background-color 0.2s ease;
}

/* ==========================================================================
   13. BUDDYBOSS PROFILE & PAGE SPACING FIXES
   ========================================================================== */

body.buddypress #content.site-content {
    padding-top: 40px !important; 
}

#page .bp-profile-content table.profile-fields {
    margin-top: 10px !important; 
    width: 100%;
}

#page .bp-profile-content table.profile-fields tr td.label,
#page .bp-profile-content table.profile-fields tr td.data {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    vertical-align: middle !important;
}

#page .bp-profile-content table.profile-fields tr td.label {
    width: 25%;
    color: var(--bb-headings-color);
    font-weight: 600;
}

/* ==========================================================================
   14. LIVE CLASS SCHEDULE FILTERS & LOGGED-OUT GRID ENFORCEMENT
   ========================================================================== */

.foxsy-category-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 15px; /* Increased gap spacing */
    margin-bottom: 50px; /* Increased bottom spacing */
    justify-content: flex-start; /* Force left alignment */
}

.foxsy-filter-btn {
    background-color: var(--bb-body-background-color, #f8f9fa);
    color: var(--bb-body-text-color, #333333);
    border: 1px solid var(--bb-content-border-color, #e7e9ec);
    padding: 10px 22px; /* Bigger buttons */
    border-radius: 8px; /* Slightly rounder to match the larger size */
    font-size: 16px; /* Bigger text */
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.foxsy-filter-btn:hover,
.foxsy-filter-btn.active {
    background-color: #3a2a90; /* Updated purple color */
    color: #ffffff;
    border-color: #3a2a90;
    box-shadow: 0 4px 12px rgba(58, 42, 144, 0.2);
}

/* Bigger headers with extra spacing and forced left alignment */
.foxsy-live-schedule-wrapper h2.foxsy-section-heading {
    font-size: 32px !important;
    margin-bottom: 40px !important;
    text-align: left !important;
}

/* ==========================================================================
   FORCE GRID STABILITY FOR LOGGED OUT USERS
   ========================================================================== */
div#foxsy-upcoming-grid,
div#foxsy-past-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 30px !important;
    width: 100% !important;
    align-items: stretch !important;
}

/* Ensures the individual cards don't blow out the grid constraints */
.foxsy-live-card-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    display: flex;
    flex-direction: column;
}

/* Keep the single column layout on mobile */
@media (max-width: 768px) {
    div#foxsy-upcoming-grid,
    div#foxsy-past-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ==========================================================================
   FORCE ALIGNMENT FOR CARD CONTENT
   ========================================================================== */
.foxsy-grid-card .foxsy-card-content {
    text-align: left !important;
    align-items: stretch !important; /* Changed this so the green bar stays full width */
}

.foxsy-grid-card .foxsy-card-title,
.foxsy-grid-card .foxsy-card-byline,
.foxsy-grid-card .foxsy-card-description,
.foxsy-access-badge-wrapper {
    text-align: left !important;
}

/* Ensure the live date banner and button text stay centered */
.foxsy-grid-card .foxsy-card-live-date,
.foxsy-grid-card .foxsy-cta-button {
    text-align: center !important;
}

/* ==========================================================================
   15. AUGUST 2026 BUG FIX PACK
   ========================================================================== */

/* --- Kadence responsive-visibility fallback ("funky strip" hardening) ---
   Kadence hides desktop/mobile row variants with per-row generated CSS. When a
   page's generated CSS is stale or an optimizer strips it, the mobile-only rows
   (background-image strips) render on desktop as a thin "funky strip". These
   class-based fallbacks mirror Kadence's own breakpoints so those rows always
   stay hidden even if the generated rules go missing. */
@media (min-width: 1025px) {
    .kb-v-lg-hidden { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .kb-v-md-hidden { display: none !important; }
}
@media (max-width: 767px) {
    .kb-v-sm-hidden { display: none !important; }
}

/* --- Responsive wrapper for class videos moved into lesson pages --- */
.foxsy-replay-embed {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    border-radius: 8px;
    overflow: hidden;
    background: #000;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.foxsy-replay-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Single page classes (Uncanny Single Page Courses) that have not been through
   the video recovery tool yet: their only "lesson" is the hidden placeholder,
   which the theme filters out of the list because clicking it bounces. With
   nothing left to show, hide the empty Class Content panel rather than render a
   bare heading above nothing. After recovery the lesson is a real step and this
   class no longer applies. */
body.foxsy-no-lesson-list #learndash_course_content,
body.foxsy-no-lesson-list #learndash_course_content_title,
body.foxsy-no-lesson-list #learndash_lessons {
    display: none;
}
/* ==========================================================================
   16. SEPTEMBER 2026 FIXES — LIVE SCHEDULE FILTER
   ========================================================================== */

/* Filtered-out cards. A class (not an inline style) so it beats the
   display:flex on .foxsy-live-card-wrapper and survives optimizers. */
.foxsy-live-card-wrapper.foxsy-is-hidden { display: none !important; }

/* Spacing between the upcoming and replay sections (was inline styles) */
.foxsy-live-section + .foxsy-live-section { margin-top: 60px; }

/* "No classes in this category" message shown when a filter empties a grid */
.foxsy-live-schedule-wrapper .foxsy-filter-empty { margin: 0; color: #666; }
.foxsy-live-schedule-wrapper .foxsy-filter-empty[hidden] { display: none; }


/* ------------------------------------------------------------------
   Skip link (audit 2026-09, finding 21)
   Visible only when focused, so keyboard users can jump past the header
   and BuddyPanel without tabbing through the whole navigation.
   ------------------------------------------------------------------ */
.foxsy-skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 100000;
    padding: 12px 20px;
    background: #027373;
    color: #ffffff;
    font-weight: 600;
    text-decoration: none;
    border-radius: 0 0 6px 0;
}

.foxsy-skip-link:focus {
    left: 0;
    outline: 3px solid #FF7A59;
    outline-offset: 2px;
}

/* ==========================================================================
   17. OCTOBER 2026 — PHONE & TABLET FIXES
   ========================================================================== */

/* LearnDash Course Grid blocks print their column count inline at every width
   (#ld-cg-… .grid { grid-template-columns: repeat(3, …) }), so on phones the class
   cards were squeezed three across: titles cut to "Water Basi…", descriptions one
   word per line, buttons clipped. One card per row on phones, two on tablets. */
@media (max-width: 599px) {
    .learndash-course-grid .items-wrapper.grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}
@media (min-width: 600px) and (max-width: 900px) {
    .learndash-course-grid .items-wrapper.grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Section 9 gives these headings a fixed 26px line height; the live schedule sets
   them to 32px, so "Upcoming Live Classes" overlapped itself when it wrapped on a phone. */
#page .foxsy-section-heading {
    line-height: 1.15;
}

/* The class-pass button on the class page is nowrap (inline style in the sidebar
   template); on 360px phones "Lifetime Access With A Class Pass | $10.00" was clipped. */
@media (max-width: 420px) {
    .foxsy-btn.foxsy-btn-outline {
        white-space: normal !important;
    }
}

/* LearnDash's ld30 stylesheet removes the bottom border from every link inside a
   .learndash-wrapper (five-class selector, !important), which includes the class
   cards' outlined "View Class" button, so its bottom edge was missing. */
#page .foxsy-grid-card a.foxsy-cta-button.foxsy-view-class {
    border-bottom: 2px solid #027373 !important;
}

/* Profile tabs on phones: BuddyBoss floats them, and the selected tab is 1px shorter,
   so the next tab snagged under it ("Forums" alone on its own row on the Billing tab). */
@media (max-width: 767px) {
    #object-nav.bp-navs > ul {
        display: flex;
        flex-wrap: wrap;
    }
    #object-nav.bp-navs > ul > li {
        float: none;
    }
}

/* Beige stripe between the header and pages that open with a full-width section
   (home hero, Membership banner, Academies...). The Customizer's Additional CSS pads
   pages 100px for the 80px fixed header, and BuddyBoss adds 30px above the content,
   leaving 50px of page background showing. On those pages only, pad exactly the
   header height and drop the extra 30px. Browsers without :has() keep the stripe. */
body.page:not(.single-sfwd-courses) #content.site-content:has(.entry-content > .kb-row-layout-wrap.alignfull:first-child) {
    padding-top: var(--bb-header-height, 80px) !important;
}
body.page #primary.content-area:has(.entry-content > .kb-row-layout-wrap.alignfull:first-child) {
    padding-top: 0 !important;
}

/* ==========================================================================
   18. OCTOBER 2026 — COURSE LISTINGS BRANDING & FULL-WIDTH ROWS
   ========================================================================== */

/* Full-width Kadence rows (section 2) break out to 100vw, but BuddyBoss pushes the
   whole page right by the BuddyPanel (230px open, 68px collapsed, from 800px up).
   The rows ended up wider than the visible page, so multi-column rows were cut off
   under the panel and past the right edge. Subtract the panel width; the row stays
   centred on the page because the content column is centred there too. */
body { --foxsy-panel-w: 0px; }
@media (min-width: 800px) {
    body.bb-buddypanel { --foxsy-panel-w: 68px; }
    body.bb-buddypanel.buddypanel-open:not(.register) { --foxsy-panel-w: 230px; }
    body.bb-buddypanel.buddypanel-open.activate,
    body.bb-buddypanel.buddypanel-open.in-bbapp,
    body.bb-buddypanel.activate,
    body.bb-buddypanel.in-bbapp,
    body.bb-buddypanel.bb-sfwd-aside:not(.buddypanel-open) { --foxsy-panel-w: 0px; }
}
.kb-row-layout-wrap.alignfull,
.kb-row-layout-wrap.alignfull .kb-row-layout-wrap.alignfull {
    width: calc(100vw - var(--foxsy-panel-w, 0px)) !important;
    margin-left: calc(var(--foxsy-panel-w, 0px) / 2 - 50vw);
    margin-right: calc(var(--foxsy-panel-w, 0px) / 2 - 50vw);
}

/* Course grid icons (category, length, format...). LearnDash Course Grid prints the
   block's icon colour (#f2916d) inline per grid, so override it with the brand pink. */
#page .learndash-course-grid .grid > .item .icon {
    background-color: #dc5f88 !important;
}

/* "Load More" under the course grids. Course Grid's own pagination/style.css loads
   after this file and wins over the older .load-more rules in section 4. */
#page .learndash-course-grid .pagination .load-more {
    background-color: #3a2a90 !important;
    border-color: #3a2a90 !important;
    color: #ffffff !important;
}
#page .learndash-course-grid .pagination .load-more:hover,
#page .learndash-course-grid .pagination .load-more:focus {
    background-color: #2a1e6b !important;
    border-color: #2a1e6b !important;
}

/* The "Explore..." headings and the borders round the category images use Kadence
   palette colour 1, which was never set on this site (Kadence's default blue).
   Point it at the brand purple on this page only. */
body.page-id-5742 {
    --global-palette1: #6220a8;
}

/* "Get Real Support" info boxes at the bottom (synced pattern 18091) were capped at
   640px wide, squeezing five boxes into ~115px each. Let them use the full row. */
#page .kb-row-layout-id18091_5ebb4b-66 > .kt-row-column-wrap {
    max-width: 100%;
}

/* Below 1025px Kadence stacks the five boxes full width and switches them to
   icon-left. On tablets and narrow laptops, wrap them 2-3 per row instead and keep
   the desktop icon-on-top look. The extra row gap clears the icon that overlaps
   each box's top border. Phones (under 600px) keep Kadence's stacked layout. */
@media (min-width: 600px) and (max-width: 1024px) {
    #page .kb-row-layout-id18091_5ebb4b-66 > .kt-row-column-wrap {
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        row-gap: 64px;
    }
    #page .kb-row-layout-id18091_5ebb4b-66 .kt-blocks-info-box-link-wrap {
        display: block;
        text-align: center;
    }
    #page .kb-row-layout-id18091_5ebb4b-66 .kt-blocks-info-box-media-container,
    #page .kb-row-layout-id18091_5ebb4b-66 .kt-infobox-textcontent {
        text-align: center;
    }
    #page .kb-row-layout-id18091_5ebb4b-66 .kt-blocks-info-box-media {
        display: inline-block;
    }
}