/* Algemene styling voor de footer */
footer {
    background: #11233b;
    background-image: url(/wp-content/themes/NetCare/images/main/footer.webp);
    background-repeat: no-repeat;
    background-size: 100% auto;
    padding: 20px 0;
    color: #fff;
}

/* Alle h3 elementen in de footer op 20px */
footer h3 {
    font-size: 20px !important;
}

/* Titel in de footer */
footer .text-center h3 {
    color: #fff;
    font-family: "Poppins", sans-serif;
    font-weight: bold;
    font-size: 40px;
    margin-top: 120px;
}

footer .text-center p {
    color: #fff;
    font-family: "Roboto", sans-serif;
    font-size: 20px;
}

/* Quicklinks-container */
footer .menu-quicklinks_nl-container h3 {
    color: #fff; /* Zorg dat de titel wit blijft */
    font-family: "Poppins", sans-serif;
    font-size: 20px;
    margin-bottom: 10px;
    text-align: left;
}

footer .menu-quicklinks_nl-container ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Altijd twee kolommen */
    gap: 15px;
    list-style: none;
    padding: 0;
    margin: 0 auto;
    width: 100%;
}

footer .menu-quicklinks_nl-container li {
    text-align: left;
    word-break: break-word;
}

footer .menu-quicklinks_nl-container a {
    text-decoration: none;
    font-size: 14px;
    color: #fff; /* Quicklinks blijven wit */
    display: block;
}

footer .menu-quicklinks_nl-container a:hover {
    text-decoration: underline;
}

/* Knoppen in de footer */
footer .btn-footer {
    padding: 8px 32px;
    background: #ff6e17; /* Oranje kleur voor de knop */
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
    margin: 16px;
}

footer .btn-footer.grey {
    background: rgba(255, 255, 255, 0.3);
}

footer .btn-footer.purple {
    background: #5547db;
    margin: 10px 0;
}

/* Social media links */
.navbar-nav.navbar-sm {
    display: flex;
    justify-content: space-between; /* Verdeel ruimte gelijkmatig */
    list-style: none;
    padding: 0;
    margin: 0;
}

.navbar-nav.navbar-sm li {
    margin: 0;
    text-align: center;
}

.navbar-nav.navbar-sm a {
    text-decoration: none;
    color: inherit;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #f1f1f1;
}

.navbar-nav.navbar-sm a:hover {
    background-color: #007bff;
    color: #fff;
}

/* Responsieve aanpassingen */
@media (max-width: 768px) {
    footer .menu-quicklinks_nl-container ul {
        grid-template-columns: repeat(2, 1fr); /* Blijf twee kolommen op mobiel */
        gap: 10px; /* Verminder ruimte tussen links */
    }

    footer .navbar-sm a {
        width: 35px;
        height: 35px;
    }
}

@media (max-width: 480px) {
    footer .menu-quicklinks_nl-container ul {
        grid-template-columns: repeat(2, 1fr); /* Twee kolommen zelfs op kleine schermen */
    }
}

/* Stijl voor de footer-eindsectie */
.footer-end {
    margin-top: 20px; /* Ruimte boven de sectie */
    padding-top: 10px; /* Ruimte boven de lijn */
    border-top: 1px solid #757575; /* Subtiele grijze scheidingslijn */
    text-align: center; /* Centreer alle inhoud binnen de sectie */
}

.footer-end .foot p {
    font-family: "Poppins", sans-serif; /* Consistent lettertype */
    font-size: 12px; /* Kleinere, nette tekst */
    color: #fff; /* Witte tekstkleur */
    margin: 0; /* Geen extra marges */
    padding: 0; /* Geen extra padding */
}

/* Subscribe2 Widget Styling */
.subscribe form[name="s2formwidget"] {
    margin-bottom: 20px;
    margin-top: -15px; /* Trek het formulier omhoog */
}

/* Verberg "Your email:" label tekst */
.subscribe form[name="s2formwidget"] label[for="s2email"] {
    display: none !important;
}

/* Verberg Subscribe2 widget titel */
.widget-content:has(.subscribe) h3 {
    display: none !important;
}

/* Verberg alleen de h3 tag binnen Subscribe2 widgets */
.widget-content .subscribe {
    margin-top: 0;
}

.widget-content h3:has(+ .subscribe) {
    display: none !important;
}

/* Eenvoudigere aanpak: verberg h3 tags binnen widget-content die Subscribe2 bevatten */
.widget-content:has(.subscribe) h3 {
    display: none !important;
}

/* Styling voor email input */
.subscribe form[name="s2formwidget"] input[type="email"] {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 10px;
    color: #000 !important; /* Zwarte tekst in het email veld */
}

/* Placeholder tekst zwart maken */
.subscribe form[name="s2formwidget"] input[type="email"]::placeholder {
    color: #000 !important;
}

/* Focus state ook zwart */
.subscribe form[name="s2formwidget"] input[type="email"]:focus {
    color: #000 !important;
    outline: none;
    border-color: #ff6e17;
}

/* Styling voor submit button */
.subscribe form[name="s2formwidget"] input[type="submit"] {
    padding: 8px 32px;
    background: #ff6e17 !important; /* Zelfde oranje kleur als contact button */
    color: #fff !important;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
    border: 1px solid transparent !important;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.subscribe form[name="s2formwidget"] input[type="submit"]:hover {
    background: #e55a0f !important; /* Donkerder oranje bij hover */
}

.subscribe form[name="s2formwidget"] input[type="submit"]:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(255, 110, 23, 0.3);
}