/*
Theme Name: EduBlink Child
Theme URI: https://edublink.co/
Template: edublink
Author: DevsBlink
Author URI: https://themeforest.net/user/devsblink/portfolio
Description: EduBlink Theme For LMS and Education Purpose.
Tags: custom-background,custom-logo,custom-menu,featured-images,threaded-comments,translation-ready
Version: 2.0.5.1763038654
Updated: 2025-11-13 12:57:33

*/

/* ============================================
   CSS RESET & FOUNDATION
   ============================================ */

*, *::before, *::after {
    box-sizing: border-box;
}

html {
    -moz-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
}

img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
}

input, button, textarea, select {
    font: inherit;
}

/* Accessibility: Respect user motion preferences */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ============================================
   CSS CUSTOM PROPERTIES (VARIABLES)
   ============================================ */

:root {
    /* Primary Colors */
    --color-primary: #fc6720;
    --color-primary-light: #ff8a4c;
    --color-primary-lighter: #ffb088;
    --color-primary-bg: #fff5f0;
    --color-primary-border: #ffe0d1;
    --color-primary-border-dark: #ffd0c2;

    /* Secondary Colors */
    --color-secondary: #04324d;
    --color-secondary-dark: #0b1a3d;
    --color-dark-blue: #023047;

    /* Neutrals */
    --color-text-primary: #1d1d1d;
    --color-text-secondary: #444;
    --color-text-muted: #666;
    --color-text-light: #555;
    --color-gray-500: #6b7280;
    --color-gray-400: #9ca3af;
    --color-gray-300: #d2d2d2;
    --color-border: #e5e7eb;
    --color-border-light: #f3f4f6;
    --color-border-input: #e0e0e0;
    --color-bg-light: #f8f9fa;
    --color-bg-input: #fafafa;
    --color-white: #ffffff;

    /* Status Colors */
    --color-success: #16a34a;
    --color-info: #2563eb;
    --color-warning: #ea580c;
    --color-error: #dc2626;

    /* Spacing Scale (8px base) */
    --space-1: 0.25rem;   /* 4px */
    --space-2: 0.5rem;    /* 8px */
    --space-3: 0.75rem;   /* 12px */
    --space-4: 1rem;      /* 16px */
    --space-5: 1.25rem;   /* 20px */
    --space-6: 1.5rem;    /* 24px */
    --space-7: 1.75rem;   /* 28px */
    --space-8: 2rem;      /* 32px */
    --space-10: 2.5rem;   /* 40px */
    --space-12: 3rem;     /* 48px */
    --space-15: 3.75rem;  /* 60px */

    /* Typography Scale (rem) */
    --text-xs: 0.875rem;   /* 14px */
    --text-sm: 0.875rem;   /* 14px */
    --text-base: 1rem;     /* 16px */
    --text-lg: 1.125rem;   /* 18px */
    --text-xl: 1.5rem;     /* 24px */
    --text-2xl: 1.75rem;   /* 28px */
    --text-3xl: 2.25rem;   /* 36px */
    --text-4xl: 2.75rem;   /* 44px */
    --text-5xl: 3.25rem;   /* 52px */
    --text-6xl: 3.5rem;    /* 56px */

    /* Z-index Scale */
    --z-base: 1;
    --z-dropdown: 10;
    --z-sticky: 20;
    --z-overlay: 30;
    --z-modal: 40;
    --z-toast: 50;
    --z-fixed-nav: 9999;

    /* Border Radius Scale */
    --radius-sm: 0.5rem;      /* 8px */
    --radius-md: 0.75rem;     /* 12px */
    --radius-lg: 1rem;        /* 16px */
    --radius-xl: 1.25rem;     /* 20px */
    --radius-full: 50px;      /* pills/badges */

    /* Component Variables */
    --input-height: 2.75rem;
    --input-padding: 0.75rem 1rem;
    --input-font: var(--text-sm);
    --input-radius: 0.625rem;
    --btn-height: 2.875rem;
    --btn-radius: var(--radius-md);
    --card-radius: var(--radius-lg);
    --card-radius-lg: var(--radius-xl);
    --card-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);

    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-base: 0.25s ease;
    --transition-slow: 0.4s ease-in-out;
}

/* Journey Section - Course Details (merged) */
.learning-journey-section {
    position: relative;
    padding: 40px 20px;
    padding-top: 12px; /* reduced top gap 2026-06-23 */
    padding-left: 20px;
    margin-top: 0;
}

.learning-journey-section h2 {
    font-size: 33px;
    font-weight: 600;
    color: var(--color-secondary);
    margin-bottom: 10px;
    padding-left: 0;
}

.learning-journey-section .subtitle {
    color: var(--color-text-muted);
    margin-bottom: 30px;
    font-size: 16px;
}

.phase {
    display: flex;
    gap: 30px;
    margin-bottom: 30px;
    position: relative;
}

.phase-icon {
    width: 20px;
    height: 20px;
    background: var(--color-primary);
    border-radius: 50%;
    margin-top: 5px;
}

.phase-line {
    width: 3px;
    background: var(--color-primary);
    position: absolute;
    left: 7px;
    top: 30px;
    bottom: -20px;
}

.phase-box {
    background: var(--color-primary-bg);
    border: 1px solid var(--color-primary-border);
    padding: 20px 25px;
    border-radius: var(--radius-md);
    flex: 1;
}

.phase-box h3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--color-primary);
    margin: 0 0 10px 0;
    font-size: 18px;
    font-weight: 700;
}

.phase-box h3 .duration {
    font-size: 14px;
    background: var(--color-white);
    border: 1px solid var(--color-primary-border-dark);
    padding: 3px 12px;
    border-radius: var(--radius-xl);
    color: var(--color-text-light);
}

.phase-box p {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: 16px;
    line-height: 1.7;
}
.lj-subtitle {
    font-size: 16px;
    color: var(--color-text-muted);
    margin-bottom: 25px;
    line-height: 1.6;
}

/* Header navbar: keep the desktop "Popular" course links on a single row. */
@media (min-width: 1025px) {
    .elementor-1166 .elementor-element.elementor-element-472d33c {
        align-items: center;
        flex-wrap: nowrap;
        gap: 14px;
    }

    .elementor-1166 .elementor-element.elementor-element-2c90662 {
        width: auto;
        max-width: none;
        min-width: 0;
        flex: 1 1 auto;
    }

    .elementor-1166 .elementor-element.elementor-element-2c90662 .elementor-nav-menu--main .elementor-nav-menu {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 2px;
    }

    .elementor-1166 .elementor-element.elementor-element-2c90662 .elementor-nav-menu--main .elementor-nav-menu > li {
        flex: 0 0 auto;
    }

    .elementor-1166 .elementor-element.elementor-element-2c90662 .elementor-nav-menu--main .elementor-item {
        white-space: nowrap;
        word-spacing: normal;
        font-size: 13px;
        font-weight: 400 !important;
        letter-spacing: 0;
        padding-left: 7px;
        padding-right: 7px;
    }

    .elementor-1166 .elementor-element.elementor-element-4e71841 {
        width: 260px !important;
        max-width: 260px !important;
        flex: 0 0 260px !important;
    }

    .elementor-1166 .elementor-element.elementor-element-4e71841 > .elementor-widget-container {
        margin: -3px 0 0 0;
    }

    .elementor-1166 .elementor-element.elementor-element-4e71841 .edublink-course-search-box-wrapper {
        width: 100%;
    }

    .elementor-1166 .elementor-element.elementor-element-4e71841 .edublink-course-serach-input-group {
        height: 34px !important;
        padding: 6px 10px !important;
    }

    .elementor-1166 .elementor-element.elementor-element-4e71841 .edublink-course-search-field {
        font-size: 13px !important;
    }
}
/* ================================
   Mobile Responsive Fix
   ================================ */
@media (max-width: 768px) {

    .learning-journey-section {
        padding: 10px 15px;
    }

    .phase {
        display: flex;
        flex-direction: row;
        gap: 15px;
        position: relative;
        padding-left: 0;
        align-items: flex-start;
    }

    /* Phase icon dot */
    .phase-icon {
        min-width: 20px;
        height: 20px;
        background: var(--color-primary);
        border-radius: 50%;
        margin-top: 5px;
        position: relative;
        left: 0;
    }

    /* Line from circle to box */
    .phase-line {
        position: absolute;
        left: 9px;
        top: 28px;
        height: calc(100% - 28px);
        width: 3px;
        background: var(--color-primary);
    }

    /* Main box */
    .phase-box {
        background: var(--color-primary-bg);
        border: 1px solid var(--color-primary-border);
        padding: 18px;
        border-radius: var(--radius-md);
        flex: 1;
    }

    .phase-box h3 {
        font-size: 16px;
        font-weight: 700;
        line-height: 1.4;
        display: flex;
        justify-content: space-between;
    }

    .phase-box h3 .duration {
        font-size: 14px;
        padding: 3px 10px;
        border-radius: 15px;
        border: 1px solid var(--color-primary-border-dark);
    }

    .phase-box p {
        font-size: 15px;
        line-height: 1.6;
        margin: 0;
    }
}
.phase-box h3 .duration {
    white-space: nowrap;   /* Prevent text wrapping */
}
/* --- Responsive Fix for Mobile (max 768px) --- */
@media (max-width: 768px) {
    .learning-journey-section h2 {
        font-size: 1.5625rem !important;
        line-height: 1.3;
        margin-bottom: 8px;
    }

    .lj-subtitle,
    .learning-journey-section .subtitle {
        font-size: 14px !important;
        line-height: 1.5;
        margin-bottom: 20px;
    }
}

/* Learning Journey - Decorative Line */
.learning-journey-section::before {
    content: '';
    position: absolute;
    left: 0;
    top: 12px; /* keep the accent bar aligned with the title after reducing top gap 2026-06-23 */
    width: 4px;
    height: 80px;
    background: linear-gradient(180deg, #fc6720 0%, #023047 100%);
    border-radius: 2px;
	margin-left:-10px;
}

.learning-journey-section h2::before {
    display: none;
}

/*course archive*/

/* ---------------------------------------------------------------------- */
/* 1. Standard Width Settings (Site Container) and Center Alignment (Fixed) */
/* ---------------------------------------------------------------------- */

/* Parent class for all Tutor LMS content */
.tutor-courses-wrap {
    /* Assuming standard site container width is 1200px. */
    /* If your header is 1140px, change this value to 1140px. */
    max-width: 1140px !important;
    margin: 0 auto !important;
    /* Set padding to zero to prevent alignment issues from default padding */
    padding: 0 !important; 
    box-sizing: border-box;
}

/* 2. Fix Two-Column Layout and Neutralize col- Classes */
.tutor-courses-wrap .tutor-row {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    margin: 0; /* Remove unwanted horizontal margins */
    box-sizing: border-box;
}

/* 3. Precise Filter Column Width (Left) */
.tutor-course-filter-container {
    width: 25%;
    padding: 0 15px 0 0; /* Left padding removed, only right padding for gutter */
    box-sizing: border-box;
}

/* 4. Precise Content Column Width (Right) */
.tutor-col-xl-8 {
    width: 75%;
    padding: 0 0 0 15px; /* Right padding removed, only left padding for gutter */
    box-sizing: border-box;
}

/* 5. Fix Course Grid (3-Column) - To Fill 75% Width */
.tutor-course-list-container .edublink-course-archive.edublink-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr); 
    gap: 20px; 
}
.tutor-course-list-container .edublink-col-lg-6 {
    /* Neutralize 2-column styles from Edublink theme */
    width: 100% !important;
}

/* ---------------------------------------------------------------------- */
/* 6. Hero Section Styling (If PHP Code Is Used) */
/* ---------------------------------------------------------------------- */
.custom-hero-section {
    text-align: center;
    padding: 60px 0 40px 0;
    max-width: 1200px;
    margin: 0 auto;
}

/* ========================================================================= */
/* 1. Course Cards Styling - No Changes Needed */
/* ========================================================================= */

/* Glass morphism hover effect code should work */
/* Since edublink-single-course classes exist in the new structure as well */

.edublink-single-course.course-style-1:hover .course-hover-content-wrapper,
.edublink-single-course.course-style-1:hover .course-hover-content {
    background: linear-gradient(
        40deg,
        rgba(252, 103, 32, 0.30),
        rgba(255, 255,255, 0.1)
    ) !important;
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(10px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    transition: background var(--transition-slow), backdrop-filter var(--transition-slow), border-color var(--transition-slow);
}

/* Full overlap without exceeding card bounds */
.edublink-single-course.course-style-1 .course-hover-content-wrapper,
.edublink-single-course.course-style-1 .course-hover-content {
    background: transparent !important;
    width: 100%;
    height: 100%;
    transition: background var(--transition-slow), backdrop-filter var(--transition-slow);
}

/* Smooth animation on hover */
.edublink-single-course.course-style-1:hover {
    transform: translateY(-4px);
    transition: transform var(--transition-base);
    overflow: hidden;
}
/* 25px border radius for entire card */
.edublink-single-course.course-style-1 {
    border-radius: 25px;
    overflow: hidden; 
}

/* ========================================================================= */
/* 2. Filter Boxes Styling - Tutor LMS Compatibility */
/* ========================================================================= */

/* Remove background and box shadow from Tutor LMS widgets */
.tutor-course-filter {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Apply card/box style to each Tutor LMS filter widget */
.tutor-widget {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: 22px 24px;
    border: 2px solid rgba(255, 107, 0, 0.15);
    box-shadow: 0 8px 20px rgba(0,0,0,0.06);
    margin-bottom: 22px;
    transition: box-shadow var(--transition-base), border-color var(--transition-base);
}

/* ----------------------------------------------------
    TITLE WITH ICON (BASE STYLE) - Tutor LMS Compatibility
-----------------------------------------------------*/
.tutor-widget-title { /* New Tutor LMS class */
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px !important;
    font-weight: 700 !important;
    margin-bottom: 18px !important;
    color: var(--color-text-primary) !important;
}

.tutor-widget-title::before { /* Apply icons via ::before */
    content: "";
    width: 18px;
    height: 18px;
    background-size: contain;
    background-repeat: no-repeat;
    filter: brightness(0) saturate(100%) invert(43%) sepia(91%) saturate(2970%)
            hue-rotate(359deg) brightness(101%) contrast(103%);
}

/* ----------------------------------------------------
    ICONS EXACTLY PER FILTER (Tutor LMS Class Compatibility)
-----------------------------------------------------*/

/* Category - List icon (inline SVG) */
.tutor-widget-course-categories .tutor-widget-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cline x1='8' y1='6' x2='21' y2='6'/%3E%3Cline x1='8' y1='12' x2='21' y2='12'/%3E%3Cline x1='8' y1='18' x2='21' y2='18'/%3E%3Cline x1='3' y1='6' x2='3.01' y2='6'/%3E%3Cline x1='3' y1='12' x2='3.01' y2='12'/%3E%3Cline x1='3' y1='18' x2='3.01' y2='18'/%3E%3C/svg%3E");
}

/* Tags icon (inline SVG) */
.tutor-widget-course-tags .tutor-widget-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E");
}

/* Level - Chart icon (inline SVG) */
.tutor-widget-course-levels .tutor-widget-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E");
}

/* Price icon (inline SVG) */
.tutor-widget-course-price .tutor-widget-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cline x1='12' y1='1' x2='12' y2='23'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6'/%3E%3C/svg%3E");
}

/* (Instructor: Not in your HTML, no changes needed) */

/* ----------------------------------------------------
    CHECKBOX STYLE - Tutor LMS Compatibility
-----------------------------------------------------*/
.tutor-widget input[type="checkbox"] { /* New class */
    appearance: none !important;
    width: 18px;
    height: 18px;
    border: 2px solid var(--color-gray-300);
    border-radius: 4px;
    margin-right: 10px;
    background: var(--color-white);
    cursor: pointer;
    position: relative;
    transition: 0.25s ease;
}

.tutor-widget input[type="checkbox"]:checked {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.tutor-widget input[type="checkbox"]:checked::after {
    content: "✔";
    font-size: 14px;
    color: var(--color-white);
    position: absolute;
    top: -1px;
    left: 3px;
}

/* ----------------------------------------------------
    APPLY FILTER BUTTON (Orange) - Tutor LMS Compatibility
-----------------------------------------------------*/
/* Tutor LMS uses anchor and button elements with tutor-btn classes. */
.tutor-course-filter-form .tutor-btn-primary {
    /* Primary button class for Tutor LMS */
    background-color: var(--color-primary) !important;
    background-image: none !important;
    border: none !important;

    width: 100%;
    height: auto !important;
    line-height: normal !important;
    padding: 12px 18px !important;
    border-radius: var(--radius-md) !important; 
    
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;

    color: var(--color-white) !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    cursor: pointer;
    box-shadow: none !important;
    transition: background-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base) !important;
}

/* hover */
.tutor-course-filter-form .tutor-btn-primary:hover {
    background-color: var(--color-primary-light) !important;
    box-shadow: 0 6px 18px rgba(255, 107, 0, 0.35) !important;
    transform: translateY(-2px);
}

