/**
 * Plant database plugin style overrides for LocaLeaf Nursery theme.
 *
 * Swaps #2e7d32 (green) → terracotta palette using the two-tier WCAG system:
 *   - Display (bg, borders, decoration): #D3783F (terracotta)
 *   - Text-bearing (links, labels, small text): #B8602A (terracotta-text, 4.5:1 on #FEFEFC)
 *
 * Also overrides related green tints (#e8f5e9, rgba(46,125,50), #1b5e20).
 * No plugin file edits — child theme CSS overrides only (FR-11).
 */

/* ==========================================================================
   1. Filter Controls
   ========================================================================== */

/* Filter toggle button — hover */
.localeaf-filter-toggle:hover {
    border-color: #D3783F;
    color: #B8602A;
}

/* Search input — focus ring */
.localeaf-search-input:focus {
    border-color: #D3783F;
    box-shadow: 0 0 0 2px rgba(211, 120, 63, 0.15);
}

/* Filter chip — checked/active state */
.localeaf-filter-group__options input:checked + span,
.localeaf-filter-group__options label:has(input:checked) {
    background: #D3783F;
    border-color: #D3783F;
}

/* Availability checkbox accent */
.localeaf-catalogue__available-toggle input[type="checkbox"] {
    accent-color: #D3783F;
}

/* ==========================================================================
   2. View Toggle
   ========================================================================== */

.localeaf-view-btn--active {
    background: #D3783F;
    border-color: #D3783F;
}

/* ==========================================================================
   3. Table View
   ========================================================================== */

/* Row hover — green tint → warm terracotta tint */
.localeaf-catalogue__table tbody tr:hover {
    background-color: #fdf0ea;
}

/* Plant name links */
.localeaf-catalogue__table td a {
    color: #B8602A;
}

/* ==========================================================================
   4. Plant Card
   ========================================================================== */

/* Keyboard focus outline */
.localeaf-plant-card__link:focus-visible {
    outline: 2px solid #111111 !important;
}

/* ==========================================================================
   5. Badges
   ========================================================================== */

/* Available badge — green tint → warm terracotta tint */
.badge--available {
    background: #fdf0ea;
    color: #B8602A;
}

/* ==========================================================================
   6. Info Popup
   ========================================================================== */

.localeaf-info-btn:hover {
    background: #D3783F;
}

.localeaf-info-popup__content a {
    color: #B8602A;
}

/* ==========================================================================
   7. Detail Page
   ========================================================================== */

/* Back-to-catalogue link */
.localeaf-plant-detail__back a {
    color: #B8602A;
}

/* Ecology subsection headings */
.localeaf-ecology-subsection h4 {
    color: #B8602A;
}

/* ==========================================================================
   8. Empty State
   ========================================================================== */

.localeaf-empty__btn:hover {
    border-color: #D3783F;
    color: #B8602A;
}

.localeaf-empty__btn--primary {
    background: #D3783F;
    border-color: #D3783F;
}

.localeaf-empty__btn--primary:hover {
    background: #C06A34;
    border-color: #C06A34;
}

/* ==========================================================================
   9. Card Grid — 4 columns at 990px content width
   ========================================================================== */

.localeaf-catalogue__grid {
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
}

/* ==========================================================================
   10. Card text sizing
   ========================================================================== */

.localeaf-plant-card__latin {
    font-size: 0.8em;
}

/* ==========================================================================
   11. Emoji sizing in cards
   ========================================================================== */

.localeaf-plant-card__meta,
.localeaf-plant-card__details {
    font-size: 0.8em;
}

/* ==========================================================================
   11. Typography — reinforce theme font stack on plugin elements
   ========================================================================== */

/* Plugin already uses font-family: inherit (6 declarations) which should
   pick up DM Sans from theme.json. These explicit overrides ensure headings
   within the plugin match the theme heading hierarchy. */

.localeaf-plant-detail__title {
    font-family: "Special Elite", cursive;
}

.localeaf-catalogue__group h2 {
    font-family: "Special Elite", cursive;
}

/* Filter toggle and catalogue form controls — explicit DM Sans
   (plugin sets font-family explicitly, breaking inheritance) */
.localeaf-filter-toggle,
.localeaf-catalogue__search input,
.localeaf-catalogue select,
.localeaf-catalogue__sort select {
    font-family: "DM Sans", sans-serif;
}
