/* nn-search/assets/css/search-widget.css — booking widget v1.0.0 */

.nn-widget {
	background: rgba(255, 255, 255, .92);
	backdrop-filter: blur(24px);
	-webkit-backdrop-filter: blur(24px);
	border: 1.5px solid rgba(255, 255, 255, .9);
	border-radius: var(--radius-xl, 20px);
	box-shadow: 0 24px 48px rgba(10,15,31,.10), 0 0 0 1px rgba(36,86,232,.06);
	overflow: hidden;
	position: relative;
}

.nn-widget-tabs {
	display: flex;
	border-bottom: 1px solid var(--border, #E5E9F0);
	padding: 0 8px;
	background: rgba(250, 251, 253, .6);
	overflow-x: auto;
	scrollbar-width: none;
}
.nn-widget-tabs::-webkit-scrollbar { display: none; }
.nn-widget-tab {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 14px 18px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--muted, #6B7693);
	cursor: pointer;
	border: 0;
	background: none;
	font-family: var(--font-bn, 'Hind Siliguri', sans-serif);
	transition: color .18s;
	white-space: nowrap;
	position: relative;
}
.nn-widget-tab svg { flex-shrink: 0; opacity: .7; transition: opacity .18s; }
.nn-widget-tab:hover { color: var(--ink, #0A0F1F); }
.nn-widget-tab.active { color: var(--brand, #2456E8); }
.nn-widget-tab.active svg { opacity: 1; }
.nn-widget-tab.active::after {
	content: '';
	position: absolute;
	bottom: -1px;
	left: 0; right: 0;
	height: 2.5px;
	background: var(--brand, #2456E8);
	border-radius: 2px 2px 0 0;
}

.nn-widget-body { padding: 20px 24px 24px; }

.nn-widget-form {
	display: none;
	flex-wrap: wrap;
	gap: 12px;
	align-items: flex-end;
}
.nn-widget-form.active {
	display: flex;
	animation: nnFadeUp .15s ease;
}
@keyframes nnFadeUp {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: translateY(0); }
}

.nn-form-group {
	display: flex;
	flex-direction: column;
	gap: 5px;
	flex: 1;
	min-width: 140px;
	position: relative;
}
.nn-form-group label {
	font-size: 11.5px;
	font-weight: 700;
	color: var(--muted, #6B7693);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-family: var(--font-mono, monospace);
}
.nn-form-input {
	border: 1.5px solid var(--border, #E5E9F0);
	border-radius: 10px;
	padding: 10px 13px;
	font-size: 14px;
	font-family: var(--font-bn, 'Hind Siliguri', sans-serif);
	color: var(--ink, #0A0F1F);
	background: var(--surface, #fff);
	transition: border-color .18s, box-shadow .18s;
	height: 42px;
}
.nn-form-input:focus {
	outline: none;
	border-color: var(--brand, #2456E8);
	box-shadow: 0 0 0 3px var(--brand-glow, rgba(36,86,232,.15));
}
.nn-form-input::placeholder { color: var(--faint, #9AA3BD); }
select.nn-form-input {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%239AA3BD'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	padding-right: 32px;
}

.nn-stepper {
	display: flex;
	align-items: center;
	border: 1.5px solid var(--border, #E5E9F0);
	border-radius: 10px;
	overflow: hidden;
	height: 42px;
	background: var(--surface, #fff);
}
.nn-stepper button {
	width: 36px;
	height: 100%;
	background: none;
	border: 0;
	font-size: 16px;
	color: var(--text, #3D4A6B);
	cursor: pointer;
	transition: background .15s;
}
.nn-stepper button:hover { background: var(--bg-alt, #F3F5F8); }
.nn-stepper span {
	flex: 1;
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	color: var(--ink, #0A0F1F);
	font-family: var(--font-mono, monospace);
}

.nn-radio-group {
	display: flex;
	gap: 16px;
	align-items: center;
	height: 42px;
}
.nn-radio-group label {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	font-weight: 500;
	color: var(--text, #3D4A6B);
	cursor: pointer;
	font-family: var(--font-bn, sans-serif);
	letter-spacing: 0;
	text-transform: none;
}
.nn-radio-group input[type=radio] { accent-color: var(--brand, #2456E8); width: 15px; height: 15px; }

.nn-swap-btn {
	width: 42px;
	height: 42px;
	border-radius: 10px;
	border: 1.5px solid var(--border, #E5E9F0);
	background: var(--surface, #fff);
	color: var(--text, #3D4A6B);
	font-size: 17px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all .25s;
	flex-shrink: 0;
	align-self: flex-end;
	cursor: pointer;
}
.nn-swap-btn:hover {
	transform: rotate(180deg);
	border-color: var(--brand, #2456E8);
	color: var(--brand, #2456E8);
}

.nn-search-btn {
	height: 42px;
	padding: 0 24px;
	border-radius: 10px;
	background: linear-gradient(135deg, var(--ink, #0A0F1F) 0%, var(--ink-2, #1A2238) 100%);
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	font-family: var(--font-bn, sans-serif);
	border: 0;
	cursor: pointer;
	transition: all .2s;
	white-space: nowrap;
	flex-shrink: 0;
	letter-spacing: -0.1px;
}
.nn-search-btn:hover {
	background: linear-gradient(135deg, var(--brand, #2456E8) 0%, var(--brand-2, #1A3FBC) 100%);
	box-shadow: 0 0 0 1px rgba(36,86,232,.15), 0 8px 32px rgba(36,86,232,.16);
	transform: translateY(-1px);
}

/* Autocomplete dropdown */
.nn-autocomplete-results {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background: #fff;
	border: 1px solid var(--border, #E5E9F0);
	border-radius: 10px;
	margin-top: 4px;
	max-height: 220px;
	overflow-y: auto;
	box-shadow: 0 12px 32px rgba(10,15,31,.12);
	z-index: 50;
	display: none;
}
.nn-autocomplete-results.open { display: block; }
.nn-autocomplete-item {
	padding: 10px 14px;
	font-size: 14px;
	font-family: var(--font-bn, sans-serif);
	cursor: pointer;
	transition: background .12s;
	color: var(--ink, #0A0F1F);
}
.nn-autocomplete-item:hover,
.nn-autocomplete-item.highlight {
	background: var(--brand-soft, #E8EFFF);
	color: var(--brand, #2456E8);
}

/* Compact variant */
.nn-widget-compact {
	background: var(--surface, #fff);
	border-radius: 12px;
	padding: 8px;
}
.nn-widget-compact .nn-widget-tabs { display: none; }
.nn-widget-compact .nn-widget-body { padding: 0; }

@media (max-width: 768px) {
	.nn-widget-tab span { display: none; }
	.nn-widget-tab { padding: 12px 14px; }
	.nn-form-group { min-width: 100%; }
	.nn-search-btn { width: 100%; }
}