/*
=========================================================
AI Wealth Tech India
Devices Hub
Frontend CSS
Version: 2.1.0 FINAL
=========================================================
*/


/* ======================================================
   DEVICE HUB ROOT
====================================================== */

.awti-device-hub {

	--awti-bg: #020817;
	--awti-card: #071426;
	--awti-card-2: #0b1930;
	--awti-border: rgba(255,255,255,.10);

	--awti-text: #f8fafc;
	--awti-muted: #94a3b8;

	--awti-blue: #2563eb;
	--awti-blue-light: #38bdf8;

	--awti-green: #22c55e;
	--awti-purple: #7c3aed;

	width: 100%;

	color: var(--awti-text);

	background:
		radial-gradient(
			circle at 15% 5%,
			rgba(37,99,235,.16),
			transparent 30%
		),
		radial-gradient(
			circle at 90% 15%,
			rgba(124,58,237,.14),
			transparent 30%
		),
		var(--awti-bg);

	font-family:
		Inter,
		system-ui,
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		sans-serif;

	border-radius: 18px;

	overflow: hidden;
}


/* ======================================================
   RESET
====================================================== */

.awti-device-hub *,
.awti-device-hub *::before,
.awti-device-hub *::after {
	box-sizing: border-box;
}

.awti-device-hub img {
	max-width: 100%;
	height: auto;
}

.awti-device-hub a {
	text-decoration: none;
}


/* ======================================================
   HERO
====================================================== */

.awti-device-hero {

	position: relative;

	min-height: 430px;

	padding: 70px 5%;

	overflow: hidden;

	background:
		linear-gradient(
			115deg,
			#020817 0%,
			#041330 48%,
			#071a3d 100%
		);

	border-bottom: 1px solid var(--awti-border);
}


.awti-device-hero::before {

	content: "";

	position: absolute;

	width: 500px;
	height: 500px;

	right: -130px;
	top: -170px;

	border-radius: 50%;

	background:
		radial-gradient(
			circle,
			rgba(37,99,235,.28),
			transparent 68%
		);

	pointer-events: none;
}


.awti-device-hero-content {

	position: relative;

	z-index: 2;

	max-width: 1400px;

	margin: auto;

	display: grid;

	grid-template-columns:
		1.05fr
		.95fr;

	align-items: center;

	gap: 50px;
}


.awti-device-hero-text h1 {

	margin: 0 0 8px;

	font-size:
		clamp(48px, 6vw, 78px);

	line-height: .95;

	font-weight: 800;

	letter-spacing: -3px;

	color: #fff;
}


.awti-device-hero-text h1 span {

	background:
		linear-gradient(
			90deg,
			#38bdf8,
			#2563eb,
			#8b5cf6
		);

	-webkit-background-clip: text;
	background-clip: text;

	color: transparent;
}


.awti-device-hero-text h2 {

	margin: 20px 0 12px;

	font-size:
		clamp(22px, 3vw, 34px);

	line-height: 1.2;

	color: #fff;
}


.awti-device-hero-text > p {

	margin: 0 0 28px;

	font-size: 17px;

	color: #cbd5e1;
}


/* ======================================================
   SEARCH
====================================================== */

.awti-device-search {

	display: flex;

	width: min(650px, 100%);

	height: 58px;

	background: #fff;

	border-radius: 12px;

	overflow: hidden;

	box-shadow:
		0 15px 50px rgba(0,0,0,.30);
}


.awti-device-search input {

	flex: 1;

	min-width: 0;

	border: 0 !important;

	outline: 0 !important;

	padding: 0 20px;

	font-size: 15px;

	color: #111827;

	background: #fff !important;

	box-shadow: none !important;
}


.awti-device-search input::placeholder {
	color: #94a3b8;
}


.awti-device-search button {

	width: 62px;

	border: 0;

	cursor: pointer;

	font-size: 20px;

	color: #fff;

	background:
		linear-gradient(
			135deg,
			#2563eb,
			#1d4ed8
		);

	transition: .25s ease;
}


.awti-device-search button:hover {

	background:
		linear-gradient(
			135deg,
			#38bdf8,
			#2563eb
		);
}


/* ======================================================
   HERO FEATURES
====================================================== */

.awti-device-features {

	display: flex;

	flex-wrap: wrap;

	gap: 9px;

	margin-top: 20px;
}


.awti-device-features span {

	padding: 7px 11px;

	font-size: 11px;

	font-weight: 600;

	color: #cbd5e1;

	background: rgba(255,255,255,.045);

	border: 1px solid rgba(255,255,255,.09);

	border-radius: 30px;
}


/* ======================================================
   HERO VISUAL
====================================================== */

.awti-device-hero-visual {

	position: relative;

	min-height: 300px;

	display: flex;

	align-items: center;

	justify-content: center;
}


.awti-device-orbit {

	position: absolute;

	border:
		1px solid
		rgba(56,189,248,.35);

	border-radius: 50%;

	transform: rotate(-15deg);

	box-shadow:
		0 0 30px rgba(37,99,235,.12);
}


.orbit-one {

	width: 410px;
	height: 190px;
}


.orbit-two {

	width: 350px;
	height: 160px;

	transform: rotate(25deg);

	border-color:
		rgba(139,92,246,.35);
}


.awti-device-hero-devices {

	position: relative;

	z-index: 3;

	display: flex;

	align-items: center;

	gap: 12px;

	font-size: 75px;

	filter:
		drop-shadow(
			0 20px 30px rgba(0,0,0,.35)
		);
}


.awti-device-hero-devices span:nth-child(1) {
	transform: translateY(20px);
}

.awti-device-hero-devices span:nth-child(2) {
	transform: translateY(-20px);
}

.awti-device-hero-devices span:nth-child(3) {
	transform: translateY(25px);
}

.awti-device-hero-devices span:nth-child(4) {
	transform: translateY(-15px);
}


/* ======================================================
   SECTIONS
====================================================== */

.awti-device-section {

	padding: 30px 4%;
}


.awti-section-heading {

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 20px;

	margin-bottom: 18px;
}


.awti-section-heading h2 {

	margin: 0;

	font-size: 21px;

	font-weight: 700;

	color: #f8fafc;
}


.awti-section-heading a {

	color: #60a5fa;

	font-size: 13px;

	font-weight: 600;
}


.awti-section-heading a:hover {
	color: #93c5fd;
}


/* ======================================================
   POPULAR CATEGORY
   LINE-BY-LINE / CLEAN ROW STYLE
====================================================== */

.awti-category-grid {

	display: grid;

	grid-template-columns:
		repeat(
			4,
			minmax(0, 1fr)
		);

	gap: 12px;

	width: 100%;
}


.awti-category-card {

	min-height: 112px;

	padding: 18px 14px;

	display: flex;

	flex-direction: column;

	align-items: center;

	justify-content: center;

	text-align: center;

	color: #fff;

	background:
		linear-gradient(
			145deg,
			rgba(37,99,235,.20),
			rgba(15,23,42,.75)
		);

	border:
		1px solid
		var(--awti-border);

	border-radius: 12px;

	transition:
		transform .25s ease,
		border-color .25s ease,
		box-shadow .25s ease;
}


.awti-category-card:hover {

	transform: translateY(-5px);

	border-color:
		rgba(56,189,248,.45);

	box-shadow:
		0 15px 35px rgba(0,0,0,.25);
}


.awti-category-icon {

	margin-bottom: 9px;

	font-size: 34px;

	line-height: 1;
}


.awti-category-card strong {

	font-size: 13px;

	color: #fff;
}


.awti-category-card span {

	margin-top: 6px;

	font-size: 10px;

	color: #94a3b8;
}


/* ======================================================
   PRICE SECTION
====================================================== */

.awti-price-section {
	padding-top: 12px;
}


.awti-price-tabs {

	display: flex;

	gap: 10px;

	overflow-x: auto;

	padding: 4px 0 8px;

	scrollbar-width: thin;
}


.awti-price-tabs a {

	flex: 0 0 auto;

	padding: 9px 17px;

	font-size: 12px;

	font-weight: 600;

	color: #cbd5e1;

	background: #0b172a;

	border:
		1px solid
		var(--awti-border);

	border-radius: 9px;

	transition: .25s ease;
}


.awti-price-tabs a:hover,
.awti-price-tabs a.active {

	color: #fff;

	background:
		linear-gradient(
			135deg,
			#2563eb,
			#1d4ed8
		);

	border-color: #3b82f6;

	box-shadow:
		0 5px 20px rgba(37,99,235,.25);
}


/* ======================================================
   DEVICE GRID
====================================================== */

.awti-device-grid {

	display: grid;

	grid-template-columns:
		repeat(
			auto-fill,
			minmax(220px, 1fr)
		);

	gap: 16px;
}


/* ======================================================
   DEVICE CARD
====================================================== */

.awti-device-card {

	position: relative;

	overflow: hidden;

	background:
		linear-gradient(
			145deg,
			#08172b,
			#050e1d
		);

	border:
		1px solid
		var(--awti-border);

	border-radius: 14px;

	transition:
		transform .25s ease,
		border-color .25s ease,
		box-shadow .25s ease;
}


.awti-device-card:hover {

	transform: translateY(-6px);

	border-color:
		rgba(56,189,248,.40);

	box-shadow:
		0 18px 45px rgba(0,0,0,.32);
}


/* ======================================================
   DEVICE IMAGE
====================================================== */

.awti-device-card-image {

	position: relative;

	height: 245px;

	display: flex;

	align-items: center;

	justify-content: center;

	padding: 20px;

	background:
		radial-gradient(
			circle at center,
			rgba(37,99,235,.16),
			transparent 70%
		);
}


.awti-device-image {

	width: 100%;
	height: 100%;

	object-fit: contain;

	transition:
		transform .35s ease;
}


.awti-device-card:hover
.awti-device-image {

	transform: scale(1.05);
}


.awti-device-placeholder {

	font-size: 70px;

	opacity: .6;
}


/* ======================================================
   BADGES
====================================================== */

.awti-device-badge {

	position: absolute;

	top: 12px;
	left: 12px;

	padding: 6px 9px;

	font-size: 10px;

	font-weight: 700;

	color: #fef3c7;

	background:
		rgba(120,53,15,.85);

	border:
		1px solid
		rgba(245,158,11,.25);

	border-radius: 7px;
}


.awti-device-badge.trending {

	color: #fee2e2;

	background:
		rgba(127,29,29,.85);
}


/* ======================================================
   CARD CONTENT
====================================================== */

.awti-device-card-content {

	padding: 17px;
}


.awti-device-brand {

	display: block;

	margin-bottom: 5px;

	font-size: 10px;

	font-weight: 700;

	text-transform: uppercase;

	letter-spacing: .8px;

	color: #38bdf8;
}


.awti-device-card h3 {

	margin: 0 0 6px;

	font-size: 16px;

	line-height: 1.3;
}


.awti-device-card h3 a {
	color: #f8fafc;
}


.awti-device-card h3 a:hover {
	color: #60a5fa;
}


.awti-device-model {

	margin: 0 0 12px;

	font-size: 11px;

	color: #64748b;
}


.awti-device-price {

	margin-bottom: 10px;

	font-size: 20px;

	font-weight: 800;

	color: #fff;
}


.awti-device-status {

	margin-bottom: 14px;

	font-size: 11px;

	color: #94a3b8;
}


/* ======================================================
   VIEW DEVICE BUTTON
====================================================== */

.awti-device-view-button {

	display: block;

	padding: 9px 12px;

	text-align: center;

	font-size: 12px;

	font-weight: 700;

	color: #fff !important;

	background:
		linear-gradient(
			135deg,
			#2563eb,
			#1d4ed8
		);

	border-radius: 8px;

	transition: .25s ease;
}


.awti-device-view-button:hover {

	background:
		linear-gradient(
			135deg,
			#3b82f6,
			#2563eb
		);

	transform: translateY(-1px);
}


/* ======================================================
   FEATURED MINI GRID
====================================================== */

.awti-device-mini-grid {

	display: grid;

	grid-template-columns:
		repeat(
			auto-fit,
			minmax(220px, 1fr)
		);

	gap: 12px;
}


.awti-mini-device {

	display: flex;

	align-items: center;

	gap: 14px;

	padding: 13px;

	color: #fff;

	background: #071426;

	border:
		1px solid
		var(--awti-border);

	border-radius: 12px;

	transition: .25s ease;
}