/* ----------------------------------------------------
    CLEAR ALL FILTERS BUTTON - Tutor LMS Compatibility
-----------------------------------------------------*/
.tutor-course-filter-form .tutor-btn-outline-primary {
    /* Clear All Filters button class in Tutor LMS */
    background: linear-gradient(180deg, #ffffff, #ffe8dd) !important;
    background-image: none !important;
    border: 2px solid var(--color-primary) !important;

    width: 100%;
    height: auto !important;
    line-height: normal !important;
    padding: 12px 18px !important;
    border-radius: var(--radius-md) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;

    color: var(--color-primary) !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    cursor: pointer;
    box-shadow: none !important;
    transition: background-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base) !important;
}

/* hover */
.tutor-course-filter-form .tutor-btn-outline-primary:hover {
    background: var(--color-primary-bg) !important;
    box-shadow: 0 6px 18px rgba(255, 107, 0, 0.25) !important;
    transform: translateY(-2px);
}

/* ========================================================================= */
/* Hero Section Styling (Injected via PHP) */
/* ========================================================================= */

/* 1. Main Container for Centering and Max Width */
.custom-hero-section-wrapper {
    /* Set standard site max-width for alignment */
    max-width: 1200px !important; 
    margin: 0 auto !important; 
    padding: 0px 15px 0 15px; /* Top and side padding */
    box-sizing: border-box;
	margin-top : -30PX !important;
}

/* 2. Text content section - merged into main .custom-hero-section above */

/* 3. Main Heading Style (Transform Your) */
.custom-hero-heading {
    font-size: 56px !important;
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-secondary-dark); /* Dark blue color similar to your design */
    margin: 0;
}

/* 4. Orange Text Styling (IT Career Today) */
.custom-hero-subheading {
    font-size: 56px !important;
    font-weight: 700;
    line-height: 1.1;
    color: var(--color-primary); /* Your orange color */
    margin: 0 0 20px 0;
}

/* 5. Sub-paragraph Styling */
.custom-hero-text {
    font-size: 18px !important;
    color: var(--color-text-muted);
    max-width: 750px; /* Limit width for better alignment */
    margin: 0 auto;
}

@media (max-width: 768px) {
        .custom-hero-section-wrapper {
            padding: 40px 15px 30px 15px;
        }

        .custom-hero-heading,
        .custom-hero-subheading {
            font-size: 36px !important;
        }

        .custom-hero-text {
            font-size: 16px !important;
        }
    }

/* ========================================================================= */
/* I. Search Box Styling (Conflict Resolution and Normal/Focus States) */
/* ========================================================================= */

/* 1. Search Container (Remove Interfering Parent Widget Styles) */
.tutor-course-filter-container .tutor-widget-search {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-bottom: 22px !important; 
}

/* 2. Main search box (apply border and flex for alignment) */
.tutor-course-filter-container .tutor-widget-search .tutor-form-wrap {
    display: flex;
    align-items: center;
    position: relative;
    border: 1px solid rgba(255, 107, 0, 0.3);
    border-radius: var(--radius-md);
    padding: 0;
    background-color: var(--color-white);
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
    transition: border-color var(--transition-base), box-shadow var(--transition-base);
}

/* 3. Search icon style (Fixing Position) */
.tutor-course-filter-container .tutor-widget-search .tutor-form-icon {
    order: 1; /* Icon on the left side */
    width: 50px;
    height: 50px;
    line-height: 1;
    color: var(--color-primary) !important; /* Orange icon color */
    font-size: 18px !important;
    
    /* Alignment settings */
    display: flex;
    align-items: center;
    justify-content: center;

    /* Remove styles that cause conflicts */
    position: relative !important;
    left: auto !important;
    top: auto !important;
    pointer-events: none; /* Ensure clicks go to the input field */
}

/* 4. Input field style */
.tutor-course-filter-container .tutor-widget-search input.tutor-form-control {
    flex-grow: 1;
    height: 50px;
    line-height: 1.5;
    
    /* Padding to space from icon */
    padding: 0 15px 0 0 !important; /* Left padding removed since icon is beside it */
    border: none !important; 
    box-shadow: none !important;
    background: transparent !important;
    font-size: 16px;
    color: var(--color-text-secondary);
    order: 2; /* Field comes after icon */
    margin: 0 !important; /* Remove default margins */
}

/* 5. Focus State Styling */
.tutor-course-filter-container .tutor-widget-search input.tutor-form-control:focus {
    outline: none !important; 
}

/* Best Solution for Focus (Change Input Field Style): */
.tutor-course-filter-container .tutor-widget-search .tutor-form-wrap:has(input.tutor-form-control:focus) {
    /* :has() requires modern browsers. If not supported, use :focus on input itself */
    border-color: var(--color-primary) !important;
    box-shadow: 0 5px 15px rgba(255, 107, 0, 0.2);
}

/* Fallback: Remove border from wrapper */
.tutor-course-filter-container .tutor-widget-search .tutor-form-wrap {
    border: none !important;
}
.tutor-course-filter-container .tutor-widget-search input.tutor-form-control {
    /* Input field keeps border and we apply border to it */
    border: 1px solid rgba(255, 107, 0, 0.3) !important;
    border-radius: var(--radius-md) !important;
    padding-left: 50px !important; /* Compensate for icon */
}

/* Final Fix Based on Your Issue (Apply Border and Focus to Field): */

.tutor-course-filter-container .tutor-widget-search .tutor-form-wrap {
    border: none !important; /* Remove border from parent */
    box-shadow: none !important;
    padding: 0 !important; 
}

.tutor-course-filter-container .tutor-widget-search input.tutor-form-control {
    /* Apply box style to input field */
    border: 1px solid rgba(255, 107, 0, 0.3) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
    padding: 0 15px 0 50px !important; /* Increase left padding for icon */
    order: 2;
    z-index: var(--z-base); /* Above the icon */
}

.tutor-course-filter-container .tutor-widget-search input.tutor-form-control:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 5px 15px rgba(255, 107, 0, 0.2);
}

.tutor-course-filter-container .tutor-widget-search .tutor-form-icon {
    /* Absolute position of icon on field */
    position: absolute !important;
    left: 0;
    top: 0;
    z-index: calc(var(--z-base) + 1); /* Above the field */
    pointer-events: none; /* Allow clicks on underlying field */
}

/* ============================================
   Tutor LMS Sort Dropdown Styling
   ============================================ */

/* Main dropdown container */
.tutor-form-control.tutor-form-select {
    position: relative;
    background: var(--color-white);
    border: 1px solid  rgba(255, 107, 0, 0.3) !important;
    border-radius: var(--radius-sm);
    padding: 12px 40px 12px 16px;
    cursor: pointer;
    transition: border-color var(--transition-base), box-shadow var(--transition-base);
    min-width: 250px;
}

.tutor-form-control.tutor-form-select:hover {
    border-color: var(--color-primary);
    box-shadow: 0 2px 8px rgba(252, 103, 32, 0.1);
}

/* Label (selected item) */
.tutor-form-select-label {
    font-size: 15px;
    font-weight: 500;
    color: var(--color-dark-blue);
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Arrow icon */
.tutor-form-control.tutor-form-select::after {
    content: '';
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid var(--color-dark-blue);
    transition: transform 0.3s ease;
}

/* Rotate arrow when active */
.tutor-form-control.tutor-form-select.is-active::after {
    transform: translateY(-50%) rotate(180deg);
}

/* Dropdown menu */
.tutor-form-select-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    box-shadow: 0 4px 16px rgba(2, 48, 71, 0.12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: opacity var(--transition-base), visibility var(--transition-base), transform var(--transition-base);
    z-index: var(--z-overlay);
    max-height: 300px;
    overflow-y: auto;
}

/* Show dropdown when active */
.tutor-form-control.tutor-form-select.is-active .tutor-form-select-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Options container */
.tutor-form-select-options {
    padding: 8px 0;
}

/* Individual option */
.tutor-form-select-option {
    padding: 12px 16px;
    cursor: pointer;
    transition: background-color var(--transition-fast);
    position: relative;
}

.tutor-form-select-option:hover {
    background: var(--color-bg-light);
}

/* Option text */
.tutor-form-select-option span {
    font-size: 15px;
    color: var(--color-gray-500);
    display: block;
    transition: color 0.2s ease;
}

.tutor-form-select-option:hover span {
    color: var(--color-dark-blue);
}

/* Active option */
.tutor-form-select-option.is-active {
    background: rgba(252, 103, 32, 0.08);
}

.tutor-form-select-option.is-active span {
    color: var(--color-primary);
    font-weight: 600;
}

/* Checkmark for active item */
.tutor-form-select-option.is-active::before {
    content: '✓';
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-primary);
    font-weight: bold;
    font-size: 16px;
}

/* Scrollbar styling */
.tutor-form-select-dropdown::-webkit-scrollbar {
    width: 6px;
}

.tutor-form-select-dropdown::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: var(--radius-sm);
}

.tutor-form-select-dropdown::-webkit-scrollbar-thumb {
    background: #cbd5e0;
    border-radius: var(--radius-sm);
}

.tutor-form-select-dropdown::-webkit-scrollbar-thumb:hover {
    background: #a0aec0;
}

/* Responsive */
@media (max-width: 768px) {
    .tutor-form-control.tutor-form-select {
        min-width: 100%;
        padding: 10px 36px 10px 14px;
    }
    
    .tutor-form-select-label {
        font-size: 15px;
    }
    
    .tutor-form-select-option span {
        font-size: 15px;
    }
}

/* ============================================
   Mobile/Tablet Filter Sidebar - Simple Fix
   ============================================ */

@media (max-width: 1199px) {
    
    /* Container styling only */
    .tutor-col-3.tutor-course-filter-container {
        width: 340px !important;
        max-width: 85vw !important;
        padding: 24px 20px !important;
    }
    
    /* Filter wrapper */
    .tutor-course-filter {
        width: 100% !important;
        background: var(--color-white) !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
    }
    
    /* Form */
    .tutor-course-filter-form {
        width: 100% !important;
        padding: 0 !important;
    }
    
    /* Close Button Section */
    .tutor-mb-16.tutor-d-block.tutor-d-xl-none {
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        padding: 16px 20px !important;
        margin: -24px -20px 20px -20px !important;
        background: var(--color-bg-light) !important;
        border-bottom: 1px solid var(--color-border) !important;
    }
    
    /* Close Button */
    .tutor-iconic-btn {
        width: 36px !important;
        height: 36px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: var(--color-white) !important;
        border: 1px solid var(--color-border) !important;
        border-radius: 6px !important;
        transition: background-color var(--transition-fast), border-color var(--transition-fast) !important;
        cursor: pointer !important;
    }

    .tutor-iconic-btn:hover {
        background: var(--color-primary) !important;
        border-color: var(--color-primary) !important;
    }
    
    .tutor-iconic-btn:hover .tutor-icon-times {
        color: var(--color-white) !important;
    }
    
    .tutor-icon-times {
        font-size: 18px !important;
        color: var(--color-dark-blue) !important;
        transition: color 0.2s ease !important;
    }
    
    /* Search Widget */
    .tutor-widget-search {
        margin-bottom: 24px !important;
    }
    
    .tutor-widget-search .tutor-form-wrap {
        position: relative !important;
        width: 100% !important;
    }
    
    .tutor-widget-search .tutor-form-control {
        width: 100% !important;
        padding: 12px 16px 12px 45px !important;
        font-size: 15px !important;
        border: 1px solid var(--color-border) !important;
        border-radius: var(--radius-sm) !important;
        background: var(--color-white) !important;
        transition: border-color var(--transition-base), box-shadow var(--transition-base) !important;
    }

    .tutor-widget-search .tutor-form-control:focus {
        border-color: var(--color-primary) !important;
        box-shadow: 0 0 0 3px rgba(252, 103, 32, 0.1) !important;
        outline: none !important;
    }
    
    .tutor-widget-search .tutor-icon-search {
        position: absolute !important;
        left: 16px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        color: var(--color-gray-500) !important;
        font-size: 16px !important;
    }
    
    /* Widget General Styling */
    .tutor-widget {
        margin-bottom: 28px !important;
        padding-bottom: 28px !important;
        border-bottom: 1px solid var(--color-border-light) !important;
    }
    
    .tutor-widget:last-of-type {
        border-bottom: none !important;
    }
    
    /* Widget Titles */
    .tutor-widget-title {
        font-size: 16px !important;
        font-weight: 700 !important;
        color: var(--color-dark-blue) !important;
        margin-bottom: 16px !important;
        padding-bottom: 12px !important;
        border-bottom: 2px solid var(--color-primary) !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }
    
    /* Icons in titles */
    .tutor-widget-title::before {
        content: '' !important;
        display: inline-block !important;
        width: 4px !important;
        height: 18px !important;
        background: var(--color-primary) !important;
        border-radius: 2px !important;
    }
    
    /* Widget Content */
    .tutor-widget-content {
        padding: 0 !important;
    }
    
    /* Lists */
    .tutor-widget .tutor-list {
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    /* List Items */
    .tutor-list-item {
        margin-bottom: 12px !important;
        padding: 0 !important;
    }
    
    .tutor-list-item:last-child {
        margin-bottom: 0 !important;
    }
    
    /* Labels */
    .tutor-list-item label {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        cursor: pointer !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        color: var(--color-gray-500) !important;
        padding: 8px 12px !important;
        border-radius: 6px !important;
        transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast) !important;
        width: 100% !important;
    }
    
    .tutor-list-item label:hover {
        background: var(--color-bg-light) !important;
        color: var(--color-dark-blue) !important;
    }
    
    /* Checkboxes */
    .tutor-form-check-input {
        width: 18px !important;
        height: 18px !important;
        margin: 0 !important;
        cursor: pointer !important;
        accent-color: var(--color-primary) !important;
        flex-shrink: 0 !important;
    }
    
    /* Clear Filters Button */
    .tutor-widget-course-filter {
        margin-top: 24px !important;
        padding-top: 24px !important;
        border-top: 2px solid var(--color-border-light) !important;
        border-bottom: none !important;
    }
    
    .tutor-widget-course-filter .tutor-btn {
        width: 100% !important;
        padding: 14px 20px !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        border: 2px solid var(--color-primary) !important;
        color: var(--color-primary) !important;
        background: transparent !important;
        border-radius: var(--radius-sm) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
    }
    
    .tutor-widget-course-filter .tutor-btn:hover {
        background: var(--color-primary) !important;
        color: var(--color-white) !important;
        transform: translateY(-2px) !important;
        box-shadow: 0 4px 12px rgba(252, 103, 32, 0.3) !important;
    }
    
    /* Spacing adjustments */
    .tutor-mt-48 {
        margin-top: 0 !important;
    }
    
    .tutor-mt-32 {
        margin-top: 0 !important;
    }
}

/* Extra Small Mobile */
@media (max-width: 480px) {
    .tutor-col-3.tutor-course-filter-container {
        width: 300px !important;
        max-width: 90vw !important;
        padding: 20px 16px !important;
    }
    
    .tutor-mb-16.tutor-d-block.tutor-d-xl-none {
        padding: 14px 16px !important;
        margin: -20px -16px 16px -16px !important;
    }
    
    .tutor-widget-title {
        font-size: 16px !important;
    }

    .tutor-list-item label {
        font-size: 14px !important;
        padding: 6px 10px !important;
    }
}

/* Search Icon Fix - Final */
.tutor-widget-search .tutor-form-wrap {
    position: relative !important;
}

.tutor-widget-search .tutor-icon-search.tutor-form-icon {
    position: absolute !important;
    left: 5px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: var(--color-primary) !important;
    font-size: 18px !important;
    z-index: calc(var(--z-base) + 1) !important;
    pointer-events: none !important;
}

.tutor-widget-search .tutor-form-control {
    padding-left: 48px !important;
}

