/*
 Theme Name:   HMK EDU Child
 Author:       Hassan Mahmud Kabir
 Author URI:   https://HassanMahmudKabir.github.io
 Description:  HMK EDU Child Theme for WordPress
 Template:     HMK-EDU
 Version:      1.0
 */

/* CSS specifically scoped to this widget */

.academic-course-widget {
  color: #333333;

  line-height: 1.65;
}

.academic-course-widget h2 {
  /* Professional academic blue */

  font-size: 2.2rem;

  margin-top: 0;

  margin-bottom: 25px;

  padding-bottom: 15px;

  border-bottom: 2px solid #eaeaea;
}

.academic-course-widget h3 {
  font-size: 1.5rem;

  margin-top: 35px;

  margin-bottom: 15px;

  font-weight: 600;
}

.academic-course-widget p {
  margin-bottom: 20px;

  font-size: 1rem;
}

.academic-course-widget ul {
  list-style-type: none;

  padding-left: 0;

  margin-bottom: 25px;
}

.academic-course-widget li {
  position: relative;

  padding-left: 25px;

  margin-bottom: 12px;
}

/* Custom bullet point for SEO-friendly lists */

.academic-course-widget li::before {
  content: "•";

  color: #004b87;

  font-size: 1.5rem;

  position: absolute;

  left: 0;

  top: -6px;
}

.academic-course-widget strong {
  color: #1a1a1a;

  font-weight: 600;
}

.academic-course-widget em {
  color: #555555;

  font-style: italic;
}

/* Mobile Responsiveness */

@media (max-width: 768px) {
  .academic-course-widget {
    padding: 20px;
  }

  .academic-course-widget h2 {
    font-size: 1.8rem;
  }

  .academic-course-widget h3 {
    font-size: 1.3rem;
  }
}

    /* Scoped to prevent conflicts with your existing Elementor/WordPress theme */
    .custom-degree-section {
        /* Your Brand Colors */
        --brand-navy: #1C2539;
        --brand-gold: #B4853E;
        
        /* Supporting Colors */
        --bg-page: transparent; 
        --bg-card: #FFFFFF;
        --text-main: #374151;
        --text-muted: #6B7280;
        --border-light: #E5E7EB;
        background-color: var(--bg-page);
        color: var(--text-main);
        line-height: 1.5;
        margin: 0 auto;
    }

    /* --- Filter Section --- */
    .custom-degree-section .section-title {
        color: var(--brand-navy);
        font-size: 1rem;
        font-weight: 600;
        margin-bottom: 1rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .custom-degree-section .filter-container {
        display: flex;
        flex-wrap: wrap;
        gap: 0.75rem;
        margin-bottom: 2.5rem;
    }

    /* Updated to style anchor tags instead of buttons */
    .custom-degree-section .filter-link {
        background-color: var(--bg-card);
        border: 1.5px solid var(--border-light);
        color: var(--text-main);
        padding: 0.5rem 1.25rem;
        border-radius: 9999px;
        font-size: 0.9rem;
        font-weight: 500;
        text-decoration: none; /* Removes default link underline */
        display: inline-block;
        transition: all 0.2s ease;
    }

    .custom-degree-section .filter-link:hover {
        border-color: var(--brand-gold);
        color: var(--brand-navy);
        background-color: #fcfaf7;
    }

    .custom-degree-section .filter-link.active {
        background-color: var(--brand-navy);
        border-color: var(--brand-navy);
        color: #FFFFFF;
        box-shadow: 0 4px 6px -1px rgba(28, 37, 57, 0.2);
    }

    /* --- Details Card Section --- */
    .custom-degree-section .details-card {
        background-color: var(--bg-card);
        border-radius: 12px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
        border-top: 2.4px solid;
        padding: 2rem;
        display: grid;
        grid-template-columns: 250px 1fr;
        gap: 2.5rem;
        align-items: start;
    }

    .custom-degree-section .card-left {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    .custom-degree-section .icon-box {
        width: 48px;
        height: 48px;
        background-color: #fdf8f0;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--brand-gold);
    }

    .custom-degree-section .icon-box svg {
        width: 24px;
        height: 24px;
    }

    .custom-degree-section .degree-title {
        color: var(--brand-navy);
        font-size: 1.75rem;
        font-weight: 700;
        margin: 0;
        line-height: 1.2;
    }

    .custom-degree-section .degree-subtitle {
        color: var(--text-muted);
        font-size: 1rem;
        font-weight: 500;
        margin-top: 0.25rem;
        display: block;
    }

    .custom-degree-section .card-right {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }

    .custom-degree-section .description-label {
        color: var(--brand-navy);
        font-size: 1.125rem;
        font-weight: 600;
        margin: 0;
    }

    .custom-degree-section .description-text {
        color: var(--text-main);
        font-size: 1rem;
        margin: 0;
        line-height: 1.6;
    }

    /* --- Mobile Responsiveness --- */
    @media (max-width: 768px) {
        .custom-degree-section .details-card {
            grid-template-columns: 1fr;
            gap: 1.5rem;
            padding: 1.5rem;
        }

        .custom-degree-section .degree-title {
            font-size: 1.5rem;
        }

        .custom-degree-section .filter-container {
            gap: 0.5rem;
        }
        
        .custom-degree-section .filter-link {
            padding: 0.4rem 1rem;
            font-size: 0.85rem;
        }
    }

.reactheme-breadcrumbs .sub-title{
    color: #fff;
    font-weight: 500;
    font-size: 20px;
    letter-spacing: 3px;
}