/*
Theme Name: Enfold Child Paol & Co
Description: Volledige sobere stijl met Masonry layout en kleurfix voor mobiel.
Template: enfold
*/

/* =0. Browser Kleur-beveiliging (Fix voor de bordeaux kleur)
-------------------------------------------------------------- */
:root {
  color-scheme: light; /* Forceert de browser om niet naar Dark Mode te schakelen */
}

/* =1. Algemene Styling & Typografie
-------------------------------------------------------------- */
.paginatitel {
    font-family: 'Rosarivo', serif;
    font-size: 42px;
    font-weight: 400;
    text-align: left;
    color: #102727;
}

.rood32, .rood48 {
    color: #102727 !important;
    font-family: 'Rosarivo', serif;
    font-weight: 400;
}

/* =2. Achtergrond & Kleurpalet (Oud-Roze #c7abaa)
-------------------------------------------------------------- */


/* =3. De Collectie Overzichtspagina (Masonry Grid)
-------------------------------------------------------------- */
#artwork-list {
    width: 72%;
    float: right;
    display: block;
    column-count: 3;
    column-gap: 25px;
}

#artwork-list .artwork-item {
    width: 100% !important;
    float: none !important;
    display: inline-block;
    margin-bottom: 30px;
    break-inside: avoid;
    transform: translateZ(0); 
    vertical-align: top;
}

#artwork-list .artwork-item img {
    width: 100%;
    height: auto !important;
    display: block;
    vertical-align: bottom;
    border: none !important;
    padding: 0 !important;
    transition: opacity 0.4s ease-in-out;
    backface-visibility: hidden;
}

#artwork-list .artwork-item img:hover {
    opacity: 0.7;
}

/* Tekstdetails in de lijst */
#artwork-list .artwork-item p,
#artwork-list .artwork-item .artwork-details {
    font-family: 'Open Sans', sans-serif;
    color: #102727;
}

#artwork-list .artwork-item em {
    font-family: 'Rosarivo', serif;
    font-style: normal;
    color: #102727;
    display: block;
}

/* =4. Filters & UI (Groen #102727 i.p.v. Oranje)
-------------------------------------------------------------- */
#artwork-filters a, 
#artwork-filters h2 a,
#artwork-filters h4 a,
#artwork-filters ul li a {
    color: #102727 !important;
}

#artwork-filters h2.active {
    border-bottom: 2px solid #102727 !important;
}

/* =5. Mobiele Optimalisatie
-------------------------------------------------------------- */
@media (max-width: 768px) {
    #artwork-list {
        width: 100%;
        float: none;
        column-count: 1;
    }
    
    #artwork-filters {
        width: 100%;
        float: none;
        margin-bottom: 30px;
    }

    /* Extra check voor mobiele achtergrond */
    .responsive #top #wrap_all #main {
        background-color: #c7abaa !important;
    }
}

/* Cleanup */
.comment-count, .post-format-icon, .article-icon-container, input[type="number"] {
    display: none !important;
}