/* Course Grid Padding */
.tutor-courses-wrap.tutor-container {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* ============================================
   Course Archive - Mobile Side Padding Fix
   ============================================ */

/* Mobile & Tablet - Side Padding */
@media (max-width: 991px) {
    
    /* Main Tutor Wrapper */
    .tutor-wrap,
    .tutor-courses-wrap,
    .tutor-wrap.tutor-courses-wrap {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    /* Hero Section */
    .custom-hero-section,
    .tutor-courses-wrap .custom-hero-section {
        padding-left: 15px !important;
        padding-right: 15px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    /* Course List Container */
    .tutor-course-list-container,
    .edublink-course-archive {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Filter & Sort Row */
    .tutor-course-filter-wrapper,
    .tutor-courses-wrap .tutor-row {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    /* Edublink Row Fix */
    .edublink-course-archive.edublink-row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    /* Body/Page Container */
    body.post-type-archive-courses .tutor-wrap,
    body.archive .tutor-wrap {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}

/* Small Mobile */
@media (max-width: 576px) {
    
    .tutor-wrap,
    .tutor-courses-wrap,
    .tutor-wrap.tutor-courses-wrap,
    body.post-type-archive-courses .tutor-wrap {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    
    .custom-hero-section {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

/* ========================================================================= */
/* SMEnode Blog Archive - No Sidebar + Categories Bar                        */
/* ========================================================================= */

/* ---------------------------------------------------------------------- */
/* 1. Hero Section                                                        */
/* ---------------------------------------------------------------------- */
/* ========== Blog Hero - Fixed ========== */
.blog-hero-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 50px 15px 40px;
    text-align: center;
}

.blog-hero-heading {
    font-size: 52px !important;
    font-weight: 700;
    margin: 0 0 15px;
    line-height: 1.2;
}

.blog-hero-heading .line-1 {
    display: block;
    color: #023047 !important; 
}

.blog-hero-heading .line-2 {
    display: block;
    color: #fc6720 !important; 
}

.blog-hero-text {
    font-size: 18px !important;
    color: var(--color-text-muted);
    max-width: 550px;
    margin: 0 auto;
}

body.smenode-blog-archive h1:not(.blog-hero-heading) {
    display: none !important;
}
/* ---------------------------------------------------------------------- */
/* 2. Intro Section (Below Hero)                                          */
/* ---------------------------------------------------------------------- */
.blog-intro {
    max-width: 800px;
    margin: 35px auto 0;
    padding: 25px 35px;
    background: linear-gradient(135deg, #fff9f5 0%, #ffffff 100%);
    border: 1px solid rgba(255, 107, 0, 0.12);
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 20px rgba(255, 107, 0, 0.06);
}

.blog-intro p {
    font-size: 16px !important;
    line-height: 1.7;
    color: var(--color-gray-500);
    margin: 0;
}

.blog-intro strong {
    color: var(--color-primary);
    font-weight: 600;
}

/* ---------------------------------------------------------------------- */
/* 3. Categories Bar (Horizontal Filter)                                  */
/* ---------------------------------------------------------------------- */
.blog-categories-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-top: 35px;
    padding: 0 15px;
}

.blog-categories-bar .cat-item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 24px;
    background: var(--color-white);
    border: 2px solid rgba(255, 107, 0, 0.2);
    border-radius: var(--radius-full);
    font-size: 16px !important;
    font-weight: 600;
    color: var(--color-gray-500);
    text-decoration: none;
    transition: border-color var(--transition-base), color var(--transition-base), background-color var(--transition-base);
    white-space: nowrap;
}

.blog-categories-bar .cat-item i {
    font-size: 16px;
    color: var(--color-gray-400);
    transition: color 0.3s;
}

.blog-categories-bar .cat-item:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: rgba(255, 107, 0, 0.04);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(255, 107, 0, 0.15);
}

.blog-categories-bar .cat-item:hover i {
    color: var(--color-primary);
}

/* Active State */
.blog-categories-bar .cat-item.active {
    background: linear-gradient(135deg, #ff6b00 0%, #ff8533 100%);
    border-color: var(--color-primary);
    color: var(--color-white);
    box-shadow: 0 6px 20px rgba(255, 107, 0, 0.35);
}

.blog-categories-bar .cat-item.active i {
    color: var(--color-white);
}

.blog-categories-bar .cat-item.active:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(255, 107, 0, 0.4);
}

/* ---------------------------------------------------------------------- */
/* 4. Layout - Remove Sidebar                                             */
/* ---------------------------------------------------------------------- */
.smenode-no-sidebar .site-content-inner {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 40px 15px !important;
}

.smenode-no-sidebar .edublink-main-content-inner {
    display: block !important;
}

.smenode-no-sidebar #primary.content-area {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}

/* Hide sidebar */
.smenode-no-sidebar #secondary.widget-area {
    display: none !important;
}

/* Hide default header */
.smenode-no-sidebar #primary > header {
    display: none !important;
}

/* ---------------------------------------------------------------------- */
/* 5. Blog Grid - 4 Columns (Without Sidebar)                             */
/* ---------------------------------------------------------------------- */
.smenode-no-sidebar .edublink-blog-post-archive-style-1 {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px !important;
}

.smenode-no-sidebar .edublink-post-one-single-grid {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ---------------------------------------------------------------------- */
/* 6. Blog Card (Keep Current Design)                                     */
/* ---------------------------------------------------------------------- */
.smenode-blog-archive .edu-blog.blog-style-1 {
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    height: 100%;
    transition: border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);
}

.smenode-blog-archive .edu-blog.blog-style-1 .inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.smenode-blog-archive .edu-blog.blog-style-1:hover {
    border-color: var(--color-primary);
    box-shadow: 0 12px 35px rgba(0,0,0,0.1);
    transform: translateY(-6px);
}

.smenode-blog-archive .edu-blog .thumbnail {
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.smenode-blog-archive .edu-blog .thumbnail img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.4s;
}

.smenode-blog-archive .edu-blog:hover .thumbnail img {
    transform: scale(1.08);
}

/* Badge */
.smenode-blog-archive .edu-blog .content {
    position: relative;
    padding: 20px;
    flex: 1;
}

.smenode-blog-archive .edu-blog .category-wrap {
    position: absolute !important;
    top: -12px !important;
    left: 20px !important;
    z-index: var(--z-dropdown) !important;
    margin: 0 !important;
}

.smenode-blog-archive .edu-blog .category-wrap a {
    display: inline-block !important;
    padding: 6px 14px !important;
    background: var(--color-primary) !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--color-white) !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    box-shadow: 0 2px 8px rgba(255,107,0,0.3);
}

.smenode-blog-archive .edu-blog .title {
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 15px 0 12px !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.smenode-blog-archive .edu-blog .title a {
    color: var(--color-text-primary) !important;
    text-decoration: none;
}

.smenode-blog-archive .edu-blog .title a:hover {
    color: var(--color-primary) !important;
}

.smenode-blog-archive .edu-blog .blog-meta {
    display: flex;
    gap: 16px;
    margin: 0 0 12px !important;
    padding: 0 !important;
    list-style: none !important;
}

.smenode-blog-archive .edu-blog .blog-meta li {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 15px;
    color: var(--color-gray-400);
}

.smenode-blog-archive .edu-blog .blog-meta li i {
    color: var(--color-primary);
}

.smenode-blog-archive .edu-blog .content > p {
    font-size: 15px;
    color: var(--color-gray-500);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ---------------------------------------------------------------------- */
/* 7. Pagination                                                          */
/* ---------------------------------------------------------------------- */
.smenode-blog-archive nav.navigation.pagination {
    grid-column: 1 / -1;
    margin-top: 40px;
    padding-top: 30px;
    border-top: 1px solid var(--color-border);
}

.smenode-blog-archive .nav-links {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.smenode-blog-archive .nav-links a,
.smenode-blog-archive .nav-links span {
    min-width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 10px;
    font-size: 15px;
    color: var(--color-gray-500);
    text-decoration: none;
    transition: border-color var(--transition-fast), color var(--transition-fast);
}

.smenode-blog-archive .nav-links a:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.smenode-blog-archive .nav-links span.current {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}

/* ---------------------------------------------------------------------- */
/* 8. Responsive                                                          */
/* ---------------------------------------------------------------------- */
/* ========================================================================= */
/* Responsive - Blog Archive                                                 */
/* ========================================================================= */

@media (max-width: 1200px) {
    .smenode-no-sidebar .edublink-blog-post-archive-style-1 {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px !important;
    }
}

@media (max-width: 992px) {
    .blog-hero-heading,
    .blog-hero-subheading {
        font-size: 44px !important;
    }
    
    .blog-categories-bar .cat-item {
        padding: 10px 18px;
        font-size: 16px !important;
    }
    
    .smenode-no-sidebar .edublink-blog-post-archive-style-1 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
    }
    
    /* Card on tablet */
    .smenode-blog-archive .edu-blog .thumbnail img {
        height: auto;
    }
    
    .smenode-blog-archive .edu-blog .content {
        padding: 18px;
    }
    
    .smenode-blog-archive .edu-blog .title {
        font-size: 16px !important;
    }
}

@media (max-width: 768px) {
    .blog-hero-heading,
    .blog-hero-subheading {
        font-size: 36px;
    }
    
    .blog-intro {
        padding: 20px 25px;
    }
    
    .blog-intro p {
        font-size: 15px;
    }
    
    .blog-categories-bar {
        gap: 10px;
    }
    
    .blog-categories-bar .cat-item {
        padding: 10px 16px;
        font-size: 15px;
    }
    
    .smenode-no-sidebar .edublink-blog-post-archive-style-1 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }
    
    /* Card on small tablet */
    .smenode-blog-archive .edu-blog .thumbnail img {
        height: auto;
    }
    
    .smenode-blog-archive .edu-blog .content {
        padding: 16px;
    }
    
    .smenode-blog-archive .edu-blog .category-wrap {
        top: -10px !important;
        left: 16px !important;
    }
    
    .smenode-blog-archive .edu-blog .category-wrap a {
        padding: 5px 12px !important;
        font-size: 14px !important;
    }
    
    .smenode-blog-archive .edu-blog .title {
        font-size: 16px !important;
        margin: 12px 0 10px !important;
    }
    
    .smenode-blog-archive .edu-blog .blog-meta {
        gap: 12px;
    }
    
    .smenode-blog-archive .edu-blog .blog-meta li {
        font-size: 14px;
    }
    
    .smenode-blog-archive .edu-blog .content > p {
        font-size: 15px;
        -webkit-line-clamp: 2;
    }
}

@media (max-width: 576px) {
    .blog-hero-wrapper {
        padding: 35px 15px 20px;
    }
    
    .blog-hero-heading,
    .blog-hero-subheading {
        font-size: 36px;
    }
    
    .blog-hero-text {
        font-size: 15px;
    }
    
    .blog-intro {
        padding: 16px 18px;
        margin-top: 20px;
    }
    
    .blog-intro p {
        font-size: 15px;
        line-height: 1.6;
    }
    
    .blog-categories-bar {
        margin-top: 20px;
        gap: 8px;
    }
    
    .blog-categories-bar .cat-item {
        padding: 8px 14px;
        font-size: 14px;
        border-radius: 30px;
    }
    
    /* Single column grid on mobile */
    .smenode-no-sidebar .edublink-blog-post-archive-style-1 {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    
    /* Card on mobile - optimized design */
    .smenode-blog-archive .edu-blog.blog-style-1 {
        border-radius: 14px;
    }
    
    .smenode-blog-archive .edu-blog .thumbnail img {
        height: auto !important;
    }
    
    .smenode-blog-archive .edu-blog .content {
        padding: 18px;
    }
    
    .smenode-blog-archive .edu-blog .category-wrap {
        top: -11px !important;
        left: 18px !important;
    }
    
    .smenode-blog-archive .edu-blog .category-wrap a {
        padding: 6px 14px !important;
        font-size: 14px !important;
        border-radius: 6px !important;
    }
    
    .smenode-blog-archive .edu-blog .title {
        font-size: 17px !important;
        line-height: 1.4 !important;
        margin: 14px 0 12px !important;
        -webkit-line-clamp: 2;
    }
    
    .smenode-blog-archive .edu-blog .blog-meta {
        gap: 14px;
        margin-bottom: 10px !important;
    }
    
    .smenode-blog-archive .edu-blog .blog-meta li {
        font-size: 15px;
        gap: 5px;
    }
    
    .smenode-blog-archive .edu-blog .content > p {
        font-size: 15px;
        line-height: 1.6;
        color: var(--color-gray-500);
        -webkit-line-clamp: 3;
    }
    
    /* Mobile pagination */
    .smenode-blog-archive nav.navigation.pagination {
        margin-top: 30px;
        padding-top: 25px;
    }
    
    .smenode-blog-archive .nav-links a,
    .smenode-blog-archive .nav-links span {
        min-width: 38px;
        height: 38px;
        font-size: 15px;
        border-radius: var(--radius-sm);
    }
}

@media (max-width: 400px) {
    .blog-hero-heading,
    .blog-hero-subheading {
        font-size: 36px;
    }
    
    .blog-categories-bar .cat-item {
        padding: 7px 12px;
        font-size: 14px;
    }
    
    .smenode-blog-archive .edu-blog .thumbnail img {
        height: auto;
    }

    .smenode-blog-archive .edu-blog .title {
        font-size: 16px !important;
    }
}

/* ---------------------------------------------------------------------- */
/* Card Spacing from Edge - Tablet                                        */
/* ---------------------------------------------------------------------- */

@media (max-width: 992px) {
    .smenode-blog-archive .site-content-inner.edublink-container,
    .smenode-no-sidebar .site-content-inner.edublink-container {
        max-width: 100% !important;
        padding-left: 30px !important;
        padding-right: 30px !important;
        box-sizing: border-box !important;
    }
    
    .smenode-blog-archive .edublink-main-content-inner.edublink-row,
    .smenode-no-sidebar .edublink-main-content-inner.edublink-row {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 0 !important;
    }
    
    .smenode-blog-archive #primary.content-area,
    .smenode-no-sidebar #primary.content-area {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

@media (max-width: 768px) {
    .smenode-blog-archive .site-content-inner.edublink-container,
    .smenode-no-sidebar .site-content-inner.edublink-container {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}

@media (max-width: 576px) {
    .smenode-blog-archive .site-content-inner.edublink-container,
    .smenode-no-sidebar .site-content-inner.edublink-container {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
}/* ---------------------------------------------------------------------- */
/* Categories Bar Fixes - Strong Version                                  */
/* ---------------------------------------------------------------------- */

/* 1- Full center alignment for categories */
.blog-categories-bar {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    margin-top: 30px !important;
    margin-bottom: 0 !important;
    padding: 0 15px !important;
    width: 100% !important;
    text-align: center !important;
}

/* 2- Thinner font for buttons */
.blog-categories-bar .cat-item {
    font-weight: 400 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
	
}

.blog-categories-bar .cat-item span {
    font-weight: 400 !important;
}

/* 3- Reduce space between categories and posts - merged above */

.smenode-no-sidebar .site-content-inner.edublink-container {
    padding-top: 20px !important;
    margin-top: 0 !important;
}

.smenode-no-sidebar .edublink-main-content-inner {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.smenode-no-sidebar #primary.content-area {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.smenode-no-sidebar .edublink-blog-post-archive-style-1 {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Center text inside buttons */
.blog-categories-bar .cat-item {
    text-align: center !important;
    justify-content: center !important;
    align-items: center !important;
    line-height: 1 !important;
}

.blog-categories-bar .cat-item span {
    display: inline-block !important;
    vertical-align: middle !important;
    line-height: 1.2 !important;
}

.blog-categories-bar .cat-item i {
    display: none !important;
}

/* ============================================
   SMEnode Academy - Tutor Dashboard Beautify
   VERSION 3 - ALL FIXES
   Add to: Appearance > Customize > Additional CSS
   ============================================ */

/* ============================================
   1. WHITE BACKGROUND EVERYWHERE
   ============================================ */
.tutor-wrap.tutor-dashboard,
body,
.site-content,
.content-area,
main#main,
.tutor-wrap {
    background: var(--color-white) !important;
}

/* ============================================
   2. REMOVE EXTRA BORDERS (Horizontal & Vertical Lines)
   ============================================ */
.tutor-dashboard-header,
.tutor-wrap.tutor-dashboard,
.tutor-dashboard,
.tutor-row,
.tutor-col-12,
.tutor-col-md-4,
.tutor-col-lg-3,
.tutor-col-md-8,
.tutor-col-lg-9 {
    border: none !important;
    box-shadow: none !important;
}

/* Remove the horizontal line after header */
.tutor-dashboard-header::after,
.tutor-dashboard-header::before {
    display: none !important;
}

/* Remove all hr and dividers */
.tutor-wrap hr,
.tutor-dashboard hr {
    display: none !important;
}

/* Remove border from row */
.tutor-wrap.tutor-dashboard > .tutor-container > .tutor-row {
    border: none !important;
}

/* Left sidebar menu - border removed, styled below */

.tutor-col-lg-9,
.tutor-col-md-8 {
    border-left: none !important;
}

/* ============================================
   3. HEADER - FIXED AVATAR
   ============================================ */
.tutor-dashboard-header {
    background: var(--color-white) !important;
    padding: 24px 28px !important;
    margin-bottom: 0px !important;
}

/* Avatar Container */
.tutor-dashboard-header-avatar {
    width: 65px !important;
    height: 65px !important;
    min-width: 65px !important;
    min-height: 65px !important;
    max-width: 65px !important;
    max-height: 65px !important;
    overflow: hidden !important;
    border-radius: 14px !important;
    border: 3px solid var(--color-primary) !important;
    box-shadow: 0 4px 15px rgba(252, 103, 32, 0.25) !important;
    flex-shrink: 0 !important;
}

/* Avatar Image */
.tutor-dashboard-header-avatar img,
.tutor-dashboard-header-avatar .tutor-avatar {
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
    border-radius: 11px !important;
    border: none !important;
}

.tutor-dashboard-header-greetings {
    font-size: 15px !important;
    color: var(--color-gray-500) !important;
}

.tutor-dashboard-header-username {
    font-size: 1.375rem !important;
    font-weight: 700 !important;
    color: var(--color-secondary-dark) !important;
}

/* ============================================
   4. LEFT SIDEBAR MENU
   ============================================ */
.tutor-dashboard-left-menu {
    background: var(--color-white) !important;
    border-radius: var(--radius-lg) !important;
    padding: 12px !important;
    border: 1px solid var(--color-border-light) !important;
    border-right: none !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04) !important;
}

.tutor-dashboard-permalinks {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

.tutor-dashboard-menu-item {
    margin-bottom: 4px !important;
}

.tutor-dashboard-menu-item-link {
    display: flex !important;
    align-items: center !important;
    padding: 12px 16px !important;
    border-radius: 10px !important;
    color: var(--color-gray-500) !important;
    font-weight: 500 !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
    text-decoration: none !important;
}

.tutor-dashboard-menu-item-link:hover {
    background: #fff7ed !important;
    color: var(--color-primary) !important;
}

.tutor-dashboard-menu-item.active .tutor-dashboard-menu-item-link {
    background: linear-gradient(135deg, #fc6720 0%, #ff8a4c 100%) !important;
    color: var(--color-white) !important;
    box-shadow: 0 4px 15px rgba(252, 103, 32, 0.3) !important;
}

.tutor-dashboard-menu-divider {
    height: 1px !important;
    background: var(--color-border-light) !important;
    margin: 10px 8px !important;
}

/* ============================================
   5. MAIN CONTENT AREA
   ============================================ */
.tutor-dashboard-content {
    background: var(--color-white) !important;
    border-radius: var(--radius-lg) !important;
    padding: 24px !important;
    border: 1px solid var(--color-border-light) !important;
}

.tutor-dashboard-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--color-secondary-dark) !important;
    padding-bottom: 16px !important;
    border-bottom: 1px solid var(--color-border-light) !important;
    margin-bottom: 20px !important;
}

/* ============================================
   6. STATS CARDS
   ============================================ */
.tutor-dashboard-content-inner .tutor-card {
    background: var(--color-white) !important;
    border-radius: 14px !important;
    border: 1px solid var(--color-border-light) !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
}

.tutor-dashboard-content-inner .tutor-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
    border-color: var(--color-primary) !important;
}

.tutor-round-box {
    width: 52px !important;
    height: 52px !important;
    border-radius: var(--radius-md) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Blue */
.tutor-col-xl-4:nth-child(1) .tutor-round-box {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%) !important;
}
.tutor-col-xl-4:nth-child(1) .tutor-round-box i {
    color: var(--color-info) !important;
    font-size: 1.375rem !important;
}

/* Orange */
.tutor-col-xl-4:nth-child(2) .tutor-round-box {
    background: linear-gradient(135deg, #ffedd5 0%, #fed7aa 100%) !important;
}
.tutor-col-xl-4:nth-child(2) .tutor-round-box i {
    color: var(--color-warning) !important;
    font-size: 1.375rem !important;
}

/* Green */
.tutor-col-xl-4:nth-child(3) .tutor-round-box {
    background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%) !important;
}
.tutor-col-xl-4:nth-child(3) .tutor-round-box i {
    color: var(--color-success) !important;
    font-size: 1.375rem !important;
}

.tutor-card .tutor-fs-3 {
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    color: var(--color-secondary-dark) !important;
}

.tutor-card .tutor-fs-7 {
    font-size: 15px !important;
    color: var(--color-gray-500) !important;
}

/* ============================================
   7. MY COURSES SECTION
   ============================================ */
.popular-courses-heading-dashboard {
    margin-top: 28px !important;
    padding-top: 20px !important;
    border-top: 1px solid var(--color-border-light) !important;
}

.popular-courses-heading-dashboard .tutor-fs-5 {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--color-secondary-dark) !important;
}

.popular-courses-heading-dashboard .tutor-btn-ghost {
    color: var(--color-primary) !important;
    font-weight: 600 !important;
}

/* ============================================
   8. COURSES TABLE
   ============================================ */
.tutor-table thead th {
    padding: 12px 16px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--color-gray-500) !important;
    text-transform: uppercase !important;
    background: #f8fafc !important;
}

.tutor-table tbody td {
    padding: 14px 16px !important;
    vertical-align: middle !important;
}

.tutor-table tbody td a {
    color: var(--color-secondary-dark) !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}

.tutor-table tbody td a:hover {
    color: var(--color-primary) !important;
}

.tutor-ratings-stars span {
    color: #fbbf24 !important;
}

/* ============================================
   9. BUTTONS
   ============================================ */
.tutor-btn-primary {
    background: linear-gradient(135deg, #fc6720 0%, #ff8a4c 100%) !important;
    border: none !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 15px rgba(252, 103, 32, 0.3) !important;
}

.tutor-btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(252, 103, 32, 0.4) !important;
}

/* ============================================
   10. RESPONSIVE
   ============================================ */
@media (max-width: 576px) {
    .tutor-dashboard-header-avatar,
    .tutor-dashboard-header-avatar img {
        width: 55px !important;
        height: 55px !important;
        min-width: 55px !important;
        min-height: 55px !important;
        max-width: 55px !important;
        max-height: 55px !important;
    }
    
    .tutor-dashboard-header-username {
        font-size: 18px !important;
    }
}

/* ============================================
   REMOVE ONLY EXTRA LINES (Keep box borders)
   ============================================ */

/* Remove the horizontal line UNDER header */
.tutor-frontend-dashboard-header {
    border: none !important;
    border-bottom: none !important;
}

.tutor-frontend-dashboard-header::after,
.tutor-frontend-dashboard-header::before {
    display: none !important;
    content: none !important;
}

/* Remove border between header sections */
.tutor-header-left-side,
.tutor-header-right-side,
.tutor-dashboard-header {
    border: none !important;
}

/* Remove vertical line between sidebar and content */
.tutor-row > .tutor-col-12.tutor-col-md-4.tutor-col-lg-3 {
    border-right: none !important;
}

.tutor-row > .tutor-col-12.tutor-col-md-8.tutor-col-lg-9 {
    border-left: none !important;
}

/* Remove any hr elements */
.tutor-wrap hr,
.tutor-dashboard hr,
.tutor-frontend-dashboard hr {
    display: none !important;
}

/* ============================================
   KEEP NICE BOX STYLING FOR SIDEBAR & CONTENT
   ============================================ */

/* Sidebar box - merged into section 4 above */

/* Content box */
.tutor-dashboard-content {
    background: var(--color-white) !important;
    border-radius: var(--radius-lg) !important;
    padding: 24px !important;
    border: 1px solid var(--color-border-light) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04) !important;
}

/* Menu divider - subtle line between menu items */
.tutor-dashboard-menu-divider {
    height: 1px !important;
    background: #f0f0f0 !important;
    border: none !important;
    margin: 8px 12px !important;
}

/* ============================================
   REMOVE VERTICAL LINE NEXT TO SIDEBAR
   ============================================ */

/* Remove border from sidebar container */
.tutor-col-12.tutor-col-md-4.tutor-col-lg-3.tutor-dashboard-left-menu {
    border: none !important;
    border-right: none !important;
    box-shadow: none !important;
}

/* Remove border from main content row */
.tutor-frontend-dashboard-main-content {
    border: none !important;
    border-left: none !important;
}

.tutor-frontend-dashboard-main-content > .tutor-row {
    border: none !important;
}

.tutor-frontend-dashboard-main-content > .tutor-row > div {
    border: none !important;
    border-left: none !important;
    border-right: none !important;
}

/* Target the specific columns */
.tutor-row > [class*="tutor-col"] {
    border-left: none !important;
    border-right: none !important;
}

/* Remove any pseudo elements that might create lines */
.tutor-dashboard-left-menu::before,
.tutor-dashboard-left-menu::after,
.tutor-dashboard-permalinks::before,
.tutor-dashboard-permalinks::after {
    display: none !important;
    content: none !important;
}

/* ============================================
   MAX WIDTH 1140px - Match Header Width
   ============================================ */

.tutor-wrap.tutor-dashboard,
.tutor-wrap.tutor-dashboard > .tutor-container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
}

/* Also apply to the row */
.tutor-wrap.tutor-dashboard .tutor-container > .tutor-row {
    max-width: 100% !important;
}

/* ============================================
   GLASSMORPHISM HEADER BOX
   ============================================ */

.tutor-frontend-dashboard-header {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border-radius: var(--radius-xl) !important;
    border: 10px solid rgba(253, 139, 85, 1) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06) !important;
    padding: 0px 28px !important;
    margin-bottom: 24px !important;
	margin-top : 0px !important ;
}
.tutor-frontend-dashboard .tutor-container {
    overflow: visible !important;
}

/* ============================================
   HEADER BOX WITH BORDER - 1px
   ============================================ */

.tutor-frontend-dashboard-header {
    background: rgba(255, 255, 255, 0.9) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border-radius: var(--radius-xl) !important;
    padding: 20px 28px !important;
    margin-bottom: 24px !important;
    margin-top: 0px !important;
    position: relative !important;
    
    /* 1px Border using Box Shadow */
    box-shadow: 
        0 0 0 1px #fc6720,
        0 8px 32px rgba(0, 0, 0, 0.06) !important;
}

.tutor-frontend-dashboard-header:hover {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08) !important;
}

/* Active courses text styling */
.sme-active-courses-text {
    font-size: 15px !important;
    color: var(--color-gray-500) !important;
    margin-top: 6px !important;
}

.sme-active-courses-text span {
    color: var(--color-primary) !important;
    font-weight: 400 !important;
}

/* ============================================
   MOBILE - FORCE SYMMETRIC LAYOUT
   ============================================ */

@media (max-width: 576px) {
    
    /* Wrap Parent */
    .tutor-wrap.tutor-wrap-parent {
        padding: 0 !important;
    }
    
    /* Container */
    .tutor-frontend-dashboard .tutor-container {
        padding-left: 16px !important;
        padding-right: 16px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    
    /* ALL Rows - Remove Negative Margins */
    .tutor-frontend-dashboard .tutor-row {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }
    
    /* Header Row */
    .tutor-frontend-dashboard-header {
        padding-left: 0 !important;
        padding-right: 0 !important;
		margin-top : 20px !important ;
    }
    
    /* Main Content Row */
    .tutor-frontend-dashboard-maincontent {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Hide Sidebar 
    .tutor-dashboard-left-menu {
        display: none !important;
    }
    
    /* Content Column - FORCE Full Width */
    .tutor-frontend-dashboard-maincontent > .tutor-col-12.tutor-col-md-8.tutor-col-lg-9,
    .tutor-frontend-dashboard-maincontent > div[class*="tutor-col-lg-9"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Header Columns */
    .tutor-frontend-dashboard-header > .tutor-col-md-6,
    .tutor-frontend-dashboard-header > div[class*="tutor-col"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
		
    }
    
    /* Dashboard Content */
    .tutor-dashboard-content {
        padding-left: 15px !important;
        padding-right: 15px !important;
        width: 100% !important;
    }
    
    /* Stats Row */
    .tutor-dashboard-content-inner .tutor-row {
        margin-left: -8px !important;
        margin-right: -8px !important;
    }
    
    .tutor-dashboard-content-inner [class*="tutor-col"] {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
    
    /* Course Progress Cards */
    .tutor-frontend-dashboard-course-progress {
        width: 100% !important;
    }
    
    .tutor-course-progress-item.tutor-card {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }
    
    /* Calendar */
    .sme-calendar-container {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* ============================================
   MOBILE - HEADER & BOXES CENTERING FIX
   ============================================ */

@media (max-width: 567px) {
    
    /* Main Container - Full Width */
    .tutor-frontend-dashboard-header {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        padding: 0 16px !important;
    }
    
    /* Left Side - Profile Section */
    .tutor-header-left-side.tutor-dashboard-header {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        width: 100% !important;
        justify-content: center !important;
    }
    
    /* Avatar */
    .tutor-dashboard-header-avatar {
        margin: 0 auto 16px auto !important;
    }
    
    /* User Info */
    .tutor-user-info {
        margin-left: 0 !important;
        text-align: center !important;
        width: 100% !important;
    }
    
    /* Active Courses Text */
    .sme-active-courses-text {
        text-align: center !important;
        justify-content: center !important;
    }
    
    /* Right Side - Quick Action Buttons */
    .tutor-header-right-side {
        width: 100% !important;
        justify-content: center !important;
        margin-top: 20px !important;
    }
    
    .sme-quick-actions {
        justify-content: center !important;
        width: 100% !important;
    }
    
    /* Dashboard Title with Orange Bar */
    .tutor-dashboard-title,
    .tutor-dashboard-content > .tutor-fs-5.tutor-fw-medium {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        width: 100% !important;
    }
    
    /* Stats Cards Row */
    .tutor-dashboard-content-inner .tutor-row {
        justify-content: start !important;
    }
    
    /* Each Stats Card */
    .tutor-dashboard-content-inner .tutor-col-lg-6,
    .tutor-dashboard-content-inner .tutor-col-xl-4 {
        display: flex !important;
        justify-content: center !important;
    }
    
    .tutor-dashboard-content-inner .tutor-card {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* In Progress Section Title */
    .tutor-frontend-dashboard-course-progress > .tutor-fs-5 {
        text-align: center !important;
    }
    
    /* Profile Card Centering */
    .tutor-frontend-dashboard-header .tutor-col-md-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

/* Dashboard Container Width Fix for Desktop */
.tutor-wrap.tutor-dashboard .tutor-container,
.tutor-frontend-dashboard .tutor-container {
    max-width: 1160px !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.tutor-frontend-dashboard-header {
    max-width: 100% !important;
}
/* Center Dashboard Header Box */
.tutor-frontend-dashboard-header {
    max-width: 1140px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
/* ============================================
   TUTOR CALENDAR - SIMPLE FIX (NO STICKY)
   ============================================ */

/* Disable sticky only */
.tutor-calendar-wrapper,
.tutor-calendar-wrapper.is-sticky {
    position: relative !important;
    top: auto !important;
}

.tutor-calendar-sticky-wrapper {
    position: relative !important;
    height: auto !important;
}

/* Just style the today date */
.tutor-calendar-date.today a {
    background: linear-gradient(135deg, #fc6720 50%, #ff8a4c 100%) !important;
    color: var(--color-white) !important;
    border-radius: 50% !important;
}

/* ============================================
   IN PROGRESS COURSES - GLASSMORPHISM
   ============================================ */

/* Section title */
.tutor-frontend-dashboard-course-progress > .tutor-fs-5 {
    color: var(--color-secondary-dark) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    margin-bottom: 20px !important;
}

/* Course card - Glassmorphism */
.tutor-course-progress-item.tutor-card {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    border-radius: var(--radius-xl) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08) !important;
    overflow: hidden !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
}

.tutor-course-progress-item.tutor-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.12) !important;
    border-color: rgba(252, 103, 32, 0.3) !important;
}

/* Course image */
.tutor-course-progress-item .tutor-card-image-left {
    border-radius: 16px 0 0 16px !important;
    object-fit: cover !important;
    transition: transform 0.3s ease !important;
}

.tutor-course-progress-item:hover .tutor-card-image-left {
    transform: scale(1.05) !important;
}

/* Card body */
.tutor-course-progress-item .tutor-card-body {
    padding: 24px !important;
}

/* Course title */
.tutor-course-progress-item-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--color-secondary-dark) !important;
    transition: color 0.2s ease !important;
}

.tutor-course-progress-item:hover .tutor-course-progress-item-title {
    color: var(--color-primary) !important;
}

/* Rating stars */
.tutor-course-progress-item .tutor-ratings-stars i {
    color: #fbbf24 !important;
    font-size: 15px !important;
}

.tutor-course-progress-item .tutor-ratings-count {
    color: var(--color-gray-500) !important;
    font-size: 15px !important;
}

/* Completed lessons text */
.tutor-course-progress-item .tutor-color-muted {
    color: var(--color-gray-500) !important;
}

/* Progress bar container */
.tutor-course-progress-item .tutor-progress-bar {
    height: 8px !important;
    background: var(--color-border) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

/* Progress bar value */
.tutor-course-progress-item .tutor-progress-value {
    background: linear-gradient(135deg, #fc6720 0%, #ff8a4c 100%) !important;
    border-radius: 10px !important;
    transition: width 0.5s ease !important;
}

/* Progress percentage */
.tutor-course-progress-item .progress-percentage {
    font-size: 15px !important;
}

.tutor-course-progress-item .progress-percentage .tutor-fw-medium {
    color: var(--color-primary) !important;
    font-weight: 700 !important;
}

/* Responsive */
@media (max-width: 991px) {
    .tutor-course-progress-item .tutor-card-image-left {
        border-radius: 16px 16px 0 0 !important;
    }
    
    .tutor-course-progress-item .tutor-card-body {
        padding: 20px !important;
    }
}

/* ============================================
   COURSE IMAGE FIX
   ============================================ */

/* Image container */
.tutor-course-progress-item .tutor-ratio {
    border-radius: var(--radius-lg) !important;
    overflow: hidden !important;
    margin: 12px !important;
}

/* Image itself */
.tutor-course-progress-item .tutor-card-image-left {
    border-radius: var(--radius-lg) !important;
    object-fit: cover !important;
    width: 100% !important;
    height: 100% !important;
}

/* Remove old border-radius from card that affects image */
.tutor-course-progress-item.tutor-card .tutor-col-lg-4 {
    padding: 0 !important;
}

.tutor-course-progress-item .tutor-ratio.tutor-ratio-3x2 {
    margin: 16px !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
}

/* ============================================
   RESPONSIVE - MOBILE
   ============================================ */

@media (max-width: 576px) {
    
    /* Force row to column */
    .tutor-course-progress-item .tutor-row.tutor-gx-0 {
        display: flex !important;
        flex-direction: column !important;
    }
    
    /* Image column - full width */
    .tutor-course-progress-item.tutor-card .tutor-col-lg-4 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding: 0 !important;
    }
    
    /* Content column - full width */
    .tutor-course-progress-item .tutor-col-lg-8 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
    
    /* Image container - full width, no margin on mobile */
    .tutor-course-progress-item .tutor-ratio.tutor-ratio-3x2 {
        margin: 0 !important;
        border-radius: 12px 12px 0 0 !important;
        width: 100% !important;
        height: auto !important;
        padding-bottom: 56% !important;
        position: relative !important;
        box-shadow: none !important;
    }
    
    /* Image - fill container */
    .tutor-course-progress-item .tutor-card-image-left {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        border-radius: 12px 12px 0 0 !important;
    }
    
    /* Card styling */
    .tutor-course-progress-item.tutor-card {
        border-radius: var(--radius-md) !important;
        overflow: hidden !important;
    }
}

/* ============================================
   IN PROGRESS COURSES - Tablet Only Fix
   ============================================ */

@media (min-width: 577px) and (max-width: 991px) {
    /* Keep row horizontal like desktop */
    .tutor-course-progress-item .tutor-row.tutor-gx-0 {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
    }
    
    /* Image column */
    .tutor-course-progress-item .tutor-col-lg-4 {
        width: 35% !important;
        max-width: 35% !important;
        flex: 0 0 35% !important;
    }
    
    /* Content column */
    .tutor-course-progress-item .tutor-col-lg-8 {
        width: 65% !important;
        max-width: 65% !important;
        flex: 0 0 65% !important;
    }
    
    /* Image container */
    .tutor-course-progress-item .tutor-ratio.tutor-ratio-3x2 {
        margin: 12px !important;
        border-radius: var(--radius-md) !important;
    }
    
    /* Card body */
    .tutor-course-progress-item .tutor-card-body {
        padding: 16px !important;
    }
    
    /* Title */
    .tutor-course-progress-item-title {
        font-size: 16px !important;
    }
}

/* ============================================
   STAT CARDS - CLICKABLE STYLE
   ============================================ */

.tutor-dashboard-content .tutor-card {
    cursor: pointer !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
}

.tutor-dashboard-content .tutor-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12) !important;
    border-color: var(--color-primary) !important;
}

.tutor-dashboard-content .tutor-card:active {
    transform: translateY(-2px) !important;
}

/* ============================================
   HEADER RIGHT SIDE - QUICK ACTIONS
   ============================================ */

.tutor-header-right-side {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
}

/* ============================================
   SMEnode Academy - My Profile Page Styling
   Version: 4.0
   Add AFTER the main dashboard CSS (v4)
   ============================================ */

/* ============================================
   1. PAGE TITLE
   ============================================ */
.tutor-dashboard-content > .tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24 {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    padding-bottom: 16px !important;
    margin-bottom: 24px !important;
    border-bottom: 2px solid var(--color-border-light) !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.tutor-dashboard-content > .tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24::before {
    content: '' !important;
    width: 4px !important;
    height: 24px !important;
    background: linear-gradient(135deg, #fc6720 0%, #ff8a4c 100%) !important;
    border-radius: 2px !important;
}

/* ============================================
   2. PROFILE DATA CONTAINER
   ============================================ */
.tutor-dashboard-content-inner.tutor-dashboard-profile-data {
    background: var(--color-white) !important;
    border-radius: var(--radius-lg) !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid var(--color-border) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04) !important;
}

/* ============================================
   3. PROFILE DATA ROWS
   ============================================ */
.tutor-dashboard-profile-data > .tutor-row {
    padding: 18px 24px !important;
    margin: 0 !important;
    border-bottom: 1px solid var(--color-border-light) !important;
    transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast) !important;
    align-items: flex-start !important;
}

.tutor-dashboard-profile-data > .tutor-row:last-child {
    border-bottom: none !important;
}

.tutor-dashboard-profile-data > .tutor-row:hover {
    background: #fffbf8 !important;
}

/* ============================================
   4. ALTERNATING ROW COLORS
   ============================================ */
.tutor-dashboard-profile-data > .tutor-row:nth-child(even) {
    background: #fafbfc !important;
}

.tutor-dashboard-profile-data > .tutor-row:nth-child(even):hover {
    background: #fff7ed !important;
}

/* ============================================
   5. LABEL COLUMN (Left side)
   ============================================ */
.tutor-dashboard-profile-data .tutor-col-12.tutor-col-sm-5.tutor-col-lg-3 {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.tutor-dashboard-profile-data .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--color-gray-500) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* ============================================
   6. LABEL ICONS - Using Tutor LMS Icons
   ============================================ */
.tutor-dashboard-profile-data .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: var(--radius-sm) !important;
    font-size: 15px !important;
    flex-shrink: 0 !important;
    font-family: "tutor" !important;
    font-weight: 400 !important;
    speak: never;
    font-style: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Registration Date - Calendar Icon */
.tutor-dashboard-profile-data > .tutor-row:nth-child(1) .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
    content: '\e92d' !important;
    background: rgba(59, 130, 246, 0.1) !important;
    color: #3b82f6 !important;
}

/* First Name - User Icon */
.tutor-dashboard-profile-data > .tutor-row:nth-child(2) .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
    content: '\e91b' !important;
    background: rgba(16, 185, 129, 0.1) !important;
    color: #10b981 !important;
}

/* Last Name - User Icon */
.tutor-dashboard-profile-data > .tutor-row:nth-child(3) .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
    content: '\e91b' !important;
    background: rgba(16, 185, 129, 0.1) !important;
    color: #10b981 !important;
}

/* Username - Man User Icon */
.tutor-dashboard-profile-data > .tutor-row:nth-child(4) .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
    content: '\e963' !important;
    background: rgba(139, 92, 246, 0.1) !important;
    color: #8b5cf6 !important;
}

/* Email - Envelope Icon */
.tutor-dashboard-profile-data > .tutor-row:nth-child(5) .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
    content: '\e96a' !important;
    background: rgba(252, 103, 32, 0.1) !important;
    color: #fc6720 !important;
}

/* Phone Number - Using Link/Contact Icon */
.tutor-dashboard-profile-data > .tutor-row:nth-child(6) .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
    content: '\e991' !important;
    background: rgba(236, 72, 153, 0.1) !important;
    color: #ec4899 !important;
}

