/* 
   Adjusted CSS for The Seasons Art Club (Version 3)
   Based on 2026 Brand Guidelines
*/

/* Fonts: Century Gothic is the primary brand font. Fallback to Arial. */
#main, body {
    font-weight: 400;
    font-family: "Century Gothic", AppleGothic, sans-serif;
    color: #58595b; /* Brand Soft Grey for typography */
}

/* Header Style */
#masthead {
    width: 100%;
    padding: 25px;
    background-position: center 10px;
    background-size: 240px;
    background-repeat: no-repeat;
    text-align: center;
    position: relative;
    background-color: #7ec3c3; /* Brand Calming Teal Green */
}

#masthead h1 {
    margin: 0 !important;
    font-weight: 400;
    font-family: "Century Gothic", AppleGothic, sans-serif;
    color: #ffffff;
    font-size: 35px;
}

@media only screen and (min-width: 981px) {
    #masthead h1 {
        font-size: 35px;
    }
}

@media only screen and (max-width: 981px) {
    #masthead h1 {
        font-size: 30px;
    }
}

#masthead a {
    color: #ffffff;
}

/* Progress Bar - Using Brand Purple and Yellow */
#progressbar li {
    color: #58595b; /* Soft Grey */
    font-family: "Century Gothic", AppleGothic, sans-serif;
}

#progressbar li:before {
    color: #ffffff !important;
    background: #643393; /* Brand Purple */
}

#progressbar li:after {
    background: #643393; /* Brand Purple */
}

#progressbar li.active:before, 
#progressbar li.active:after {
    background: #f7c21a; /* Brand Yellow Splash */
}

/* Content Styles */
#content {
    width: 100%;
    margin-bottom: 75px;
    height: 100%;
}

#content li h2 {
    margin: 0 !important;
    font-weight: 600;
    font-size: 16px !important;
    font-family: "Century Gothic", AppleGothic, sans-serif;
    color: #58595b;
}

.result-content p {
    font-family: "Century Gothic", AppleGothic, sans-serif;
    color: #58595b;
    font-size: 14px;
    text-transform: none;
}

/* Availability Colors - Updated to align with palette where possible */
.colour-available { color: #643393; } /* Using Purple for availability */
.colour-last-few { color: #f7c21a; } /* Using Yellow for warning */
.colour-only-one { color: #bf0d22; }
.colour-waiting-list { color: #643393; }

/* Buttons - Brand Purple */
.btn-primary {
    background-color: #643393;
    color: #ffffff;
    border: none;
    font-family: "Century Gothic", AppleGothic, sans-serif;
}

.btn-primary:hover {
    background-color: #f7c21a !important; /* Hover to Brand Yellow */
    color: #ffffff;
}

#booking-review span {
    color: #643393;
}

/* Inputs */
input, textarea {
    border-radius: 4px !important; /* Slightly rounded for a friendlier feel */
    border: 1px solid #b28abf; /* Brand Lilac for borders */
}

table td {
    font-size: 12px;
    color: #58595b;
}

/* Footer Adjustment - White/Transparent with Dark Grey Text */
footer, .bti-footer, #bti-footer, [id*="footer"], .powered-by {
    background-color: transparent !important;
    background: transparent !important;
    border-top: 1px solid #eeeeee;
    color: #58595b !important; /* Brand Soft Grey */
}

/* Force dark grey for all footer elements including 'Powered by' text */
footer p, footer span, footer div, 
.bti-footer p, .bti-footer span, .bti-footer div,
#bti-footer p, #bti-footer span, #bti-footer div,
.powered-by {
    color: #58595b !important;
}

/* Brand Link Colour for 'Book That In' - Using Brand Purple */
footer a, .bti-footer a, #bti-footer a, .powered-by a {
    color: #643393 !important; 
    text-decoration: underline;
    font-weight: bold;
}

footer a:hover, .bti-footer a:hover, #bti-footer a:hover, .powered-by a:hover {
    color: #f7c21a !important; /* Hover to Brand Yellow */
}
