/* Nafasam premium dropdowns · Rose Atelier */
:root { --sx-blush: #FBF3F1; --sx-rose: #F3DCD8; --sx-line: #EAD3CF; --sx-wine: #6E1A36; --sx-plum: #2B1419; --sx-mauve: #6F555B;
	--sx-sans: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif; --sx-ease: cubic-bezier(.2, .8, .2, 1); }

/* ---------- Custom select (enhanced native) ---------- */
.nsx-sel { position: relative; display: inline-block; min-width: 190px; max-width: 100%; vertical-align: middle; font-family: var(--sx-sans); }
.nsx-sel .nsx-sel-native { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; opacity: 0 !important; pointer-events: none !important; }
body .nsx-sel-btn {
	display: flex !important; align-items: center; justify-content: space-between; gap: 12px; width: 100%; height: 44px; min-height: 0 !important;
	padding: 0 14px 0 18px !important; border: 1px solid var(--sx-line) !important; border-radius: 999px !important; background: #fff !important;
	color: var(--sx-plum) !important; font: 500 14.5px/1 var(--sx-sans) !important; text-transform: none !important; letter-spacing: 0 !important;
	text-align: left; cursor: pointer; box-shadow: none !important; transition: border-color .2s, box-shadow .2s !important;
}
body .nsx-sel-btn:hover { border-color: var(--sx-wine) !important; }
body .nsx-sel-btn:focus-visible, .nsx-sel.is-open .nsx-sel-btn { outline: none; border-color: var(--sx-wine) !important; box-shadow: 0 0 0 4px rgba(110, 26, 54, .12) !important; }
.nsx-sel-val { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nsx-sel-chev { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--sx-blush); color: var(--sx-wine); flex: none; transition: transform .3s var(--sx-ease), background .2s; }
.nsx-sel-chev svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.nsx-sel.is-open .nsx-sel-chev { transform: rotate(180deg); background: var(--sx-rose); }

.nsx-sel-list {
	position: absolute; z-index: 9990; top: calc(100% + 8px); right: 0; min-width: 100%; max-height: 300px; overflow: auto; overscroll-behavior: contain;
	margin: 0 !important; padding: 6px !important; list-style: none !important; border-radius: 20px; background: #fff; outline: none;
	border: 1px solid var(--sx-rose); box-shadow: 0 24px 48px -20px rgba(43, 20, 25, .35), 0 4px 12px -6px rgba(43, 20, 25, .12);
	visibility: hidden; opacity: 0; transform: translateY(-6px) scale(.97); transform-origin: top right;
	transition: opacity .18s ease, transform .28s var(--sx-ease), visibility 0s linear .28s;
	scrollbar-width: thin; scrollbar-color: var(--sx-line) transparent;
}
.nsx-sel.is-up .nsx-sel-list { top: auto; bottom: calc(100% + 8px); transform-origin: bottom right; transform: translateY(6px) scale(.97); }
.nsx-sel-list.is-open { visibility: visible; transition: opacity .18s ease, transform .28s var(--sx-ease), visibility 0s; }
.nsx-sel-list.is-shown { opacity: 1; transform: none; }
.nsx-sel-opt {
	display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 !important; padding: 11px 14px !important; border-radius: 14px;
	color: var(--sx-plum); font: 500 14.5px/1.3 var(--sx-sans); white-space: nowrap; cursor: pointer; transition: background .15s, color .15s;
}
.nsx-sel-opt svg { width: 16px; height: 16px; flex: none; fill: none; stroke: var(--sx-wine); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; opacity: 0; transform: scale(.6); transition: opacity .2s, transform .25s var(--sx-ease); }
.nsx-sel-opt.is-active { background: var(--sx-blush); }
.nsx-sel-opt[aria-selected="true"] { color: var(--sx-wine); font-weight: 600; }
.nsx-sel-opt[aria-selected="true"] svg { opacity: 1; transform: none; }
.nsx-sel-opt[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }

/* Phones: options slide up as a bottom sheet */
.nsx-sel-overlay { position: fixed; inset: 0; z-index: 99990; background: rgba(43, 20, 25, .42); animation: nsx-fade .25s ease both; }
@keyframes nsx-fade { from { opacity: 0; } to { opacity: 1; } }
html.nsx-sel-lock, html.nsx-sel-lock body { overflow: hidden !important; }
.nsx-sel-list.is-sheet {
	position: fixed; z-index: 99991; top: auto; left: 0; right: 0; bottom: 0; min-width: 0; max-height: 70vh; padding: 22px 12px calc(16px + env(safe-area-inset-bottom)) !important;
	border-radius: 26px 26px 0 0; border: 0; transform: translateY(100%); transition: transform .38s var(--sx-ease), opacity .2s, visibility 0s linear .38s;
}
.nsx-sel-list.is-sheet::before { content: ''; position: absolute; top: 8px; left: 50%; width: 42px; height: 5px; margin-left: -21px; border-radius: 99px; background: rgba(43, 20, 25, .2); }
.nsx-sel-list.is-sheet.is-open { transition: transform .38s var(--sx-ease), opacity .2s, visibility 0s; }
.nsx-sel-list.is-sheet.is-shown { transform: none; opacity: 1; }
.nsx-sel-list.is-sheet .nsx-sel-opt { padding: 15px 16px !important; font-size: 16px; }