/* Skill/Occupation - Badge/Graduation Icon */
.tutor-dashboard-profile-data > .tutor-row:nth-child(7) .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
    content: '\e969' !important;
    background: rgba(245, 158, 11, 0.1) !important;
    color: #f59e0b !important;
}

/* Biography - Document Icon */
.tutor-dashboard-profile-data > .tutor-row:nth-child(8) .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
    content: '\e932' !important;
    background: rgba(99, 102, 241, 0.1) !important;
    color: #6366f1 !important;
}

/* ============================================
   7. VALUE COLUMN (Right side)
   ============================================ */
.tutor-dashboard-profile-data .tutor-col-12.tutor-col-sm-7.tutor-col-lg-9 > .tutor-fs-6.tutor-fw-medium.tutor-color-black {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--color-text-primary) !important;
    line-height: 1.6 !important;
}

/* Empty value styling (dash) */
.tutor-dashboard-profile-data .tutor-col-lg-9 > .tutor-fs-6.tutor-fw-medium.tutor-color-black:empty::after {
    content: '—' !important;
    color: var(--color-gray-400) !important;
}

/* ============================================
   8. BIOGRAPHY SECTION - SPECIAL STYLING
   ============================================ */
.tutor-dashboard-profile-data .tutor-col-lg-9 > .tutor-fs-6.tutor-color-secondary {
    font-size: 15px !important;
    line-height: 1.7 !important;
    color: var(--color-gray-500) !important;
}

