/* =============================================================
   UAEP — Choices.js dropdown styling
   Applies to: Nationality, Emirate of Arrival, Traveling from
   (all three share the same Choices.js markup)
   Theme accent: deep gold #92722A / soft gold #F4ECDB
   ============================================================= */

:root {
    --uaep-gold: #92722A;
    --uaep-gold-soft: #F4ECDB;
    --uaep-gold-tint: #FBF7EF;
    --uaep-border: #E4DFD3;
    --uaep-ink: #2B2B2B;
    --uaep-muted: #8A8A8A;
}

/* --- Control box: focus / open state ------------------------- */
.wpforms-container .choices.is-open .choices__inner,
.wpforms-container .choices.is-focused .choices__inner {
    border-color: var(--uaep-gold) !important;
    box-shadow: 0 0 0 3px rgba(146, 114, 42, 0.12) !important;
    outline: none !important;
}

/* Caret color to match */
.wpforms-container .choices[data-type*="select-one"]::after {
    border-color: var(--uaep-gold) transparent transparent !important;
}

/* Keep the box square-cornered while open so it meets the panel cleanly */
.wpforms-container .choices.is-open .choices__inner {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

/* --- Dropdown panel ------------------------------------------ */
.wpforms-container .choices__list--dropdown,
.wpforms-container .choices__list[aria-expanded] {
    margin-top: 6px !important;
    border: 1px solid var(--uaep-border) !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 30px rgba(43, 33, 12, 0.12),
                0 2px 6px rgba(43, 33, 12, 0.06) !important;
    overflow: hidden !important;
    z-index: 100 !important;
}

/* When the panel sits directly under the (square) control */
.wpforms-container .choices.is-open .choices__list--dropdown {
    margin-top: -1px !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

/* --- Search field inside the panel --------------------------- */
.wpforms-container .choices__list--dropdown .choices__input,
.wpforms-container .choices__input--cloned {
    margin: 10px !important;
    padding: 10px 14px !important;
    width: calc(100% - 20px) !important;
    border: 1px solid var(--uaep-border) !important;
    border-radius: 9px !important;
    background: var(--uaep-gold-tint) !important;
    font-size: 15px !important;
    color: var(--uaep-ink) !important;
}

.wpforms-container .choices__input--cloned:focus {
    border-color: var(--uaep-gold) !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(146, 114, 42, 0.10) !important;
    outline: none !important;
}

/* --- Scrollable option list ---------------------------------- */
.wpforms-container .choices__list--dropdown .choices__list {
    max-height: 280px !important;
    padding: 6px !important;
}

/* Thin gold scrollbar */
.wpforms-container .choices__list--dropdown .choices__list {
    scrollbar-width: thin;
    scrollbar-color: var(--uaep-gold) transparent;
}
.wpforms-container .choices__list--dropdown .choices__list::-webkit-scrollbar {
    width: 8px;
}
.wpforms-container .choices__list--dropdown .choices__list::-webkit-scrollbar-thumb {
    background: rgba(146, 114, 42, 0.55);
    border-radius: 8px;
    border: 2px solid #ffffff;
}
.wpforms-container .choices__list--dropdown .choices__list::-webkit-scrollbar-track {
    background: transparent;
}

/* --- Individual options -------------------------------------- */
.wpforms-container .choices__list--dropdown .choices__item {
    padding: 11px 14px !important;
    margin: 2px 0 !important;
    border-radius: 8px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    color: var(--uaep-ink) !important;
    transition: background-color 0.12s ease, color 0.12s ease !important;
}

/* Highlighted (keyboard/hover) — replaces the default blue bar */
.wpforms-container .choices__list--dropdown .choices__item--selectable.is-highlighted,
.wpforms-container .choices__list--dropdown .choices__item--selectable:hover {
    background-color: var(--uaep-gold-soft) !important;
    color: var(--uaep-gold) !important;
}

/* Currently selected option — gold text + subtle check */
.wpforms-container .choices__list--dropdown .choices__item.is-selected {
    background-color: var(--uaep-gold-tint) !important;
    color: var(--uaep-gold) !important;
    font-weight: 600 !important;
}
.wpforms-container .choices__list--dropdown .choices__item.is-selected::after {
    content: "";
    float: right;
    width: 16px;
    height: 16px;
    margin-top: 2px;
    background: no-repeat center / contain
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2392722A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='M20 6L9 17l-5-5'/></svg>");
}

/* Placeholder / disabled first option */
.wpforms-container .choices__list--dropdown .choices__placeholder,
.wpforms-container .choices__list--dropdown .choices__item--disabled {
    color: var(--uaep-muted) !important;
    opacity: 1 !important;
}
.wpforms-container .choices__list--dropdown .choices__item--disabled:hover {
    background: transparent !important;
    color: var(--uaep-muted) !important;
}

/* "No results / no choices" message */
.wpforms-container .choices__list--dropdown .has-no-results,
.wpforms-container .choices__list--dropdown .has-no-choices {
    color: var(--uaep-muted) !important;
    font-style: italic;
}

/* --- Selected value shown in the closed control -------------- */
.wpforms-container .choices__list--single .choices__item {
    color: var(--uaep-ink) !important;
}