/* Shop sort sits neatly beside its label */
.nsd-sort .nsx-sel { min-width: 200px; }

/* ---------- WooCommerce searchable dropdowns (checkout / account / cart address) ---------- */
body .select2-container .select2-selection--single { height: 52px !important; border: 1px solid var(--sx-line) !important; border-radius: 16px !important; background: var(--sx-blush) !important; transition: border-color .2s, box-shadow .2s, background .2s; }
body .select2-container .select2-selection--single .select2-selection__rendered { line-height: 50px !important; padding: 0 52px 0 16px !important; color: var(--sx-plum) !important; font: 500 15px/50px var(--sx-sans) !important; }
body .select2-container .select2-selection--single .select2-selection__arrow { top: 12px !important; right: 12px !important; width: 26px !important; height: 26px !important; border-radius: 50%; background: #fff; }
body .select2-container .select2-selection--single .select2-selection__arrow b { border: 0 !important; width: 8px !important; height: 8px !important; margin: -6px 0 0 -4px !important; border-right: 2px solid var(--sx-wine) !important; border-bottom: 2px solid var(--sx-wine) !important; transform: rotate(45deg); transition: transform .3s var(--sx-ease), margin .3s; }
body .select2-container--open .select2-selection--single .select2-selection__arrow b { transform: rotate(225deg); margin-top: -2px !important; }
body .select2-container--open .select2-selection--single, body .select2-container--focus .select2-selection--single { border-color: var(--sx-wine) !important; background: #fff !important; box-shadow: 0 0 0 4px rgba(110, 26, 54, .12); }
body .select2-container--open .select2-selection--single { border-radius: 16px !important; }

body .select2-dropdown { margin-top: 8px; padding: 8px; border: 1px solid var(--sx-rose) !important; border-radius: 20px !important; background: #fff !important; overflow: hidden;
	box-shadow: 0 24px 48px -20px rgba(43, 20, 25, .35), 0 4px 12px -6px rgba(43, 20, 25, .12) !important; animation: nsx-pop .25s var(--sx-ease) both; font-family: var(--sx-sans); }
body .select2-dropdown--above { margin-top: -8px; }
@keyframes nsx-pop { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }
body .select2-search--dropdown { position: relative; padding: 0 0 8px !important; }
body .select2-search--dropdown::before { content: ''; position: absolute; left: 15px; top: 14px; width: 16px; height: 16px; pointer-events: none;
	background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F555B' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E"); }
body .select2-search--dropdown .select2-search__field { height: 44px !important; padding: 0 14px 0 40px !important; border: 1px solid var(--sx-line) !important; border-radius: 999px !important; background: var(--sx-blush) !important; font: 500 15px/1 var(--sx-sans) !important; color: var(--sx-plum) !important; outline: none; }
body .select2-search--dropdown .select2-search__field:focus { border-color: var(--sx-wine) !important; background: #fff !important; }
body .select2-results__options { max-height: 260px !important; scrollbar-width: thin; scrollbar-color: var(--sx-line) transparent; }
body .select2-results__option { position: relative; margin: 0 !important; padding: 11px 40px 11px 14px !important; border-radius: 14px; color: var(--sx-plum) !important; font: 500 14.5px/1.3 var(--sx-sans) !important; background: transparent !important; }
body .select2-results__option--highlighted[aria-selected], body .select2-results__option--highlighted[data-selected] { background: var(--sx-blush) !important; color: var(--sx-plum) !important; }
body .select2-results__option[aria-selected="true"], body .select2-results__option[data-selected="true"] { color: var(--sx-wine) !important; font-weight: 600 !important; }
body .select2-results__option[aria-selected="true"]::after, body .select2-results__option[data-selected="true"]::after { content: ''; position: absolute; right: 16px; top: 50%; width: 6px; height: 11px; margin-top: -7px; border-right: 2.2px solid var(--sx-wine); border-bottom: 2.2px solid var(--sx-wine); transform: rotate(45deg); }
body .select2-results__message { padding: 12px 14px !important; color: var(--sx-mauve) !important; font: 500 14px/1.4 var(--sx-sans) !important; }

/* Plain selects we do not enhance still look on-brand */
body select.nsx-native, body .woocommerce-shipping-calculator select {
	appearance: none; -webkit-appearance: none; height: 52px; padding: 0 48px 0 16px !important; border: 1px solid var(--sx-line) !important; border-radius: 16px !important;
	background: var(--sx-blush) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236E1A36' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center / 16px !important;
	color: var(--sx-plum) !important; font: 500 15px/1 var(--sx-sans) !important;
}

@media (prefers-reduced-motion: reduce) {
	.nsx-sel-list, .nsx-sel-chev, .nsx-sel-opt svg, body .select2-dropdown { transition: none !important; animation: none !important; }
}
body .nsx-sel-list:focus, body .nsx-sel-list:focus-visible { outline: none !important; border-color: var(--sx-rose) !important; }