.tutor-dashboard-profile-data .tutor-col-lg-9 blockquote {
    background: linear-gradient(135deg, rgba(252, 103, 32, 0.04) 0%, rgba(252, 103, 32, 0.01) 100%) !important;
    border-left: 4px solid var(--color-primary) !important;
    border-radius: 0 12px 12px 0 !important;
    padding: 20px 24px !important;
    margin: 8px 0 0 0 !important;
    font-style: normal !important;
}

.tutor-dashboard-profile-data .tutor-col-lg-9 blockquote p {
    margin-bottom: 14px !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
    color: var(--color-gray-500) !important;
}

.tutor-dashboard-profile-data .tutor-col-lg-9 blockquote p:last-child {
    margin-bottom: 0 !important;
}

.tutor-dashboard-profile-data .tutor-col-lg-9 blockquote strong {
    color: var(--color-text-primary) !important;
    font-weight: 600 !important;
}

/* ============================================
   9. RESPONSIVE DESIGN
   ============================================ */
@media (max-width: 991px) {
    .tutor-dashboard-profile-data > .tutor-row {
        padding: 16px 20px !important;
    }
    
    .tutor-dashboard-profile-data .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary {
        font-size: 14px !important;
        margin-bottom: 8px !important;
    }
    
    .tutor-dashboard-profile-data .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary::before {
        width: 28px !important;
        height: 28px !important;
        font-size: 14px !important;
    }
}

@media (max-width: 576px) {
    .tutor-dashboard-content > .tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24 {
        font-size: 18px !important;
        padding-bottom: 12px !important;
        margin-bottom: 16px !important;
    }
    
    .tutor-dashboard-profile-data > .tutor-row {
        padding: 14px 16px !important;
        flex-direction: column !important;
    }
    
    .tutor-dashboard-profile-data .tutor-col-12.tutor-col-sm-5.tutor-col-lg-3,
    .tutor-dashboard-profile-data .tutor-col-12.tutor-col-sm-7.tutor-col-lg-9 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
    
    .tutor-dashboard-profile-data .tutor-col-lg-3 > .tutor-fs-6.tutor-color-secondary {
        margin-bottom: 8px !important;
    }
    
    .tutor-dashboard-profile-data .tutor-col-lg-9 blockquote {
        padding: 16px 18px !important;
    }
    
    .tutor-dashboard-profile-data .tutor-col-lg-9 blockquote p {
        font-size: 15px !important;
    }
}

/* ============================================
   FIX: Remove Quote Icon from Biography
   ============================================ */
.tutor-dashboard-profile-data .tutor-col-lg-9 blockquote::before,
.tutor-dashboard-profile-data .tutor-col-lg-9 blockquote::after,
.tutor-dashboard-profile-data blockquote::before,
.tutor-dashboard-profile-data blockquote::after {
    display: none !important;
    content: none !important;
}

/* Also target any quote icon that might be added by theme */
.tutor-dashboard-profile-data blockquote p::before,
.tutor-dashboard-profile-data blockquote p::after {
    display: none !important;
    content: none !important;
}

/* ============================================
   ENROLLED COURSES PAGE - Fixed & Responsive
   SMEnode Academy
   Version: 2.0 - Complete Fix
   ============================================ */

/* ============================================
   1. PAGE TITLE WITH ORANGE BAR
   ============================================ */
.tutor-dashboard-content > div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-16,
.tutor-dashboard-content > .tutor-fs-5.tutor-fw-medium {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--color-text-primary) !important;
    padding-left: 16px !important;
    margin-bottom: 24px !important;
    position: relative !important;
    border: none !important;
    background: transparent !important;
}

.tutor-dashboard-content > div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-16::before,
.tutor-dashboard-content > .tutor-fs-5.tutor-fw-medium::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 4px !important;
    background: var(--color-primary) !important;
    border-radius: 2px !important;
}

/* ============================================
   2. TAB NAVIGATION - FIXED VERSION
   ============================================ */

/* Remove outer box */
.tutor-dashboard-content-inner.enrolled-courses,
.tutor-dashboard-content-inner {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Tabs Container - Pill Style */
.tutor-dashboard-content-inner > .tutor-mb-32,
.enrolled-courses .tutor-mb-32 {
    background: var(--color-bg-light) !important;
    border-radius: var(--radius-full) !important;
    padding: 6px !important;
    margin-bottom: 28px !important;
    display: inline-flex !important;
    border: none !important;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.06) !important;
}

/* Nav List */
ul.tutor-nav,
.enrolled-courses ul.tutor-nav,
ul.tutor-nav[tutor-priority-nav] {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    list-style: none !important;
    border-bottom: none !important;
}

/* Nav Items */
ul.tutor-nav .tutor-nav-item,
.enrolled-courses ul.tutor-nav .tutor-nav-item {
    list-style: none !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
}

/* Tab Links - Default State */
ul.tutor-nav .tutor-nav-item .tutor-nav-link,
.enrolled-courses ul.tutor-nav .tutor-nav-item .tutor-nav-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 24px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--color-gray-500) !important;
    background: transparent !important;
    border: none !important;
    border-radius: var(--radius-full) !important;
    text-decoration: none !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
    white-space: nowrap !important;
    position: relative !important;
}

/* Tab Links - Hover State */
ul.tutor-nav .tutor-nav-item .tutor-nav-link:hover,
.enrolled-courses ul.tutor-nav .tutor-nav-item .tutor-nav-link:hover {
    color: var(--color-primary) !important;
    background: rgba(252, 103, 32, 0.08) !important;
}

/* Tab Links - Active State (FIXED) */
ul.tutor-nav .tutor-nav-item .tutor-nav-link.is-active,
.enrolled-courses ul.tutor-nav .tutor-nav-item .tutor-nav-link.is-active {
    color: var(--color-white) !important;
    font-weight: 600 !important;
    background: linear-gradient(135deg, #fc6720 0%, #ff8a50 100%) !important;
    box-shadow: 0 4px 15px rgba(252, 103, 32, 0.4) !important;
}

/* Remove any pseudo-elements on active tab */
ul.tutor-nav .tutor-nav-item .tutor-nav-link.is-active::before,
ul.tutor-nav .tutor-nav-item .tutor-nav-link.is-active::after,
.enrolled-courses ul.tutor-nav .tutor-nav-item .tutor-nav-link.is-active::before,
.enrolled-courses ul.tutor-nav .tutor-nav-item .tutor-nav-link.is-active::after {
    display: none !important;
    content: none !important;
}

/* Hide more dropdown */
ul.tutor-nav .tutor-nav-more,
.enrolled-courses ul.tutor-nav .tutor-nav-more {
    display: none !important;
}

/* ============================================
   3. COURSE GRID
   ============================================ */
.enrolled-courses .tutor-grid.tutor-grid-3,
.tutor-grid.tutor-grid-3 {
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

/* ============================================
   4. RESPONSIVE - TABLET
   ============================================ */
@media (max-width: 991px) {
    /* Tabs Container */
    .tutor-dashboard-content-inner > .tutor-mb-32,
    .enrolled-courses .tutor-mb-32 {
        display: flex !important;
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        border-radius: 40px !important;
        padding: 5px !important;
    }
    
    .tutor-dashboard-content-inner > .tutor-mb-32::-webkit-scrollbar,
    .enrolled-courses .tutor-mb-32::-webkit-scrollbar {
        display: none !important;
    }
    
    /* Nav List */
    ul.tutor-nav,
    .enrolled-courses ul.tutor-nav {
        flex-wrap: nowrap !important;
        width: max-content !important;
    }
    
    /* Tab Links */
    ul.tutor-nav .tutor-nav-item .tutor-nav-link,
    .enrolled-courses ul.tutor-nav .tutor-nav-item .tutor-nav-link {
        padding: 10px 18px !important;
        font-size: 15px !important;
    }
}

/* ============================================
   5. RESPONSIVE - MOBILE
   ============================================ */
@media (max-width: 576px) {
    /* Page Title */
    .tutor-dashboard-content > div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-16,
    .tutor-dashboard-content > .tutor-fs-5.tutor-fw-medium {
        font-size: 16px !important;
        padding-left: 14px !important;
        margin-bottom: 20px !important;
    }
    
    /* Tabs Container */
    .tutor-dashboard-content-inner > .tutor-mb-32,
    .enrolled-courses .tutor-mb-32 {
        border-radius: 35px !important;
        padding: 4px !important;
        margin-bottom: 20px !important;
    }
    
    /* Tab Links */
    ul.tutor-nav .tutor-nav-item .tutor-nav-link,
    .enrolled-courses ul.tutor-nav .tutor-nav-item .tutor-nav-link {
        padding: 8px 14px !important;
        font-size: 14px !important;
    }
    
    /* Active Tab */
    ul.tutor-nav .tutor-nav-item .tutor-nav-link.is-active,
    .enrolled-courses ul.tutor-nav .tutor-nav-item .tutor-nav-link.is-active {
        box-shadow: 0 3px 10px rgba(252, 103, 32, 0.35) !important;
    }
}

/* ============================================
   SETTINGS PAGE - Modern Attractive Design
   SMEnode Academy - Responsive Version
   ============================================ */

/* ============================================
   SETTINGS FORM - Clean & Professional
   SMEnode Academy - Fixed Version
   ============================================ */

/* ============================================
   1. FORM CONTAINER
   ============================================ */
.tutor-dashboard-setting-profile form {
    padding: 100px 32px 32px !important;
    background: var(--color-white) !important;
}

/* ============================================
   2. FORM ROWS - Clean Layout
   ============================================ */
.tutor-dashboard-setting-profile .tutor-row {
    margin: 0 -12px !important;
    display: flex !important;
    flex-wrap: wrap !important;
}

.tutor-dashboard-setting-profile [class*="tutor-col-"] {
    padding: 0 12px !important;
    margin-bottom: 20px !important;
}

/* ============================================
   3. LABELS - Simple Style
   ============================================ */
.tutor-form-label,
.tutor-dashboard-setting-profile label.tutor-form-label {
    display: block !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--color-text-secondary) !important;
    margin-bottom: 8px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
}

/* ============================================
   4. INPUT FIELDS - Clean Rectangle
   ============================================ */
.tutor-form-control,
.tutor-dashboard-setting-profile .tutor-form-control {
    width: 100% !important;
    padding: 12px 16px !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--color-text-primary) !important;
    background: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-sm) !important;
    transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast) !important;
    box-sizing: border-box !important;
}

