/* RanchOS demo: neutral light palette for the property manager templates.
   Only tokens and the handful of rules that hardcode dark colors. */
:root {
    --dark-bg:           #f6f7f8;   /* page */
    --dark-surface:      rgb(0, 0, 0, 0.03);
    --dark-card:         #ffffff;   /* cards, panels */
    --dark-card-hover:   #f0f2f4;
    --dark-border:       rgb(0, 0, 0, 0.10);
    --dark-text:         #1f2933;
    --dark-text-muted:   #5f6b78;
    --dark-accent:       #35506b;   /* restrained slate blue for fills and borders */
    --dark-accent-fg:    #2c4560;   /* same hue as text: 8.5:1 on white */
    --dark-accent-dim:   #2a405a;
    --dark-input-bg:     #ffffff;
    --dark-input-border: rgb(0, 0, 0, 0.18);
    --dark-overlay-bg:   #ffffff;
    --color-border-weak: rgb(0, 0, 0, 0.05);
}

/* Rules in ranch-templates.css that bypass the tokens. */
.ranch-plugin .view-btn.active,
.ranch-plugin .view-btn[aria-pressed="true"] {
    background: #35506b;
    color: #ffffff;
}
.ranch-plugin .view-btn.active:hover {
    background: #2a405a;
    color: #ffffff;
}
.ranch-single--mag .mag-btn--outline {
    color: #1f2933;
    border-color: rgb(31, 41, 51, 0.5);
}
.ranch-single--mag .mag-btn--outline:hover,
.ranch-single--mag .mag-btn--outline:focus-visible {
    background: #1f2933;
    border-color: #1f2933;
    color: #ffffff;
}
.ranch-overlay-body::-webkit-scrollbar-thumb {
    background-color: #c5ccd4;
}
.ranch-single--mag .mag-related-card {
    background: #ffffff;
}
/* The card's click overlay must stay transparent or it hides the text under it. */
.ranch-single--mag .mag-sidebar__card-link-overlay {
    background: transparent;
}
/* Cards and hero overlays that sit on photos keep their own contrast. */
.ranch-plugin .ranch-card,
.ranch-plugin .property-card {
    box-shadow: 0 1px 2px rgb(0, 0, 0, 0.06), 0 4px 16px rgb(0, 0, 0, 0.06);
}

/* Listing-contact cards in the magazine sidebar: white card, dark text,
   and a compact initial when there is no headshot. */
.ranch-single--mag .mag-sidebar__card {
    background: #ffffff;
}
.ranch-single--mag .mag-sidebar__body,
.ranch-single--mag .mag-sidebar__name,
.ranch-single--mag .mag-sidebar__detail,
.ranch-single--mag .mag-sidebar__detail a {
    color: #1f2933;
}
.ranch-single--mag .mag-sidebar__role {
    color: #5f6b78;
}
.ranch-single--mag .mag-sidebar__photo--placeholder {
    aspect-ratio: auto;
    height: 96px;
    background: #e9ecef;
    color: #5f6b78;
}

/* Filter bar and multi-select dropdowns: the plugin colors the items for a
   dark menu; on a white menu they need dark text. */
.ranch-archive--dark .filter-checkbox-item,
.filter-checkbox-item,
.filter-checkbox-search,
.filter-checkbox-toggle {
    color: #1f2933;
}
.filter-checkbox-item:hover {
    background: #f0f2f4;
}
.filter-checkbox-menu {
    border-color: rgb(0, 0, 0, 0.12);
    box-shadow: 0 8px 24px rgb(0, 0, 0, 0.10);
}
.ranch-filter-toggle {
    background: #ffffff;
    color: #1f2933;
    border-bottom: 1px solid rgb(0, 0, 0, 0.10);
}
.results-count__scope-clear {
    background: rgb(0, 0, 0, 0.05);
}
.results-count__scope-clear:hover,
.results-count__scope-clear:focus-visible {
    background: rgb(0, 0, 0, 0.10);
}

/* Action buttons on the listing page. */
.ranch-single--mag .mag-btn--dark {
    background: #35506b;
    border-color: #35506b;
    color: #ffffff;
}
.ranch-single--mag .mag-btn--dark:hover,
.ranch-single--mag .mag-btn--dark:focus-visible {
    background: #2a405a;
    border-color: #2a405a;
    color: #ffffff;
}

/* Fixed call-to-action bar on phones: light, with a visible top edge. */
.ranch-single--mag .mag-mobile-cta {
    background: rgb(255, 255, 255, 0.98) !important;
    border-top-color: rgb(0, 0, 0, 0.12) !important;
    box-shadow: 0 -4px 20px rgb(0, 0, 0, 0.08);
}
.ranch-single--mag .mag-mobile-cta .mag-btn--outline {
    color: #1f2933;
    border-color: rgb(31, 41, 51, 0.5);
    background: #ffffff;
}

/* Password form button and hero stats box shadow that assumed a dark page. */
.ranch-password-gate .post-password-form input[type="submit"] {
    background: #35506b;
    border-color: #35506b;
    color: #ffffff;
}
.ranch-single--mag .mag-stats {
    box-shadow: 0 1px 12px rgb(0, 0, 0, 0.06) !important;
}

/* The header action row uses the traditional button set; its primary button
   inherits the page text color, which is dark on a slate fill. */
.ranch-single .trad-btn--primary,
.ranch-single .trad-btn--primary:hover,
.ranch-single .trad-btn--primary:focus-visible {
    color: #ffffff;
}
.ranch-single .trad-btn--primary:hover,
.ranch-single .trad-btn--primary:focus-visible {
    background: #2a405a;
    border-color: #2a405a;
}
