/*
 Theme Name:   Domyn Child DADL
 Template:     domyn-theme
 Description:  Child theme for Domyn used for client-specific customizations.
 Author:       DOMYN
 Version:      1.0.0
 Text Domain:  domyn-theme-child-dadl
*/

.default-content {
    min-height: 200px;
    max-width: var(--dmn-site-width, 1280px);
    width: 100%;
    margin: 0 auto;
    padding: 0px!important;
}

.layout-media-right .text-media-content-inner {
    padding-left: 0px!important;
}

.text-media-content-inner {
    padding: 0px!important;
}

/* ============================================================
   Footer – DADL Customizations
   ============================================================ */

/* Titels (h3) in alle footer-kolommen wit */
.site-footer .footer-heading {
    color: #ffffff;
}

/* Site-naam als er geen logo is */
.site-footer .footer-title {
    color: #ffffff;
}

/* Broodtekst kolom 1 wit */
.site-footer .footer-text,
.site-footer .footer-text p {
    color: #ffffff;
}

/* Lijstitems in alle kolommen wit */
.site-footer .footer-nav li,
.site-footer .footer-nav-extra li,
.site-footer .hours-list li,
.site-footer .contact-list li {
    color: #ffffff;
}

/* Links in alle kolommen wit */
.site-footer .footer-nav a,
.site-footer .footer-nav-extra a,
.site-footer .footer-contact a {
    color: #ffffff;
}

/* Footer bottom tekst (copyright + credits) wit */
.site-footer .footer-copy,
.site-footer .footer-credits,
.site-footer .footer-credits a {
    color: #ffffff;
}

/* Tekst in kolommen links uitlijnen */
.site-footer .footer-grid,
.site-footer .footer-col {
    text-align: left;
}

/* ============================================================
   Footer Logo Override – Wit SVG
   ============================================================ */

/* Verberg het originele logo-img in de footer */
.site-footer .footer-logo {
    display: none !important;
}

/* Toon de witte SVG als vervanger op de link-wrapper */
.site-footer .footer-logo-link {
    display: block;
    background-image: url('/wp-content/uploads/2026/04/Dierenkliniek-Aan-de-Laan-wit.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left center;
    width: 180px;
    height: 70px;
}

/* ============================================================
   Footer Bottom – DADL (flex balk met knoppen)
   ============================================================ */

.footer-bottom--dadl {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 30px!important;
    padding-bottom: 16px;
    margin-top: 40px;
    text-align: left !important;
}

.footer-bottom--dadl .footer-copy {
    margin: 0;
    flex: 1;
}


/* Knoppen-wrapper rechts */
.footer-bottom-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

/* Basis knopstijl */
.footer-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: var(--dmn-button-padding);
    border-radius: var(--dmn-button-radius);
    font-size: var(--dmn-text);
    font-weight: 700;
    text-decoration: none !important;
    transition: all 0.2s ease;
    white-space: nowrap;
    line-height: 1;
}

/* SPOED – rood */
.footer-btn--spoed {
    background-color: #d32f2f;
    color: #ffffff !important;
    border: 2px solid #d32f2f;
}

.footer-btn--spoed:hover {
    background-color: #b71c1c;
    border-color: #b71c1c;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* Maak afspraak – teal (aansluitend op footer achtergrond) */
.footer-btn--afspraak {
    background-color: transparent;
    color: #ffffff !important;
    border: 2px solid rgba(255, 255, 255, 0.6);
}

.footer-btn--afspraak:hover {
    background-color: rgba(255, 255, 255, 0.12);
    border-color: #ffffff;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* Mobiel: knoppen onder de tekst */
@media (max-width: 600px) {
    .footer-bottom--dadl {
        flex-direction: column;
        align-items: flex-start;
    }

    .footer-bottom-actions {
        width: 100%;
        justify-content: flex-start;
    }
    
}

/* ============================================================
   Header SPOED Knop – DADL
   ============================================================ */
.header-logo {
    flex-shrink: 0;
    min-width: 150px;
}

.header-nav a {
    font-weight: 500;
}

.dadl-btn-spoed {
    background-color: #d32f2f !important;
    color: #ffffff !important;
    border: none !important;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 24px 7px 24px;
    border-radius: var(--dmn-button-radius);
    font-size: var(--dmn-text);
    font-weight: 700;
    transition: background-color 0.2s ease, transform 0.15s ease !important;
    margin-right: 10px;
}

.dadl-btn-spoed:hover {
    background-color: #b71c1c !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* Verberg header SPOED knop op mobiel (zit al in footer) */
@media (max-width: 768px) {
    :root {
        --dmn-section-spacing: 40px;
    }

    .dadl-btn-spoed {
        display: none !important;
    }

    .layout-media-right .text-media-container,
    .layout-media-left .text-media-container {
        grid-template-columns: 1fr!important;
    }

    /* Hero-sub bovenaan: aansluiten op mobile nav */
    .default-content > .dmn-hero-sub:first-child {
        padding-top: 0;
    }

    /* Text + Media block: child-override op 100px verlagen */
    .dmn-text-media {
        padding: 40px 20px !important;
    }

    /* Textblock-padding compacter op mobiel */
    .contentbloksmall {
        padding-top: 20px !important;
    }
}

.contentbloksmall{
    max-width:900px;
    margin:0 auto;
    padding-top:50px!important;
}

.contentbloksmall h2{
    text-align:center;
}

.dmn-services-intro {
    font-size: var(--dmn-font-size-base)!important;
    font-weight: var(--dmn-font-weight-normal)!important;
    color: var(--dmn-text)!important;
}

.footer-text p {
    padding-top:20px;
}

.footer-socials svg {
    width: 30px;
    height: 30px;
}