/* Carousel container to maintain square aspect ratio */
.carousel-container {
    width: 500px; /* Adjust as needed */
    height: 500px; /* Ensure it's square */
    margin: auto;
    overflow: hidden;
}

/* Ensuring the images are square and cover the area */
.carousel-inner img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures images fill the square without distortion */
}

/* Control the size of the carousel */
.carousel {
    max-width: 600px; /* Limit the maximum width */
    margin: 0 auto; /* Center the carousel */
}

/* Set the images in the carousel to the same size */
.carousel-img {
    width: 100%;
    height: 300px;  /* Set a fixed height */
    object-fit: cover;  /* Ensures the image covers the area without stretching */
}

  

body {
    font-family: Arial, sans-serif;
    background-color: #f8f9fa;
}

#wrapper {
    max-width: 1200px;
    margin: auto;
    padding: 20px;
}

h1 {
    color: #561747;
    font-weight: bold;
}

html {
    scroll-behavior: smooth;
}
  
body {
    background-color: rgb(242, 208, 255);
  }
  
h2 {
    color: #28003a; /* Dark pink color */
  }

.p-3 {
    background-color:#28003a !important;  
}

.nav-link {
    color: white;
    
}

.nav-link:hover {
    color: rgb(242, 208, 255);
    
}

.navbar-brand {
    color: white;
    }

.navbar-brand:hover {
        color: rgb(242, 208, 255);
        
} 

.navbar {
    width: 100% !important;
    margin: 0;
    padding: 0;
}
.container-fluid {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Change the background color of accordion headers */
.accordion-button {
    background-color: rgb(242, 208, 255); /* Light pastel purple */
    color: #28003a; /* Dark purple */
    font-weight: bold;
}

/* Change the background color of active accordion header */
.accordion-button:not(.collapsed) {
    background-color: #d89bf5; /* Slightly darker shade when expanded */
    color: #28003a;
}

/* Change the border and background of accordion body */
.accordion-body {
    background-color: rgb(255, 235, 255); /* Very light lavender */
    color: #28003a;
}

/* Change the border color of each accordion item */
.accordion-item {
    border: 1px solid #28003a; /* Dark purple border */
}

/* Optional: Add hover effect */
.accordion-button:hover {
    background-color: #e6bff8;
    color: #28003a;
}

/* Page Title */
h2.display-4 {
    color: #28003a;
}

/* Cards */
.card {
    background-color: rgb(242, 208, 255); /* Light purple */
    border: 2px solid #28003a;
    color: #28003a;
}

.card-title {
    color: #28003a;
    font-weight: bold;
}

.card-text {
    color: #28003a;
}

/* Purchase Buttons */
.btn-primary {
    background-color: #28003a;
    border-color: #28003a;
    color: rgb(242, 208, 255);
}

.btn-primary:hover {
    background-color: #d89bf5;
    border-color: #d89bf5;
    color: #28003a;
}