/* ============================================================================
 * Theme: Terracotta (Pro) — Claude-inspired
 *
 * DESIGN.md source: https://github.com/VoltAgent/awesome-design-md/tree/main/design-md/claude/
 *
 * Warm terracotta (#DA7756), warm cream (#FAF7F2) background, optional
 * editorial serif on the field for a literary feel. The catalog entry
 * for Claude is the source of truth for all surface tokens, type
 * rhythm, and editorial accents.
 *
 * SECTION INDEX (matches css/style.css BEM contract):
 *   /* ---- Tokens ---- */                  — :root custom properties
 *   /* ---- Field ---- */                   — .fast-fuzzy-search__field
 *   /* ---- Input ---- */                   — .fast-fuzzy-search__input
 *   /* ---- Icon ---- */                    — .fast-fuzzy-search__icon
 *   /* ---- Clear button ---- */            — .fast-fuzzy-search__clear
 *   /* ---- Post-type bar ---- */           — .fast-fuzzy-search__post-types + chips
 *   /* ---- Context strip ---- */           — .fast-fuzzy-search__context
 *   /* ---- Panel ---- */                   — .fast-fuzzy-search__panel
 *   /* ---- Result link ---- */             — .fast-fuzzy-search__result-link
 *   /* ---- Result icon + image ---- */     — .fast-fuzzy-search__result-icon
 *   /* ---- Result chip ---- */             — .fast-fuzzy-search__chip
 *   /* ---- Result item divider ---- */     — .fast-fuzzy-search__result-item
 *   /* ---- Empty + keyboard + view-all --- — empty state, kbd footer, view-all
 *   /* ---- View all button ---- */        — .fast-fuzzy-search__view-all
 *   /* ---- Panel close button ---- */      — .fast-fuzzy-search__panel-close
 *   /* ---- Trigger buttons (button.php + icon-button.php) ---- */
 *                                            .fast-fuzzy-search__button + .fast-fuzzy-search__icon-button
 * ============================================================================
 */

.fast-fuzzy-search--terracotta {
    --ffs-border-color:           #e8e2d8;
    --ffs-scrollbar-thumb:        #c9b8a2;
    --ffs-scrollbar-thumb-hover:  #DA7756;
}

