/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

/* === The Breathable Clinic — Global Overrides === */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&family=Public+Sans:wght@300;400;500&family=Inter:wght@400;500&family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap');

:root {
  --kc-primary: #004e47;
  --kc-primary-container: #00685f;
  --kc-secondary: #00696b;
  --kc-surface: #f5fafa;
  --kc-on-surface: #171d1d;
  --kc-on-surface-variant: #3e4947;
}

/* Body & typography */
body {
  font-family: 'Public Sans', -apple-system, sans-serif !important;
  background-color: var(--kc-surface) !important;
  color: var(--kc-on-surface) !important;
}

h1, h2, h3, h4, h5, h6,
.font-headline {
  font-family: 'Manrope', -apple-system, sans-serif !important;
}

/* Override Flatsome blue with teal */
.button,
.btn,
input[type="submit"],
button[type="submit"] {
  background-color: var(--kc-primary) !important;
  border-color: var(--kc-primary) !important;
  font-family: 'Manrope', sans-serif !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
}
.button:hover,
.btn:hover,
input[type="submit"]:hover {
  background-color: var(--kc-primary-container) !important;
}

/* Header nav */
#header,
.header-inner,
.nav-bar,
#main-nav {
  background: rgba(255,255,255,0.85) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}
#main-nav a,
.nav-bar a {
  font-family: 'Manrope', sans-serif !important;
  font-weight: 700 !important;
  color: var(--kc-on-surface) !important;
}
#main-nav a:hover,
.nav-bar a:hover {
  color: var(--kc-primary) !important;
}

/* Flatsome accent color */
a { color: var(--kc-primary) !important; }
a:hover { color: var(--kc-primary-container) !important; }

/* Footer */
#footer {
  background-color: #004e47 !important;
  color: #ecf2f1 !important;
  font-family: 'Public Sans', sans-serif !important;
}
#footer a { color: rgba(236,242,241,0.7) !important; }
#footer a:hover { color: #fff !important; }
#footer h3, #footer h4 {
  font-family: 'Manrope', sans-serif !important;
  color: #fff !important;
}

/* Flatsome page container */
.page-wrapper, #wrapper {
  background: var(--kc-surface) !important;
}

/* Material Symbols utility */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle;
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/

  .kc-hero-inner {
    grid-template-columns: 1fr !important;
    padding: 0 20px !important;
  }
  .kc-doctor-inner,
  .kc-hours-inner {
    grid-template-columns: 1fr !important;
  }
  .kc-bento-card.large,
  .kc-bento-card.featured,
  .kc-bento-card.medium,
  .kc-bento-card.medium2 {
    grid-column: span 12 !important;
  }
}