/* Field picker bar, tags and menu. Shown over any theme, so everything is spelled out. */
.wps-aa-picker {
	--wps-aa-picker-brand: #FF8500;
	--wps-aa-picker-dark: #1d2634;
	--wps-aa-picker-text: #1d2327;
	--wps-aa-picker-muted: #646970;
	font: 14px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	color: var(--wps-aa-picker-text);
}
.wps-aa-picker *,
.wps-aa-picker *::before,
.wps-aa-picker *::after { box-sizing: border-box; }

.wps-aa-picker__bar {
	position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 2147483600;
	display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
	max-width: 1100px; margin: 0 auto; padding: 14px 16px;
	background: #fff; border: 2px solid var(--wps-aa-picker-brand); border-radius: 12px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, .25);
}
.wps-aa-picker__title { font-weight: 700; color: var(--wps-aa-picker-dark); }
.wps-aa-picker__message { flex: 1 1 260px; margin: 0; font-size: 14px; }
.wps-aa-picker__roles { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 6px; }
.wps-aa-picker__actions { display: flex; gap: 8px; margin-left: auto; }

.wps-aa-picker button {
	margin: 0; padding: 6px 14px; min-height: 0; font: inherit; font-size: 13px; line-height: 1.4;
	text-transform: none; letter-spacing: normal; cursor: pointer;
	color: var(--wps-aa-picker-text); background: #fff; border: 1px solid #c3c4c7; border-radius: 999px;
	box-shadow: none;
}
.wps-aa-picker button:hover { border-color: var(--wps-aa-picker-dark); }
.wps-aa-picker button:disabled { opacity: .5; cursor: default; }
.wps-aa-picker .wps-aa-picker__done { color: #fff; background: var(--wps-aa-picker-brand); border-color: var(--wps-aa-picker-brand); font-weight: 600; }
.wps-aa-picker .wps-aa-picker__role { color: var(--wps-aa-picker-muted); }
.wps-aa-picker .wps-aa-picker__role.is-picked { color: #00753c; border-color: #00a32a; background: #edfaef; }
.wps-aa-picker .wps-aa-picker__role.is-active { color: #fff; background: var(--wps-aa-picker-dark); border-color: var(--wps-aa-picker-dark); }

.wps-aa-picker__outline,
.wps-aa-picker__ring {
	position: fixed; z-index: 2147483500; pointer-events: none; border-radius: 4px;
}
.wps-aa-picker__outline { display: none; outline: 2px dashed var(--wps-aa-picker-brand); outline-offset: 2px; }
.wps-aa-picker__ring { outline: 2px solid #00a32a; outline-offset: 2px; }
.wps-aa-picker__tag {
	position: fixed; z-index: 2147483550; pointer-events: none;
	padding: 1px 8px; font-size: 12px; font-weight: 600; line-height: 18px; white-space: nowrap;
	color: #fff; background: #00a32a; border-radius: 4px;
}

.wps-aa-picker__menu {
	position: fixed; z-index: 2147483650; display: flex; flex-direction: column; gap: 4px;
	width: 220px; padding: 10px; background: #fff; border-radius: 10px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, .25);
}
.wps-aa-picker__menu[hidden] { display: none; }
.wps-aa-picker__menu p { margin: 0 0 4px; font-weight: 600; }
.wps-aa-picker .wps-aa-picker__menu button { text-align: left; border-radius: 6px; }
.wps-aa-picker .wps-aa-picker__menu button.is-picked { border-color: #00a32a; background: #edfaef; }

/* Paused: the page works as normal, so hide everything but the bar */
.wps-aa-picker.is-paused .wps-aa-picker__tags,
.wps-aa-picker.is-paused .wps-aa-picker__roles,
.wps-aa-picker.is-finished .wps-aa-picker__roles,
.wps-aa-picker.is-finished .wps-aa-picker__tags,
.wps-aa-picker.is-finished .wps-aa-picker__pause,
.wps-aa-picker.is-finished .wps-aa-picker__done { display: none; }

@media (max-width: 600px) {
	.wps-aa-picker__bar { left: 8px; right: 8px; bottom: 8px; }
	.wps-aa-picker__actions { margin-left: 0; }
}
