.heading {
    background-color: #006400;
    display: flex;
    justify-content: left;
    font-size: 25px;
    font-weight: 700;
    color: white;
}

.content-enroll {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 20px;
    color: white;
}

.enroll-sec{
    background-color: #006400!important;
    max-height: fit-content;
    margin-block-start: 5px;
    justify-content: center;
    /* height:580px; */
}
.enrol_key_height{
    display: flex;
    align-items: stretch;
}
.coursedetails {
    background-color: #006400;
    border: 2px solid white;
    border-radius: 10px;
    padding: 15px;
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: white;
    flex: 1; /* Allows both divs to grow equally */
    min-height: fit-content;
    position: relative;
}
.cat-name{
    font-size: x-small;
    border-radius: 20px;
    border-color: #fff;
    color: #006400;
    background-color: #fff;
    padding-left: 10px;
    padding-right: 10px;
    height: 19px;
    padding-top:2px;
    padding-bottom: 2px;
    font-weight: bold;
    
}
.card {
    background: none;
    color: black;
    padding: 20px;
    border-radius: 10px;
    flex: 1;
}


/* Ensure the entire course card has a fixed size */
.course-details {
    background-color: white;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Card container */
.card-2 {
    background: white;
    color: black;
    padding: 20px;
    flex: 1;
    width: 320px; /* Fixed width for all cards */
    min-height: 500px; /* Ensure the same height */
    border: 2px solid #006400;
    /* border-radius: 10px; */
    display: flex;
    flex-direction: column;
    align-items: center;

    position: relative; /* Helps with positioning */
}

/* Image container */
.course_image {
    width: 160px; /* Set a fixed width */
    height: 130px; /* Set a fixed height */
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #006400;
    border-radius: 10px;
    border: 2px solid #006400;
    overflow: hidden;
    margin-bottom: 15px;
    margin-top: 10px;
}

/* Image styling */
.course_image img {
    width: 100%; /* Prevents overflowing */
    height: 100%;
    object-fit: contain; /* Ensures image fits without distortion */
    padding: 5px;
}

#course-des1 {
    color: white !important;
    text-align: left;
    margin-top: 10px;
}


.cus-enrollment-methods button {
    display: block;
    width: 100%;
    padding: 15px;
    cursor: pointer;
    border-radius: 5px;
    font-size: 16px;
    background-color: #006400;
    border:none;
}

.option-btn.active {
    border: 2px solid white !important;
    border-radius: 10px;
   
}
.option-btn {
    border: 2px solid transparent;
    font-weight: normal;
    padding: 10px 15px;
    margin: 5px;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    text-align: left;
}

.enroll-btn {
    background: #006400;
    border-color:white;
    border-radius: 5px;
    border-style:solid;
    padding: 6px 9px 6px 9px;

}



.course-title-1 {
    margin-top: 10px;
    align-self: flex-start !important;
}

.course-link-1 {
    color: #47d45a;
    text-decoration: underline !important;
    font-weight: bold;
}

.course-description1 {
    color: white !important;
    align-self: flex-start !important;
    margin-top: 10px;
 
}








/* Disable interaction for the individual user radio */
#individual-radio {
    pointer-events: none;
}



/* administartor assistance */

/* Admin Form Styling */
.card-1 {
    background-color: #006400;
    color: white;
    padding: 20px;
    flex: 1;
    border: 2px solid white;  
    border-radius: 10px;
    flex: 1;
}

/* Title */
.admin-title {
    text-decoration: underline;
    text-align: left;
    margin-bottom: 10px;
   
}

/* Radio Button Group */
/* Radio Button Group - Inline on large screens */
.admin-radio-group {
    display: flex;
    justify-content: space-between; /* Equal spacing */
    align-items: left;
    gap: 5px;
    max-width: 100%;
    flex-wrap: wrap; /* Ensures wrapping when needed */
    overflow: hidden; /* Prevents overflow */
    margin-top: 30px;
}

/* Individual Radio Items - Maintain Equal Spacing */
.admin-radio-item {
    flex: 1;
    display: flex;
    justify-content: left;
    min-width: 150px; /* Ensures it doesn't shrink too much */
}

/* Radio Label Styling */
.admin-radio-option {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: small;
    white-space: nowrap; /* Prevents text breaking */
}

/* Icons */
.admin-radio-option img {
    width: 22px;
    height: 22px;
    
}

/* Input Radio */
.admin-radio-option input {
    margin-left: -3px;
}

/* Small Screen: Remove Flex & Stack in Column */


.large-radio {
    appearance: none;
    width: 18px;
    height: 18px;
    border: 3px solid white;
    border-radius: 50%;
    background: transparent;
    position: relative;
    cursor: pointer;
    display: inline-block;
}

.large-radio:checked::before {
    content: "";
    width: 8px;
    height: 8px;
    background: white;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}



/* Form Labels */
.ad-label {
    display: block;
 
    margin-bottom: 10px;
    font-weight: normal; 
    margin-top: 20px;
}

/* Input Fields */
.admin-input, .admin-textarea {
    width: 100%;
    padding: 4px;
    margin-bottom: 10px;
    border: 1px solid #ddd;
    /* border-radius: 5px; */
    font-size: 14px;
    color: black;
}

/* Textarea */
.admin-textarea {
    height: 80px;
    /* resize: none; */
}


/* responsive design */

@media (max-width: 768px) {
    .heading {
        flex-direction: row;
        text-align: justify;
    }
}

@media (max-width: 768px) {
    .enroll-sec {
        flex-direction: column;
        align-items: left;
    }  
}

@media (max-width: 768px) {
    .col-4 {
        width: 100%;
    }
    /* .course_details {
        padding: 10px;
    } */

}
@media (max-width: 768px) {
    .col-4 {
        width: 100%;
    }
    /* .course_details {
        padding: 10px;
    } */

}



@media (max-width: 768px) {
    .card-2 {
        width: 100%; 
    }

    .course_image {
        width: 200px;
        height: 120px;
    }
}

@media (max-width: 768px) {
    .cus-enrollment-methods button {
        padding: 15px; /* Keep the same padding */
        font-size: 16px; /* Keep the same font size */
        background-color: #006400; /* Keep the same background color */
        border-radius: 5px; /* Keep the same border radius */
        border: none; /* Keep the same border style */
        width: max-content;
    }
}

@media (max-width: 768px) {
    .admin-radio-group {
        flex-direction: column;
        gap: 10px;
        align-items: center;
    }
}

@media (max-width: 768px) {
    .admin-radio-group {
        display: block; /* Removes flex to stack items */
        text-align: left;
    }

    .admin-radio-item {
        width: 100%;
        display: block; /* Ensures full width */
        margin-bottom: 5px;
    }
}
