/* Homepage flower finder only. The existing catalogue filters remain the result source. */
body.hkf-public-design.page-home .home-flower-finder {
    position: relative;
    margin: 24px 0 0;
    padding: 22px 26px 20px;
    color: #194a33;
    background: #f1f4e9;
    border: 1px solid #aec19e;
    border-radius: 16px;
}
body.hkf-public-design.page-home .home-flower-finder .flower-finder {
    margin: 0;
    border: 0;
    border-radius: 0;
    background: none;
}
body.hkf-public-design.page-home .home-flower-finder .flower-finder > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 48px;
    gap: 16px;
    padding: 0;
    list-style: none;
    cursor: pointer;
}
body.hkf-public-design.page-home .home-flower-finder .flower-finder > summary::-webkit-details-marker { display: none; }
body.hkf-public-design.page-home .home-flower-finder-heading {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 18px;
    min-width: 0;
}
body.hkf-public-design.page-home .home-flower-finder-heading .home-flower-finder-ornament {
    display: inline-flex;
    color: #a48646;
}
body.hkf-public-design.page-home .home-flower-finder-heading .home-flower-finder-ornament :is(.public-icon,svg) { width: 31px; height: 31px; }
body.hkf-public-design.page-home .home-flower-finder-heading strong {
    color: #174932;
    font-size: clamp(1.3rem, 2vw, 1.8rem);
    font-weight: 700;
    line-height: 1.3;
}
body.hkf-public-design.page-home .home-flower-finder-heading > span:last-child {
    padding-left: 18px;
    color: #31563e;
    border-left: 1px solid #b5c4a7;
    font-size: 1rem;
    line-height: 1.5;
}
body.hkf-public-design.page-home .home-flower-finder-toggle {
    display: inline-flex;
    flex: 0 0 auto;
    min-width: 88px;
    justify-content: center;
    padding: 8px 13px;
    color: #25523c;
    background: #fffef9;
    border: 1px solid #a8bd9a;
    border-radius: 9px;
    font-size: .9rem;
    font-weight: 700;
}
body.hkf-public-design.page-home .home-flower-finder .when-closed,
body.hkf-public-design.page-home .home-flower-finder .flower-finder:not([open]) .when-open { display: none; }
body.hkf-public-design.page-home .home-flower-finder .flower-finder:not([open]) .when-closed { display: inline; }
body.hkf-public-design.page-home .home-flower-finder-quick-picks {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 18px;
}
body.hkf-public-design.page-home .home-flower-finder-quick-picks > strong {
    margin-right: 8px;
    color: #214b34;
    font-size: .88rem;
}
body.hkf-public-design.page-home .home-flower-finder-quick-picks button {
    min-height: 44px;
    min-width: 120px;
    margin: 0;
    padding: 8px 16px;
    color: #214a35;
    background: #dfeaf0;
    border: 2px solid transparent;
    border-radius: 9px;
    font-family: inherit;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
}
body.hkf-public-design.page-home .home-flower-finder-quick-picks button:nth-of-type(2) { background: #e2ecd9; }
body.hkf-public-design.page-home .home-flower-finder-quick-picks button:nth-of-type(3) { background: #fae7cf; }
body.hkf-public-design.page-home .home-flower-finder-quick-picks button[aria-pressed="true"] {
    border-color: #1b553b;
    box-shadow: inset 0 0 0 1px #1b553b;
}
body.hkf-public-design.page-home .home-flower-finder .flower-finder:not([open]) ~ .home-flower-finder-expanded { display: none; }
body.hkf-public-design.page-home .home-flower-finder-expanded { margin-top: 20px; }
body.hkf-public-design.page-home .home-flower-finder-expanded form {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto;
    align-items: end;
    gap: 14px;
}
body.hkf-public-design.page-home .home-flower-finder-expanded label { display: grid; gap: 7px; min-width: 0; }
body.hkf-public-design.page-home .home-flower-finder-expanded label > span { color: #214b34; font-size: .86rem; font-weight: 700; }
body.hkf-public-design.page-home .home-flower-finder-expanded select {
    width: 100%;
    min-height: 48px;
    padding: 8px 13px;
    color: #1f4934;
    background: #fff;
    border: 1px solid #acbfae;
    border-radius: 8px;
    font-size: 1rem;
}
body.hkf-public-design.page-home .home-flower-finder-expanded form > button {
    min-height: 48px;
    margin: 0;
    padding: 8px 20px;
    color: #fff;
    background: #194e38;
    border: 1px solid #194e38;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}
body.hkf-public-design.page-home .home-flower-finder-footer {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin: 22px 0 0;
    padding-top: 16px;
    color: #375741;
    border-top: 1px solid #bdcbaa;
    font-size: .9rem;
}
body.hkf-public-design.page-home .home-flower-finder-footer a { color: #174932; font-weight: 700; text-decoration: underline; }
body.hkf-public-design.page-home .home-flower-finder :focus-visible,
body.hkf-public-design.page-home .home-flower-finder-quick-picks :focus-visible,
body.hkf-public-design.page-home .home-flower-finder-expanded :focus-visible { outline: 3px solid #a48545; outline-offset: 3px; }
@media (max-width: 760px) {
    body.hkf-public-design.page-home .home-flower-finder { padding: 17px; }
    body.hkf-public-design.page-home .home-flower-finder-heading { gap: 5px 10px; }
    body.hkf-public-design.page-home .home-flower-finder-heading strong { font-size: 1.2rem; }
    body.hkf-public-design.page-home .home-flower-finder-heading > span:last-child { flex-basis: 100%; padding-left: 0; border: 0; font-size: .84rem; }
    body.hkf-public-design.page-home .home-flower-finder-expanded form { grid-template-columns: minmax(0, 1fr); }
    body.hkf-public-design.page-home .home-flower-finder-expanded form > button { width: 100%; }
    body.hkf-public-design.page-home .home-flower-finder-quick-picks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    body.hkf-public-design.page-home .home-flower-finder-quick-picks > strong { grid-column: 1 / -1; }
    body.hkf-public-design.page-home .home-flower-finder-quick-picks button { min-width: 0; padding: 7px 4px; font-size: .77rem; }
}
@media (max-width: 350px) {
    body.hkf-public-design.page-home .home-flower-finder { padding: 13px; }
    body.hkf-public-design.page-home .home-flower-finder-toggle { min-width: 66px; padding: 7px 5px; }
}
html[data-hkf-theme="dark"] body.hkf-public-design.page-home .home-flower-finder { background: #263b30; border-color: #779773; }
html[data-hkf-theme="dark"] body.hkf-public-design.page-home .home-flower-finder :is(.home-flower-finder-heading strong,.home-flower-finder-heading > span:last-child,.home-flower-finder-quick-picks > strong,.home-flower-finder-expanded label > span,.home-flower-finder-footer,.home-flower-finder-footer a) { color: #f0f4e8; }