.awti-mini-device:hover {

	transform: translateY(-3px);

	border-color:
		rgba(56,189,248,.35);
}


.awti-mini-device img {

	width: 72px;
	height: 72px;

	object-fit: contain;

	border-radius: 8px;
}


.awti-mini-device strong {

	display: block;

	margin-bottom: 5px;

	font-size: 13px;

	line-height: 1.3;
}


.awti-mini-device span {

	font-size: 12px;

	color: #60a5fa;
}


.awti-mini-placeholder {

	font-size: 42px !important;
}


/* ======================================================
   EMPTY
====================================================== */

.awti-device-empty {

	padding: 60px 20px;

	text-align: center;

	background: #071426;

	border:
		1px solid
		var(--awti-border);

	border-radius: 14px;

	color: #94a3b8;
}


.awti-device-empty:first-letter {
	font-size: 45px;
}


.awti-device-empty h3 {

	margin: 15px 0 5px;

	color: #fff;
}


/* ======================================================
   TRUST BAR
====================================================== */

.awti-device-trust-bar {

	display: grid;

	grid-template-columns:
		repeat(4, 1fr);

	margin: 15px 3% 0;

	border-top:
		1px solid
		var(--awti-border);

	border-bottom:
		1px solid
		var(--awti-border);
}


.awti-device-trust-bar > div {

	min-height: 105px;

	padding: 20px;

	display: grid;

	grid-template-columns: 35px 1fr;

	grid-template-rows:
		auto
		auto;

	column-gap: 8px;

	align-items: center;

	border-right:
		1px solid
		var(--awti-border);
}


.awti-device-trust-bar > div:last-child {
	border-right: 0;
}


.awti-device-trust-bar span {

	grid-row: 1 / 3;

	font-size: 24px;
}


.awti-device-trust-bar strong {

	font-size: 12px;

	color: #f8fafc;
}


.awti-device-trust-bar small {

	font-size: 10px;

	color: #64748b;
}


/* ======================================================
   FOCUS
====================================================== */

.awti-device-hub form input:focus {
	outline: none;
}


.awti-device-hub button:focus,
.awti-device-hub a:focus {

	outline:
		2px solid
		rgba(56,189,248,.5);

	outline-offset: 2px;
}


/* ======================================================
   TABLET
====================================================== */

@media (max-width: 900px) {

	.awti-device-hero {
		padding: 55px 5%;
	}


	.awti-device-hero-content {
		grid-template-columns: 1fr;
	}


	.awti-device-hero-visual {
		min-height: 220px;
	}


	.awti-device-hero-devices {
		font-size: 60px;
	}


	/* Category: 3 per row */

	.awti-category-grid {

		grid-template-columns:
			repeat(3, 1fr);

	}


	.awti-device-trust-bar {

		grid-template-columns:
			repeat(2, 1fr);

	}


	.awti-device-trust-bar > div:nth-child(2) {
		border-right: 0;
	}


	.awti-device-trust-bar > div:nth-child(3),
	.awti-device-trust-bar > div:nth-child(4) {

		border-top:
			1px solid
			var(--awti-border);
	}

}


/* ======================================================
   MOBILE
====================================================== */

@media (max-width: 600px) {

	.awti-device-hub {
		border-radius: 10px;
	}


	.awti-device-hero {

		min-height: auto;

		padding: 42px 18px;
	}


	.awti-device-hero-text h1 {

		font-size: 48px;

		letter-spacing: -2px;
	}


	.awti-device-hero-text h2 {
		font-size: 22px;
	}


	.awti-device-hero-text > p {
		font-size: 14px;
	}


	.awti-device-search {
		height: 52px;
	}


	.awti-device-features {

		gap: 6px;
	}


	.awti-device-features span {

		font-size: 9px;

		padding: 6px 8px;
	}


	.awti-device-hero-visual {
		min-height: 170px;
	}


	.orbit-one {

		width: 280px;
		height: 130px;
	}


	.orbit-two {

		width: 240px;
		height: 110px;
	}


	.awti-device-hero-devices {
		font-size: 42px;
	}


	.awti-device-section {
		padding: 22px 15px;
	}


	.awti-section-heading h2 {
		font-size: 18px;
	}


	/* ==================================================
	   CATEGORY — 2 PER ROW
	================================================== */

	.awti-category-grid {

		grid-template-columns:
			repeat(2, minmax(0, 1fr));

		gap: 8px;
	}


	.awti-category-card {

		min-height: 105px;

		padding: 15px 8px;
	}


	.awti-category-icon {
		font-size: 30px;
	}


	.awti-category-card strong {
		font-size: 12px;
	}


	.awti-category-card span {
		font-size: 9px;
	}


	.awti-device-grid {

		grid-template-columns:
			repeat(2, minmax(0, 1fr));

		gap: 9px;
	}


	.awti-device-card-image {

		height: 165px;

		padding: 12px;
	}


	.awti-device-card-content {
		padding: 12px;
	}


	.awti-device-card h3 {
		font-size: 13px;
	}


	.awti-device-price {
		font-size: 17px;
	}


	.awti-device-model {
		font-size: 9px;
	}


	.awti-device-view-button {

		font-size: 10px;

		padding: 8px 5px;
	}


	.awti-device-mini-grid {
		grid-template-columns: 1fr;
	}


	.awti-device-trust-bar {

		grid-template-columns: 1fr;

		margin: 10px 15px 0;
	}


	.awti-device-trust-bar > div {

		border-right: 0 !important;

		border-bottom:
			1px solid
			var(--awti-border);
	}


	.awti-device-trust-bar > div:last-child {
		border-bottom: 0;
	}

}


/* ======================================================
   VERY SMALL MOBILE
====================================================== */

@media (max-width: 380px) {

	.awti-device-grid {
		grid-template-columns: 1fr;
	}


	.awti-category-grid {
		grid-template-columns: 1fr;
	}


	.awti-device-card-image {
		height: 220px;
	}


	.awti-device-hero-text h1 {
		font-size: 42px;
	}

}

/* =========================================================
   AWTI DEVICES HUB — PREMIUM FRONTEND UPGRADE
   Version: 3.0.0
   Master palette:
   Green → White → Blue
   Existing layout / class names preserved.
   ========================================================= */

.awti-device-hub{

	--awti-bg:#f7fafc;
	--awti-card:#ffffff;
	--awti-card-2:#ffffff;

	--awti-border:rgba(37,99,235,.15);

	--awti-text:#0f172a;
	--awti-muted:#64748b;

	--awti-blue:#2563eb;
	--awti-blue-light:#3b82f6;

	--awti-green:#16a34a;
	--awti-green-light:#22c55e;

	--awti-teal:#0d9488;

	--awti-gradient:
		linear-gradient(
			135deg,
			#ecfdf5 0%,
			#ffffff 48%,
			#eff6ff 100%
		);

	--awti-top-gradient:
		linear-gradient(
			90deg,
			#16a34a,
			#0d9488,
			#2563eb
		);

	background:
		radial-gradient(
			circle at 8% 0%,
			rgba(22,163,74,.08),
			transparent 28%
		),
		radial-gradient(
			circle at 95% 8%,
			rgba(37,99,235,.09),
			transparent 30%
		),
		#f7fafc;

	color:var(--awti-text);
}


/* =========================================================
   PREMIUM HERO — KEEP DARK, MATCH BRAND ACCENTS
   ========================================================= */

.awti-device-hero{

	background:
		linear-gradient(
			115deg,
			#07111f 0%,
			#0b1f2d 48%,
			#0d2740 100%
		);

	border-bottom:1px solid rgba(37,99,235,.20);

	box-shadow:
		0 18px 50px rgba(15,23,42,.16);
}


.awti-device-hero::before{

	background:
		radial-gradient(
			circle,
			rgba(22,163,74,.18),
			transparent 48%
		);
}


.awti-device-hero-text h1 span{

	background:
		var(--awti-top-gradient);

	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}


.awti-device-search{

	border:1px solid rgba(37,99,235,.16);

	box-shadow:
		0 15px 45px rgba(15,23,42,.24);
}


.awti-device-search button{

	background:
		var(--awti-top-gradient);
}


.awti-device-search button:hover{

	background:
		linear-gradient(
			135deg,
			#22c55e,
			#0d9488,
			#2563eb
		);
}


/* =========================================================
   HERO FEATURE PILLS
   ========================================================= */

.awti-device-features span{

	color:#dbeafe;

	background:
		linear-gradient(
			135deg,
			rgba(22,163,74,.14),
			rgba(37,99,235,.14)
		);

	border-color:
		rgba(96,165,250,.18);
}


/* =========================================================
   SECTION HEADINGS
   ========================================================= */

.awti-section-heading h2{

	color:#0f172a;
}


.awti-section-heading a{

	color:#2563eb;
}


.awti-section-heading a:hover{

	color:#15803d;
}


/* =========================================================
   CATEGORY CARDS
   ========================================================= */

.awti-category-card{

	position:relative;
	overflow:hidden;

	color:#0f172a;

	background:
		var(--awti-gradient);

	border:
		1px solid rgba(37,99,235,.15);

	border-radius:14px;

	box-shadow:
		0 6px 20px rgba(15,23,42,.045);
}


.awti-category-card::before{

	content:"";

	position:absolute;

	top:0;
	left:0;
	right:0;

	height:3px;

	background:
		var(--awti-top-gradient);
}


.awti-category-card:hover{

	transform:translateY(-5px);

	border-color:
		rgba(37,99,235,.30);

	box-shadow:
		0 15px 32px rgba(37,99,235,.10);
}


.awti-category-card strong{

	color:#0f172a;
}


.awti-category-card span{

	color:#64748b;
}


.awti-category-icon{

	filter:
		drop-shadow(
			0 5px 8px rgba(15,23,42,.08)
		);
}


/* =========================================================
   PRICE TABS
   ========================================================= */

.awti-price-tabs a{

	color:#475569;

	background:#ffffff;

	border-color:
		rgba(37,99,235,.15);

	box-shadow:
		0 3px 10px rgba(15,23,42,.035);
}


.awti-price-tabs a:hover,
.awti-price-tabs a.active{

	color:#ffffff;

	background:
		var(--awti-top-gradient);

	border-color:transparent;

	box-shadow:
		0 7px 20px rgba(37,99,235,.18);
}


/* =========================================================
   DEVICE CARDS
   ========================================================= */

.awti-device-card{

	position:relative;

	background:
		var(--awti-gradient);

	border:
		1px solid rgba(37,99,235,.15);

	border-radius:15px;

	box-shadow:
		0 7px 22px rgba(15,23,42,.05);
}


.awti-device-card::before{

	content:"";

	position:absolute;

	top:0;
	left:0;
	right:0;

	height:3px;

	background:
		var(--awti-top-gradient);

	z-index:2;
}


.awti-device-card:hover{

	transform:translateY(-6px);

	border-color:
		rgba(37,99,235,.28);

	box-shadow:
		0 18px 40px rgba(37,99,235,.11);
}


/* =========================================================
   DEVICE IMAGE AREA
   ========================================================= */

.awti-device-card-image{

	background:
		linear-gradient(
			135deg,
			#f0fdf4 0%,
			#ffffff 50%,
			#eff6ff 100%
		);
}


.awti-device-image{

	filter:
		drop-shadow(
			0 12px 18px rgba(15,23,42,.10)
		);
}


/* =========================================================
   BADGES
   ========================================================= */

.awti-device-badge{

	color:#166534;

	background:
		linear-gradient(
			135deg,
			#dcfce7,
			#f0fdf4
		);

	border-color:#bbf7d0;

	box-shadow:
		0 4px 10px rgba(22,163,74,.08);
}


.awti-device-badge.trending{

	color:#1d4ed8;

	background:
		linear-gradient(
			135deg,
			#dbeafe,
			#eff6ff
		);

	border-color:#bfdbfe;
}


/* =========================================================
   DEVICE CARD CONTENT
   ========================================================= */

.awti-device-brand{

	color:#0d9488;
}


.awti-device-card h3{

	color:#0f172a;
}


.awti-device-card h3 a{

	color:#0f172a;
}


.awti-device-card h3 a:hover{

	color:#2563eb;
}


.awti-device-model{

	color:#64748b;
}


.awti-device-price{

	color:#15803d;
}


