/* root */
:root {
    /* colors */
    --primary-color: #002366;
    --secondary-color: #D4AF37;
    --text-color: black;
    --background-color: white;
    --gray-color: lightgray;
    
    /* typography */
    --brand-font: "Pinyon Script", Sans-serif;
    --main-font: "EB Garamond", Sans-serif;
    --sub-font: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    --tag-line-size: 1.7rem;
}
/* reflow */
.reflow-product-list .ref-image, .reflow-product-list.ref-cards .ref-image {
    width: 100%;
    height: 100%;
}

.reflow-product-search input, .reflow-product-search input:focus {
    border: 1px solid var(--secondary-color); 
    border-radius: 0;
    box-shadow: none;
}

.ref-page-item.active .ref-page-link {
    color: white;
    background: var(--primary-color);
}

.correct-spacing {
        width: 100%;
        max-width: 100%;
        padding-right: calc(1.5rem * .5);
        padding-left: calc(1.5rem * .5);
        margin-top: 0;
}

/* mailchimp */
#mc_embed_signup_scroll, .foot {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 4px 16px;
}

.mc-field-group {
    padding: 8px 8px;
}

#mc-embedded-subscribe, #mc-embedded-subscribe:hover {
    background-color: var(--primary-color);
    color: white;
    border: 1px solid var(--primary-color);
    border-radius: 5px;
    width: 620px;
}

/* body */
html {
    height: 100%;
}

body {
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    background: url("/media/background-royal-baroque-style.png");
}

/* typography */
h1 {
    font-family: var(--main-font);
    font-size: 3rem;
    color: var(--primary-color);
}

h2, h3, h4, h5, h6 {
    font-family: var(--main-font);
    font-weight: normal;
    color: var(--primary-color);
}

.navbar-brand {
    font-family: var(--main-font);
}

.last-update {
    margin-top: 0.8rem;
    float: right;
}

a {
    color: var(--primary-color);
}

/* graphic elements */
hr {
    opacity: 1;
    border: 1px solid var(--secondary-color);
}

/* accordions */
.accordion, .accordion-header {
    border: 1px solid var(--secondary-color); 
}

.accordion-button {
    font-size: 1.5rem;
}

.accordion-button:focus, .accordion-button:not(.collapsed) {
    background-color: var(--secondary-color);
    box-shadow: none;
    color: black;
}

/* buttons */
.btn, button, input[type="button"], .btn-primary, .ref-button,
.btn:hover, button:hover, input[type="button"]:hover, a .btn-primary:hover, .ref-button:hover {
    background-color: var(--primary-color);
    color: white;
    border: 1px solid var(--primary-color);
    border-radius: 5px;
    outline: none;
}

/* forms */
input, input:focus {
    background-color: transparent;
    border: 1px solid var(--primary-color);
    outline: none;
    border-radius: 5px;
    padding: 8px 16px;
    outline: none;
}

/* background */
.bg-brand {
    background-color: var(--secondary-color);
}

/* navigation */
nav {
    box-shadow: 0 1px 5px #6d5a1c;
}

nav .logo-nav {
    filter: grayscale(1);
}

/* header */
.tag-line {
    font-size:  var(--tag-line-size);
}

/* main */
.brand-card {
    border: 1px solid var(--secondary-color);
    border-radius: 0;

}

#business-partners img {
    filter: grayscale(1);
}

/* page - shop */
#categories {
    border: 1px solid var(--secondary-color);
    border-radius: 0;
    background-color: white;
}

#categories ul {
    padding-left: 0;
}

#categories ul a{
    text-decoration: none;
    color: black;
}

/* footer */
#footer {
    box-shadow: 0 -1px 5px #6d5a1c;
}
footer h5 {
    color: var(--text-color);
    font-weight: bold;
}

footer ul {
    list-style-type: none;
    padding: 0;
}

footer a, footer a:hover {
    text-decoration: none;
    color: var(--text-color);
}

/* cookies */
#consent-popup {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3.5rem;
    padding: 1rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.8);
    box-shadow: 0 -2px 10px rgba(144, 144, 144, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    z-index: 9998;
    transition: opacity .8s ease;
    cursor: default;
}

#consent-popup.hidden {
    visibility: hidden;
}

#consent-popup :first-child {
        color: black;
}

#accept {
    text-decoration: none;
    color: white;
    border: 1px solid var(--primary-color);
    background-color: var(--primary-color);
    border-radius: 5px;
    padding: 0.2rem 0.4rem;
    margin: 0 0.2rem;
    cursor: pointer;
}

#accept:hover {
    box-shadow: 0 0 0;
}

/* scroll up*/
.scroll-up {
    display: none;
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    background-color: rgba(0, 36, 102, .5);
    color: var(--primary-color);
    font-size: 18px;
    cursor: pointer;
    border-radius: 2px;
    text-align: center;
    z-index: 9999;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.scroll-up:hover {
    background-color: rgba(0, 36, 102, .5);
    color: var(--primary-color);
}