/* David Ion Custom Styles - Black & Gold Elegance Theme */
/* Color Palette: #000000 (black), #14213D (navy), #FCA311 (gold), #E5E5E5 (light gray) */

/* ===== HERO SECTION ===== */
/* Add dark overlay for text readability */
#banner {
    background-image: linear-gradient(rgba(20, 33, 61, 0.5), rgba(20, 33, 61, 0.6)),
                      url('../../images/whale-landing.jpg') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

/* Override template's style2, style3, etc. banner colors - NUCLEAR OVERRIDE */
#banner.style2,
#banner.style3,
#banner.style4,
#banner.style5,
#banner.style6 {
    background-color: #14213D !important;
}

#banner.style2:before,
#banner.style3:before,
#banner.style4:before,
#banner.style5:before,
#banner.style6:before,
#banner.style2:after,
#banner.style3:after,
#banner.style4:after,
#banner.style5:after,
#banner.style6:after {
    background-color: #14213D !important;
}

/* Override the image overlay that creates the purple tint */
#banner .image:after,
#banner.style2 .image:after,
#banner.style3 .image:after,
#banner.style4 .image:after,
#banner.style5 .image:after,
#banner.style6 .image:after {
    background-color: rgba(20, 33, 61, 0.75) !important;
}

#banner h1,
#banner p,
#banner .content,
#banner .button {
    color: #ffffff !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

/* ===== BUTTONS ===== */
/* Primary buttons = Gold */
.button.primary,
input[type="submit"].primary,
.actions .button.primary {
    background-color: #FCA311 !important;
    color: #000000 !important;
    border: none !important;
    font-weight: 600 !important;
}

.button.primary:hover {
    background-color: #FFB733 !important;
    color: #000000 !important;
}

/* Regular buttons = Navy */
.button.next,
.button {
    background-color: #14213D !important;
    color: #ffffff !important;
}

.button.next:hover,
.button:hover {
    background-color: #1E2F54 !important;
}

/* ===== HEADER ===== */
#header {
    background: #14213D !important;
}

#header.alt {
    background: transparent;
}

/* ===== SERVICE TILES ===== */
/* Dark navy overlay on tiles */
.tiles article .image:after {
    background-color: rgba(20, 33, 61, 0.8) !important;
}

/* Gold overlay on hover */
.tiles article:hover .image:after {
    background-color: rgba(252, 163, 17, 0.85) !important;
}

/* Ensure tile text is white */
.tiles article header h3,
.tiles article header p {
    color: #ffffff !important;
}

/* ===== SPOTLIGHTS SECTIONS ===== */
/* These alternate dark/light backgrounds in the template */
.spotlights section:nth-child(odd) {
    background-color: #14213D !important;
}

.spotlights section:nth-child(odd) h1,
.spotlights section:nth-child(odd) h2,
.spotlights section:nth-child(odd) h3,
.spotlights section:nth-child(odd) h4,
.spotlights section:nth-child(odd) p,
.spotlights section:nth-child(odd) li,
.spotlights section:nth-child(odd) strong {
    color: #ffffff !important;
}

.spotlights section:nth-child(even) {
    background-color: #E5E5E5 !important;
}

.spotlights section:nth-child(even) h1,
.spotlights section:nth-child(even) h2,
.spotlights section:nth-child(even) h3,
.spotlights section:nth-child(even) h4,
.spotlights section:nth-child(even) p,
.spotlights section:nth-child(even) li,
.spotlights section:nth-child(even) strong {
    color: #333333 !important;
}

/* ===== ICONS ===== */
.icon.major {
    color: #FCA311 !important;
}

/* ===== LINKS ===== */
a {
    color: #FCA311;
    border-bottom-color: transparent;
}

a:hover {
    color: #FFB733;
}

/* ===== SECTIONS ===== */
/* Default sections - dark text on light background */
section {
    background-color: #ffffff;
}