.awti-device-status{

	color:#64748b;
}


/* =========================================================
   VIEW BUTTON
   ========================================================= */

.awti-device-view-button{

	background:
		var(--awti-top-gradient);

	border-radius:9px;

	box-shadow:
		0 5px 14px rgba(37,99,235,.12);
}


.awti-device-view-button:hover{

	background:
		linear-gradient(
			135deg,
			#22c55e,
			#0d9488,
			#2563eb
		);

	box-shadow:
		0 8px 20px rgba(37,99,235,.18);
}


/* =========================================================
   MINI DEVICES
   ========================================================= */

.awti-mini-device{

	color:#0f172a;

	background:
		var(--awti-gradient);

	border-color:
		rgba(37,99,235,.15);

	box-shadow:
		0 5px 16px rgba(15,23,42,.04);
}


.awti-mini-device:hover{

	border-color:
		rgba(37,99,235,.28);

	box-shadow:
		0 10px 24px rgba(37,99,235,.09);
}


.awti-mini-device strong{

	color:#0f172a;
}


.awti-mini-device span{

	color:#2563eb;
}


/* =========================================================
   EMPTY STATE
   ========================================================= */

.awti-device-empty{

	background:
		var(--awti-gradient);

	border-color:
		rgba(37,99,235,.16);

	color:#64748b;

	box-shadow:
		0 7px 22px rgba(15,23,42,.04);
}


.awti-device-empty h3{

	color:#0f172a;
}


/* =========================================================
   TRUST BAR
   ========================================================= */

.awti-device-trust-bar{

	border-top-color:
		rgba(37,99,235,.14);

	border-bottom-color:
		rgba(37,99,235,.14);
}


.awti-device-trust-bar > div{

	border-right-color:
		rgba(37,99,235,.12);
}


.awti-device-trust-bar strong{

	color:#0f172a;
}


.awti-device-trust-bar small{

	color:#64748b;
}


/* =========================================================
   FOCUS / ACCESSIBILITY
   ========================================================= */

.awti-device-hub button:focus,
.awti-device-hub a:focus,
.awti-device-hub input:focus{

	outline:
		2px solid rgba(37,99,235,.42);

	outline-offset:3px;
}


/* =========================================================
   SMOOTH INTERACTION
   ========================================================= */

.awti-category-card,
.awti-device-card,
.awti-mini-device,
.awti-price-tabs a,
.awti-device-view-button{

	will-change:transform;
}


/* =========================================================
   MOBILE POLISH
   ========================================================= */

@media (max-width:600px){

	.awti-device-card{

		border-radius:13px;

	}


	.awti-device-card::before{

		height:2px;

	}


	.awti-category-card{

		border-radius:12px;

	}


	.awti-device-price{

		font-size:16px;

	}

}


@media (prefers-reduced-motion:reduce){

	.awti-category-card,
	.awti-device-card,
	.awti-mini-device,
	.awti-price-tabs a,
	.awti-device-view-button,
	.awti-device-image{

		transition:none !important;

		transform:none !important;

	}

}

/* =========================================================
   AWTI DEVICES HUB — MASTER FRONTEND CSS
   Version: 4.0.0 FINAL
   ---------------------------------------------------------
   One-file styling for:
   • Device Hub
   • AI Rating / Value / Trust
   • AI Analysis / Best For / Pros / Cons
   • AI Specifications / Review Note
   • Resources & Links
   • Tabs
   • Wishlist / Share
   • Add to Compare
   • Similar Products
   • Responsive / Accessibility
   ---------------------------------------------------------
   Palette:
   Green → White → Blue
   ========================================================= */


/* =========================================================
   MASTER VARIABLES
   ========================================================= */

.awti-device-hub,
.awti-device-single,
.awti-device-single-page,
.awti-ai-review-card {

	--awti-green: #16a34a;
	--awti-green-light: #22c55e;
	--awti-teal: #0d9488;

	--awti-blue: #2563eb;
	--awti-blue-light: #3b82f6;

	--awti-ink: #0f172a;
	--awti-text: #1e293b;
	--awti-muted: #64748b;

	--awti-border-soft: rgba(37,99,235,.14);

	--awti-surface:
		linear-gradient(
			135deg,
			#ecfdf5 0%,
			#ffffff 48%,
			#eff6ff 100%
		);

	--awti-brand-gradient:
		linear-gradient(
			90deg,
			#16a34a 0%,
			#0d9488 48%,
			#2563eb 100%
		);

	--awti-shadow:
		0 7px 24px rgba(15,23,42,.055);
}


/* =========================================================
   AI REVIEW — MASTER CONTAINER
   ========================================================= */

.awti-ai-review-card {

	position: relative;

	width: 100%;

	margin: 24px 0;

	padding: 0;

	color: var(--awti-text);

	background: #ffffff;

	border: 1px solid var(--awti-border-soft);

	border-radius: 18px;

	box-shadow:
		0 10px 35px rgba(15,23,42,.07);

	overflow: hidden;
}


.awti-ai-review-card::before {

	content: "";

	display: block;

	width: 100%;
	height: 4px;

	background: var(--awti-brand-gradient);
}


/* =========================================================
   AI REVIEW — UNIVERSAL CARD SURFACE
   ========================================================= */

.awti-ai-review-card
.awti-ai-card,
.awti-ai-review-card
.awti-ai-rating-card,
.awti-ai-review-card
.awti-ai-analysis,
.awti-ai-review-card
.awti-ai-summary,
.awti-ai-review-card
.awti-ai-best-for,
.awti-ai-review-card
.awti-ai-pros,
.awti-ai-review-card
.awti-ai-cons,
.awti-ai-review-card
.awti-ai-specifications,
.awti-ai-review-card
.awti-ai-note {

	background: var(--awti-surface) !important;

	border:
		1px solid var(--awti-border-soft) !important;

	border-radius: 14px !important;

	box-shadow:
		0 5px 18px rgba(15,23,42,.045) !important;
}


/* =========================================================
   AI RATING HEADER
   ========================================================= */

.awti-ai-review-card
.awti-ai-rating-header,
.awti-ai-review-card
.awti-ai-header {

	padding: 18px 20px;

	background:
		linear-gradient(
			135deg,
			#f0fdf4,
			#ffffff 50%,
			#eff6ff
		);

	border-bottom:
		1px solid var(--awti-border-soft);
}


.awti-ai-review-card
.awti-ai-rating-header h2,
.awti-ai-review-card
.awti-ai-header h2 {

	margin: 0;

	color: var(--awti-ink) !important;

	font-size: 20px;

	font-weight: 800;
}


.awti-ai-review-card
.awti-ai-rating-header p,
.awti-ai-review-card
.awti-ai-header p {

	color: var(--awti-muted) !important;

	font-size: 13px;

	line-height: 1.6;
}


/* =========================================================
   SCORE CARDS
   ========================================================= */

.awti-ai-review-card
.awti-ai-score-grid {

	display: grid;

	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	gap: 12px;

	margin: 16px 0;
}


.awti-ai-review-card
.awti-ai-score-grid > div {

	position: relative;

	min-height: 105px;

	padding: 16px;

	background: var(--awti-surface) !important;

	border:
		1px solid var(--awti-border-soft) !important;

	border-radius: 14px !important;

	box-shadow:
		0 5px 18px rgba(15,23,42,.045) !important;

	overflow: hidden;
}


.awti-ai-review-card
.awti-ai-score-grid > div::before {

	content: "";

	position: absolute;

	top: 0;
	left: 0;
	right: 0;

	height: 3px;

	background: var(--awti-brand-gradient);
}


.awti-ai-review-card
.awti-ai-score-grid strong,
.awti-ai-review-card
.awti-ai-score-grid .score {

	color: var(--awti-blue) !important;

	font-weight: 800;
}


.awti-ai-review-card
.awti-ai-score-grid small,
.awti-ai-review-card
.awti-ai-score-grid span {

	color: var(--awti-muted) !important;
}


/* =========================================================
   INDIVIDUAL AI SCORE BLOCKS
   ========================================================= */

.awti-ai-rating,
.awti-ai-rating-score,
.awti-value-score,
.awti-data-trust {

	background: var(--awti-surface) !important;

	border:
		1px solid var(--awti-border-soft) !important;

	border-radius: 14px !important;

	box-shadow:
		0 5px 18px rgba(15,23,42,.045) !important;
}


.awti-ai-rating::before,
.awti-ai-rating-score::before,
.awti-value-score::before,
.awti-data-trust::before {

	content: "";

	display: block;

	height: 3px;

	margin: -1px -1px 12px;

	border-radius: 14px 14px 0 0;

	background: var(--awti-brand-gradient);
}


.awti-ai-rating strong,
.awti-ai-rating-score strong {

	color: var(--awti-blue) !important;
}


.awti-value-score strong {

	color: var(--awti-green) !important;
}


.awti-data-trust strong {

	color: var(--awti-teal) !important;
}


/* =========================================================
   AI BUY VERDICT
   ========================================================= */

.awti-ai-verdict,
.awti-ai-buy-tip,
.awti-buy-tip {

	position: relative;

	padding: 15px 17px;

	background:
		linear-gradient(
			135deg,
			#f0fdf4,
			#ffffff,
			#eff6ff
		) !important;

	border:
		1px solid rgba(22,163,74,.18) !important;

	border-radius: 13px !important;

	box-shadow:
		0 5px 18px rgba(22,163,74,.055);
}


.awti-ai-verdict strong,
.awti-ai-buy-tip strong,
.awti-buy-tip strong {

	color: #15803d !important;
}


.awti-ai-verdict .recommended,
.awti-ai-buy-tip .recommended,
.awti-buy-tip .recommended {

	display: inline-flex;

	align-items: center;

	gap: 5px;

	padding: 5px 9px;

	margin-left: 7px;

	color: #166534 !important;

	background: #dcfce7;

	border: 1px solid #bbf7d0;

	border-radius: 999px;

	font-size: 11px;

	font-weight: 700;
}


/* =========================================================
   AI ANALYSIS
   ========================================================= */

.awti-ai-review-card
.awti-ai-analysis {

	padding: 18px;
}


.awti-ai-review-card
.awti-ai-analysis h3 {

	color: var(--awti-ink) !important;

	margin: 0 0 10px;

	font-size: 18px;

	font-weight: 800;
}


.awti-ai-review-card
.awti-ai-analysis p {

	color: #475569 !important;

	font-size: 13px;

	line-height: 1.75;
}


/* =========================================================
   AI SPECIFICATION GRID
   ========================================================= */

.awti-ai-review-card
.awti-ai-analysis-grid {

	display: grid;

	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	gap: 10px;

	margin-top: 14px;
}


.awti-ai-review-card
.awti-ai-analysis-grid > div {

	box-sizing: border-box;

	position: relative;

	padding: 13px 14px;

	background: var(--awti-surface) !important;

	border:
		1px solid var(--awti-border-soft) !important;

	border-radius: 12px !important;

	box-shadow:
		0 5px 18px rgba(15,23,42,.045) !important;

	transition:
		transform .2s ease,
		box-shadow .2s ease,
		border-color .2s ease;
}


.awti-ai-review-card
.awti-ai-analysis-grid > div::before {

	content: "";

	position: absolute;

	top: 0;
	left: 0;

	width: 3px;
	height: 100%;

	background: var(--awti-brand-gradient);

	border-radius: 12px 0 0 12px;
}


.awti-ai-review-card
.awti-ai-analysis-grid > div:hover {

	transform: translateY(-2px);

	border-color:
		rgba(37,99,235,.25) !important;

	box-shadow:
		0 10px 24px rgba(37,99,235,.08) !important;
}


.awti-ai-review-card
.awti-ai-analysis-grid > div strong {

	color: var(--awti-ink) !important;
}


.awti-ai-review-card
.awti-ai-analysis-grid > div span {

	color: #475569 !important;
}


/* =========================================================
   BEST FOR
   ========================================================= */

.awti-ai-best-for,
.awti-best-for {

	padding: 16px 18px;

	background:
		linear-gradient(
			135deg,
			#eff6ff,
			#ffffff,
			#ecfdf5
		) !important;

	border:
		1px solid rgba(37,99,235,.15) !important;

	border-radius: 14px !important;
}


.awti-ai-best-for h3,
.awti-best-for h3 {

	color: var(--awti-ink) !important;

	margin: 0 0 10px;

	font-size: 17px;
}


