/* =============================================
   Bootstrap Blue Override — Kill ALL default blues
   Our palette: greens, wood tones, terracotta, gold
   ============================================= */
:root {
    --bs-primary: var(--color-primary) !important;
    --bs-primary-rgb: var(--color-primary-rgb) !important;
    --bs-link-color: var(--color-primary) !important;
    --bs-link-color-rgb: var(--color-primary-rgb) !important;
    --bs-link-hover-color: var(--color-accent-hover) !important;
    --bs-blue: var(--color-primary) !important;
    --bs-focus-ring-color: rgba(74, 124, 89, 0.25) !important;
    --bs-border-color: var(--color-border) !important;
}

/* Bootstrap .btn-primary → our primary green */
.btn-primary {
    --bs-btn-bg: var(--color-primary);
    --bs-btn-border-color: var(--color-primary);
    --bs-btn-hover-bg: var(--color-primary-dark);
    --bs-btn-hover-border-color: var(--color-primary-dark);
    --bs-btn-active-bg: var(--color-primary-dark);
    --bs-btn-active-border-color: var(--color-primary-dark);
    --bs-btn-focus-shadow-rgb: var(--color-primary-rgb);
}

/* Links — no blue anywhere */
a, .link-primary, .text-primary {
    color: var(--color-primary) !important;
}

a:hover {
    color: var(--color-accent-hover) !important;
}

/* Form focus states — green glow, not blue */
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 0.25rem rgba(74, 124, 89, 0.25) !important;
}

.form-check-input:checked {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

/* Accordion — no blue on expand */
.accordion-button:focus {
    border-color: var(--color-primary-light) !important;
    box-shadow: 0 0 0 0.25rem rgba(74, 124, 89, 0.15) !important;
}

.accordion-button:not(.collapsed) {
    color: var(--color-primary) !important;
    background-color: var(--color-bg-soft) !important;
    box-shadow: none !important;
}

.accordion-button:not(.collapsed)::after {
    filter: hue-rotate(90deg) saturate(0.5);
}

/* Selection color */
::selection {
    background: rgba(74, 124, 89, 0.2);
    color: var(--color-text-primary);
}

/* Focus ring — green not blue */
*:focus-visible {
    outline-color: var(--color-primary) !important;
}

/* Badge — Bootstrap default is blue */
.badge {
    --bs-badge-color: var(--color-bg-white);
}

.bg-primary {
    --bs-bg-opacity: 1;
    background-color: var(--color-primary) !important;
}

.bg-primary-dark {
    background-color: var(--color-primary-dark) !important;
}

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

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

/* Override Bootstrap's internal RGB variable for bg-primary */
.bg-primary[class] {
    --bs-primary-rgb: 74, 124, 89 !important;
}

/* Pagination (if used) */
.page-link {
    color: var(--color-primary);
}

.page-link:hover {
    color: var(--color-primary-dark);
}

.page-item.active .page-link {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

/* CSS Reset & Base HTML Elements */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

body {
    margin: 0;
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: var(--leading-normal);
    color: var(--color-text-primary);
    background-color: var(--color-bg-cream);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Texture overlay for subtle grain */
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.03'/%3E%3C/svg%3E");
}

/* Typography Base */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: var(--font-heading);
    font-weight: var(--font-normal);
    line-height: var(--leading-tight);
    color: var(--color-text-primary);
    margin-top: 0;
    margin-bottom: 1rem;
}

h1,
.h1 {
    font-size: var(--text-hero);
}

h2,
.h2 {
    font-size: var(--text-5xl);
}

h3,
.h3 {
    font-size: var(--text-4xl);
}

h4,
.h4 {
    font-size: var(--text-3xl);
}

h5,
.h5 {
    font-size: var(--text-2xl);
}

h6,
.h6 {
    font-size: var(--text-xl);
}

.lead {
    font-size: var(--text-lg);
    color: var(--color-text-secondary);
    line-height: var(--leading-relaxed);
}

.text-small,
small {
    font-size: var(--text-sm);
    color: var(--color-text-light);
}

.font-accent,
blockquote {
    font-family: var(--font-accent);
    font-style: italic;
    color: var(--color-text-primary);
}

/* Links */
a {
    color: var(--color-link);
    text-decoration: none;
    transition: all var(--transition-normal);
}

a:hover {
    color: var(--color-accent-hover);
}

p {
    margin-bottom: 1.5rem;
}

/* Layout Core Helpers */
.section-padding {
    padding: var(--section-py) 0;
}

.section-padding-lg {
    padding: var(--section-py-lg) 0;
}

.bg-cream {
    background-color: var(--color-bg-cream);
}

.bg-soft {
    background-color: var(--color-bg-soft);
}

.bg-white {
    background-color: var(--color-bg-white);
}

.bg-dark {
    background-color: var(--color-bg-dark);
    color: var(--color-text-on-dark);
}

.bg-dark h1,
.bg-dark h2,
.bg-dark h3,
.bg-dark h4,
.bg-dark h5,
.bg-dark h6,
.bg-dark .h1,
.bg-dark .h2,
.bg-dark .h3,
.bg-dark .h4,
.bg-dark .h5,
.bg-dark .h6,
.bg-dark p,
.bg-dark li {
    color: var(--color-text-on-dark);
}

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

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

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

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

/* Image classes */
.img-fluid {
    max-width: 100%;
    height: auto;
}

.rounded-4,
.rounded-lg {
    border-radius: var(--border-radius-lg) !important;
}

/* Organic soft clip-paths/borders for imagery */
.organic-shape {
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
}

.organic-shape-slight {
    border-radius: 16px 20px 20px 16px;
}

/* Extended Utility Classes (used by Gemini components) */
.text-primary-dark {
    color: var(--color-primary-dark) !important;
}

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

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

.text-sm {
    font-size: var(--text-sm) !important;
}

.text-lg {
    font-size: var(--text-lg) !important;
}

.text-2xl {
    font-size: var(--text-2xl) !important;
}

.text-hero {
    font-size: var(--text-hero) !important;
}

.font-heading {
    font-family: var(--font-heading) !important;
}

.font-medium {
    font-weight: var(--font-medium) !important;
}

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

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

.shadow-soft {
    box-shadow: var(--shadow-soft) !important;
}

/* Hover utilities */
.hover-bg-soft:hover {
    background-color: var(--color-bg-soft);
}

.hover-opacity-100:hover {
    opacity: 1 !important;
}

/* Transition utilities */
.transition-fast {
    transition: all var(--transition-fast);
}

.transition-normal {
    transition: all var(--transition-normal);
}

/* Layout utilities */
.z-index-top {
    z-index: 1050;
}

.pointer-events-none {
    pointer-events: none;
}

/* Opacity utilities */
.opacity-75 {
    opacity: 0.75;
}

.opacity-05 {
    opacity: 0.05;
}

/* Blend modes */
.mix-blend-multiply {
    mix-blend-mode: multiply;
}

/* Object fit */
.object-fit-cover {
    object-fit: cover;
}

/* Additional z-index */
.z-index-1 {
    z-index: 1;
}

.z-index-10 {
    z-index: 10;
}

/* Background color extensions */
.bg-primary-light {
    background-color: var(--color-primary-light) !important;
}

/* Shadow extensions */
.shadow-medium {
    box-shadow: var(--shadow-medium) !important;
}

/* Italic utility */
.italic {
    font-style: italic;
}

/* Bounce animation for scroll indicator */
@keyframes bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(8px); }
}

.animate-bounce {
    animation: bounce 2s infinite ease-in-out;
}