/* Modal Styling */
.custom-modal .modal-content {
    border-radius: 10px; /* Rounded corners */
    background-color: #f9f9f9; /* Light gray background */
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3); /* Subtle shadow */
    font-family: 'Arial', sans-serif; /* Font style */
}

/* Header */
.custom-modal .modal-header {
    background-color: #b3792b; /* Dark gray/black background */
    color: white; /* White text color */
    border-top-left-radius: 10px; /* Rounded top-left */
    border-top-right-radius: 10px; /* Rounded top-right */
    font-size: 18px; /* Adjusted font size */
    padding: 15px 20px;
}

.custom-modal .modal-header .close {
    color: white; /* White close button */
}

/* Body */
.custom-modal .modal-body {
    color: #333; /* Dark gray text */
    font-size: 16px; /* Comfortable font size */
    line-height: 1.6; /* Improved readability */
    padding: 20px; /* Added padding for better spacing */
}

/* Footer */
.custom-modal .modal-footer {
    background-color: #f1f1f1; /* Light gray footer background */
    border-bottom-left-radius: 10px; /* Rounded bottom-left */
    border-bottom-right-radius: 10px; /* Rounded bottom-right */
    padding: 10px 20px;
    justify-content: center; /* Center the Close button */
}

/* Modal dialog */
.custom-modal .modal-dialog {
    max-width: 40%; /* Adjust modal width */
    margin: 30px auto; /* Center the modal horizontally */
}

/* Button */
.custom-modal .btn-secondary {
    background-color: #555; /* Darker gray background for button */
    border-color: #555;
    color: white; /* White text */
    padding: 8px 20px; /* Adjust padding */
    border-radius: 5px; /* Rounded button */
    font-size: 14px; /* Adjust font size */
}

.custom-modal .btn-secondary:hover {
    background-color: #333; /* Darker on hover */
    border-color: #333;
}