/* ===================================
   Algemene Merk Stijlen
   =================================== */

:root {
    --brand-primary: #8a2c53;     /* Chique bessenkleur */
    --brand-primary-hover: #702444; /* Iets donkerder voor hover */
}

/* ===================================
   Algemene Links
   =================================== */

a {
    color: var(--brand-primary);
    text-decoration: none;
}

a:hover {
    color: var(--brand-primary-hover);
    text-decoration: underline;
}

/* ===================================
   Bootstrap Component Overrides
   =================================== */

/* Primaire Knoppen */
.btn-primary {
    background-color: var(--brand-primary);
    border-color: var(--brand-primary);
}

.btn-primary:hover {
    background-color: var(--brand-primary-hover);
    border-color: var(--brand-primary-hover);
}

/* ===================================
   Navbar Fixes & Features
   =================================== */

/* De merknaam (linksboven) */
.navbar-dark .navbar-brand {
    color: white;
}
.navbar-dark .navbar-brand:hover,
.navbar-dark .navbar-brand:focus {
    color: #f0f0f0; 
}

/* Alle normale menu-links */
.navbar-dark .navbar-nav .nav-link {
    color: white;
}

/* De kleur bij hover of focus */
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
    color: #f0f0f0; 
}

/* De ACTIEVE link */
.navbar-dark .navbar-nav .nav-link.active {
    color: white;
    font-weight: bold;
}

/* Navbar Dropdown op Hover */
.navbar-nav .dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; 
}

/* ===================================
   Product Galerij Thumbnails
   =================================== */
.product-thumbnail {
    border: 2px solid #ddd;
    cursor: pointer;
    transition: border-color 0.2s;
    height: 100px; /* Vaste hoogte */
    width: 100%;
    object-fit: cover; /* Zorgt dat foto netjes past */
}

.product-thumbnail:hover,
.product-thumbnail.active {
    border-color: var(--brand-primary); /* Gebruik onze merkkleur */
}