/*
Theme Name: Music In Every Room
Theme URI: https://www.musicineveryroom.co.uk/
Author: Livetech
Description: Faithful WordPress clone of the Music In Every Room Webflow site. Reuses the
  original compiled stylesheet so the rebuild matches the original on casual inspection.
  Webflow's jQuery runtime is replaced with a small vanilla script for the hero slider,
  the FAQ accordions and the nav dropdowns.
Version: 2.3.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: mier
*/

/* Real styling lives in assets/css/webflow.css, enqueued from functions.php.
   Put your own overrides below so an upstream refresh never clobbers them. */

/* ------------------------------------------------------------------
   Fixes for state Webflow's runtime used to apply inline at page load.
   Dropping webflow.js drops those inline styles, so anything the
   original relied on them for has to be restated here.
   ------------------------------------------------------------------ */

/* Nav logo: the original ships this with an inline `opacity: 0` from a
   Webflow interaction, and never fades it in — even scrolled it stays
   hidden. Without the runtime it renders on top of the Home link. */
.navbar-logo-image {
    opacity: 0;
}

/* ------------------------------------------------------------------
   Contact Form 7
   ------------------------------------------------------------------
   The CF7 form template reproduces the site's own markup and reuses
   .input-field---contact-section etc, so the fields need no restyling.
   What does need handling is the extra markup CF7 wraps around them,
   the new consent checkbox, and its validation messages.
   ------------------------------------------------------------------ */

/* CF7 wraps every control in an inline span, which would collapse the
   block-level inputs. */
.contact-section---home .wpcf7-form-control-wrap {
    display: block;
}

.contact-section---home .wpcf7 form .wpcf7-response-output {
    margin: 1.2vw 0 0;
    padding: 0.8vw 1vw;
    border: 0;
    border-left: 4px solid var(--brand-colour-2);
    background-color: #f1f3f6;
    color: #333;
    font-size: 1.15vw;
    font-weight: 600;
    line-height: 1.45;
}

.contact-section---home .wpcf7 form.invalid .wpcf7-response-output,
.contact-section---home .wpcf7 form.unaccepted .wpcf7-response-output,
.contact-section---home .wpcf7 form.failed .wpcf7-response-output {
    border-left-color: #c62828;
    background-color: #fdf0f0;
    color: #8f1f1f;
}

.contact-section---home .wpcf7 form.sent .wpcf7-response-output {
    border-left-color: #1e7d3c;
    background-color: #eef7f0;
    color: #1b5e2a;
}

/* Per-field validation message, sitting under the input it belongs to. */
.contact-section---home .wpcf7-not-valid-tip {
    display: block;
    margin: -0.2vw 0 0.6vw;
    color: #c62828;
    font-size: 0.95vw;
    font-weight: 500;
    line-height: 1.3;
}

.contact-section---home .wpcf7-not-valid {
    box-shadow: inset 0 0 0 1px #c62828;
}

/* Consent checkbox */
.consent-wrapper---contact-section {
    margin-top: 1.2vw;
}

.consent-wrapper---contact-section .wpcf7-list-item {
    margin: 0;
}

.consent-wrapper---contact-section label {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    gap: 0.7vw;
    cursor: pointer;
    color: var(--rgb-100);
    font-size: 0.9vw;
    font-weight: 500;
    line-height: 1.45;
}

.consent-wrapper---contact-section input[type="checkbox"] {
    width: 1.1vw;
    height: 1.1vw;
    margin: 0.15vw 0 0;
    accent-color: var(--brand-colour-2);
    flex: none;
}

.consent-wrapper---contact-section a {
    color: var(--brand-colour-2);
    text-decoration: underline;
}

.contact-section---home .wpcf7-spinner {
    margin: 0 auto;
}

@media screen and (min-width: 1280px) {
    .contact-section---home .wpcf7 form .wpcf7-response-output { font-size: 15px; padding: 13px 16px; margin-top: 18px; }
    .contact-section---home .wpcf7-not-valid-tip { font-size: 12px; margin-bottom: 8px; }
    .consent-wrapper---contact-section { margin-top: 16px; }
    .consent-wrapper---contact-section label { font-size: 12px; gap: 9px; }
    .consent-wrapper---contact-section input[type="checkbox"] { width: 15px; height: 15px; margin-top: 2px; }
}

@media screen and (max-width: 991px) {
    .contact-section---home .wpcf7 form .wpcf7-response-output { font-size: 1.7vw; }
    .contact-section---home .wpcf7-not-valid-tip { font-size: 1.4vw; margin-bottom: 1.5vw; }
    .consent-wrapper---contact-section { margin-top: 3vw; }
    .consent-wrapper---contact-section label { font-size: 1.35vw; gap: 1.2vw; }
    .consent-wrapper---contact-section input[type="checkbox"] { width: 2vw; height: 2vw; }
}

@media screen and (max-width: 767px) {
    .contact-section---home .wpcf7 form .wpcf7-response-output { font-size: 2.3vw; }
    .contact-section---home .wpcf7-not-valid-tip { font-size: 1.9vw; }
    .consent-wrapper---contact-section label { font-size: 1.8vw; gap: 1.6vw; }
    .consent-wrapper---contact-section input[type="checkbox"] { width: 2.8vw; height: 2.8vw; }
}

@media screen and (max-width: 479px) {
    .contact-section---home .wpcf7 form .wpcf7-response-output { font-size: 3.6vw; }
    .contact-section---home .wpcf7-not-valid-tip { font-size: 3.2vw; }
    .consent-wrapper---contact-section label { font-size: 2.9vw; gap: 2.4vw; }
    .consent-wrapper---contact-section input[type="checkbox"] { width: 4.4vw; height: 4.4vw; }
}

/* =CookieYes
-------------------------------------------------------------- */
/* Solid Buttons */
.cky-btn-accept,
.cky-btn-preferences,
.cky-btn-reject{
    background: #2b3648 !important;
    border: 2px solid #2b3648 !important;
    color: #fff!important;
}
 
/* Outline Buttons */
.cky-btn-customize {
    color: #2b3648 !important;
    border: 2px solid #2b3648 !important;
}
 
/* Icon Colour */
.cky-btn-revisit-wrapper {
    background: #2b3648 !important;
}