/* components.css */



/* Card styles */
.card {
    transition: transform 0.3s ease; /* Smooth hover effect */
}

.card:hover {
    transform: scale(1.05); /* Slightly scale up on hover */
}

/* Button styles */
.btn-outline-primary {
    border-width: 2px; /* Thicker border for outline buttons */
    transition: background-color 0.3s ease; /* Transition for hover */
}

.btn-outline-primary:hover {
    background-color: #007bff; /* Change background on hover */
    color: white; /* Change text color on hover */
}



/* Style for the description container */
.description-container {
    max-width: 100%; /* Ensure it doesn't exceed the column width */
    background: rgba(255, 255, 255, 0.9); /* Semi-transparent background for better readability */
    padding: 20px; /* Add more padding for spaciousness */
    border-radius: 10px; /* Rounded corners for a softer look */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); /* Subtle shadow for depth */
    margin-bottom: 20px; /* Space below the description */
}

/* Style adjustments for the text */
.description-container span {
    display: inline-block; /* Make it inline-block for better formatting */
    line-height: 1.6; /* Improve line spacing */
}

/* Adjust the column width */
.col-md-8 {
    max-width: 100%; /* Ensure full width within the parent container */
}


.accordion-button {
    font-weight: bold; /* Makes the button text bold */
}

.accordion-body {
    padding: 15px; /* Adds padding to the accordion body */
    background-color: #f8f9fa; /* Light background for content */
}

.list-group-item {
    background-color: #ffffff; /* Ensures a white background for items */
    border: 1px solid #dee2e6; /* Adds a border for better separation */
}