/* delete_account.css */

/* Main container for padding */
.delete-account-container {
    padding-top: 70px;
    padding-bottom: 70px;
}

/* Flexbox wrapper to align sections side by side */
.deletion-box-wrapper {
    display: flex; /* Enables flexbox layout */
    justify-content: space-between; /* Distributes space between items */
}

/* Box styling */
.deletion-box {
    padding: 20px;
    margin: 0 10px; /* Adds margin for spacing between the boxes */
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    flex: 1; /* Allows boxes to grow equally */
}

/* Hover effect with shadow */
.deletion-box:hover {
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

/* English section styling */
.deletion-box-english {
    background-color:#8E6800; /* Light background */
    color: #333; /* Dark text for better readability */
}
.deletion-box-english h3 {
    font-size: 1.5rem;
    margin-top: 20px;
    margin-bottom: 10px;
    border-bottom: 2px solid  #bed1e4;  /* Change to blue as per privacy section */
    padding-bottom: 5px;
    color: #333; /* Dark text color */
}
.deletion-box-english p {
    font-size: 1rem;
    line-height: 1.6; /* Increased line height for better readability */
    color: #bed1e4; /* Slightly darker text */
}

/* Bengali section styling */
.deletion-box-bengali {
    background-color: #bed1e4; /* Light background */
    color: #333; /* Dark text for contrast */
}
.deletion-box-bengali h3 {
    font-size: 1.5rem;
    margin-top: 20px;
    margin-bottom: 10px;
    border-bottom: 2px solid  #8E6800; /* Change to blue as per privacy section */
    padding-bottom: 5px;
}
.deletion-box-bengali p {
    font-size: 1rem;
    line-height: 1.6; /* Increased line height for better readability */
    color: #555; /* Slightly darker text */
}

/* Responsive Design Adjustments */
@media (max-width: 767px) {
    .delete-account-container {
        padding: 20px;
    }
    .deletion-box {
        padding: 15px; /* Slightly reduced padding for smaller screens */
        margin: 10px 0; /* Stack vertically on small screens */
    }
    .deletion-box-wrapper {
        flex-direction: column; /* Stacks boxes vertically on small screens */
    }
}