.awti-ai-best-for span,
.awti-best-for span {

	display: inline-flex;

	padding: 6px 10px;

	margin: 3px;

	color: #1d4ed8 !important;

	background: #eff6ff;

	border: 1px solid #bfdbfe;

	border-radius: 999px;

	font-size: 11px;

	font-weight: 700;
}


/* =========================================================
   PROS
   ========================================================= */

.awti-ai-pros,
.awti-pros {

	padding: 17px;

	background:
		linear-gradient(
			135deg,
			#f0fdf4,
			#ffffff,
			#ecfdf5
		) !important;

	border:
		1px solid rgba(22,163,74,.17) !important;

	border-radius: 14px !important;
}


.awti-ai-pros h3,
.awti-pros h3 {

	color: #15803d !important;

	margin: 0 0 10px;
}


.awti-ai-pros li,
.awti-pros li {

	color: #334155 !important;

	line-height: 1.6;

	margin-bottom: 7px;
}


.awti-ai-pros li::marker {

	color: #16a34a;
}


/* =========================================================
   CONS
   ========================================================= */

.awti-ai-cons,
.awti-cons {

	padding: 17px;

	background:
		linear-gradient(
			135deg,
			#eff6ff,
			#ffffff,
			#f8fafc
		) !important;

	border:
		1px solid rgba(37,99,235,.17) !important;

	border-radius: 14px !important;
}


.awti-ai-cons h3,
.awti-cons h3 {

	color: #1d4ed8 !important;

	margin: 0 0 10px;
}


.awti-ai-cons li,
.awti-cons li {

	color: #334155 !important;

	line-height: 1.6;

	margin-bottom: 7px;
}


.awti-ai-cons li::marker {

	color: #2563eb;
}


/* =========================================================
   REVIEW NOTE
   ========================================================= */

.awti-ai-note,
.awti-ai-review-note,
.awti-ai-footnote {

	position: relative;

	margin-top: 15px;

	padding: 13px 15px;

	color: #475569 !important;

	background:
		linear-gradient(
			135deg,
			#f8fafc,
			#ffffff,
			#eff6ff
		) !important;

	border:
		1px solid rgba(37,99,235,.12) !important;

	border-radius: 12px !important;

	font-size: 11px;

	line-height: 1.65;
}


.awti-ai-note strong,
.awti-ai-review-note strong,
.awti-ai-footnote strong {

	color: #0f172a !important;
}


/* =========================================================
   RESOURCES & LINKS — PREMIUM
   ========================================================= */

.awti-device-resources,
.awti-resources,
.awti-resources-section,
.awti-resources-card {

	position: relative;

	margin: 22px 0;

	padding: 20px;

	background: var(--awti-surface) !important;

	border:
		1px solid var(--awti-border-soft) !important;

	border-radius: 16px !important;

	box-shadow:
		0 7px 24px rgba(15,23,42,.05) !important;

	overflow: hidden;
}


.awti-device-resources::before,
.awti-resources::before,
.awti-resources-section::before,
.awti-resources-card::before {

	content: "";

	position: absolute;

	top: 0;
	left: 0;
	right: 0;

	height: 3px;

	background: var(--awti-brand-gradient);
}


.awti-device-resources h2,
.awti-device-resources h3,
.awti-resources h2,
.awti-resources h3,
.awti-resources-section h2,
.awti-resources-section h3 {

	margin: 0 0 7px;

	color: var(--awti-ink) !important;

	font-weight: 800;
}


.awti-device-resources p,
.awti-resources p,
.awti-resources-section p {

	color: #64748b !important;

	font-size: 13px;

	line-height: 1.6;
}


/* Resource links */

.awti-device-resources a,
.awti-resources a,
.awti-resources-section a,
.awti-resources-card a {

	display: inline-flex;

	align-items: center;

	gap: 6px;

	margin: 5px 7px 5px 0;

	padding: 8px 12px;

	color: #1d4ed8 !important;

	background:
		linear-gradient(
			135deg,
			#eff6ff,
			#ffffff
		) !important;

	border:
		1px solid #bfdbfe !important;

	border-radius: 9px;

	font-size: 12px;

	font-weight: 700;

	transition:
		transform .2s ease,
		box-shadow .2s ease,
		border-color .2s ease;
}


.awti-device-resources a:hover,
.awti-resources a:hover,
.awti-resources-section a:hover,
.awti-resources-card a:hover {

	transform: translateY(-2px);

	color: #15803d !important;

	border-color: #86efac !important;

	box-shadow:
		0 7px 16px rgba(37,99,235,.09);
}


/* =========================================================
   TABS
   ========================================================= */

.awti-device-tabs {

	display: flex;

	gap: 6px;

	padding: 5px;

	background:
		#f1f5f9;

	border:
		1px solid rgba(37,99,235,.10);

	border-radius: 12px;

	overflow-x: auto;
}


.awti-device-tabs button {

	flex: 0 0 auto;

	padding: 9px 16px;

	color: #64748b !important;

	background: transparent !important;

	border: 0 !important;

	border-radius: 9px;

	font-size: 12px;

	font-weight: 700;

	cursor: pointer;

	transition: .2s ease;
}


.awti-device-tabs button:hover {

	color: #1d4ed8 !important;

	background: #eff6ff !important;
}


.awti-device-tabs button.is-active,
.awti-device-tabs button.active {

	color: #ffffff !important;

	background: var(--awti-brand-gradient) !important;

	box-shadow:
		0 5px 14px rgba(37,99,235,.15);
}


.awti-device-tab-panel {

	display: none;
}


.awti-device-tab-panel.is-active,
.awti-device-tab-panel.active {

	display: block;
}


/* =========================================================
   WISHLIST
   ========================================================= */

[data-awti-wishlist] {

	width: 42px;
	height: 42px;

	display: inline-flex;

	align-items: center;
	justify-content: center;

	color: #64748b;

	background:
		#ffffff;

	border:
		1px solid rgba(37,99,235,.15);

	border-radius: 50%;

	font-size: 20px;

	cursor: pointer;

	box-shadow:
		0 5px 15px rgba(15,23,42,.07);

	transition: .2s ease;
}


[data-awti-wishlist]:hover {

	color: #2563eb;

	border-color: #93c5fd;

	transform: translateY(-2px);
}


[data-awti-wishlist].is-active {

	color: #dc2626;

	background:
		linear-gradient(
			135deg,
			#fef2f2,
			#ffffff
		);

	border-color: #fecaca;

	box-shadow:
		0 7px 18px rgba(220,38,38,.12);
}


/* =========================================================
   SHARE
   ========================================================= */

[data-awti-share] {

	width: 42px;
	height: 42px;

	display: inline-flex;

	align-items: center;
	justify-content: center;

	color: #2563eb;

	background: #ffffff;

	border:
		1px solid rgba(37,99,235,.15);

	border-radius: 50%;

	cursor: pointer;

	box-shadow:
		0 5px 15px rgba(15,23,42,.07);

	transition: .2s ease;
}


[data-awti-share]:hover {

	color: #ffffff;

	background: var(--awti-brand-gradient);

	border-color: transparent;

	transform: translateY(-2px);
}


/* =========================================================
   ADD TO COMPARE
   ========================================================= */

.awti-device-compare {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	gap: 7px;

	min-height: 42px;

	padding: 9px 15px;

	color: #1d4ed8 !important;

	background:
		linear-gradient(
			135deg,
			#eff6ff,
			#ffffff
		) !important;

	border:
		1px solid #bfdbfe !important;

	border-radius: 10px;

	font-size: 12px;

	font-weight: 800;

	cursor: pointer;

	box-shadow:
		0 5px 15px rgba(37,99,235,.06);

	transition:
		transform .2s ease,
		box-shadow .2s ease,
		background .2s ease;
}


.awti-device-compare:hover {

	transform: translateY(-2px);

	box-shadow:
		0 9px 20px rgba(37,99,235,.12);
}


.awti-device-compare.is-added {

	color: #166534 !important;

	background:
		linear-gradient(
			135deg,
			#dcfce7,
			#f0fdf4
		) !important;

	border-color:
		#86efac !important;

	box-shadow:
		0 7px 18px rgba(22,163,74,.12);
}





/* =========================================================
   SIMILAR PRODUCTS
   ========================================================= */

.awti-similar-products,
.awti-similar-products-section {

	margin-top: 25px;
}


.awti-similar-products h2,
.awti-similar-products h3,
.awti-similar-products-section h2,
.awti-similar-products-section h3 {

	color: var(--awti-ink) !important;

	font-weight: 800;
}


.awti-similar-products-grid,
.awti-similar-grid {

	display: grid;

	grid-template-columns:
		repeat(
			auto-fit,
			minmax(210px, 1fr)
		);

	gap: 12px;
}


.awti-similar-product,
.awti-similar-products .awti-device-card {

	position: relative;

	background: var(--awti-surface) !important;

	border:
		1px solid var(--awti-border-soft) !important;

	border-radius: 14px !important;

	box-shadow:
		0 6px 20px rgba(15,23,42,.045) !important;

	overflow: hidden;

	transition: .22s ease;
}


.awti-similar-product::before,
.awti-similar-products .awti-device-card::before {

	content: "";

	position: absolute;

	top: 0;
	left: 0;
	right: 0;

	height: 3px;

	background: var(--awti-brand-gradient);
}


.awti-similar-product:hover,
.awti-similar-products .awti-device-card:hover {

	transform: translateY(-5px);

	border-color:
		rgba(37,99,235,.28) !important;

	box-shadow:
		0 14px 30px rgba(37,99,235,.09) !important;
}


/* =========================================================
   GENERAL SINGLE DEVICE SURFACES
   ========================================================= */

.awti-device-single .awti-card,
.awti-device-single-page .awti-card,
.awti-device-single .awti-section-card,
.awti-device-single-page .awti-section-card {

	background: var(--awti-surface) !important;

	border:
		1px solid var(--awti-border-soft) !important;

	border-radius: 14px !important;

	box-shadow: var(--awti-shadow) !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

	.awti-ai-review-card {

		margin: 16px 0;

		border-radius: 14px;
	}


	.awti-ai-score-grid {

		grid-template-columns: 1fr !important;
	}


	.awti-ai-review-card
	.awti-ai-analysis-grid {

		grid-template-columns: 1fr;
	}


	.awti-device-resources,
	.awti-resources,
	.awti-resources-section,
	.awti-resources-card {

		padding: 16px;

		border-radius: 13px !important;
	}


	.awti-device-tabs {

		border-radius: 10px;
	}


	.awti-device-tabs button {

		padding: 8px 12px;

		font-size: 11px;
	}


	.awti-similar-products-grid,
	.awti-similar-grid {

		grid-template-columns:
			repeat(2, minmax(0, 1fr));

		gap: 8px;
	}

}