/* CRITICAL: Force dark text on ALL light background sections */
section h1,
section h2,
section h3,
section h4,
section h5,
section h6,
section p,
section li,
section span,
section div,
section strong,
section a,
section label {
    color: #333333 !important;
}

/* Force dark text on ANY element with white/light inline background */
[style*="background: #fff"],
[style*="background: #f"],
[style*="background-color: #fff"],
[style*="background-color: #f"] {
    color: #333333 !important;
}

[style*="background: #fff"] *,
[style*="background: #f"] *,
[style*="background-color: #fff"] *,
[style*="background-color: #f"] * {
    color: #333333 !important;
}

/* Remove any blue highlighting on text */
section mark,
section strong,
p strong,
strong {
    background-color: transparent !important;
    color: inherit !important;
}

/* About section - ensure white background */
#about {
    background-color: #ffffff !important;
}

#about p,
#about strong {
    background-color: transparent !important;
    color: #333333 !important;
}

/* Alternating light gray sections */
#why,
#cta {
    background-color: #E5E5E5;
}

/* Ensure dark text on light sections */
#why h1,
#why h2,
#why h3,
#why h4,
#why p,
#why strong,
#cta h1,
#cta h2,
#cta h3,
#cta h4,
#cta p {
    color: #333333 !important;
}

/* ===== DARK SECTIONS (Contact & Footer) ===== */
#contact,
#contact section,
#contact .inner,
#contact .split,
#footer {
    background-color: #14213D !important;
}

#contact,
#contact *,
#contact h1,
#contact h2,
#contact h3,
#contact h4,
#contact p,
#contact span,
#contact a,
#contact .contact-method,
#contact .contact-method h3,
#contact .contact-method span,
#contact .contact-method a {
    color: #ffffff !important;
}

#contact a:hover {
    color: #FCA311 !important;
}

/* Footer styling - match template style */
#footer {
    padding: 3em 0 2em 0;
}

#footer .inner {
    text-align: center;
}

#footer .copyright {
    font-size: 0.9em;
    margin: 0;
    padding: 0;
    list-style: none;
}

#footer .copyright li {
    display: inline-block;
    border-left: solid 1px rgba(255, 255, 255, 0.3);
    line-height: 1;
    padding: 0 0 0 1em;
    margin: 0 0 0 1em;
    color: rgba(255, 255, 255, 0.6) !important;
}

#footer .copyright li:first-child {
    border-left: 0;
    padding-left: 0;
    margin-left: 0;
}

#footer .copyright a {
    color: rgba(255, 255, 255, 0.6) !important;
}

#footer .copyright a:hover {
    color: #ffffff !important;
}

/* Contact section - form and text styling */
#contact form label {
    color: #ffffff !important;
}

#contact form input,
#contact form textarea {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
}

#contact form input:focus,
#contact form textarea:focus {
    border-color: #FCA311 !important;
    background-color: rgba(255, 255, 255, 0.15) !important;
}

#contact form input::placeholder,
#contact form textarea::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

/* ===== CTA SECTION ===== */
#cta {
    background-color: #E5E5E5;
}

/* ===== REMOVE CONFLICTING STYLES ===== */
/* Override any template blues */
.alt {
    background-color: transparent !important;
}

/* ===== NETLIFY FORMS ===== */
/* Hide honeypot field from bots */
.hidden {
    display: none !important;
}

/* Contact form section styling */
#contact-form label {
    color: #ffffff !important;
}

#contact-form form input,
#contact-form form textarea,
#contact-form form select {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
}

#contact-form form input:focus,
#contact-form form textarea:focus,
#contact-form form select:focus {
    border-color: #FCA311 !important;
    background-color: rgba(255, 255, 255, 0.15) !important;
}

#contact-form form input::placeholder,
#contact-form form textarea::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

#contact-form form select option {
    background-color: #14213D !important;
    color: #ffffff !important;
}