/* Delivery address picker (locate.js), in Glovo's steps: full screen on phones, a tall panel on desktop.
 * Views: start (map + choices), search, pin (map + kind of place), details. */
.wsfo-loc { position: fixed; inset: 0; z-index: 100001; display: none; font-family: var(--wsfo-body, Montserrat, sans-serif); color: #161617; }
.wsfo-loc.is-in { display: block; }
.wsfo-loc *, .wsfo-loc *::before, .wsfo-loc *::after { box-sizing: border-box; }
.wsfo-loc-bg { position: absolute; inset: 0; background: rgba(20, 14, 10, .5); }
.wsfo-loc-in { position: absolute; inset: 0; background: #fff; display: flex; flex-direction: column; overflow: hidden; }
@media (min-width: 720px) {
	.wsfo-loc-in { inset: auto; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 440px; height: min(760px, calc(100vh - 48px)); border-radius: 22px; box-shadow: 0 24px 60px rgba(0, 0, 0, .3); }
}
/* Theme button styles off inside the picker. */
.wsfo-loc button { font: inherit; color: inherit; text-transform: none !important; letter-spacing: 0 !important; min-height: 0 !important; box-shadow: none !important; margin: 0; cursor: pointer; }
.wsfo-loc input, .wsfo-loc textarea { font: 500 16px/1.3 var(--wsfo-body, Montserrat, sans-serif) !important; color: #161617 !important; }

/* Map */
.wsfo-loc-map { position: relative; flex: 0 0 auto; height: 44%; background: #e8e2d8; transition: height .2s; }
.wsfo-loc-in[data-view="pin"] .wsfo-loc-map { flex: 1 1 auto; height: auto; }
.wsfo-loc-in[data-view="search"] .wsfo-loc-map, .wsfo-loc-in[data-view="details"] .wsfo-loc-map { display: none; }
.wsfo-loc-canvas { position: absolute; inset: 0; }
.wsfo-loc-pin {
	position: absolute; left: 50%; top: 50%; width: 30px; height: 30px; margin: -32px 0 0 -15px; z-index: 500; pointer-events: none;
	background: var(--wsfo-accent, #9B1111); border: 3px solid #fff; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); box-shadow: 0 4px 10px rgba(0, 0, 0, .3);
}
.wsfo-loc-pin.is-static { position: relative; left: auto; top: auto; margin: 0; display: inline-block; }
.wsfo-loc-bubble { position: absolute; left: 50%; top: calc(50% - 44px); transform: translate(-50%, -100%); z-index: 501; max-width: calc(100% - 32px); pointer-events: none; }
.wsfo-loc-bubble:empty, .wsfo-loc-in[data-view="start"] .wsfo-loc-bubble { display: none; }
.wsfo-loc-bubble > * { display: block; }
.wsfo-loc-bubble b, .wsfo-loc-bubble p { background: #fff; }
.wsfo-loc-bubble { background: #fff; border-radius: 14px; padding: 10px 14px; box-shadow: 0 6px 20px rgba(0, 0, 0, .18); text-align: left; }
.wsfo-loc-bubble b { font-size: 14px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wsfo-loc-bubble span { font-size: 12.5px; color: #4b463f; margin-top: 2px; }
.wsfo-loc-bubble p { margin: 0; font-size: 13px; font-weight: 600; }
.wsfo-loc-bubble .is-bad { color: var(--wsfo-accent, #9B1111); }
.wsfo-loc .wsfo-loc-round { width: 40px; height: 40px; border-radius: 50%; border: 0 !important; padding: 0 !important; background: #fff !important; display: grid; place-items: center; flex: 0 0 40px; box-shadow: 0 2px 8px rgba(0, 0, 0, .15) !important; }
.wsfo-loc-mapback, .wsfo-loc-mapx { position: absolute !important; top: 14px; z-index: 502; }
.wsfo-loc-mapback { left: 14px; }
.wsfo-loc-mapx { right: 14px; }
.wsfo-loc-in[data-view="start"] .wsfo-loc-mapback { display: none; }
.wsfo-loc-in[data-view="pin"] .wsfo-loc-mapx { display: none; }

/* Views */
.wsfo-loc-v { display: none; flex-direction: column; gap: 12px; padding: 18px 16px calc(18px + env(safe-area-inset-bottom, 0px)); overflow-y: auto; }
.wsfo-loc-in[data-view="start"] [data-v="start"], .wsfo-loc-in[data-view="search"] [data-v="search"],
.wsfo-loc-in[data-view="pin"] [data-v="pin"], .wsfo-loc-in[data-view="details"] [data-v="details"] { display: flex; }
.wsfo-loc-in[data-view="start"] [data-v="start"] { flex: 1 1 auto; border-radius: 22px 22px 0 0; margin-top: -18px; background: #fff; position: relative; z-index: 2; }
.wsfo-loc-in[data-view="search"] [data-v="search"], .wsfo-loc-in[data-view="details"] [data-v="details"] { flex: 1 1 auto; }
.wsfo-loc-in[data-view="pin"] [data-v="pin"] { flex: 0 0 auto; border-radius: 22px 22px 0 0; margin-top: -18px; background: #fff; position: relative; z-index: 2; }
.wsfo-loc h2 { margin: 0; font: 800 21px/1.2 var(--wsfo-display, "Bricolage Grotesque", sans-serif); letter-spacing: -.01em; color: #161617; }
.wsfo-loc h3 { margin: 8px 0 0; font: 800 17px/1.2 var(--wsfo-display, "Bricolage Grotesque", sans-serif); color: #161617; }
.wsfo-loc-muted { margin: -8px 0 0; font-size: 13px; color: #6B635A; }

/* Rows (share location, saved addresses) */
.wsfo-loc .wsfo-loc-row { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; padding: 10px 0 !important; border: 0 !important; border-bottom: 1px solid #f0eeeb !important; background: none !important; border-radius: 0 !important; }
.wsfo-loc .wsfo-loc-row.is-flat { border-bottom: 0 !important; padding: 4px 0 !important; }
.wsfo-loc-row > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.wsfo-loc-row em { font-style: normal; align-self: flex-start; font-size: 11px; font-weight: 700; color: var(--wsfo-leaf, #1E7A4C); background: var(--wsfo-leaf-soft, #DDF0E5); padding: 1px 6px; border-radius: 4px; margin-bottom: 2px; }
.wsfo-loc-row b { font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wsfo-loc-row small { font-size: 12.5px; color: #6B635A; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wsfo-loc-ic { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 50%; background: #F2F2F3; display: grid; place-items: center; color: var(--wsfo-accent, #9B1111); }
.wsfo-loc-mini { font-weight: 700; font-size: 13px; padding: 7px 14px; border-radius: 99px; background: var(--wsfo-accent-soft, #F8E7E7); color: var(--wsfo-accent, #9B1111); }
.wsfo-loc .wsfo-loc-main { margin-top: auto !important; width: 100%; height: 50px; border: 0 !important; border-radius: 99px !important; background: var(--wsfo-accent, #9B1111) !important; color: #fff !important; font-weight: 800 !important; font-size: 16px !important; }
.wsfo-loc .wsfo-loc-main:disabled { opacity: .45; cursor: not-allowed; }
.wsfo-loc .wsfo-loc-link { align-self: flex-start; border: 0 !important; background: none !important; padding: 2px 0 !important; color: var(--wsfo-accent, #9B1111) !important; font-weight: 700 !important; font-size: 14px !important; }

/* Search */
.wsfo-loc-top { display: flex; align-items: center; gap: 10px; }
.wsfo-loc-top .wsfo-loc-round { box-shadow: none !important; background: #F2F2F3 !important; }
.wsfo-loc-field { flex: 1; display: flex; align-items: center; gap: 8px; height: 46px; padding: 0 8px 0 14px; border-radius: 99px; border: 1.5px solid var(--wsfo-accent, #9B1111); color: #6B635A; margin: 0; }
.wsfo-loc .wsfo-loc-field input { flex: 1; min-width: 0; border: 0 !important; outline: 0; background: transparent !important; height: 40px !important; padding: 0 !important; box-shadow: none !important; -webkit-appearance: none; appearance: none; }
.wsfo-loc .wsfo-loc-clear { width: 30px; height: 30px; border: 0 !important; background: none !important; padding: 0 !important; display: grid; place-items: center; color: #6B635A; }
.wsfo-loc-results { display: flex; flex-direction: column; }
.wsfo-loc .wsfo-loc-results button { display: flex; flex-direction: column; align-items: flex-start; text-align: left; padding: 12px 2px !important; border: 0 !important; border-bottom: 1px solid #f0eeeb !important; background: none !important; border-radius: 0 !important; }
.wsfo-loc-results b { font-size: 15px; }
.wsfo-loc-results small { font-size: 12.5px; color: #6B635A; }
.wsfo-loc-busy { margin: 0; padding: 12px 2px; color: #6B635A; font-size: 14px; }
.wsfo-loc-nomatch { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 14px; background: #F2F2F3; font-size: 14px; }
.wsfo-loc-nomatch > span:last-child { display: flex; flex-direction: column; }
.wsfo-loc .wsfo-loc-nomatch button { border: 0 !important; background: none !important; padding: 0 !important; color: var(--wsfo-accent, #9B1111) !important; font-weight: 700 !important; text-decoration: underline !important; align-self: flex-start; }
.wsfo-loc-powered { margin: auto 0 0; text-align: right; font-size: 11px; color: #8a8178; }

/* Kind of place */
.wsfo-loc-types { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.wsfo-loc .wsfo-loc-types button { display: flex; align-items: center; gap: 10px; height: 54px; padding: 0 16px !important; border: 0 !important; border-radius: 14px !important; background: #F2F2F3 !important; font-weight: 700 !important; font-size: 15px !important; }
.wsfo-loc .wsfo-loc-types button:disabled { opacity: .4; cursor: not-allowed; }
.wsfo-loc .wsfo-loc-types button:not(:disabled):hover { background: var(--wsfo-accent-soft, #F8E7E7) !important; }

/* Details */
.wsfo-loc-addr { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 14px; background: #F7F6F4; }
.wsfo-loc-addr > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.wsfo-loc-addr b { font-size: 15px; }
.wsfo-loc-addr small { font-size: 12.5px; color: #6B635A; }
.wsfo-loc-addr .wsfo-loc-round { box-shadow: none !important; background: #fff !important; width: 36px; height: 36px; flex-basis: 36px; }
.wsfo-loc-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.wsfo-loc-pair label, .wsfo-loc-note { display: flex; flex-direction: column; gap: 4px; margin: 0; font-size: 12.5px; font-weight: 600; color: #4b463f; }
.wsfo-loc-pair input, .wsfo-loc-note textarea, .wsfo-loc .wsfo-loc-custom { width: 100%; height: 46px; border: 1px solid #dedad4 !important; border-radius: 12px !important; padding: 0 12px !important; background: #fff !important; box-shadow: none !important; }
.wsfo-loc-note textarea { height: auto; min-height: 64px; padding: 10px 12px !important; resize: vertical; }
.wsfo-loc .wsfo-loc-refine { display: flex; align-items: center; justify-content: center; gap: 14px; height: 84px; border: 0 !important; border-radius: 14px !important; background: radial-gradient(circle at 50% 50%, rgba(155, 17, 17, .12) 0 30px, #EDE9E3 31px) !important; font-weight: 700 !important; }
.wsfo-loc-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.wsfo-loc .wsfo-loc-chips button { padding: 8px 16px !important; border-radius: 99px !important; border: 0 !important; background: #F2F2F3 !important; font-weight: 600 !important; font-size: 14px !important; }
.wsfo-loc .wsfo-loc-chips button.is-on { background: var(--wsfo-accent, #9B1111) !important; color: #fff !important; }
.wsfo-loc [hidden] { display: none !important; }