/* ---- Field ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__field {
    height: 48px;
    background: #FAF7F2;
    border: 1px solid var(--ffs-border-color);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(218, 119, 86, 0.05);
    color: #1f1d1a;
    font-family: Georgia, 'Times New Roman', serif;
}

.fast-fuzzy-search--terracotta[data-has-query="true"] .fast-fuzzy-search__field {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__field:focus-within {
    border-color: #DA7756;
    box-shadow: 0 0 0 3px rgba(218, 119, 86, 0.15);
}

/* ---- Input ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__input,
.fast-fuzzy-search--terracotta .fast-fuzzy-search__input::placeholder {
    font-size: 15px;
    line-height: 22px;
    font-weight: 400;
    color: #1f1d1a;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__input::placeholder {
    color: #b09580;
}

/* ---- Icon ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__icon,
.fast-fuzzy-search--terracotta .fast-fuzzy-search__icon-frame {
    color: #DA7756;
}

/* ---- Clear button ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__clear button {
    background: rgba(218, 119, 86, 0.1);
    color: #DA7756;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__clear button:hover {
    background: rgba(218, 119, 86, 0.18);
}

/* ---- Post-type bar ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__post-types {
    background: #f3ede4;
    border-bottom: 1px solid var(--ffs-border-color);
    color: #1f1d1a;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__chip-button {
    border-color: var(--ffs-border-color);
    background: #fdfaf5;
    color: #1f1d1a;
    font-family: Georgia, 'Times New Roman', serif;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__chip-button:hover {
    background: #f8f1e6;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__chip-button[aria-selected="true"] {
    border-color: #DA7756;
    background: rgba(218, 119, 86, 0.1);
    color: #DA7756;
    box-shadow: inset 0 0 0 1px #DA7756;
}

/* ---- Context strip ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__context {
    color: #1f1d1a;
    background: #f3ede4;
    font-family: Georgia, 'Times New Roman', serif;
}

/* ---- Panel ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__panel {
    background: #fdfaf5;
    border: 1px solid var(--ffs-border-color);
    border-top: 0;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    font-size: 14px;
    line-height: 22px;
    color: #1f1d1a;
}

/* ---- Result link ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__result-link {
    color: #1f1d1a;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__result-link:hover {
    background: #f8f1e6;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__result-link[aria-selected="true"] {
    border-color: #DA7756;
    border-left-color: #DA7756;
    background: rgba(218, 119, 86, 0.1);
    box-shadow: inset 0 0 0 1px #DA7756;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__result-link[aria-selected="true"]:hover {
    background: rgba(218, 119, 86, 0.15);
}

/* ---- Result icon + image ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__result-icon {
    background: #f3ede4;
    color: #DA7756;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__result-link[aria-selected="true"] .fast-fuzzy-search__result-icon,
.fast-fuzzy-search--terracotta .fast-fuzzy-search__result-link:hover .fast-fuzzy-search__result-icon {
    background: #DA7756;
    color: #fdfaf5;
}

/* ---- Result chip ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__chip {
    background: #f3ede4;
    color: #1f1d1a;
    font-family: Georgia, 'Times New Roman', serif;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__result-link[aria-selected="true"] .fast-fuzzy-search__chip,
.fast-fuzzy-search--terracotta .fast-fuzzy-search__result-link:hover .fast-fuzzy-search__chip {
    background: #DA7756;
    color: #fdfaf5;
}

/* ---- Empty + keyboard + view-all --- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__empty {
    color: #1f1d1a;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__empty-title {
    color: #1f1d1a;
    font-family: Georgia, 'Times New Roman', serif;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__empty-description {
    color: #5c504a;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__keyboard-shortcuts {
    background: #f3ede4;
    border-top-color: var(--ffs-border-color);
    color: #1f1d1a;
    font-family: Georgia, 'Times New Roman', serif;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__kbd {
    background: #fdfaf5;
    border-color: var(--ffs-border-color);
    color: #1f1d1a;
    font-family: Georgia, 'Times New Roman', serif;
}

/* ---- View all button ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__view-all {
    background: #f3ede4;
    color: #DA7756;
    font-family: Georgia, 'Times New Roman', serif;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__view-all:hover {
    background: rgba(218, 119, 86, 0.1);
}

/* ---- Panel close button ---- */
.fast-fuzzy-search__panel-close--terracotta {
    background: #fdfaf5;
    color: #1f1d1a;
    box-shadow: 0 1px 2px rgba(218, 119, 86, 0.05);
}

.fast-fuzzy-search__panel-close--terracotta:hover,
.fast-fuzzy-search__panel-close--terracotta:focus {
    background: #f3ede4;
}

/* ---- Trigger buttons (button.php + icon-button.php) ---- */
.fast-fuzzy-search--terracotta .fast-fuzzy-search__icon-button,
.fast-fuzzy-search--terracotta .fast-fuzzy-search__button {
    background: #fdfaf5;
    color: #1f1d1a;
    border: 1px solid var(--ffs-border-color);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(218, 119, 86, 0.05);
    font-family: Georgia, 'Times New Roman', serif;
    transition: background-color var(--ffs-duration-fast) var(--ffs-easing),
                border-color var(--ffs-duration-fast) var(--ffs-easing),
                box-shadow var(--ffs-duration-fast) var(--ffs-easing),
                transform var(--ffs-duration-fast) var(--ffs-easing);
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__icon-button {
    border-radius: var(--ffs-radius-pill);
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__button {
    border-radius: 8px;
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__icon-button:hover,
.fast-fuzzy-search--terracotta .fast-fuzzy-search__button:hover {
    background: #f3ede4;
    border-color: #DA7756;
    box-shadow: 0 2px 4px rgba(218, 119, 86, 0.1), 0 6px 14px rgba(218, 119, 86, 0.08);
}

.fast-fuzzy-search--terracotta .fast-fuzzy-search__icon-button:focus-visible,
.fast-fuzzy-search--terracotta .fast-fuzzy-search__button:focus-visible {
    border-color: #DA7756;
    box-shadow: 0 0 0 3px rgba(218, 119, 86, 0.15);
}