/**
 * Palm Hills design system
 * Tokens inspired by the product UI scale (DM Sans + Cormorant Garamond,
 * sea-green primary, warm paper background). Mapped onto WpResidence
 * --wp-estate-* variables so existing theme components inherit them.
 */

@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500&family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&display=swap");

:root {
    --font-sans: "DM Sans", ui-sans-serif, system-ui, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --font-display: "Cormorant Garamond", "Times New Roman", Georgia, serif;

    --color-neutral-100: oklch(97% 0 none);
    --color-neutral-300: oklch(87% 0 none);
    --color-neutral-500: oklch(55.6% 0 none);
    --color-neutral-700: oklch(37.1% 0 none);
    --color-neutral-900: oklch(20.5% 0 none);
    --color-black: #000;
    --color-white: #fff;

    --color-parchment: #F5F1E9;
    --color-cream: #FAF7F2;
    --color-bg: #F5F1E9;
    --color-bg-elevated: #FAF7F2;
    --color-bg-subtle: #EBE5DB;
    --color-bg-ink: #1a2e2b;
    --color-fg: #162421;
    --color-fg-muted: #5a6b67;
    --color-fg-subtle: #879692;
    --color-fg-on-ink: #f4f6f5;
    --color-fg-on-ink-muted: #b5c4c0;
    --color-primary: #3b756e;
    --color-primary-hover: #2f5f59;
    --color-primary-fg: var(--color-parchment);
    --color-border: #dce3e1;
    --color-border-strong: #c2cdc9;
    --color-sea: #3b756e;

    --spacing: 0.25rem;
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 1.875rem;
    --text-4xl: 2.25rem;
    --text-5xl: 3rem;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --tracking-tight: -0.025em;
    --tracking-normal: 0em;
    --tracking-wide: 0.025em;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --radius-xs: 0.25rem;
    --radius-sm: 0.5rem;
    --radius-md: 0.75rem;
    --radius-lg: 1rem;
    --radius-xl: 1.5rem;
    --radius-2xl: 2rem;
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --blur-sm: 8px;
    --blur-md: 12px;
    --shadow-soft: 0 1px 2px rgb(26 46 43 / 0.04), 0 8px 24px rgb(26 46 43 / 0.06);
    --shadow-lift: 0 4px 12px rgb(26 46 43 / 0.08), 0 16px 40px rgb(26 46 43 / 0.08);
    --motion-quick: 150ms;
    --motion-fast: 250ms;
    --motion-slow: 400ms;

    --icon-stroke: 1.5;
    --icon-stroke-emphasis: 1.75;
    --icon-size: 1.25rem;
    --icon-color: currentColor;
    --icon-color-accent: var(--color-primary);

    /* WpResidence bridges — theme components read these. */
    --wp-estate-main-color-option: var(--color-primary);
    --wp-estate-second-color-option: var(--color-primary);
    --wp-estate-background-color-option: var(--color-bg);
    --wp-estate-background-color: var(--color-bg);
    --wp_estate_content_back_color-option: var(--color-bg);
    --wp_estate_content_area_back_color-option: var(--color-bg-elevated);
    --wp-estate-font-color-option: var(--color-fg);
    --wp-estate-font-color: var(--color-fg);
    --wp_estate_headings_color-option: var(--color-bg-ink);
    --wp_estate_link_color-option: var(--color-primary);
    --wp-estate-hover-button-color-option: var(--color-primary-hover);
    --wp_estate_breadcrumbs_font_color-option: var(--color-fg-muted);
    --wp-estate-border-radius-corner-option: var(--radius-md);
    --wp-estate-cssbox-shadow-option: var(--shadow-soft);
    --wp-estate-h1-font-family-option: var(--font-display);
    --wp-estate-h2-font-family-option: var(--font-display);
    --wp-estate-h3-font-family-option: var(--font-display);
    --wp-estate-h4-font-family-option: var(--font-display);
    --wp-estate-h5-font-family-option: var(--font-sans);
    --wp-estate-h6-font-family-option: var(--font-sans);
    --wp-estate-paragraph-font-family-option: var(--font-sans);
    --wp-estate-menu-font-family-option: var(--font-sans);
    --wp-estate-h1-font-weight-option: 600;
    --wp-estate-h2-font-weight-option: 600;
    --wp-estate-h3-font-weight-option: 600;
    --wp-estate-paragraph-font-weight-option: 400;
    --wp-estate-menu-font-weight-option: 500;
    --wp-estate-card-details-font-family-option: var(--font-sans);
    --wp-estate-card-details-font-color-option: var(--color-fg-muted);
}

html {
    color-scheme: light;
}

body {
    font-family: var(--font-sans);
    font-size: var(--text-base);
    line-height: var(--leading-normal);
    letter-spacing: var(--tracking-normal);
    color: var(--color-fg);
    background-color: var(--color-bg);
}

