/* FLUFFYTECH: Beaminster Tennis Club / Global styles | Version 1.0.3 | Updated 2026-11-12 */
:root {
    color-scheme: light;
    --club-green: #39b54a;
    --text: #fff;
    --link-dot-color: rgba(255, 255, 255, .8);
    --scroll-thumb: rgba(255, 255, 255, .55);
    --content-max-width: 72vh;
    --content-width: min(100% - 1.25rem, var(--content-max-width));
    --logo-width: min(100vw, 71.875vh);
    scrollbar-color: var(--scroll-thumb) var(--club-green);
}

:root::-webkit-scrollbar,
:root::-webkit-scrollbar-track { background: var(--club-green); }
:root::-webkit-scrollbar-thumb { background: var(--scroll-thumb); }

body {
    margin: 0;
    background: var(--club-green);
    color: var(--text);
    font-family: Quicksand, sans-serif;
    font-size: .875rem;
    letter-spacing: .025rem;
}

.club-logo-header {
    position: relative;
    z-index: 1;
    pointer-events: none;
}

.club-logo-header--overlay {
    position: absolute;
    inset: 0 0 auto;
}

.club-logo-header .club-logo {
    position: relative;
    display: grid;
    place-items: center;
    width: var(--logo-width);
    max-width: 100%;
    aspect-ratio: 920 / 305;
    margin-inline: auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: center;
    text-decoration: none;
    pointer-events: auto;
}

button.club-logo:enabled { cursor: pointer; }
button.club-logo:disabled { cursor: default; }

.club-logo canvas {
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    height: auto;
    pointer-events: none;
}

.site-footer {
    margin-block-start: 3.5em;
    text-align: left;
}

.site-footer .site-breadcrumbs p {
    margin: 0;
    padding-inline-start: .5rem;
}

.site-footer .site-breadcrumbs a {
    color: inherit;
    border-bottom: .0625rem dotted rgba(255, 255, 255, .8);
    text-decoration: none;
}

.site-footer .site-breadcrumbs a:hover {
    border-bottom-color: transparent;
}

.site-footer #copyright {
    margin-block-start: 3.125rem;
    padding-block-end: 4.375rem;
    font-size: .7em;
}

.site-footer #copyright a {
    margin-inline-start: .25rem;
    border: 0;
    color: inherit;
    text-decoration: none;
}

.site-footer #copyright img {
    width: .8125rem;
    height: auto;
    margin-inline-start: .125rem;
    vertical-align: middle;
}

@media (max-width: 42.375rem) {
    .site-footer #copyright {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: .75rem;
    }

    .site-footer #copyright a { margin-inline-start: 0; }
}
