/*
Theme Name: Coastal Preservation Child 
Theme URI: https://coastalpreservation.com/
Description: Child theme for Coastal Preservation
Author: Gemini AI
Author URI: https://gemini.google.com
Template: coastal-preservation
Version: 1.0.0
*/

/* --- 1. Custom Brand Colors & Fonts (used in custom CSS below) --- */
:root {
    --coastal-blue: #083D77;
    --sand-beige: #E8D7B5;
    --dark-sand: #C9B89E;
    --white: #ffffff;
    --text-color: #333333;
}

/* --- 2. Base Typography & Structure --- */
body {
    font-family: 'Open Sans', sans-serif;
    color: var(--text-color);
}

.montserrat {
    font-family: 'Montserrat', sans-serif;
}

/* --- 3. Single-Page Navigation Overrides (Required for SPA functionality) --- */

/* Initially hide all page sections except the active one. */
.page-section {
    display: none;
}

/* Ensure only the active page section is visible */
.page-section.active {
    display: block;
}

/* Navigation Link active state styling (optional if using active class) */
.nav-link.active {
    border-bottom-color: var(--sand-beige) !important;
}


/* --- 4. Contact Form 7 Styling Overrides --- */

/* Target all inputs and textareas within the CF7 form to apply Tailwind-like styles */
.wpcf7-form input:not([type="submit"]),
.wpcf7-form textarea {
    width: 100%;
    padding: 0.75rem 1rem; /* py-3 px-4 */
    margin-bottom: 1rem;
    border: 1px solid #D1D5DB; /* border-gray-300 */
    border-radius: 0.5rem; /* rounded-lg */
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); /* shadow-sm */
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* Focus state for inputs */
.wpcf7-form input:focus:not([type="submit"]),
.wpcf7-form textarea:focus {
    border-color: var(--coastal-blue);
    box-shadow: 0 0 0 3px rgba(8, 61, 119, 0.2); /* ring-2 focus:ring-coastal-blue */
    outline: none;
}

/* --- FIX for overly tall message area --- */
.wpcf7-form textarea {
    min-height: 5rem; /* Ensures a minimum height */
    height: 5rem !important; /* Forces the fixed height, overriding plugin defaults */
    resize: none; /* Prevents users from manually resizing the box, improving layout consistency */
}
/* -------------------------------------- */

/* Style the submit button */
.wpcf7-form input[type="submit"] {
    display: inline-block;
    width: auto;
    cursor: pointer;
    background-color: var(--sand-beige);
    color: var(--coastal-blue);
    font-weight: 700; /* font-bold */
    padding: 0.75rem 2rem; /* py-3 px-8 */
    border: none;
    border-radius: 0.5rem; /* rounded-lg */
    transition: background-color 0.2s;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1); /* shadow-xl */
}

.wpcf7-form input[type="submit"]:hover {
    background-color: var(--dark-sand); /* slightly darker beige on hover */
}

/* --- 5. Table Styling for Service Detail Article --- */

.page-section table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    font-size: 0.95rem;
    line-height: 1.5;
}

/* Table Header */
.page-section th {
    background-color: var(--coastal-blue);
    color: var(--sand-beige);
    font-weight: 700;
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 2px solid var(--dark-sand);
}

/* Table Data Cells */
.page-section td {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #e0e0e0; /* light gray separator */
}

/* Zebra Striping (Optional) */
.page-section tr:nth-child(even) {
    background-color: #f7f7f7;
}

.page-section tr:last-child td {
    border-bottom: none;
}