.tutor-form-control:hover {
    border-color: var(--color-gray-400) !important;
}

.tutor-form-control:focus {
    outline: none !important;
    background: var(--color-white) !important;
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgba(252, 103, 32, 0.1) !important;
}

.tutor-form-control:disabled {
    background: var(--color-border-light) !important;
    color: var(--color-gray-400) !important;
    cursor: not-allowed !important;
}

.tutor-form-control::placeholder {
    color: var(--color-gray-400) !important;
    font-weight: 400 !important;
}

/* ============================================
   5. SELECT DROPDOWN - Clean Style
   ============================================ */
.tutor-form-select,
.tutor-dashboard-setting-profile select.tutor-form-select,
.tutor-js-form-select,
.tutor-form-control.tutor-form-select.tutor-js-form-select {
    width: 100% !important;
    padding: 12px 16px !important;
    padding-right: 40px !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--color-text-primary) !important;
    background: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-sm) !important;
    cursor: pointer !important;
    appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 16px !important;
    transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast) !important;
}

.tutor-form-select:hover,
.tutor-js-form-select:hover {
    border-color: var(--color-gray-400) !important;
}

.tutor-form-select:focus,
.tutor-js-form-select:focus {
    outline: none !important;
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgba(252, 103, 32, 0.1) !important;
}

/* Select Label */
.tutor-form-select-label {
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--color-text-primary) !important;
}

/* Select Dropdown Menu */
.tutor-form-select-dropdown {
    position: absolute !important;
    top: calc(100% + 4px) !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-sm) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
    z-index: var(--z-toast) !important;
    max-height: 250px !important;
    overflow-y: auto !important;
}

.tutor-form-select-option {
    padding: 10px 16px !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--color-text-secondary) !important;
    cursor: pointer !important;
    transition: background 0.15s ease !important;
}

.tutor-form-select-option:hover {
    background: var(--color-bg-light) !important;
}

.tutor-form-select-option.is-active {
    background: #fff7ed !important;
    color: var(--color-primary) !important;
}

/* ============================================
   6. BIO EDITOR - Clean Border
   ============================================ */
.tutor-dashboard-setting-profile .wp-editor-wrap,
.tutor-dashboard-setting-profile .tutor-form-group .wp-editor-wrap {
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-sm) !important;
    overflow: hidden !important;
    background: var(--color-white) !important;
    transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast) !important;
}

.tutor-dashboard-setting-profile .wp-editor-wrap:focus-within {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgba(252, 103, 32, 0.1) !important;
}

.tutor-dashboard-setting-profile .wp-editor-tabs {
    background: var(--color-bg-light) !important;
    border-bottom: 1px solid var(--color-border) !important;
    padding: 6px 10px !important;
}

.tutor-dashboard-setting-profile .wp-switch-editor {
    background: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 4px !important;
    padding: 4px 10px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--color-gray-500) !important;
    transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast) !important;
}

.tutor-dashboard-setting-profile .wp-switch-editor:hover {
    background: var(--color-border-light) !important;
    color: var(--color-text-secondary) !important;
}

.tutor-dashboard-setting-profile .wp-switch-editor.switch-tmce {
    background: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: var(--color-white) !important;
}

.tutor-dashboard-setting-profile .mce-toolbar-grp {
    background: var(--color-bg-light) !important;
    border-bottom: 1px solid var(--color-border) !important;
    padding: 6px !important;
}

.tutor-dashboard-setting-profile .mce-btn {
    background: transparent !important;
    border-radius: 4px !important;
}

.tutor-dashboard-setting-profile .mce-btn:hover {
    background: var(--color-border) !important;
}

.tutor-dashboard-setting-profile .mce-edit-area iframe {
    min-height: 120px !important;
    background: var(--color-white) !important;
}

/* ============================================
   7. HELPER TEXT - Subtle
   ============================================ */
.tutor-fs-7.tutor-color-secondary,
.tutor-dashboard-setting-profile .tutor-fs-7 {
    font-size: 14px !important;
    color: var(--color-gray-400) !important;
    margin-top: 6px !important;
    line-height: 1.5 !important;
    font-style: normal !important;
}

/* ============================================
   8. SUBMIT BUTTON - Clean Style
   ============================================ */
.tutor-profile-settings-save,
.tutor-btn.tutor-btn-primary.tutor-profile-settings-save {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    border: none !important;
    padding: 14px 32px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-radius: var(--radius-sm) !important;
    cursor: pointer !important;
    transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast) !important;
    margin-top: 8px !important;
    box-shadow: none !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.tutor-profile-settings-save:hover {
    background: #e55a1b !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(252, 103, 32, 0.3) !important;
}

/* ============================================
   9. FORM GROUP SPACING
   ============================================ */
.tutor-dashboard-setting-profile .tutor-mb-32 {
    margin-bottom: 20px !important;
}

.tutor-dashboard-setting-profile .tutor-mb-24 {
    margin-bottom: 16px !important;
}

.tutor-dashboard-setting-profile .tutor-form-group {
    margin-bottom: 20px !important;
}

/* ============================================
   10. RESPONSIVE - TABLET
   ============================================ */
@media (max-width: 991px) {
    .tutor-dashboard-setting-profile form {
        padding: 90px 24px 24px !important;
    }
    
    .tutor-dashboard-setting-profile .tutor-row {
        margin: 0 -10px !important;
    }
    
    .tutor-dashboard-setting-profile [class*="tutor-col-"] {
        padding: 0 10px !important;
        margin-bottom: 16px !important;
    }
}

/* ============================================
   11. RESPONSIVE - MOBILE
   ============================================ */
@media (max-width: 576px) {
    .tutor-dashboard-setting-profile form {
        padding: 70px 16px 20px !important;
    }
    
    .tutor-dashboard-setting-profile .tutor-row {
        margin: 0 !important;
    }
    
    .tutor-dashboard-setting-profile [class*="tutor-col-"] {
        padding: 0 !important;
        margin-bottom: 16px !important;
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
    
    /* Labels */
    .tutor-form-label,
    .tutor-dashboard-setting-profile label.tutor-form-label {
        font-size: 14px !important;
        margin-bottom: 6px !important;
    }
    
    /* Input Fields */
    .tutor-form-control,
    .tutor-dashboard-setting-profile .tutor-form-control {
        padding: 10px 14px !important;
        font-size: 15px !important;
        border-radius: 6px !important;
    }
    
    /* Select */
    .tutor-form-select,
    .tutor-js-form-select {
        padding: 10px 14px !important;
        font-size: 15px !important;
        border-radius: 6px !important;
    }
    
    /* Bio Editor */
    .tutor-dashboard-setting-profile .wp-editor-wrap {
        border-radius: 6px !important;
    }
    
    /* Submit Button */
    .tutor-profile-settings-save {
        width: 100% !important;
        padding: 12px 24px !important;
        font-size: 15px !important;
        border-radius: 6px !important;
    }
    
    /* Helper Text */
    .tutor-fs-7.tutor-color-secondary {
        font-size: 14px !important;
    }
}

/* ============================================
   SETTINGS PAGE - Bug Fixes
   ============================================ */

/* ============================================
   1. HELPER TEXT - Fix Overflow on Mobile
   ============================================ */
.tutor-fs-7.tutor-color-secondary,
.tutor-dashboard-setting-profile .tutor-fs-7,
.tutor-dashboard-content-inner .tutor-fs-7 {
    font-size: 14px !important;
    color: var(--color-gray-400) !important;
    margin-top: 6px !important;
    line-height: 1.4 !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
    display: block !important;
}

@media (max-width: 576px) {
    .tutor-fs-7.tutor-color-secondary,
    .tutor-dashboard-setting-profile .tutor-fs-7,
    .tutor-dashboard-content-inner .tutor-fs-7 {
        font-size: 14px !important;
        line-height: 1.3 !important;
    }
    
    /* Form columns fix */
    .tutor-dashboard-setting-profile .tutor-col-lg-6,
    .tutor-dashboard-setting-profile .tutor-col-md-6,
    .tutor-dashboard-setting-profile .tutor-col-sm-6 {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

/* ============================================
   2. HIDE "Social Profile Link" Title
   ============================================ */
.tutor-dashboard-setting-social .tutor-fs-6.tutor-fw-medium.tutor-color-black.tutor-mt-32,
.tutor-dashboard-content-inner .tutor-fs-6.tutor-fw-medium.tutor-color-black.tutor-mt-32 {
    display: none !important;
}

/* ============================================
   3. KEEP "Settings" Title Visible on All Tabs
   ============================================ */
.tutor-dashboard-content > div.tutor-fs-4.tutor-fw-medium.tutor-mb-24,
.tutor-dashboard-content > .tutor-fs-4.tutor-fw-medium {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 1.375rem !important;
    font-weight: 700 !important;
    color: var(--color-text-primary) !important;
    padding: 0 0 20px 20px !important;
    margin-bottom: 24px !important;
    position: relative !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid var(--color-border-light) !important;
}

.tutor-dashboard-content > div.tutor-fs-4.tutor-fw-medium.tutor-mb-24::before,
.tutor-dashboard-content > .tutor-fs-4.tutor-fw-medium::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 5px !important;
    height: 28px !important;
    background: linear-gradient(180deg, #fc6720 0%, #ff8a50 100%) !important;
    border-radius: 3px !important;
}

/* Mobile Title */
@media (max-width: 576px) {
    .tutor-dashboard-content > div.tutor-fs-4.tutor-fw-medium.tutor-mb-24,
    .tutor-dashboard-content > .tutor-fs-4.tutor-fw-medium {
        font-size: 18px !important;
        padding: 0 0 14px 14px !important;
        margin-bottom: 20px !important;
    }
    
    .tutor-dashboard-content > div.tutor-fs-4.tutor-fw-medium.tutor-mb-24::before,
    .tutor-dashboard-content > .tutor-fs-4.tutor-fw-medium::before {
        width: 4px !important;
        height: 22px !important;
    }
}

/* NUCLEAR OPTION - Force everything */
@media (max-width: 991px) {
    .tutor-dashboard-setting-profile form .tutor-row > div {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
        float: none !important;
        display: block !important;
    }
    
    .tutor-dashboard-setting-profile .tutor-mb-32 {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Break long words */
    .tutor-dashboard-setting-profile * {
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }
}
/* ============================================
   MOBILE BOTTOM NAVIGATION - CLEAN DESIGN
   ============================================ */

#tutor-dashboard-footer-mobile {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--color-white) !important;
    border-top: 1px solid var(--color-border) !important;
    box-shadow: none !important;
    padding: 10px 0 0px 0 !important;
    z-index: var(--z-fixed-nav) !important;
    border-radius: 0 !important;
}

#tutor-dashboard-footer-mobile .tutor-container {
    padding: 0 !important;
}

#tutor-dashboard-footer-mobile .tutor-row {
    margin: 0 !important;
    display: flex !important;
    justify-content: space-around !important;
    align-items: center !important;
}

/* Navigation Items */
#tutor-dashboard-footer-mobile a.tutor-col-4 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 4px 12px !important;
    color: var(--color-gray-500) !important;
    text-decoration: none !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* Remove ALL pseudo elements */
#tutor-dashboard-footer-mobile a.tutor-col-4::before,
#tutor-dashboard-footer-mobile a.tutor-col-4::after {
    display: none !important;
    content: none !important;
}

/* Icons */
#tutor-dashboard-footer-mobile a i {
    font-size: 1.375rem !important;
    margin-bottom: 4px !important;
}

/* Text */
#tutor-dashboard-footer-mobile a span {
    font-size: 14px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
}

/* Active State */
#tutor-dashboard-footer-mobile a.active {
    color: var(--color-primary) !important;
}

/* Hover State */
#tutor-dashboard-footer-mobile a:hover {
    color: var(--color-primary) !important;
}

/* Safe Area for iPhone */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    #tutor-dashboard-footer-mobile {
        padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
    }
}

/* Main content padding */
@media (max-width: 991px) {
    .tutor-wrap.tutor-wrap-parent {
        padding-bottom: 75px !important;
    }
}

/* ============================================
   PAGE TITLES - Force Left Align on Mobile
   ============================================ */

@media (max-width: 991px) {
    /* Target exact class */
    .tutor-dashboard-title,
    div.tutor-dashboard-title,
    .tutor-dashboard-content .tutor-dashboard-title,
    div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-text-capitalize.tutor-mb-24.tutor-dashboard-title {
        display: block !important;
        text-align: left !important;
        justify-content: flex-start !important;
        align-items: flex-start !important;
        width: 100% !important;
        padding: 0 0 12px 16px !important;
        margin: 0 0 16px 0 !important;
        position: relative !important;
    }
    
    /* Orange bar position */
    .tutor-dashboard-title::before,
    div.tutor-dashboard-title::before {
        left: 0 !important;
    }
    
    /* Parent container */
    .tutor-dashboard-content {
        text-align: left !important;
    }
}

@media (max-width: 576px) {
    .tutor-dashboard-title,
    div.tutor-dashboard-title {
        padding: 0 0 10px 14px !important;
        font-size: 18px !important;
    }
}

/* ============================================
   ALL PAGE TITLES - Force Left Align on Mobile
   ============================================ */

@media (max-width: 991px) {
    /* Common class for all page titles */
    .tutor-dashboard-content > div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24,
    .tutor-dashboard-content > .tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24,
    div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24 {
        display: block !important;
        text-align: left !important;
        justify-content: flex-start !important;
        width: 100% !important;
        padding: 0 0 12px 16px !important;
        margin: 0 0 16px 0 !important;
        position: relative !important;
    }
    
    /* Orange bar */
    .tutor-dashboard-content > div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24::before,
    div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24::before {
        content: '' !important;
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        bottom: 12px !important;
        width: 4px !important;
        background: var(--color-primary) !important;
        border-radius: 2px !important;
    }
}

@media (max-width: 576px) {
    .tutor-dashboard-content > div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24,
    div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-24 {
        padding: 0 0 10px 14px !important;
        font-size: 16px !important;
    }
}

/* ============================================
   ENROLLED COURSES TITLE - Force Left on Mobile
   ============================================ */

@media (max-width: 991px) {
    /* Enrolled Courses page title */
    .tutor-dashboard-content > div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-16,
    div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-16.tutor-text-capitalize {
        display: block !important;
        text-align: left !important;
        justify-content: flex-start !important;
        width: 100% !important;
        padding: 0 0 12px 16px !important;
        margin: 0 0 16px 0 !important;
        position: relative !important;
    }
    
    /* Orange bar */
    .tutor-dashboard-content > div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-16::before,
    div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-16.tutor-text-capitalize::before {
        content: '' !important;
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        bottom: 12px !important;
        width: 4px !important;
        background: var(--color-primary) !important;
        border-radius: 2px !important;
    }
}

@media (max-width: 576px) {
    .tutor-dashboard-content > div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-16,
    div.tutor-fs-5.tutor-fw-medium.tutor-color-black.tutor-mb-16.tutor-text-capitalize {
        padding: 0 0 10px 14px !important;
        font-size: 16px !important;
    }
}

/* ============================================
   DASHBOARD STAT BOXES - Mobile (Simple Fix)
   ============================================ */

