/* Custom CSS for Certification Menu Multi-Column Layout */

/* Multi-column layout for certification submenu */
.certification-submenu {
    column-count: 2;
    column-gap: 30px;
    min-width: 500px !important;
    max-width: 600px !important;
    padding: 15px 20px !important;
}

/* Prevent items from breaking across columns */
.certification-submenu li {
    break-inside: avoid;
    page-break-inside: avoid;
    -webkit-column-break-inside: avoid;
}

/* Add max height and scrolling if needed */
.certification-submenu {
    max-height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Customize scrollbar */
.certification-submenu::-webkit-scrollbar {
    width: 8px;
}

.certification-submenu::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.certification-submenu::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.certification-submenu::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Responsive: Single column on smaller screens */
@media (max-width: 768px) {
    .certification-submenu {
        column-count: 1;
        min-width: 280px !important;
        max-width: 320px !important;
    }
}

/* Optional: Add some spacing between certification items */
.certification-submenu li {
    margin-bottom: 5px;
}

.certification-submenu li a {
    display: block;
    padding: 8px 12px;
    transition: all 0.3s ease;
}

.certification-submenu li a:hover {
    background-color: #f8f9fa;
    padding-left: 16px;
}

/* Hover effect for curriculum-content cards - matching info-box color and waves */
.curriculum-content .card {
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: all 0.3s ease;
}

.curriculum-content .card::before {
    position: absolute;
    content: '';
    top: 30%;
    left: -90px;
    width: 540px;
    height: 200px;
    background-color: rgba(33, 182, 215, 0.2);
    z-index: -1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-transform: translateY(100%) rotate(10deg);
    -moz-transform: translateY(100%) rotate(10deg);
    -ms-transform: translateY(100%) rotate(10deg);
    -o-transform: translateY(100%) rotate(10deg);
    transform: translateY(100%) rotate(10deg);
}

.curriculum-content .card:hover {
    border-color: #21b6d7 !important;
    background-color: #21b6d7 !important;
    -webkit-transform: translateY(-5px);
    -moz-transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    -o-transform: translateY(-5px);
    transform: translateY(-5px);
}

.curriculum-content .card:hover::before {
    transition-delay: .2s;
    -webkit-transform: translateY(0) rotate(10deg);
    -moz-transform: translateY(0) rotate(10deg);
    -ms-transform: translateY(0) rotate(10deg);
    -o-transform: translateY(0) rotate(10deg);
    transform: translateY(0) rotate(10deg);
}

.curriculum-content .card:hover .card-title,
.curriculum-content .card:hover .card-text,
.curriculum-content .card:hover h5,
.curriculum-content .card:hover h6,
.curriculum-content .card:hover p,
.curriculum-content .card:hover span,
.curriculum-content .card:hover i {
    color: #fff !important;
}

/* Hide Froala Editor branding on frontend */
a[href*="froala.com"],
a[href*="froala"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    position: absolute !important;
    left: -9999px !important;
}

/* Hide empty paragraphs that might contain only Froala links */
.course-description p:empty,
.card-body p:empty {
    display: none;
}