@media (max-width: 420px) {

	.awti-similar-products-grid,
	.awti-similar-grid {

		grid-template-columns: 1fr;
	}


	.awti-ai-review-card
	.awti-ai-analysis-grid {

		gap: 8px;
	}

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.awti-device-hub a:focus-visible,
.awti-device-hub button:focus-visible,
.awti-device-single a:focus-visible,
.awti-device-single button:focus-visible {

	outline:
		3px solid rgba(37,99,235,.35) !important;

	outline-offset: 3px !important;
}


@media (prefers-reduced-motion: reduce) {

	.awti-device-hub *,
	.awti-device-single *,
	.awti-device-single-page * {

		transition-duration: .01ms !important;

		animation-duration: .01ms !important;

		animation-iteration-count: 1 !important;

		scroll-behavior: auto !important;
	}

}


/* =========================================================
   END — AWTI MASTER FRONTEND CSS
   ========================================================= */
/* =========================================================
   AWTI DEVICE HUB — FILTER PANEL FINAL
   Green → White → Blue
   ========================================================= */

.awti-device-filter-form {
	width: 100%;
	margin: 10px 0 18px;
}


/* =========================================================
   FILTER BUTTON
   ========================================================= */

.awti-device-filter-form [data-awti-filter-toggle] {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 7px;

	min-height: 40px;
	padding: 9px 16px;

	color: #0f172a !important;

	background:
		linear-gradient(
			135deg,
			#ffffff 0%,
			#ecfdf5 50%,
			#eff6ff 100%
		) !important;

	border: 1px solid rgba(37,99,235,.22) !important;
	border-radius: 10px !important;

	font-size: 13px;
	font-weight: 800;

	cursor: pointer;

	box-shadow:
		0 5px 16px rgba(15,23,42,.08);

	transition: all .2s ease;
}

.awti-device-filter-form
[data-awti-filter-toggle]:hover {

	color: #ffffff !important;

	background:
		linear-gradient(
			90deg,
			#16a34a,
			#0d9488,
			#2563eb
		) !important;

	border-color: transparent !important;

	transform: translateY(-2px);

	box-shadow:
		0 8px 20px rgba(37,99,235,.16);
}


/* =========================================================
   FILTER PANEL
   ========================================================= */

.awti-device-filter-form [data-awti-filter-panel] {

	display: none;

	margin-top: 10px;
	padding: 15px;

	background:
		linear-gradient(
			135deg,
			#ecfdf5 0%,
			#ffffff 48%,
			#eff6ff 100%
		) !important;

	border:
		1px solid rgba(37,99,235,.16) !important;

	border-radius: 14px !important;

	box-shadow:
		0 8px 25px rgba(15,23,42,.07);

}


.awti-device-filter-form
[data-awti-filter-panel].is-open {

	display: grid;

	grid-template-columns:
		repeat(4, minmax(0, 1fr));

	gap: 12px;

	animation:
		awtiFilterOpen .2s ease;
}


@keyframes awtiFilterOpen {

	from {
		opacity: 0;
		transform: translateY(-5px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}

}


/* =========================================================
   FILTER LABEL
   ========================================================= */

.awti-device-filter-form label {

	display: flex;

	flex-direction: column;

	gap: 6px;

	color: #334155 !important;

	font-size: 12px;

	font-weight: 800;
}


/* =========================================================
   SELECT BOX
   ========================================================= */

.awti-device-filter-form select {

	width: 100%;

	min-height: 42px;

	padding: 9px 34px 9px 12px;

	color: #0f172a !important;

	background-color: #ffffff !important;

	border:
		1px solid rgba(37,99,235,.22) !important;

	border-radius: 9px !important;

	font-size: 12px;

	font-weight: 600;

	cursor: pointer;

	outline: none;

	box-shadow:
		0 3px 10px rgba(15,23,42,.04);

	transition:
		border-color .2s ease,
		box-shadow .2s ease,
		transform .2s ease;
}


.awti-device-filter-form select:hover {

	border-color:
		rgba(22,163,74,.45) !important;

	box-shadow:
		0 5px 14px rgba(22,163,74,.07);
}


.awti-device-filter-form select:focus {

	border-color:
		#2563eb !important;

	box-shadow:
		0 0 0 3px rgba(37,99,235,.12) !important;
}


/* =========================================================
   FILTER ACTIONS
   ========================================================= */

.awti-device-filter-actions {

	display: flex;

	align-items: center;

	gap: 8px;

	grid-column: 1 / -1;

	margin-top: 2px;
}


.awti-device-filter-actions button,
.awti-device-filter-actions a,
.awti-device-filter-form
[data-awti-filter-apply],
.awti-device-filter-form
[data-awti-filter-reset] {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	min-height: 40px;

	padding: 9px 16px;

	border-radius: 9px !important;

	font-size: 12px;

	font-weight: 800;

	cursor: pointer;

	text-decoration: none !important;

	transition: all .2s ease;
}


/* Apply */

.awti-device-filter-form
[data-awti-filter-apply] {

	color: #ffffff !important;

	background:
		linear-gradient(
			90deg,
			#16a34a,
			#0d9488,
			#2563eb
		) !important;

	border: 0 !important;

	box-shadow:
		0 6px 16px rgba(37,99,235,.15);
}


.awti-device-filter-form
[data-awti-filter-apply]:hover {

	transform: translateY(-2px);

	box-shadow:
		0 9px 20px rgba(37,99,235,.2);
}


/* Reset */

.awti-device-filter-form
[data-awti-filter-reset] {

	color: #475569 !important;

	background: #ffffff !important;

	border:
		1px solid rgba(100,116,139,.2) !important;
}


.awti-device-filter-form
[data-awti-filter-reset]:hover {

	color: #dc2626 !important;

	border-color:
		#fecaca !important;

	background: #fffafa !important;
}


/* =========================================================
   MOBILE FILTER
   ========================================================= */

@media (max-width: 700px) {

	.awti-device-filter-form {
		margin-top: 8px;
	}


	.awti-device-filter-form
	[data-awti-filter-toggle] {

		width: auto;

		min-height: 38px;

		padding: 8px 14px;

		font-size: 12px;
	}


	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		grid-template-columns: 1fr;

		gap: 10px;

		padding: 13px;

		border-radius: 12px !important;
	}


	.awti-device-filter-form label {

		font-size: 11px;
	}


	.awti-device-filter-form select {

		min-height: 40px;

		font-size: 12px;
	}


	.awti-device-filter-actions {

		display: grid;

		grid-template-columns:
			1fr 1fr;

		width: 100%;
	}


	.awti-device-filter-form
	[data-awti-filter-apply],
	.awti-device-filter-form
	[data-awti-filter-reset] {

		width: 100%;
	}

}


/* =========================================================
   AWTI DEVICE HUB — FILTER FINAL OVERRIDE
   Version: 5.0.0 FINAL
   Green → White → Blue
   Strong selectors to prevent theme/plugin CSS conflicts
   ========================================================= */

.awti-device-hub .awti-device-filter-form {
	width: 100% !important;
	margin: 10px 0 18px !important;
	position: relative;
	z-index: 10;
}

.awti-device-hub .awti-device-filter-form [data-awti-filter-toggle] {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 7px !important;
	min-height: 40px !important;
	padding: 9px 16px !important;
	color: #0f172a !important;
	background: linear-gradient(135deg, #ffffff 0%, #ecfdf5 50%, #eff6ff 100%) !important;
	border: 1px solid rgba(37,99,235,.22) !important;
	border-radius: 10px !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
	cursor: pointer !important;
	box-shadow: 0 5px 16px rgba(15,23,42,.08) !important;
	transition: all .2s ease !important;
}

.awti-device-hub .awti-device-filter-form [data-awti-filter-toggle]:hover {
	color: #fff !important;
	background: linear-gradient(90deg, #16a34a, #0d9488, #2563eb) !important;
	border-color: transparent !important;
	transform: translateY(-2px);
}

.awti-device-hub .awti-device-filter-form [data-awti-filter-panel] {
	display: none !important;
	width: 100% !important;
	margin-top: 10px !important;
	padding: 15px !important;
	background: linear-gradient(135deg, #ecfdf5 0%, #ffffff 48%, #eff6ff 100%) !important;
	border: 1px solid rgba(37,99,235,.16) !important;
	border-radius: 14px !important;
	box-shadow: 0 8px 25px rgba(15,23,42,.07) !important;
}

.awti-device-hub .awti-device-filter-form [data-awti-filter-panel].is-open {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: 12px !important;
	animation: awtiFilterFinalOpen .2s ease !important;
}

.awti-device-hub .awti-device-filter-form label {
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;
	color: #334155 !important;
	font-size: 12px !important;
	font-weight: 800 !important;
	line-height: 1.3 !important;
}

.awti-device-hub .awti-device-filter-form select {
	width: 100% !important;
	min-height: 42px !important;
	padding: 9px 34px 9px 12px !important;
	color: #0f172a !important;
	background: #fff !important;
	border: 1px solid rgba(37,99,235,.22) !important;
	border-radius: 9px !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	outline: none !important;
	box-shadow: 0 3px 10px rgba(15,23,42,.04) !important;
	cursor: pointer !important;
}

.awti-device-hub .awti-device-filter-form select:hover {
	border-color: rgba(22,163,74,.45) !important;
	box-shadow: 0 5px 14px rgba(22,163,74,.07) !important;
}

.awti-device-hub .awti-device-filter-form select:focus {
	border-color: #2563eb !important;
	box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important;
}

.awti-device-hub .awti-device-filter-actions {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	grid-column: 1 / -1 !important;
	margin-top: 2px !important;
}

.awti-device-hub .awti-device-filter-actions button,
.awti-device-hub .awti-device-filter-actions a,
.awti-device-hub .awti-device-filter-form [data-awti-filter-apply],
.awti-device-hub .awti-device-filter-form [data-awti-filter-reset] {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 40px !important;
	padding: 9px 16px !important;
	border-radius: 9px !important;
	font-size: 12px !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
	cursor: pointer !important;
	text-decoration: none !important;
}

.awti-device-hub .awti-device-filter-form [data-awti-filter-apply] {
	color: #fff !important;
	background: linear-gradient(90deg, #16a34a, #0d9488, #2563eb) !important;
	border: 0 !important;
	box-shadow: 0 6px 16px rgba(37,99,235,.15) !important;
}

.awti-device-hub .awti-device-filter-form [data-awti-filter-apply]:hover {
	transform: translateY(-2px);
	box-shadow: 0 9px 20px rgba(37,99,235,.2) !important;
}

.awti-device-hub .awti-device-filter-form [data-awti-filter-reset] {
	color: #475569 !important;
	background: #fff !important;
	border: 1px solid rgba(100,116,139,.2) !important;
}

.awti-device-hub .awti-device-filter-form [data-awti-filter-reset]:hover {
	color: #dc2626 !important;
	border-color: #fecaca !important;
	background: #fffafa !important;
}

@keyframes awtiFilterFinalOpen {
	from {
		opacity: 0;
		transform: translateY(-5px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (max-width: 700px) {
	.awti-device-hub .awti-device-filter-form [data-awti-filter-panel].is-open {
		grid-template-columns: 1fr !important;
		gap: 10px !important;
		padding: 13px !important;
		border-radius: 12px !important;
	}

	.awti-device-hub .awti-device-filter-form select {
		min-height: 40px !important;
	}

	.awti-device-hub .awti-device-filter-actions {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		width: 100% !important;
	}

	.awti-device-hub .awti-device-filter-actions button,
	.awti-device-hub .awti-device-filter-actions a,
	.awti-device-hub .awti-device-filter-form [data-awti-filter-apply],
	.awti-device-hub .awti-device-filter-form [data-awti-filter-reset] {
		width: 100% !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.awti-device-hub .awti-device-filter-form [data-awti-filter-panel].is-open {
		animation: none !important;
	}
}


/* =========================================================
   AWTI FINAL POLISH
   ========================================================= */

/* Hide horizontal scrollbar under Popular Mobiles by Price.
   Horizontal swipe/scroll remains available. */
.awti-device-hub .awti-price-tabs {
	overflow-x: auto !important;
	overflow-y: hidden !important;
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
}

.awti-device-hub .awti-price-tabs::-webkit-scrollbar {
	display: none !important;
	width: 0 !important;
	height: 0 !important;
}

.awti-device-hub .awti-price-tabs a {
	flex: 0 0 auto !important;
	white-space: nowrap !important;
}

/* Add to Compare — JS supplies the single ✓ in the button text.
   Do NOT add another checkmark through CSS. */
.awti-device-hub .awti-device-compare.is-added::before {
	content: none !important;
	display: none !important;
}

.awti-device-hub .awti-device-compare.is-added {
	color: #166534 !important;
	background: linear-gradient(
		135deg,
		#dcfce7 0%,
		#f0fdf4 50%,
		#eff6ff 100%
	) !important;
	border-color: #86efac !important;
	box-shadow: 0 7px 18px rgba(22,163,74,.12) !important;
}

@media (max-width: 700px) {
	.awti-device-hub .awti-price-tabs {
		scrollbar-width: none !important;
		-ms-overflow-style: none !important;
	}

	.awti-device-hub .awti-price-tabs::-webkit-scrollbar {
		display: none !important;
		height: 0 !important;
	}
}
/* =========================================================
   AWTI DEVICES HUB
   FILTER SELECT TEXT VISIBILITY FIX
   ========================================================= */

.awti-device-filter-form select,
.awti-device-filter-form select:focus,
.awti-device-filter-form select:active {
	color: #0f172a !important;
	background-color: #ffffff !important;
	-webkit-text-fill-color: #0f172a !important;
	opacity: 1 !important;
	font-weight: 600 !important;
}

/* Selected option */
.awti-device-filter-form select option {
	color: #0f172a !important;
	background: #ffffff !important;
	font-weight: 500;
}

/* Placeholder / first option */
.awti-device-filter-form select option:first-child {
	color: #64748b !important;
}

/* Disabled option */
.awti-device-filter-form select option:disabled {
	color: #94a3b8 !important;
}

/* Safari / Chrome native select */
.awti-device-filter-form select {
	appearance: auto;
	-webkit-appearance: auto;
}

/* Filter box */
.awti-device-filter-form {
	color: #0f172a;
}

/* Labels */
.awti-device-filter-form label,
.awti-device-filter-form label span {
	color: #0f172a !important;
	font-weight: 700 !important;
}



/* =========================================================
   AWTI DEVICES HUB — FINAL UI OVERRIDES
   Version: 2.2.0 FINAL
   Green → White → Blue
   ========================================================= */


/* =========================================================
   FILTER PANEL — FINAL
   ========================================================= */

.awti-device-hub .awti-device-filter-form {
	width: 100% !important;
	margin: 10px 0 18px !important;
}


/* Filter button */

.awti-device-hub
.awti-device-filter-form
[data-awti-filter-toggle] {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 7px !important;

	min-height: 42px !important;
	padding: 9px 16px !important;

	color: #0f172a !important;

	background:
		linear-gradient(
			135deg,
			#ffffff 0%,
			#ecfdf5 50%,
			#eff6ff 100%
		) !important;

	border: 1px solid
		rgba(37,99,235,.22) !important;

	border-radius: 11px !important;

	font-size: 13px !important;
	font-weight: 800 !important;

	cursor: pointer !important;

	box-shadow:
		0 5px 16px
		rgba(15,23,42,.08) !important;

	transition:
		transform .2s ease,
		box-shadow .2s ease,
		background .2s ease !important;
}


.awti-device-hub
.awti-device-filter-form
[data-awti-filter-toggle]:hover {
	color: #ffffff !important;

	background:
		linear-gradient(
			90deg,
			#16a34a,
			#0d9488,
			#2563eb
		) !important;

	border-color: transparent !important;

	transform: translateY(-2px);

	box-shadow:
		0 9px 22px
		rgba(37,99,235,.18) !important;
}


/* =========================================================
   FILTER PANEL
   ========================================================= */

.awti-device-hub
.awti-device-filter-form
[data-awti-filter-panel] {
	display: none !important;

	margin-top: 10px !important;
	padding: 15px !important;

	background:
		linear-gradient(
			135deg,
			#ecfdf5 0%,
			#ffffff 48%,
			#eff6ff 100%
		) !important;

	border:
		1px solid
		rgba(37,99,235,.16) !important;

	border-radius: 14px !important;

	box-shadow:
		0 8px 25px
		rgba(15,23,42,.07) !important;
}


.awti-device-hub
.awti-device-filter-form
[data-awti-filter-panel].is-open {
	display: grid !important;
	grid-template-columns:
		repeat(4, minmax(0, 1fr)) !important;

	gap: 10px !important;

	animation:
		awtiFilterFinalOpen
		.2s ease both;
}


@keyframes awtiFilterFinalOpen {

	from {
		opacity: 0;
		transform: translateY(-5px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}

}


/* =========================================================
   FILTER LABELS
   ========================================================= */

.awti-device-hub
.awti-device-filter-form
label {
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;

	color: #0f172a !important;

	font-size: 12px !important;
	font-weight: 800 !important;
}


/* =========================================================
   FILTER SELECTS
   IMPORTANT:
   Selected option text MUST remain visible.
   ========================================================= */

.awti-device-hub
.awti-device-filter-form
select {
	display: block !important;

	width: 100% !important;
	min-width: 0 !important;
	min-height: 42px !important;

	padding:
		9px 34px 9px 12px !important;

	color: #0f172a !important;

	-webkit-text-fill-color:
		#0f172a !important;

	background-color:
		#ffffff !important;

	background-image:
		none !important;

	border:
		1px solid
		rgba(100,116,139,.18) !important;

	border-radius: 10px !important;

	font-size: 12px !important;
	font-weight: 700 !important;

	line-height: 1.3 !important;

	opacity: 1 !important;

	cursor: pointer !important;

	outline: none !important;

	box-shadow:
		0 3px 10px
		rgba(15,23,42,.04) !important;

	transition:
		border-color .2s ease,
		box-shadow .2s ease,
		transform .2s ease !important;
}


.awti-device-hub
.awti-device-filter-form
select:hover {
	border-color:
		rgba(22,163,74,.45) !important;

	box-shadow:
		0 5px 14px
		rgba(22,163,74,.07) !important;
}


.awti-device-hub
.awti-device-filter-form
select:focus {
	color: #0f172a !important;

	-webkit-text-fill-color:
		#0f172a !important;

	background-color:
		#ffffff !important;

	border-color:
		#2563eb !important;

	box-shadow:
		0 0 0 3px
		rgba(37,99,235,.12) !important;
}


/* Browser dropdown options */

.awti-device-hub
.awti-device-filter-form
select option {
	color: #0f172a !important;

	background: #ffffff !important;

	font-weight: 600 !important;
}


.awti-device-hub
.awti-device-filter-form
select option:checked {
	color: #0f172a !important;

	background:
		#dbeafe !important;

	font-weight: 800 !important;
}


/* =========================================================
   FILTER ACTIONS
   ========================================================= */

.awti-device-hub
.awti-device-filter-actions {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;

	grid-column: 1 / -1 !important;

	margin-top: 2px !important;
}


.awti-device-hub
.awti-device-filter-actions
button,
.awti-device-hub
.awti-device-filter-actions
a,
.awti-device-hub
.awti-device-filter-form
[data-awti-filter-apply],
.awti-device-hub
.awti-device-filter-form
[data-awti-filter-reset] {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;

	min-height: 40px !important;

	padding: 9px 16px !important;

	border-radius: 9px !important;

	font-size: 12px !important;
	font-weight: 800 !important;

	line-height: 1.2 !important;

	cursor: pointer !important;

	text-decoration: none !important;

	transition:
		transform .2s ease,
		box-shadow .2s ease,
		background .2s ease,
		border-color .2s ease !important;
}


/* Apply */

.awti-device-hub
.awti-device-filter-form
[data-awti-filter-apply] {
	color: #ffffff !important;

	background:
		linear-gradient(
			90deg,
			#16a34a,
			#0d9488,
			#2563eb
		) !important;

	border: 0 !important;

	box-shadow:
		0 6px 16px
		rgba(37,99,235,.15) !important;
}


.awti-device-hub
.awti-device-filter-form
[data-awti-filter-apply]:hover {
	color: #ffffff !important;

	transform: translateY(-2px);

	box-shadow:
		0 9px 20px
		rgba(37,99,235,.20) !important;
}


/* Reset */

.awti-device-hub
.awti-device-filter-form
[data-awti-filter-reset] {
	color: #475569 !important;

	background: #ffffff !important;

	border:
		1px solid
		rgba(100,116,139,.20) !important;
}


.awti-device-hub
.awti-device-filter-form
[data-awti-filter-reset]:hover {
	color: #dc2626 !important;

	background: #fffafa !important;

	border-color:
		#fecaca !important;
}


/* =========================================================
   SEARCH — FINAL
   ========================================================= */

.awti-device-hub
.awti-device-search {
	position: relative !important;

	display: flex !important;

	width: min(650px, 100%) !important;
	height: 58px !important;

	background: #ffffff !important;

	border-radius: 14px !important;

	overflow: hidden !important;

	box-shadow:
		0 15px 50px
		rgba(0,0,0,.30) !important;
}


.awti-device-hub
.awti-device-search
input {
	flex: 1 1 auto !important;

	min-width: 0 !important;

	height: 58px !important;

	padding:
		0 20px !important;

	color: #0f172a !important;

	-webkit-text-fill-color:
		#0f172a !important;

	background: #ffffff !important;

	border: 0 !important;

	outline: none !important;

	box-shadow: none !important;

	font-size: 15px !important;
}


.awti-device-hub
.awti-device-search
input::placeholder {
	color: #94a3b8 !important;

	-webkit-text-fill-color:
		#94a3b8 !important;

	opacity: 1 !important;
}


.awti-device-hub
.awti-device-search
button {
	flex: 0 0 62px !important;

	width: 62px !important;
	height: 58px !important;

	display: inline-flex !important;

	align-items: center !important;
	justify-content: center !important;

	color: #ffffff !important;

	background:
		linear-gradient(
			135deg,
			#16a34a 0%,
			#0d9488 48%,
			#2563eb 100%
		) !important;

	border: 0 !important;

	cursor: pointer !important;

	font-size: 20px !important;

	transition:
		transform .2s ease,
		filter .2s ease !important;
}


.awti-device-hub
.awti-device-search
button:hover {
	filter: brightness(1.08);

	transform: scale(1.02);
}


.awti-device-hub
.awti-device-search
button:disabled {
	opacity: .7 !important;

	cursor: wait !important;

	transform: none !important;
}


/* =========================================================
   SEARCH LOADING
   ========================================================= */

.awti-device-hub
.is-search-loading {
	opacity: .65 !important;

	pointer-events: none !important;

	transition: opacity .2s ease !important;
}


/* =========================================================
   AI RATING / AI ANALYSIS
   Same Green → White → Blue colour system
   ========================================================= */

.awti-ai-review-card,
.awti-device-single
.awti-ai-review-card,
.awti-device-single-page
.awti-ai-review-card {
	background:
		linear-gradient(
			135deg,
			#ecfdf5 0%,
			#ffffff 48%,
			#eff6ff 100%
		) !important;

	border:
		1px solid
		rgba(37,99,235,.18) !important;

	border-radius: 14px !important;

	box-shadow:
		0 8px 25px
		rgba(15,23,42,.07) !important;
}


.awti-ai-review-card
.awti-ai-analysis-grid {
	display: grid !important;

	grid-template-columns:
		repeat(
			2,
			minmax(0, 1fr)
		) !important;

	gap: 10px !important;
}


.awti-ai-review-card
.awti-ai-analysis-grid > div {
	box-sizing: border-box !important;

	background:
		linear-gradient(
			135deg,
			#ecfdf5 0%,
			#ffffff 48%,
			#eff6ff 100%
		) !important;

	background-color:
		transparent !important;

	border:
		1px solid
		rgba(37,99,235,.18) !important;

	border-radius: 12px !important;

	box-shadow:
		0 5px 18px
		rgba(15,23,42,.045) !important;
}


.awti-ai-review-card
.awti-ai-analysis-grid > div strong {
	color: #0f172a !important;
}


.awti-ai-review-card
.awti-ai-analysis-grid > div span {
	color: #475569 !important;
}


/* =========================================================
   RESOURCES & LINKS
   ========================================================= */

.awti-device-resources,
.awti-resources,
.awti-resources-links {
	background:
		linear-gradient(
			135deg,
			#ecfdf5 0%,
			#ffffff 48%,
			#eff6ff 100%
		) !important;

	border:
		1px solid
		rgba(37,99,235,.16) !important;

	border-radius: 14px !important;

	box-shadow:
		0 8px 25px
		rgba(15,23,42,.06) !important;
}


.awti-device-resources a,
.awti-resources a,
.awti-resources-links a {
	display: inline-flex !important;

	align-items: center !important;

	gap: 5px !important;

	color: #2563eb !important;

	font-weight: 700 !important;

	text-decoration: none !important;

	transition:
		color .2s ease,
		transform .2s ease !important;
}


.awti-device-resources a:hover,
.awti-resources a:hover,
.awti-resources-links a:hover {
	color: #16a34a !important;

	transform: translateY(-1px);
}


/* =========================================================
   PROS / CONS
   ========================================================= */

.awti-device-pros,
.awti-device-cons,
.awti-pros-card,
.awti-cons-card {
	background:
		linear-gradient(
			135deg,
			#ecfdf5 0%,
			#ffffff 48%,
			#eff6ff 100%
		) !important;

	border:
		1px solid
		rgba(37,99,235,.15) !important;

	border-radius: 13px !important;

	box-shadow:
		0 6px 20px
		rgba(15,23,42,.05) !important;
}


/* =========================================================
   COMPARE BUTTON
   ========================================================= */

.awti-device-compare {
	display: inline-flex !important;

	align-items: center !important;
	justify-content: center !important;

	gap: 5px !important;

	min-height: 40px !important;

	padding: 9px 14px !important;

	color: #2563eb !important;

	background:
		linear-gradient(
			135deg,
			#ffffff,
			#eff6ff
		) !important;

	border:
		1px solid
		rgba(37,99,235,.22) !important;

	border-radius: 9px !important;

	font-weight: 800 !important;

	cursor: pointer !important;
}


.awti-device-compare.is-added {
	color: #166534 !important;

	background:
		linear-gradient(
			135deg,
			#dcfce7,
			#ecfdf5
		) !important;

	border-color:
		rgba(22,163,74,.35) !important;
}


/* Prevent CSS from creating an extra check mark.
   JS should be the only source of the ✓ text. */

.awti-device-compare.is-added::before,
.awti-device-compare.is-added::after {
	content: none !important;
}


/* =========================================================
   WISHLIST
   ========================================================= */

[data-awti-wishlist] {
	display: inline-flex !important;

	align-items: center !important;
	justify-content: center !important;

	width: 42px !important;
	height: 42px !important;

	color: #64748b !important;

	background: #ffffff !important;

	border:
		1px solid
		rgba(100,116,139,.20) !important;

	border-radius: 50% !important;

	cursor: pointer !important;

	transition:
		color .2s ease,
		background .2s ease,
		transform .2s ease !important;
}


[data-awti-wishlist].is-active {
	color: #ef4444 !important;

	background:
		#fff1f2 !important;

	border-color:
		rgba(239,68,68,.25) !important;
}


[data-awti-wishlist]:hover {
	transform: translateY(-2px);
}


/* =========================================================
   SIMILAR PRODUCTS
   ========================================================= */

.awti-similar-products-grid,
.awti-similar-grid {
	display: grid !important;

	grid-template-columns:
		repeat(
			3,
			minmax(0, 1fr)
		) !important;

	gap: 12px !important;
}


.awti-similar-products-grid > *,
.awti-similar-grid > * {
	background:
		linear-gradient(
			135deg,
			#ecfdf5 0%,
			#ffffff 48%,
			#eff6ff 100%
		) !important;

	border:
		1px solid
		rgba(37,99,235,.14) !important;

	border-radius: 12px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		grid-template-columns:
			1fr !important;

		gap: 10px !important;

		padding: 13px !important;

		border-radius: 12px !important;

	}

	.awti-device-hub
	.awti-device-filter-actions {

		display: grid !important;

		grid-template-columns:
			1fr 1fr !important;

		width: 100% !important;

	}

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-apply],

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-reset] {

		width: 100% !important;

	}

	.awti-device-hub
	.awti-device-search {

		height: 52px !important;

		border-radius: 12px !important;

	}

	.awti-device-hub
	.awti-device-search
	input {

		height: 52px !important;

		padding:
			0 14px !important;

		font-size: 14px !important;

	}

	.awti-device-hub
	.awti-device-search
	button {

		flex-basis: 58px !important;

		width: 58px !important;

		height: 52px !important;

	}

	.awti-ai-review-card
	.awti-ai-analysis-grid {

		grid-template-columns:
			1fr !important;

	}

	.awti-similar-products-grid,
	.awti-similar-grid {

		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			) !important;

	}

}


@media (max-width: 420px) {

	.awti-similar-products-grid,
	.awti-similar-grid {

		grid-template-columns:
			1fr !important;

	}

	.awti-device-hub
	.awti-device-filter-actions {

		grid-template-columns:
			1fr !important;

	}

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.awti-device-hub
a:focus-visible,

.awti-device-hub
button:focus-visible,

.awti-device-single
a:focus-visible,

.awti-device-single
button:focus-visible {

	outline:
		3px solid
		rgba(37,99,235,.35) !important;

	outline-offset:
		3px !important;

}


@media (prefers-reduced-motion: reduce) {

	.awti-device-hub *,
	.awti-device-single *,
	.awti-device-single-page * {

		transition-duration:
			.01ms !important;

		animation-duration:
			.01ms !important;

		animation-iteration-count:
			1 !important;

		scroll-behavior:
			auto !important;

	}

}


/* =========================================================
   END — AWTI MASTER FRONTEND CSS FINAL
   ========================================================= */


/* =========================================================
   AWTI DEVICES HUB — FINAL MASTER OVERRIDE
   Version: 5.0.0 FINAL
   ---------------------------------------------------------
   ✓ Filter desktop/laptop/mobile
   ✓ Selected filter text
   ✓ Search UI
   ✓ Apply / Reset
   ✓ Add to Compare — single check
   ✓ Wishlist
   ✓ Resources & Links
   ✓ Responsive
   ========================================================= */


/* =========================================================
   FILTER MASTER
   ========================================================= */

.awti-device-filter-form {
	width: 100% !important;
	margin: 10px 0 18px !important;
	box-sizing: border-box !important;
}

.awti-device-filter-form
[data-awti-filter-panel] {
	width: 100% !important;
	box-sizing: border-box !important;
	background: linear-gradient(
		135deg,
		#f0fdf4 0%,
		#ffffff 50%,
		#eff6ff 100%
	) !important;
	border: 1px solid rgba(37,99,235,.14) !important;
	border-radius: 14px !important;
	box-shadow: 0 8px 25px rgba(15,23,42,.07) !important;
}

.awti-device-filter-form
[data-awti-filter-panel].is-open {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(150px, 1fr)) !important;
	gap: 12px !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

.awti-device-filter-form
.awti-filter-field,
.awti-device-filter-form label {
	min-width: 0 !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.awti-device-filter-form
.awti-filter-select-wrap {
	position: relative !important;
	width: 100% !important;
	min-width: 150px !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

.awti-device-filter-form select {
	width: 100% !important;
	min-width: 150px !important;
	min-height: 42px !important;
	height: 42px !important;
	padding: 0 40px 0 12px !important;
	border: 1px solid rgba(37,99,235,.18) !important;
	border-radius: 9px !important;
	background: #ffffff !important;
	color: transparent !important;
	-webkit-text-fill-color: transparent !important;
	box-shadow: 0 3px 10px rgba(15,23,42,.04) !important;
	cursor: pointer !important;
	box-sizing: border-box !important;
}

.awti-device-filter-form select option {
	color: #0f172a !important;
	-webkit-text-fill-color: #0f172a !important;
	background: #ffffff !important;
}

.awti-device-filter-form select:hover {
	border-color: rgba(22,163,74,.45) !important;
	box-shadow: 0 5px 14px rgba(22,163,74,.07) !important;
}

.awti-device-filter-form select:focus {
	outline: 2px solid rgba(37,99,235,.18) !important;
	outline-offset: 1px !important;
	border-color: #2563eb !important;
}

.awti-device-filter-form
.awti-filter-selected-value {
	position: absolute !important;
	z-index: 2 !important;
	left: 12px !important;
	right: 40px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	display: block !important;
	width: auto !important;
	max-width: calc(100% - 52px) !important;
	overflow: hidden !important;
	white-space: nowrap !important;
	text-overflow: ellipsis !important;
	pointer-events: none !important;
	color: #0f172a !important;
	-webkit-text-fill-color: #0f172a !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
}

.awti-device-filter-form
.awti-filter-selected-value.is-placeholder {
	color: #64748b !important;
	-webkit-text-fill-color: #64748b !important;
	font-weight: 600 !important;
}


/* =========================================================
   FILTER ACTIONS
   ========================================================= */

.awti-device-filter-actions {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
	flex-wrap: wrap !important;
	gap: 9px !important;
	width: 100% !important;
	grid-column: 1 / -1 !important;
	margin-top: 4px !important;
}

.awti-device-filter-actions
[data-awti-filter-apply] {
	min-height: 40px !important;
	padding: 9px 18px !important;
	border: 0 !important;
	border-radius: 9px !important;
	color: #ffffff !important;
	background: linear-gradient(
		135deg,
		#16a34a,
		#0d9488,
		#2563eb
	) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	cursor: pointer !important;
	box-shadow: 0 5px 15px rgba(37,99,235,.14) !important;
	transition: .2s ease !important;
}

.awti-device-filter-actions
[data-awti-filter-reset] {
	min-height: 40px !important;
	padding: 9px 16px !important;
	border: 1px solid rgba(37,99,235,.16) !important;
	border-radius: 9px !important;
	color: #475569 !important;
	background: #ffffff !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	cursor: pointer !important;
	transition: .2s ease !important;
}

.awti-device-filter-actions
[data-awti-filter-apply]:hover,
.awti-device-filter-actions
[data-awti-filter-reset]:hover {
	transform: translateY(-1px) !important;
}


/* =========================================================
   ADD TO COMPARE — SINGLE ✓ ONLY
   ========================================================= */

.awti-device-compare {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 5px !important;
	min-height: 38px !important;
	padding: 8px 12px !important;
	color: #2563eb !important;
	background: #ffffff !important;
	border: 1px solid rgba(37,99,235,.18) !important;
	border-radius: 9px !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	cursor: pointer !important;
	transition: .2s ease !important;
}

.awti-device-compare:hover {
	transform: translateY(-2px) !important;
	border-color: #60a5fa !important;
	box-shadow: 0 8px 20px rgba(37,99,235,.12) !important;
}

.awti-device-compare.is-added {
	color: #166534 !important;
	background: linear-gradient(
		135deg,
		#dcfce7 0%,
		#f0fdf4 50%,
		#eff6ff 100%
	) !important;
	border-color: #86efac !important;
	box-shadow: 0 5px 16px rgba(22,163,74,.10) !important;
}

/* JS already prints ✓ — CSS must never add another one. */
.awti-device-compare::before,
.awti-device-compare::after,
.awti-device-compare.is-added::before,
.awti-device-compare.is-added::after {
	content: none !important;
	display: none !important;
}


/* =========================================================
   WISHLIST
   ========================================================= */

[data-awti-wishlist] {
	width: 42px !important;
	height: 42px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	color: #64748b !important;
	background: #ffffff !important;
	border: 1px solid rgba(37,99,235,.14) !important;
	border-radius: 50% !important;
	font-size: 21px !important;
	cursor: pointer !important;
	transition: .2s ease !important;
}

[data-awti-wishlist]:hover {
	color: #2563eb !important;
	border-color: #93c5fd !important;
	transform: translateY(-2px) !important;
}

[data-awti-wishlist].is-active {
	color: #ef4444 !important;
	background: #fff1f2 !important;
	border-color: rgba(239,68,68,.25) !important;
}


/* =========================================================
   RESOURCES & LINKS
   ========================================================= */

.awti-device-resources,
.awti-resources,
.awti-resources-section,
.awti-resources-card {
	position: relative !important;
	width: 100% !important;
	margin: 22px 0 !important;
	padding: 18px !important;
	background: linear-gradient(
		135deg,
		#f0fdf4,
		#ffffff 50%,
		#eff6ff
	) !important;
	border: 1px solid rgba(37,99,235,.15) !important;
	border-radius: 14px !important;
	box-shadow: 0 7px 22px rgba(15,23,42,.05) !important;
	overflow: hidden !important;
}

.awti-device-resources a,
.awti-resources a,
.awti-resources-section a,
.awti-resources-card a {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	padding: 8px 12px !important;
	margin: 3px 4px 3px 0 !important;
	color: #2563eb !important;
	background: #ffffff !important;
	border: 1px solid rgba(37,99,235,.14) !important;
	border-radius: 8px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	transition: .2s ease !important;
}

.awti-device-resources a:hover,
.awti-resources a:hover,
.awti-resources-section a:hover,
.awti-resources-card a:hover {
	color: #15803d !important;
	background: #f0fdf4 !important;
	border-color: #86efac !important;
	transform: translateY(-1px) !important;
}


/* =========================================================
   LARGE DESKTOP
   ========================================================= */

@media (min-width: 1100px) {

	.awti-device-filter-form
	[data-awti-filter-panel].is-open {
		grid-template-columns:
			repeat(4, minmax(175px, 1fr)) !important;
		gap: 14px !important;
	}

}


/* =========================================================
   LAPTOP
   ========================================================= */

@media (min-width: 701px)
and (max-width: 1099px) {

	.awti-device-filter-form
	[data-awti-filter-panel].is-open {
		grid-template-columns:
			repeat(2, minmax(180px, 1fr)) !important;
		gap: 12px !important;
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

	.awti-device-filter-form
	[data-awti-filter-panel].is-open {
		grid-template-columns: 1fr !important;
		gap: 9px !important;
	}

	.awti-device-filter-form
	.awti-filter-select-wrap {
		width: 100% !important;
		min-width: 0 !important;
	}

	.awti-device-filter-form select {
		width: 100% !important;
		min-width: 0 !important;
	}

	.awti-device-filter-form
	.awti-filter-selected-value {
		left: 12px !important;
		right: 36px !important;
		max-width: calc(100% - 48px) !important;
	}

	.awti-device-filter-actions {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		width: 100% !important;
	}

	.awti-device-filter-actions button {
		width: 100% !important;
	}

	.awti-device-compare {
		min-height: 36px !important;
		padding: 7px 9px !important;
		font-size: 10px !important;
	}

	.awti-device-resources,
	.awti-resources,
	.awti-resources-section,
	.awti-resources-card {
		padding: 14px !important;
	}

	.awti-device-resources a,
	.awti-resources a,
	.awti-resources-section a,
	.awti-resources-card a {
		width: 100% !important;
		justify-content: center !important;
		margin: 4px 0 !important;
	}

}


/* =========================================================
   VERY SMALL MOBILE
   ========================================================= */

@media (max-width: 380px) {

	.awti-device-filter-actions {
		grid-template-columns: 1fr !important;
	}

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.awti-device-filter-form button:focus,
.awti-device-filter-form select:focus,
.awti-device-compare:focus,
[data-awti-wishlist]:focus,
.awti-device-resources a:focus {
	outline: 2px solid rgba(37,99,235,.40) !important;
	outline-offset: 2px !important;
}

/* =========================================================
   AWTI DEVICES HUB — FINAL FILTER RESPONSIVE FIX
   ========================================================= */

.awti-device-hub
.awti-device-filter-form
.awti-filter-select-wrap {
	position: relative !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

.awti-device-hub
.awti-device-filter-form
.awti-filter-select-wrap select {
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	height: 42px !important;
	box-sizing: border-box !important;

	color: #0f172a !important;
	-webkit-text-fill-color: #0f172a !important;

	background: #fff !important;

	appearance: auto !important;
	-webkit-appearance: auto !important;
}


/* =========================================================
   LAPTOP — 2 COLUMNS
   ========================================================= */

@media (min-width: 701px)
and (max-width: 1099px) {

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		display: grid !important;

		grid-template-columns:
			repeat(2, minmax(0, 1fr)) !important;

		gap: 12px !important;

		width: 100% !important;

		max-width: 100% !important;

		box-sizing: border-box !important;
	}

	.awti-device-hub
	.awti-device-filter-form
	.awti-filter-field {

		width: 100% !important;

		min-width: 0 !important;

		max-width: 100% !important;
	}

	.awti-device-hub
	.awti-device-filter-form
	.awti-filter-select-wrap select {

		width: 100% !important;

		min-width: 0 !important;

		max-width: 100% !important;

		padding-left: 10px !important;

		padding-right: 32px !important;
	}

}


/* =========================================================
   DESKTOP — 4 COLUMNS
   ========================================================= */

@media (min-width: 1100px) {

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		display: grid !important;

		grid-template-columns:
			repeat(4, minmax(0, 1fr)) !important;

		gap: 12px !important;
	}

}


/* =========================================================
   MOBILE — 1 COLUMN
   ========================================================= */

@media (max-width: 700px) {

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		display: grid !important;

		grid-template-columns:
			1fr !important;

		gap: 10px !important;
	}

	.awti-device-hub
	.awti-device-filter-form
	.awti-filter-select-wrap select {

		width: 100% !important;

		min-width: 0 !important;
	}

}

/* =========================================================
   AWTI FILTER BOX — BIGGER SIZE
   ========================================================= */

.awti-device-hub
.awti-device-filter-form
[data-awti-filter-panel].is-open {
	width: 100% !important;
	box-sizing: border-box !important;
}

/* Each filter field */
.awti-device-hub
.awti-device-filter-form
[data-awti-filter-panel].is-open > * {
	min-width: 0 !important;
}

/* Bigger select box */
.awti-device-hub
.awti-device-filter-form
select {
	width: 100% !important;
	height: 50px !important;
	min-height: 50px !important;

	padding: 0 42px 0 16px !important;

	font-size: 15px !important;
	font-weight: 600 !important;

	border-radius: 10px !important;
	box-sizing: border-box !important;
}

/* Laptop */
@media (min-width: 701px) and (max-width: 1099px) {

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		grid-template-columns:
			repeat(2, minmax(0, 1fr)) !important;

		gap: 16px !important;
	}

	.awti-device-hub
	.awti-device-filter-form
	select {
		height: 52px !important;
		min-height: 52px !important;
		font-size: 15px !important;
	}
}

/* Desktop */
@media (min-width: 1100px) {

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		grid-template-columns:
			repeat(4, minmax(180px, 1fr)) !important;

		gap: 16px !important;
	}
}

/* Mobile */
@media (max-width: 700px) {

	.awti-device-hub
	.awti-device-filter-form
	select {
		height: 48px !important;
		min-height: 48px !important;
		font-size: 14px !important;
	}
}

/* =========================================================
   AWTI DEVICE HUB
   FINAL FILTER LAYOUT
   ONE BOX BELOW ANOTHER
   DESKTOP + LAPTOP + MOBILE
   ========================================================= */

/* Filter panel */
.awti-device-hub
.awti-device-filter-form
[data-awti-filter-panel].is-open {

	display: flex !important;

	flex-direction: column !important;

	width: 100% !important;

	max-width: 100% !important;

	gap: 14px !important;

	box-sizing: border-box !important;

}


/* =========================================================
   FILTER FIELD
   ========================================================= */

.awti-device-hub
.awti-device-filter-form
.awti-filter-field {

	display: flex !important;

	flex-direction: column !important;

	width: 100% !important;

	min-width: 0 !important;

	max-width: 100% !important;

	box-sizing: border-box !important;

}


/* Label */
.awti-device-hub
.awti-device-filter-form
.awti-filter-field label {

	display: block !important;

	width: 100% !important;

	margin-bottom: 6px !important;

	font-size: 14px !important;

	font-weight: 700 !important;

	line-height: 1.3 !important;

}


/* =========================================================
   SELECT WRAPPER
   ========================================================= */

.awti-device-hub
.awti-device-filter-form
.awti-filter-select-wrap {

	position: relative !important;

	display: block !important;

	width: 100% !important;

	min-width: 0 !important;

	max-width: 100% !important;

	box-sizing: border-box !important;

}


/* =========================================================
   SELECT BOX
   ========================================================= */

.awti-device-hub
.awti-device-filter-form
.awti-filter-select-wrap
select {

	display: block !important;

	width: 100% !important;

	min-width: 0 !important;

	max-width: 100% !important;

	height: 50px !important;

	min-height: 50px !important;

	box-sizing: border-box !important;

	padding: 0 42px 0 15px !important;

	margin: 0 !important;

	font-size: 15px !important;

	font-weight: 600 !important;

	line-height: 50px !important;

	color: #172033 !important;

	-webkit-text-fill-color: #172033 !important;

	background: #ffffff !important;

	border: 1px solid #d9e2ec !important;

	border-radius: 11px !important;

	opacity: 1 !important;

	visibility: visible !important;

	appearance: auto !important;

	-webkit-appearance: auto !important;

}


/* Focus */
.awti-device-hub
.awti-device-filter-form
.awti-filter-select-wrap
select:focus {

	outline: none !important;

	border-color: #2196f3 !important;

	box-shadow:
	0 0 0 3px
	rgba(33,150,243,.12) !important;

}


/* =========================================================
   APPLY + RESET
   ========================================================= */

.awti-device-hub
.awti-device-filter-form
[data-awti-filter-actions] {

	display: flex !important;

	flex-direction: column !important;

	width: 100% !important;

	gap: 8px !important;

	margin-top: 2px !important;

}


.awti-device-hub
.awti-device-filter-form
[data-awti-filter-apply] {

	width: 100% !important;

	min-height: 48px !important;

	border-radius: 10px !important;

	font-size: 15px !important;

	font-weight: 700 !important;

}


.awti-device-hub
.awti-device-filter-form
[data-awti-filter-reset] {

	width: 100% !important;

	min-height: 42px !important;

	background: transparent !important;

	border: 0 !important;

	font-size: 14px !important;

	font-weight: 600 !important;

	cursor: pointer !important;

}


/* =========================================================
   IMPORTANT
   REMOVE OLD OVERLAY TEXT
   ========================================================= */

.awti-device-hub
.awti-filter-selected-value {

	display: none !important;

}


/* Native select text must remain visible */
.awti-device-hub
.awti-device-filter-form
select {

	color: #172033 !important;

	-webkit-text-fill-color: #172033 !important;

}


/* =========================================================
   LAPTOP
   ========================================================= */

@media (min-width: 701px)
and (max-width: 1099px) {

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		display: flex !important;

		flex-direction: column !important;

		gap: 14px !important;

	}

	.awti-device-hub
	.awti-device-filter-form
	select {

		height: 52px !important;

		min-height: 52px !important;

		font-size: 15px !important;

	}

}


/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width: 1100px) {

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		display: flex !important;

		flex-direction: column !important;

		gap: 15px !important;

	}

	.awti-device-hub
	.awti-device-filter-form
	select {

		height: 52px !important;

		min-height: 52px !important;

	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

	.awti-device-hub
	.awti-device-filter-form
	[data-awti-filter-panel].is-open {

		display: flex !important;

		flex-direction: column !important;

		gap: 11px !important;

	}

	.awti-device-hub
	.awti-device-filter-form
	select {

		height: 48px !important;

		min-height: 48px !important;

		font-size: 14px !important;

	}

}

/* =========================================================
   AWTI DEVICE HUB — GLOBAL BACK BUTTON
   FINAL
   ========================================================= */

.awti-device-hub .awti-device-back-button,
.awti-device-single .awti-device-back-button,
.awti-device-single-page .awti-device-back-button {

	display: inline-flex !important;

	align-items: center !important;

	justify-content: center !important;

	gap: 8px !important;

	width: fit-content !important;

	min-width: 92px !important;

	height: 42px !important;

	margin: 0 0 16px 0 !important;

	padding: 0 16px !important;

	border: 1px solid
		rgba(37,99,235,.18) !important;

	border-radius: 11px !important;

	background:
		linear-gradient(
			135deg,
			#f0fdf4 0%,
			#ffffff 50%,
			#eff6ff 100%
		) !important;

	color: #172033 !important;

	font-size: 14px !important;

	font-weight: 700 !important;

	line-height: 1 !important;

	cursor: pointer !important;

	box-shadow:
		0 5px 16px
		rgba(15,23,42,.07) !important;

	transition:
		transform .2s ease,
		box-shadow .2s ease,
		border-color .2s ease !important;

	box-sizing: border-box !important;

}


.awti-device-hub
.awti-device-back-button
.awti-back-arrow,
.awti-device-single
.awti-device-back-button
.awti-back-arrow,
.awti-device-single-page
.awti-device-back-button
.awti-back-arrow {

	display: inline-block !important;

	font-size: 20px !important;

	font-weight: 800 !important;

	line-height: 1 !important;

	transition:
		transform .2s ease !important;

}


.awti-device-hub
.awti-device-back-button:hover,
.awti-device-single
.awti-device-back-button:hover,
.awti-device-single-page
.awti-device-back-button:hover {

	transform:
		translateX(-2px) !important;

	border-color:
		rgba(37,99,235,.40) !important;

	box-shadow:
		0 8px 22px
		rgba(37,99,235,.12) !important;

}


.awti-device-back-button:hover
.awti-back-arrow {

	transform:
		translateX(-3px) !important;

}


.awti-device-back-button:focus-visible {

	outline:
		3px solid
		rgba(37,99,235,.22) !important;

	outline-offset:
		2px !important;

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.awti-device-hub
	.awti-device-back-button,
	.awti-device-single
	.awti-device-back-button,
	.awti-device-single-page
	.awti-device-back-button {

		min-width: 82px !important;

		height: 40px !important;

		margin-bottom: 12px !important;

		padding: 0 13px !important;

		font-size: 13px !important;

		border-radius: 10px !important;

	}

	.awti-device-back-button
	.awti-back-arrow {

		font-size: 18px !important;

	}

}