.tutor-dashboard-content-inner .tutor-card .tutor-color-secondary {
	font-size: 16px !important;}

@media (max-width: 991px) {
    /* Center the boxes */
    .tutor-dashboard-content-inner .tutor-row.tutor-gx-lg-4 {
        justify-content: center !important;
    }
    
    /* Font size - slightly larger */
    .tutor-dashboard-content-inner .tutor-card .tutor-fs-4 {
        font-size: 24px !important;
		color : 
#616161 ;
    }
    
    .tutor-dashboard-content-inner .tutor-card .tutor-color-secondary {
        font-size: 15px !important;
		color : 
               #616161 ;
    }
}
	
	
	

	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
/* =====================================================
   SMEnode Academy - Auth Pages v11 - Clean & Optimized
   ===================================================== */

/* ===========================================
   GLOBAL VARIABLES
   =========================================== */
:root {
    --sme-input-height: 44px;
    --sme-input-padding: 12px 16px;
    --sme-input-font: 14px;
    --sme-input-radius: 10px;
    --sme-btn-height: 46px;
    --sme-social-btn-height: 44px;
    --sme-card-radius: 20px;
    --sme-header-height: 110px;
    --sme-orange: #fc6720;
    --sme-orange-light: #ffb088;
}

/* ===========================================
   SECTION 1: LOGIN PAGE
   =========================================== */

.tutor-wrap.tutor-page-wrap {
    background: transparent !important;
    padding: 0 !important;
}

.tutor-login-wrap {
    max-width: 480px !important;
    margin: 50px auto !important;
    padding: 0 !important;
    background: var(--color-white) !important;
    border-radius: var(--sme-card-radius) !important;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08) !important;
    overflow: hidden !important;
    position: relative !important;
}

.tutor-login-wrap::before {
    content: '' !important;
    display: block !important;
    width: 100% !important;
    height: var(--sme-header-height) !important;
    background: linear-gradient(to bottom, var(--sme-orange-light) 0%, #ffffff 100%) !important;
    background-image: url('https://smenode-academy.com/wp-content/uploads/2025/10/cropped-logo-sme-copy.2webp.webp') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 130px auto !important;
}

.tutor-login-wrap .tutor-login-form-wrapper {
    background: var(--color-white) !important;
    padding: 30px 35px 25px !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.tutor-login-wrap .tutor-login-form-wrapper > .tutor-fs-5 {
    font-size: 24px !important;
    font-weight: 500 !important;
    color: var(--color-secondary-dark) !important;
    text-align: center !important;
    margin-top: 5px !important;
    margin-bottom: 28px !important;
}

.tutor-login-wrap input.tutor-form-control,
.tutor-login-wrap input[type="text"],
.tutor-login-wrap input[type="password"],
.tutor-login-wrap input[type="email"] {
    width: 100% !important;
    height: var(--sme-input-height) !important;
    padding: var(--sme-input-padding) !important;
    border: 1.5px solid var(--color-border-input) !important;
    border-radius: var(--sme-input-radius) !important;
    font-size: var(--sme-input-font) !important;
    font-weight: 400 !important;
    background: var(--color-bg-input) !important;
    box-sizing: border-box !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
}

.tutor-login-wrap input:focus {
    border-color: var(--sme-orange) !important;
    background: var(--color-white) !important;
    box-shadow: 0 0 0 3px rgba(252, 103, 32, 0.1) !important;
    outline: none !important;
}

.tutor-login-wrap .tutor-mb-20 {
    margin-bottom: 16px !important;
}

.tutor-login-wrap .tutor-mb-32 {
    margin-bottom: 20px !important;
}

.tutor-login-wrap .tutor-mb-40 {
    margin-bottom: 24px !important;
}

.tutor-login-wrap button.tutor-btn-primary,
.tutor-login-wrap .tutor-btn.tutor-btn-primary[type="submit"] {
    width: 100% !important;
    height: var(--sme-btn-height) !important;
    padding: 0 20px !important;
    background: linear-gradient(135deg, var(--sme-orange) 0%, #e55a1b 100%) !important;
    border: none !important;
    border-radius: var(--sme-input-radius) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--color-white) !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.tutor-login-wrap button.tutor-btn-primary:hover {
    background: linear-gradient(135deg, #e55a1b 0%, #d14f15 100%) !important;
    transform: translateY(-1px) !important;
}

.tutor-login-wrap .tutor-btn-link {
    color: var(--sme-orange) !important;
    font-weight: 500 !important;
}

.tutor-login-wrap .tutor-btn-ghost {
    color: var(--sme-orange) !important;
}

/* ===========================================
   SECTION 2: SOCIAL LOGIN BUTTONS
   =========================================== */

.tutor-login-wrap + #tutor-pro-social-authentication,
.tutor-login-wrap #tutor-pro-social-authentication,
#tutor-registration-wrap + #tutor-pro-social-authentication,
#tutor-registration-wrap #tutor-pro-social-authentication {
    background: var(--color-white) !important;
    margin: 0 !important;
    padding: 25px 35px 30px !important;
    border-top: 1px solid var(--color-border-light) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    border-radius: 0 0 var(--sme-card-radius) var(--sme-card-radius) !important;
}

.tutor-login-wrap + #tutor-pro-social-authentication::before,
.tutor-login-wrap #tutor-pro-social-authentication::before,
#tutor-registration-wrap + #tutor-pro-social-authentication::before,
#tutor-registration-wrap #tutor-pro-social-authentication::before {
    content: 'or continue with' !important;
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    color: var(--color-gray-400) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    margin-bottom: 12px !important;
}

#tutor-pro-social-authentication > div {
    width: 100% !important;
    max-width: 300px !important;
    display: flex !important;
    justify-content: center !important;
}

/* Google Button */
#tutor-pro-google-authentication .nsm7Bb-HzV7m-LgbsSe,
#tutor-pro-google-authentication > div > div {
    width: 100% !important;
    max-width: 300px !important;
    height: var(--sme-social-btn-height) !important;
    border: 1.5px solid var(--color-border-input) !important;
    border-radius: var(--sme-input-radius) !important;
    background: var(--color-white) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
}
#tutor-pro-social-authentication {
    overflow: visible !important; 
    position: relative !important;
}

#tutor-pro-google-authentication {
    min-height: 40px !important; 
    display: block !important;
}
#tutor-pro-google-authentication .nsm7Bb-HzV7m-LgbsSe:hover {
    background: var(--color-bg-light) !important;
    border-color: var(--color-gray-300) !important;
}

#tutor-pro-google-authentication {
    position: relative !important;
    width: 100% !important;
    max-width: 310px !important;
    height: 80px !important;
    margin: 10px auto !important;
    background: #ffffff !important;
    border: 1px solid #d1d7e0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#tutor-pro-google-authentication::before {
    content: 'Sign in with Google' !important;
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #3e4455 !important;
    display: flex !important;
    align-items: center !important;
}

#tutor-pro-google-authentication::after {
    content: '' !important;
    background: url('https://upload.wikimedia.org/wikipedia/commons/c/c1/Google_%22G%22_logo.svg') no-repeat center !important;
    background-size: contain !important;
    width: 20px !important;
    height: 20px !important;
    position: absolute !important;
    left: 20px !important;
}

#tutor-pro-google-authentication iframe, 
.S9gUrf-YoZ4jf,
.S9gUrf-YoZ4jf iframe {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0.01 !important; 
    z-index: 99 !important; 
    cursor: pointer !important;
    transform: scale(2) !important;
}

#tutor-pro-social-authentication::before {
    content: 'or continue with' !important;
    display: block !important;
    text-align: center !important;
    margin-bottom: 20px !important;
    color: #8e96a3 !important;
    font-size: 14px !important;
}

#tutor-pro-google-authentication {
    height: 55px !important; 
}

#tutor-pro-google-authentication::before {
    height: 100% !important;
    line-height: 55px !important; 
    display: flex !important;
    align-items: center !important;
}

#tutor-pro-google-authentication::after {
    top: 50% !important;
    transform: translateY(-50%) !important;
    left: 20px !important;
}

#tutor-pro-google-authentication iframe, 
.S9gUrf-YoZ4jf,
.S9gUrf-YoZ4jf iframe {
    height: 100% !important;
    min-height: 55px !important; 
}

/* Twitter Button - Same Style as Google */
#tutor-pro-twitter-login {
    width: 100% !important;
    max-width: 300px !important;
    height: var(--sme-social-btn-height) !important;
    background: var(--color-white) !important;
    border: 1.5px solid var(--color-border-input) !important;
    border-radius: var(--sme-input-radius) !important;
    color: var(--color-text-primary) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    cursor: pointer !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
}

#tutor-pro-twitter-login:hover {
    background: var(--color-bg-light) !important;
    border-color: var(--color-gray-300) !important;
}

#tutor-pro-twitter-login .tutor-icon-brand-twitter {
    color: #1DA1F2 !important;
    font-size: 18px !important;
}

#tutor-pro-facebook-authentication {
    display: none !important;
}

/* ===========================================
   SECTION 3: REGISTER PAGE
   =========================================== */

#tutor-registration-wrap {
    max-width: 540px !important;
    margin: 50px auto !important;
    padding: 0 !important;
    background: var(--color-white) !important;
    border-radius: var(--sme-card-radius) !important;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08) !important;
    overflow: hidden !important;
    position: relative !important;
}

#tutor-registration-wrap::before {
    content: '' !important;
    display: block !important;
    width: 100% !important;
    height: var(--sme-header-height) !important;
    background: linear-gradient(to bottom, var(--sme-orange-light) 0%, #ffffff 100%) !important;
    background-image: url('https://smenode-academy.com/wp-content/uploads/2025/10/cropped-logo-sme-copy.2webp.webp') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 130px auto !important;
}

#tutor-registration-form {
    padding: 30px 35px 25px !important;
}

#tutor-registration-wrap .tutor-form-row {
    display: flex !important;
    gap: 16px !important;
    margin-bottom: 16px !important;
}

#tutor-registration-wrap .tutor-form-col-6 {
    flex: 1 !important;
    min-width: 0 !important;
}

#tutor-registration-wrap .tutor-form-col-12 {
    width: 100% !important;
}

#tutor-registration-wrap .tutor-form-group label {
    display: block !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--color-text-light) !important;
    margin-bottom: 6px !important;
}

#tutor-registration-wrap input[type="text"],
#tutor-registration-wrap input[type="password"],
#tutor-registration-wrap input[type="email"] {
    width: 100% !important;
    height: var(--sme-input-height) !important;
    padding: var(--sme-input-padding) !important;
    border: 1.5px solid var(--color-border-input) !important;
    border-radius: var(--sme-input-radius) !important;
    font-size: var(--sme-input-font) !important;
    font-weight: 400 !important;
    background: var(--color-bg-input) !important;
    box-sizing: border-box !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
    margin-bottom: 0 !important;
}

#tutor-registration-wrap input:focus {
    border-color: var(--sme-orange) !important;
    background: var(--color-white) !important;
    box-shadow: 0 0 0 3px rgba(252, 103, 32, 0.1) !important;
    outline: none !important;
}

#tutor-registration-wrap .tutor-password-field input {
    margin-bottom: 0 !important;
}

#tutor-registration-wrap .tutor-password-strength-hint {
    margin-top: 8px !important;
}

#tutor-registration-wrap .tutor-password-strength-hint .indicator {
    display: flex !important;
    gap: 4px !important;
}

#tutor-registration-wrap .tutor-password-strength-hint .indicator span {
    flex: 1 !important;
    height: 4px !important;
    background: var(--color-border-input) !important;
    border-radius: 2px !important;
}

#tutor-registration-wrap button.tutor-btn-primary {
    width: 100% !important;
    height: var(--sme-btn-height) !important;
    padding: 0 20px !important;
    background: linear-gradient(135deg, var(--sme-orange) 0%, #e55a1b 100%) !important;
    border: none !important;
    border-radius: var(--sme-input-radius) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--color-white) !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 10px !important;
}

#tutor-registration-wrap button.tutor-btn-primary:hover {
    background: linear-gradient(135deg, #e55a1b 0%, #d14f15 100%) !important;
}

/* ===========================================
   SECTION 4: FORGOT PASSWORD PAGE
   =========================================== */

.tutor-forgot-password-form {
    max-width: 440px !important;
    margin: 60px auto !important;
    padding: 0 !important;
    background: var(--color-white) !important;
    border-radius: var(--sme-card-radius) !important;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08) !important;
    overflow: hidden !important;
    position: relative !important;
}

.tutor-forgot-password-form::before {
    content: '' !important;
    display: block !important;
    width: 100% !important;
    height: var(--sme-header-height) !important;
    background: linear-gradient(to bottom, var(--sme-orange-light) 0%, #ffffff 100%) !important;
    background-image: url('https://smenode-academy.com/wp-content/uploads/2025/10/cropped-logo-sme-copy.2webp.webp') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 130px auto !important;
}

.tutor-forgot-password-form > p {
    padding: 25px 35px 15px !important;
    margin: 0 !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--color-text-muted) !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

.tutor-forgot-password-form .tutor-form-row {
    padding: 0 35px !important;
    margin-bottom: 16px !important;
}

.tutor-forgot-password-form .tutor-form-row:last-child {
    padding-bottom: 30px !important;
    margin-bottom: 0 !important;
}

.tutor-forgot-password-form label {
    display: block !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--color-text-light) !important;
    margin-bottom: 6px !important;
}

.tutor-forgot-password-form input[type="text"],
.tutor-forgot-password-form input#user_login {
    width: 100% !important;
    height: var(--sme-input-height) !important;
    padding: var(--sme-input-padding) !important;
    border: 1.5px solid var(--color-border-input) !important;
    border-radius: var(--sme-input-radius) !important;
    font-size: var(--sme-input-font) !important;
    font-weight: 400 !important;
    background: var(--color-bg-input) !important;
    box-sizing: border-box !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
}

.tutor-forgot-password-form input:focus {
    border-color: var(--sme-orange) !important;
    background: var(--color-white) !important;
    box-shadow: 0 0 0 3px rgba(252, 103, 32, 0.1) !important;
    outline: none !important;
}

.tutor-forgot-password-form button.tutor-btn-primary {
    width: 100% !important;
    height: var(--sme-btn-height) !important;
    padding: 0 20px !important;
    background: linear-gradient(135deg, var(--sme-orange) 0%, #e55a1b 100%) !important;
    border: none !important;
    border-radius: var(--sme-input-radius) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--color-white) !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.tutor-forgot-password-form button.tutor-btn-primary:hover {
    background: linear-gradient(135deg, #e55a1b 0%, #d14f15 100%) !important;
}

/* ===========================================
   SECTION 5: MOBILE RESPONSIVE
   =========================================== */

@media (max-width: 600px) {
    :root {
        --sme-input-height: 42px;
        --sme-input-padding: 11px 14px;
        --sme-input-font: 15px;
        --sme-btn-height: 44px;
        --sme-social-btn-height: 42px;
        --sme-card-radius: 16px;
        --sme-header-height: 95px;
    }
    
    .tutor-login-wrap {
        max-width: calc(100% - 30px) !important;
        margin: 30px 15px !important;
    }
    
    .tutor-login-wrap::before,
    #tutor-registration-wrap::before,
    .tutor-forgot-password-form::before {
        background-size: 110px auto !important;
    }
    
    .tutor-login-wrap .tutor-login-form-wrapper {
        padding: 22px 20px 20px !important;
    }
    
    .tutor-login-wrap .tutor-login-form-wrapper > .tutor-fs-5 {
        font-size: 18px !important;
        margin-bottom: 22px !important;
    }
    
    .tutor-login-wrap + #tutor-pro-social-authentication,
    .tutor-login-wrap #tutor-pro-social-authentication,
    #tutor-registration-wrap + #tutor-pro-social-authentication,
    #tutor-registration-wrap #tutor-pro-social-authentication {
        padding: 20px !important;
    }
    
    #tutor-registration-wrap {
        max-width: calc(100% - 30px) !important;
        margin: 30px 15px !important;
    }
    
    #tutor-registration-form {
        padding: 22px 20px 20px !important;
    }
    
    #tutor-registration-wrap .tutor-form-row {
        flex-direction: column !important;
        gap: 0 !important;
    }
    
    #tutor-registration-wrap .tutor-form-col-6 {
        width: 100% !important;
    }
    
    #tutor-registration-wrap .tutor-form-group {
        margin-bottom: 14px !important;
    }
    
    .tutor-forgot-password-form {
        max-width: calc(100% - 30px) !important;
        margin: 30px 15px !important;
    }
    
    .tutor-forgot-password-form > p {
        padding: 20px 20px 12px !important;
        font-size: 15px !important;
    }
    
    .tutor-forgot-password-form .tutor-form-row {
        padding: 0 20px !important;
    }
    
    .tutor-forgot-password-form .tutor-form-row:last-child {
        padding-bottom: 25px !important;
    }
    
    #tutor-pro-social-authentication > div,
    #tutor-pro-twitter-login,
    #tutor-pro-google-authentication .nsm7Bb-HzV7m-LgbsSe {
        max-width: 100% !important;
    }
}

