/*
 * The Wharf brand colours
 * Dark green: #1c3524
 * Gold: #d4a843
 * Light gold: #e8c96d
 * Dark bg: #162b1e
 * Off-white: #f5f2eb
 */

:root {
    --wharf-green: #1c3524;
    --wharf-green-dark: #162b1e;
    --wharf-gold: #d4a843;
    --wharf-gold-light: #e8c96d;
    --wharf-offwhite: #f5f2eb;
}

/* ===== Global ===== */
body {
    background-color: var(--wharf-offwhite);
    color: var(--wharf-green);
}

a {
    color: var(--wharf-gold);
}

a:hover {
    color: var(--wharf-gold-light);
}

/* ===== Header / Navigation ===== */
.site-header,
.main-navigation,
.navbar,
.site-navigation-fixed,
#masthead {
    background-color: var(--wharf-green) !important;
}

.main-navigation a,
.navbar a,
.site-header a,
#masthead a {
    color: var(--wharf-gold) !important;
}

.main-navigation a:hover,
.navbar a:hover,
.site-header a:hover,
#masthead a:hover {
    color: var(--wharf-gold-light) !important;
}

/* ===== Hero / Branding ===== */
.site-branding {
    background-color: rgba(28, 53, 36, 0.75);
}

.site-branding .site-title a,
.site-branding .site-description {
    color: var(--wharf-gold) !important;
}

/* ===== Buttons ===== */
button,
input[type="submit"],
.button,
.btn,
.wp-block-button__link,
.header-button a {
    background-color: var(--wharf-gold) !important;
    color: var(--wharf-green) !important;
    border: none;
}

button:hover,
input[type="submit"]:hover,
.button:hover,
.btn:hover,
.wp-block-button__link:hover,
.header-button a:hover {
    background-color: var(--wharf-gold-light) !important;
    color: var(--wharf-green) !important;
}

/* ===== Footer ===== */
.site-footer,
#colophon,
footer {
    background-color: var(--wharf-green-dark) !important;
    color: var(--wharf-offwhite);
}

.site-footer a,
#colophon a,
footer a {
    color: var(--wharf-gold) !important;
}

.site-footer a:hover,
#colophon a:hover,
footer a:hover {
    color: var(--wharf-gold-light) !important;
}

/* ===== Headings ===== */
h1, h2, h3, h4, h5, h6 {
    color: var(--wharf-green);
}

/* ===== Cards / Posts ===== */
.entry-title a {
    color: var(--wharf-green);
}

.entry-title a:hover {
    color: var(--wharf-gold);
}

/* ===== Widgets / Sidebar ===== */
.widget-title {
    color: var(--wharf-green);
    border-bottom-color: var(--wharf-gold);
}

/* ===== Scrollbar accent (modern browsers) ===== */
::-webkit-scrollbar-thumb {
    background-color: var(--wharf-gold);
}

/* ===== Selection highlight ===== */
::selection {
    background-color: var(--wharf-gold);
    color: var(--wharf-green);
}