h1, h2, h3, h4,
.entry-title,
.blog_unit_meta h4,
.listing_title,
.listing_title_unit,
.property_listing h4,
.agent_unit h4,
.single-title,
.panel-title,
.property_menu_item_title {
    font-family: var(--font-display);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--tracking-tight);
    color: var(--color-bg-ink);
    line-height: var(--leading-tight);
}

h5, h6 {
    font-family: var(--font-sans);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--tracking-wide);
    color: var(--color-fg);
}

p, li, td, th, label, input, select, textarea, button {
    font-family: var(--font-sans);
}

a {
    color: var(--color-primary);
    transition: color var(--motion-quick) var(--ease-out);
}

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

/* Buttons */
.wpresidence_button,
.wpestate_agent_details_wrapper .wpresidence_button,
#submit_action,
.comment-form .submit,
.btn.wpresidence_button {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-primary-fg);
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-weight: var(--font-weight-medium);
    letter-spacing: var(--tracking-wide);
    box-shadow: var(--shadow-soft);
    transition: background-color var(--motion-fast) var(--ease-out),
                box-shadow var(--motion-fast) var(--ease-out),
                transform var(--motion-quick) var(--ease-out);
}

.wpresidence_button:hover,
.btn.wpresidence_button:hover {
    background-color: var(--color-primary-hover);
    border-color: var(--color-primary-hover);
    color: var(--color-primary-fg);
    box-shadow: var(--shadow-lift);
}

/* Cards / listings */
.property_listing,
.listing_wrapper .property_listing,
.agent_unit,
.blog_unit_back,
.featured_property,
.places_wrapper {
    background-color: var(--color-bg-elevated);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-soft);
    border: 1px solid var(--color-border);
    transition: box-shadow var(--motion-fast) var(--ease-out),
                transform var(--motion-fast) var(--ease-out);
}

.property_listing:hover,
.agent_unit:hover,
.blog_unit_back:hover {
    box-shadow: var(--shadow-lift);
}

.property_listing img,
.listing-unit-img-wrapper,
.listing-unit-img-wrapper img {
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

/* Forms */
input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
select,
textarea,
.form-control,
.bootstrap-select .dropdown-toggle {
    border-color: var(--color-border) !important;
    border-radius: var(--radius-sm) !important;
    color: var(--color-fg);
    background-color: var(--color-bg-elevated);
    font-family: var(--font-sans);
}

input:focus,
textarea:focus,
select:focus,
.form-control:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgb(59 117 110 / 0.15);
    outline: none;
}

/* Surfaces */
.wpresidence-content-container-wrapper,
.container.content_wrapper,
.content_wrapper {
    background-color: var(--color-bg);
}

#colophon,
.footer_back {
    background-color: var(--color-bg-ink);
    color: var(--color-fg-on-ink);
}

#colophon a,
.footer_back a {
    color: var(--color-fg-on-ink-muted);
}

#colophon a:hover,
.footer_back a:hover {
    color: var(--color-fg-on-ink);
}

/* Search / advanced */
.search_wrapper,
.adv-search-1,
#advanced_search_shortcode,
.advanced_search_shortcode {
    background-color: var(--color-bg-elevated);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-soft);
}

/* Overview + muted copy */
.overview_element,
.listing_detail,
.property_categs,
.meta-info,
.price_label {
    color: var(--color-fg-muted);
}

.price_area,
.listing_unit_price_wrapper {
    color: var(--color-primary);
    font-family: var(--font-display);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--tracking-tight);
}


/* Lucide icons — 1.5–1.75 stroke, currentColor / primary green */
.ph-icon,
svg.ph-icon {
    width: var(--icon-size);
    height: var(--icon-size);
    stroke: currentColor;
    stroke-width: var(--icon-stroke);
    fill: none;
    flex-shrink: 0;
    display: inline-block;
    vertical-align: middle;
    color: var(--icon-color-accent);
}

.ph-icon--on-ink,
.master_header .ph-icon,
#colophon .ph-icon,
.wpresidence_button .ph-icon {
    color: currentColor;
}

.overview_element .ph-icon,
.listing_detail .ph-icon,
.property_listing_details_v2 .ph-icon {
    color: var(--color-primary);
    width: 1.25rem;
    height: 1.25rem;
}


/* Soft parchment section bands */
.elementor-section.elementor-top-section:nth-child(even),
.wpresidence-content-container-wrapper .item_row:nth-child(even),
.adv_results_wrapper,
#listing_ajax_container {
    background-color: var(--color-bg-subtle);
}

.property_listing,
.agent_unit,
.blog_unit_back,
.search_wrapper,
.adv-search-1 {
    background-color: var(--color-cream);
}