/* American Herbalists Guild - HelpScout Minimal Custom Styles */
/* Just fonts, colors, and essential fixes */

/* ===== FONTS ===== */
@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@400;500;700&family=Inter:wght@400;500;600&display=swap');

/* Body font */
body,
input,
button,
select,
textarea {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Heading font */
h1, h2, h3, h4, h5, h6,
#docsSearch h1,
.contentWrapper h1,
#fullArticle .title,
.category-list .category h3 {
    font-family: 'Frank Ruhl Libre', Georgia, serif !important;
    font-weight: 500 !important;
}

/* ===== LOGO AND HEADER FIXES ===== */
/* Fix header height and spacing */
.navbar-inner {
    height: 100px !important;
    min-height: 100px !important;
    position: relative !important;
}

.navbar {
    height: 100px !important;
    min-height: 100px !important;
}

/* Hide the duplicate logo text */
.navbar .brand span {
    display: none !important;
}

/* Replace with actual logo */
.navbar .brand {
    background: url('https://i0.wp.com/americanherbalistsguild.com/wp-content/uploads/2025/03/AHG-Logo-for-Footer.png?w=500&quality=80&ssl=1') no-repeat !important;
    background-size: contain !important;
    background-position: left center !important;
    width: 280px !important;
    height: 70px !important;
    text-indent: -9999px !important;
    overflow: hidden !important;
    margin: 15px 0 !important;
    padding: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
    float: left !important;
}

/* Position navigation menu properly aligned with logo */
.navbar .nav {
    position: absolute !important;
    right: 0 !important;
    top: 15px !important;
    margin: 0 !important;
    height: 70px !important;
    display: flex !important;
    align-items: center !important;
}

.navbar .nav li {
    display: inline-block !important;
}

.navbar .nav li a {
    font-weight: 500 !important;
    padding: 8px 15px !important;
    line-height: normal !important;
}

/* ===== COLORS ===== */
/* AHG Brand Colors */
:root {
    --ahg-primary-orange: #E67E22;
    --ahg-brand-teal: #178fa4;
    --ahg-text-dark: #2C3E50;
    --ahg-text-medium: #5D6D7E;
}

/* Links */
a {
    color: var(--ahg-brand-teal) !important;
}

a:hover {
    color: var(--ahg-primary-orange) !important;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    color: var(--ahg-text-dark) !important;
}

/* Body text */
p, li, span {
    color: var(--ahg-text-medium) !important;
}

/* ===== SEARCH BUTTON - SUPER AGGRESSIVE OVERRIDE ===== */
/* Nuclear option - override everything */
button[type="submit"],
input[type="submit"],
#searchBar button,
#searchBar input[type="submit"],
form[role="search"] button,
.search-form button {
    background: #178fa4 !important;
    background-color: #178fa4 !important;
    background-image: none !important;
    border: 2px solid #178fa4 !important;
    border-color: #178fa4 !important;
    color: #ffffff !important;
    text-shadow: none !important;
    box-shadow: none !important;
    filter: none !important;
    border-radius: 0 6px 6px 0 !important;
    border-left: 2px solid #178fa4 !important;
}

button[type="submit"]:hover,
input[type="submit"]:hover,
#searchBar button:hover,
#searchBar input[type="submit"]:hover,
form[role="search"] button:hover,
.search-form button:hover,
button[type="submit"]:focus,
input[type="submit"]:focus,
#searchBar button:focus {
    background: #136a7a !important;
    background-color: #136a7a !important;
    background-image: none !important;
    border: 2px solid #136a7a !important;
    border-color: #136a7a !important;
    color: #ffffff !important;
    text-shadow: none !important;
    box-shadow: none !important;
    filter: none !important;
    border-left: 2px solid #136a7a !important;
}

/* Force white text on button text/spans */
#searchBar button *,
#searchBar button span,
button[type="submit"] *,
button[type="submit"] span {
    color: #ffffff !important;
}

/* Fix search input to connect properly with button */
#searchBar .search-query {
    border-radius: 6px 0 0 6px !important;
    border-right: none !important;
}

#searchBar .search-query:focus {
    border-color: var(--ahg-brand-teal) !important;
    border-right: none !important;
    box-shadow: 0 0 0 2px rgba(23, 143, 164, 0.2) !important;
}

/* Additional button selectors */
button,
.btn,
input[type="submit"],
button[type="submit"] {
    background-color: var(--ahg-brand-teal) !important;
    border-color: var(--ahg-brand-teal) !important;
    color: #ffffff !important;
    border: 2px solid var(--ahg-brand-teal) !important;
}

button:hover,
.btn:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
    background-color: #136a7a !important;
    border-color: #136a7a !important;
    color: #ffffff !important;
    border: 2px solid #136a7a !important;
}

/* ===== SPACING FIX FOR CARDS ===== */
.category-list {
    gap: 24px !important;
}

.category-list .category {
    margin-bottom: 24px !important;
    background-color: #F5F5F5 !important;
}

/* Additional card selectors */
.category,
.col-md-6,
.col-lg-4,
.category-item {
    background-color: #F5F5F5 !important;
}

/* Mobile spacing */
@media (max-width: 768px) {
    .category-list {
        gap: 16px !important;
    }
    
    .category-list .category {
        margin-bottom: 16px !important;
    }
    
    .navbar,
    .navbar-inner {
        height: 70px !important;
        min-height: 70px !important;
    }
    
    .navbar .brand {
        width: 180px !important;
        height: 50px !important;
        margin: 10px 0 !important;
    }
    
    .navbar .nav {
        position: static !important;
        transform: none !important;
        margin-top: 10px !important;
    }
}

/* ===== INPUT FOCUS STATES ===== */
input:focus,
textarea:focus,
select:focus {
    border-color: var(--ahg-brand-teal) !important;
    box-shadow: 0 0 0 2px rgba(23, 143, 164, 0.2) !important;
    outline: none !important;
}

/* ===== MINIMAL CLEAN UP ===== */
/* Ensure strong text uses dark color */
strong {
    color: var(--ahg-text-dark) !important;
}

/* ===== FOOTER SPACING ===== */
/* Add extra space above the footer */
footer {
    margin-top: 100px !important;
}

/* Alternative selector in case HelpScout uses different footer class */
.footer,
.main-footer,
#footer {
    margin-top: 100px !important;
}