/* custom.css */

/* Primary Color */
:root {
    --primary-color: #ba1624;
    --secondary-color: #faa507;
}

/* Override Bootstrap primary color */
.btn-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

/* Override Bootstrap secondary color */
.btn-secondary {
    background-color: var(--secondary-color) !important;
    border-color: var(--secondary-color) !important;
}

/* Override text color */
.text-primary {
    color: var(--primary-color) !important;
}

.text-secondary {
    color: var(--secondary-color) !important;
}

/* Other elements */
.site-footer {
    background-color: var(--primary-color);
}

.navbar-nav .nav-link {
    color: black !important; /* Ensure text color is black */
}

.navbar-nav .nav-link:hover {
    color: #faa507 !important; /* Optional: Change color on hover */
}

/* Change background color of the navbar toggler button */
.navbar-toggler {
    background-color: #ba1624 !important; /* Set the background color of the toggle button */
    border: none; /* Optional: remove the default border if you prefer */
}

/* Change color of the navbar toggler icon (hamburger lines) */
.navbar-toggler-icon {
    background-color: #fff !important; /* Set the color of the hamburger lines */
}

.site-footer a {
    color: var(--secondary-color);
}

.artists-hover {
    background-color: #ffffff;
    color: #000000;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.artists-hover p {
    margin: 5px 0;
    line-height: 1.4;
}

.artists-hover p strong {
    color: #ba1624 !important; /* Primary color for labels */
    margin-right: 0; /* Removes space between label and value */
    font-weight: 600;
    display: inline; /* Ensures label is directly next to the value */
}

/* Newsletter Section */
.newsletter-section {
    background-color: #faa507;  /* Background color set to #faa507 */
    padding: 40px 0;  /* Add padding for spacing */
}

.newsletter-section h2 {
    color: #fff;  /* White text for the heading */
    text-align: center;  /* Center the heading */
    margin-bottom: 20px;  /* Add space below the heading */
}

.newsletter-section .form-control {
    max-width: 400px;
    margin: 0 auto;
}

.newsletter-section .input-group-append button {
    background-color: #ba1624; /* Button color set to #ba1624 */
    color: white; /* White text on the button */
    border: none; /* Remove border */
    padding: 10px 20px; /* Add padding to the button */
    font-size: 16px; /* Set a readable font size */
    cursor: pointer; /* Pointer cursor on hover */
    border-radius: 5px; /* Slightly rounded corners */
}

.newsletter-section .input-group-append button:hover {
    background-color: #9a0f1b; /* Darker shade of button color on hover */
}

.experience-section .experience-poster img {
    max-width: 100%;
    height: auto;
    max-height: 600px;
    display: block;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .experience-section .experience-poster img {
        max-height: 400px;
    }
}