@media (max-width: 380px) {
    .tutor-login-wrap,
    #tutor-registration-wrap,
    .tutor-forgot-password-form {
        margin: 20px 10px !important;
    }
    
    .tutor-login-wrap .tutor-login-form-wrapper,
    #tutor-registration-form {
        padding: 18px 15px !important;
    }
    
    .tutor-login-wrap .tutor-login-form-wrapper > .tutor-fs-5 {
        font-size: 24px !important;
    }
    
    .tutor-login-wrap + #tutor-pro-social-authentication,
    .tutor-login-wrap #tutor-pro-social-authentication,
    #tutor-registration-wrap + #tutor-pro-social-authentication,
    #tutor-registration-wrap #tutor-pro-social-authentication {
        padding: 15px !important;
    }
}

/* ===========================================
   SECTION 6: CLEANUP
   =========================================== */

.tutor-template-segment {
    background: transparent !important;
    padding: 0 !important;
}

.page-id-23 .entry-title,
.tutor-screen-frontend-dashboard .entry-title {
    display: none !important;
}

.page-id-23 .edublink-main-content-inner,
.tutor-screen-frontend-dashboard .tutor-wrap {
    padding: 20px 0 !important;
}

#tutor-pro-social-authentication.tutor-border-top-light {
    border-top: none !important;
}

/* =====================================================
   FIX: Background Gradient + Social Buttons
   ===================================================== */

/* Fix 1: Background with Logo + Gradient Combined */
.tutor-login-wrap::before,
#tutor-registration-wrap::before,
.tutor-forgot-password-form::before {
    background: 
        url('https://smenode-academy.com/wp-content/uploads/2025/10/cropped-logo-sme-copy.2webp.webp') center center / 130px auto no-repeat,
        linear-gradient(to bottom, #ffb088 0%, #ffffff 100%) !important;
}

/* Fix 2: Social Authentication Container - Inside tutor-login-wrap */
.tutor-login-wrap #tutor-pro-social-authentication {
    background: var(--color-white) !important;
    margin: 0 !important;
    padding: 25px 35px 30px !important;
    border-top: 1px solid var(--color-border-light) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
}

.tutor-login-wrap #tutor-pro-social-authentication::before {
    content: 'or continue with' !important;
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    color: var(--color-gray-400) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    margin-bottom: 12px !important;
}

/* Fix 3: Twitter Button - Complete Override */
#tutor-pro-twitter-login,
a#tutor-pro-twitter-login,
.tutor-login-wrap a#tutor-pro-twitter-login {
    width: 300px !important;
    max-width: 300px !important;
    height: 44px !important;
    background: var(--color-white) !important;
    background-color: var(--color-white) !important;
    border: 1.5px solid var(--color-border-input) !important;
    border-color: var(--color-border-input) !important;
    border-radius: 10px !important;
    color: var(--color-text-primary) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    cursor: pointer !important;
    transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base), transform var(--transition-base) !important;
    padding: 0 !important;
}

#tutor-pro-twitter-login:hover,
a#tutor-pro-twitter-login:hover {
    background: var(--color-bg-light) !important;
    background-color: #f8f8f8 !important;
    border-color: var(--color-gray-300) !important;
}

#tutor-pro-twitter-login .tutor-icon-brand-twitter {
    color: #1DA1F2 !important;
    font-size: 18px !important;
}

/* Fix 4: Google Button - Match Twitter */
#tutor-pro-google-authentication,
#tutor-pro-google-authentication > div {
    width: 300px !important;
    max-width: 300px !important;
}

#tutor-pro-google-authentication .nsm7Bb-HzV7m-LgbsSe,
#tutor-pro-google-authentication iframe {
    width: 300px !important;
    max-width: 300px !important;
    height: 44px !important;
    border-radius: 10px !important;
}

/* Fix 5: Hide Facebook */
#tutor-pro-facebook-authentication {
    display: none !important;
}

/* Fix 6: Remove inline style override */
.tutor-login-wrap style,
.tutor-login-wrap style + div {
    display: block !important;
}

/* Mobile Fix */
@media (max-width: 600px) {
    .tutor-login-wrap::before,
    #tutor-registration-wrap::before,
    .tutor-forgot-password-form::before {
        background: 
            url('https://smenode-academy.com/wp-content/uploads/2025/10/cropped-logo-sme-copy.2webp.webp') center center / 110px auto no-repeat,
            linear-gradient(to bottom, #ffb088 0%, #ffffff 100%) !important;
    }
    
    #tutor-pro-twitter-login,
    a#tutor-pro-twitter-login,
    #tutor-pro-google-authentication,
    #tutor-pro-google-authentication > div,
    #tutor-pro-google-authentication .nsm7Bb-HzV7m-LgbsSe {
        width: 100% !important;
        max-width: 100% !important;
    }
}
#tutor-pro-twitter-login,
a#tutor-pro-twitter-login {
    box-shadow: none !important;
    outline: none !important;
    margin-top: -20px !important;
}

/* Fix: Remove ALL extra spacing in social section */
#tutor-pro-social-authentication.tutor-pt-24 {
    padding-top: 20px !important;
}

#tutor-pro-social-authentication[style*="gap"] {
    gap: 0px !important;
}

#tutor-pro-google-authentication.tutor-d-flex,
#tutor-pro-twitter-authentication.tutor-d-flex,
#tutor-pro-facebook-authentication.tutor-d-flex {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    height: auto !important;
}

/* Hide Facebook completely - no space */
#tutor-pro-facebook-authentication {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* Google container */
#tutor-pro-google-authentication {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
}

/* Twitter container */
#tutor-pro-twitter-authentication {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
}

/* Fix: Remove empty form row spacing in Register page */
#tutor-registration-form .tutor-form-row:has(.tutor-form-group:empty),
#tutor-registration-form .tutor-form-row .tutor-form-group:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
}

/* Alternative fix - target the empty row directly */
#tutor-registration-form .tutor-form-row:nth-last-of-type(2) {
    display: none !important;
}

/* Reduce spacing before Register button */
#tutor-registration-form > div:last-of-type {
    margin-top: 10px !important;
}

#tutor-registration-wrap .tutor-form-row {
    margin-bottom: 16px !important;
}

/* Fix: Hide inline style tag that takes space */
.tutor-login-wrap style,
.tutor-template-segment style,
#tutor-registration-wrap style {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ============================================================
   SECTION: Font Size Overrides - Force Larger Fonts
   ============================================================ */

/* Course Archive Page - Hero Section */
.custom-hero-heading,
.custom-hero-heading span {
    font-size: 56px !important;
    line-height: 1.2 !important;
}

.custom-hero-subheading {
    font-size: 56px !important;
    line-height: 1.1 !important;
}

/* Course Archive Page - Course Cards */
.tutor-course-name a,
.tutor-course-name {
    font-size: 18px !important;
    line-height: 1.4 !important;
}

.tutor-course-loop-price .tutor-loop-cart-btn-wrap a,
.tutor-loop-cart-btn-wrap a {
    font-size: 14px !important;
}

.tutor-meta span,
.tutor-course-loop-meta span {
    font-size: 14px !important;
}

/* Course Archive - Sidebar Filters */
.tutor-course-filter-title,
.tutor-widget-title {
    font-size: 18px !important;
    font-weight: 600 !important;
}

.tutor-form-check-label,
.tutor-course-filter .tutor-form-check-label {
    font-size: 15px !important;
}

/* Course Archive - Pagination */
.tutor-pagination-wrap a,
.tutor-pagination-wrap span {
    font-size: 15px !important;
}

/* Blog Archive Page - Hero Section */
.blog-hero-heading,
.blog-hero-heading span {
    font-size: 56px !important;
    line-height: 1.2 !important;
}

.blog-hero-subheading {
    font-size: 52px !important;
    line-height: 1.2 !important;
}

/* Blog Archive - Post Cards */
.entry-title,
.entry-title a {
    font-size: 22px !important;
    line-height: 1.4 !important;
}

.entry-content p,
.entry-summary p {
    font-size: 16px !important;
    line-height: 1.6 !important;
}

.entry-meta span,
.post-meta span {
    font-size: 14px !important;
}

/* Dashboard Page - Headings */
.tutor-fs-4,
.tutor-dashboard-title,
.tutor-page-title {
    font-size: 28px !important;
    line-height: 1.3 !important;
}

.tutor-fs-5 {
    font-size: 22px !important;
}

.tutor-fs-6 {
    font-size: 18px !important;
}

/* Dashboard - Navigation */
.tutor-dashboard-menu-item a,
.tutor-dashboard-menu a {
    font-size: 15px !important;
}

/* Dashboard - Course Cards */
.tutor-dashboard-content .tutor-course-name,
.tutor-dashboard-content .tutor-course-name a {
    font-size: 18px !important;
}

/* Dashboard - Stats & Info */
.tutor-dashboard-content p,
.tutor-dashboard-info p {
    font-size: 15px !important;
}

/* Login/Register Pages */
.tutor-login-form-title,
.tutor-registration-form-title,
.tutor-login-wrap h3,
.tutor-login-wrap .tutor-fs-4 {
    font-size: 28px !important;
    line-height: 1.3 !important;
}

.tutor-login-wrap label,
.tutor-registration-wrap label,
.tutor-form-label {
    font-size: 15px !important;
}

.tutor-login-wrap input,
.tutor-registration-wrap input,
.tutor-form-control {
    font-size: 15px !important;
}

.tutor-login-wrap a,
.tutor-registration-wrap a {
    font-size: 14px !important;
}

.tutor-login-wrap .tutor-btn,
.tutor-registration-wrap .tutor-btn {
    font-size: 16px !important;
}

/* General Tutor LMS Font Overrides */
.tutor-fs-7 {
    font-size: 15px !important;
}

.tutor-text-regular {
    font-size: 15px !important;
}

.tutor-color-secondary,
.tutor-color-muted {
    font-size: 14px !important;
}

/* Button Text Sizes */
.tutor-btn,
.tutor-button {
    font-size: 15px !important;
}

.tutor-btn-sm {
    font-size: 14px !important;
}

.tutor-btn-lg {
    font-size: 16px !important;
}

/* Responsive Overrides */
@media (max-width: 991px) {
    .custom-hero-heading,
    .custom-hero-heading span,
    .blog-hero-heading,
    .blog-hero-heading span {
        font-size: 44px !important;
    }

    .tutor-dashboard-title,
    .tutor-page-title,
    .tutor-login-form-title,
    .tutor-registration-form-title {
        font-size: 24px !important;
    }
}

@media (max-width: 767px) {
    .custom-hero-heading,
    .custom-hero-heading span,
    .blog-hero-heading,
    .blog-hero-heading span {
        font-size: 36px !important;
    }

    .custom-hero-subheading,
    .blog-hero-subheading {
        font-size: 18px !important;
    }

    .tutor-dashboard-title,
    .tutor-page-title {
        font-size: 22px !important;
    }

    .entry-title,
    .entry-title a {
        font-size: 20px !important;
    }

    .tutor-course-name a,
    .tutor-course-name {
        font-size: 16px !important;
    }
}

@media (max-width: 576px) {
    .custom-hero-heading,
    .custom-hero-heading span,
    .blog-hero-heading,
    .blog-hero-heading span {
        font-size: 28px !important;
    }

    .custom-hero-subheading,
    .blog-hero-subheading {
        font-size: 16px !important;
    }

    .tutor-dashboard-title,
    .tutor-page-title,
    .tutor-login-form-title,
    .tutor-registration-form-title {
        font-size: 20px !important;
    }
}

/* Course Archive Pagination - Clean Style */
.tutor-pagination {
    background: #fff;
    border: 1px solid rgba(255, 107, 0, 0.15);
    border-radius: 10px;
    padding: 12px 20px;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tutor-pagination .tutor-pagination-hints,
.tutor-pagination .tutor-pagination-hints * {
    color: #6b7280 !important;
}

.tutor-pagination .page-numbers {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    font-weight: 500;
    color: #023047;
    text-decoration: none;
    transition: all 0.2s ease;
}

.tutor-pagination .page-numbers:hover {
    background: #f3f4f6;
}

.tutor-pagination .page-numbers.current {
    background: #f3f4f6;
    color: #fff;
}

.tutor-pagination .page-numbers.next,
.tutor-pagination .page-numbers.prev {
    background: #fef3ed;
}

.tutor-pagination .page-numbers.next:hover,
.tutor-pagination .page-numbers.prev:hover {
    background: #fc6720;
    color: #fff;
}

.tutor-pagination-numbers {
    display: flex;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.tutor-pagination .tutor-pagination-hints span.tutor-color-black {
    color: #023047 !important;
}

/* Newsletter Form - ID: 3457 */
#wpcf7-f3457-o2 .wpcf7-form p {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    margin: 0 !important;
}

#wpcf7-f3457-o2 .wpcf7-form br {
    display: none !important;
}

#wpcf7-f3457-o2 span.wpcf7-form-control-wrap {
    flex: 0 0 350px !important;
}

#wpcf7-f3457-o2 input[type="email"] {
    width: 100% !important;
    padding: 14px 20px !important;
    border: 1px solid #fc6720 !important;
    border-right: 0 !important;
    border-radius: 30px 0 0 30px !important;
    font-size: 14px !important;
    height: 50px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    background: #fff !important;
}

#wpcf7-f3457-o2 input[type="email"]::placeholder {
    color: #999 !important;
}

#wpcf7-f3457-o2 input[type="submit"] {
    padding: 14px 30px !important;
    background-color: #fc6720 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 0 30px 30px 0 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    height: 50px !important;
    margin: 0 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
}

#wpcf7-f3457-o2 input[type="submit"]:hover {
    background-color: #e55a1b !important;
}

#wpcf7-f3457-o2 .wpcf7-spinner {
    display: none !important;
}

/* Responsive */
@media (max-width: 576px) {
    #wpcf7-f3457-o2 .wpcf7-form p {
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    #wpcf7-f3457-o2 span.wpcf7-form-control-wrap {
        flex: 0 0 auto !important;
        width: 100% !important;
    }
    
    #wpcf7-f3457-o2 input[type="email"] {
        border: 1px solid #ddd !important;
        border-radius: 30px !important;
    }
    
    #wpcf7-f3457-o2 input[type="submit"] {
        border-radius: 30px !important;
        width: 100% !important;
    }
	
@media (max-width: 768px) {
   
    .custom-hero-subheading {
        font-size: 28px !important;
    }


    .blog-hero-subheading {
        font-size: 28px !important;
    }
}

/* ============================================================
 * Course card rating + price color fixes (v16)
 * Lives in style.css (not mu-plugin) so file mtime busts caches.
 * ============================================================ */
.edublink-single-course .course-rating,
.edublink-single-course .course-rating *,
.edublink-single-course .eb-tl-course-rating,
.edublink-single-course .eb-tl-course-rating *,
.edublink-single-course .tutor-ratings-stars,
.edublink-single-course .tutor-ratings-stars *,
.edublink-single-course .eb-tl-rating-text,
.edublink-single-course .tutor-icon-star-line,
.edublink-single-course .tutor-icon-star-bold {
    color: #023047 !important;
    -webkit-text-fill-color: #023047 !important;
}
.edublink-single-course .tutor-icon-star-filled,
.edublink-single-course .tutor-icon-star-full {
    color: #fc6720 !important;
    -webkit-text-fill-color: #fc6720 !important;
}
.edublink-single-course:hover .price,
.edublink-single-course:hover .price *,
.edublink-single-course:hover .course-price,
.edublink-single-course:hover .course-price *,
.edublink-single-course:hover .woocommerce-Price-amount,
.edublink-single-course:hover .woocommerce-Price-amount *,
.edublink-single-course:hover .woocommerce-Price-currencySymbol,
.edublink-single-course:hover ins,
.edublink-single-course:hover ins *,
.edublink-single-course:hover .course-rating,
.edublink-single-course:hover .course-rating *,
.edublink-single-course:hover .eb-tl-course-rating,
.edublink-single-course:hover .eb-tl-course-rating *,
.edublink-single-course:hover .tutor-ratings-stars,
.edublink-single-course:hover .tutor-ratings-stars *,
.edublink-single-course:hover .eb-tl-rating-text,
.edublink-single-course:hover .tutor-icon-star-line,
.edublink-single-course:hover .tutor-icon-star-bold,
.edublink-single-course:hover .tutor-icon-star-filled,
.edublink-single-course:hover .tutor-icon-star-full {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
.edublink-single-course:hover del,
.edublink-single-course:hover del * {
    color: rgba(255,255,255,0.85) !important;
    -webkit-text-fill-color: rgba(255,255,255,0.85) !important;
    opacity: 1 !important;
}

/* Remix Icon subset + Font Awesome fa-check SVG replacement moved to
 * wp_head inline <style> in mu-plugins/smenode-performance-safe.php
 * because WP Rocket RUCSS strips these rules from external CSS files
 * (its static scanner can't detect @font-face unicode-range usage or
 * custom mask-image rules). Inline <style> blocks bypass RUCSS. */