/*
Theme Name: Olive Chiropractic
Version: 1.0
*/

/* =========================
   ROOT
========================= */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

:root {
 --accent:   #282d3c; /* navy blue from logo background */
  --accent-1: #ab8057; /* gold from MB monogram and stripe */
  --accent-2: #f6f3ec; /* olive-dark */
  --accent-3: #dfe2d9; /* line */
  --accent-4: #e9ede2; /* olive-light */
  --accent-5: #f7f5ef; /* cream */
 --serif: 'Playfair Display', Georgia, serif;
  --sans: 'Montserrat', Inter, sans-serif;
}

body {
  font-family:var(--sans);
  line-height:1.65;
  
}

.font-1 {
  font-family: 'Cinzel', serif;
  font-weight: 400;
  letter-spacing: 2px;
}

.font-2 {
  font-family: var(--sans);
  font-weight: 700;
}



.font-3 {
  font-family: var(--serif);
  font-style: italic;
}


h1, h2, h3, h4, h5, h6, strong {

}

p {

}

i {
    font-size: 5rem;
}

a {
    color: var(--accent-2);
    text-decoration: none;
}

a:hover {
    color: var(--accent-3);
    text-decoration: none;
}

.logo {
    max-height: 10vh;
} 

 /*-- Cookies --*/
.cookie-container {
display: none;
}

.cookie-container.active {
  display: block;
}


.bg-accent {
    background: var(--accent)  !important;
}

.bg-accent-1 {
    background: var(--accent-1)  !important;
}

.bg-accent-2 {
    background: var(--accent-2)  !important;
}

.bg-accent-3 {
    background: var(--accent-3)  !important;
}

.bg-accent-5 {
    background: var(--accent-5)  !important;
}

.text-accent {
    color: var(--accent) !important;
}

.text-accent-1 {
    color: var(--accent-1) !important;
}

.text-accent-2 {
    color: var(--accent-2) !important;
}

.text-accent-3 {
    color: var(--accent-3) !important;
}

.border-accent-1 {
border-color: var(--accent-1);
 }

/* -----------------------------------------------------------------
   Base .btn styles (your existing button helpers – keep as‑is)
   ----------------------------------------------------------------- */
.btn {
    font-weight: 600;
    transition: .5s;
}



/* -----------------------------------------------------------------
   NEW • .btn‑accent (primary brand colour)
   ----------------------------------------------------------------- */
.btn-accent,
.btn-accent-1,
.btn-accent-2,
.btn-accent-3,
.btn-accent-4 {
    /* shared button traits */
    font-weight: 400;               /* match original .btn-primary */
    transition: .5s;
    border-color: #222;
}

/* Primary accent – uses --accent (the “brand blue”) */
.btn-accent {
    background: var(--accent) !important;
    color: var(--bs-white) !important;   /* white text on dark bg */
}
.btn-accent:hover {
    background: var(--bs-white) !important;
    color: var(--accent) !important;
}

/* -----------------------------------------------------------------
   Variant • .btn‑accent‑1 (lightest accent colour)
   ----------------------------------------------------------------- */
.btn-accent-1 {
    background: var(--accent-1) !important;
    color: var(--bs-white) !important;   /* dark text on light bg */
}

.btn-accent-1:hover {
    background: var(--bs-black) !important;
    color: var(--accent-1) !important;
}


/* -----------------------------------------------------------------
   Variant • .btn‑accent‑2 (mid‑tone accent colour)
   ----------------------------------------------------------------- */
.btn-accent-2 {
    background: var(--accent-2) !important;
    color: var(--bs-dark) !important;   /* make text readable on ~#646674 */
}


/* -----------------------------------------------------------------
   Variant • .btn‑accent‑3 (soft accent colour)
   ----------------------------------------------------------------- */
.btn-accent-3 {
    background: var(--accent-3) !important;
    color: var(--accent-1) !important;   /* dark text works on #b0afbb */
}

.btn-accent-3:hover {
    background: var(--bs-white) !important;
    color: var(--accent-1) !important;   /* dark text works on #b0afbb */
}

.bg-accent-4 {
    background: var(--accent-4)  !important;
}

.text-accent-4 {
    color: var(--accent-4) !important;
}

/* Primary accent – uses --accent (the “brand blue”) */
.btn-accent-4 {
    background: var(--accent-4) !important;
    color: var(--bs-white) !important;   /* white text on dark bg */
}
.btn-accent-4:hover {
    background: var(--bs-white) !important;
    color: var(--accent-4) !important;
}

/* -----------------------------------------------------------------
   Square‑button helpers – keep unchanged
   ----------------------------------------------------------------- */
.btn-square {width: 32px;  height: 32px; }
.btn-sm-square {width: 34px;  height: 34px; }
.btn-md-square {width: 44px;  height: 44px; }
.btn-lg-square {width: 56px;  height: 56px; }

.btn-square,
.btn-sm-square,
.btn-md-square,
.btn-lg-square {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: normal;
    border-radius: 10%;
}

.section-spacer {
  padding: 15vh 0;
}

.service-box {
  border: 1px solid var(--accent-1);
  padding: 10px 10px;
  position: relative;
  height: 100%;
}


#footer ul li a {
    color: #ff0000;
}