/*
 * OpenCart-Lab Theme Stylesheet
 * Replicating opencart-lab.com design
 */

:root {
	--tm-blue: #5777ff;
	--tm-blue-hover: #4361e8;
	--tm-light-blue: #eef2ff;
	--tm-green: #22c55e;
	--tm-slate: #0f1115;
	--tm-border: #d8dce8;
	--tm-bg-subtle: #f7f9fc;
	--tm-rating: #ff9c00;
}

body {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	line-height: 1.6;
	color: #4b5860;
	background-color: var(--tm-bg-subtle);
	width: 100%;
	margin: 0;
	padding: 0;
}

/* Container Width */
@media (min-width: 1200px) {
	.container {
		width: 1170px;
	}
}
@media (min-width: 1460px) {
	.container {
		width: 1400px;
	}
}

a {
	color: var(--tm-slate);
	text-decoration: none;
	transition: color 0.2s ease;
}
a:hover {
	color: var(--tm-blue);
	text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
	color: var(--tm-slate);
	font-family: 'Inter', sans-serif;
}

/* Headings */
.common-home #content h3, 
.product-category #content h1, 
.product-product #content h1 {
	text-align: left;
	font-weight: 700;
	position: relative;
	padding-bottom: 0;
	margin-top: 30px;
	margin-bottom: 20px;
	text-transform: none;
	font-size: 28px;
}

/* Top Black Header */
/* ===== NEW 3-ROW HEADER STYLING ===== */

/* --- Row 1: Header Top Bar (#header-top-bar) --- */
#header-top-bar {
	background-color: #f8fafc;
	border-bottom: 1px solid #e2e8f0;
	padding: 8px 0;
	font-size: 13px;
	color: #64748b;
}
#header-top-bar .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}
.top-bar-left {
	display: flex;
	align-items: center;
	gap: 24px;
}
.top-bar-right {
	display: flex;
	align-items: center;
	gap: 24px;
}
#header-top-bar a.tb-link, 
#header-top-bar .info-dropdown > a {
	color: #475569;
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	transition: color 0.2s ease;
}
#header-top-bar a.tb-link:hover, 
#header-top-bar .info-dropdown > a:hover,
#header-top-bar .info-dropdown.open > a {
	color: var(--tm-blue) !important;
}
#header-top-bar a.tb-link i, 
#header-top-bar .info-dropdown > a i {
	font-size: 14px;
	display: inline-flex;
	align-items: center;
}
.info-dropdown {
	position: relative;
	display: inline-block;
}
.info-dropdown .dropdown-menu {
	margin-top: 8px !important;
}
.theme-toggle i {
	font-size: 16px;
	cursor: pointer;
}

/* --- Row 2: Header Main Row (#header-main-row) --- */
#header-main-row {
	background-color: #ffffff;
	color: #0f172a;
	padding: 16px 0;
	min-height: 83px;
	border-bottom: 1px solid #f1f5f9;
	position: relative;
	z-index: 1050;
}
@media (min-width: 768px) {
	#header-main-row .row.header {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		min-height: 83px;
	}
	#header-main-row .row.header::before,
	#header-main-row .row.header::after {
		display: none !important;
		content: none !important;
	}
	#header-main-row .row.header .header_col_logo {
		flex: 0 0 auto !important;
		width: auto !important;
	}
	#header-main-row .row.header .header_col_catalog {
		flex: 0 0 auto !important;
		width: auto !important;
		padding-left: 15px !important;
		padding-right: 15px !important;
	}
	#header-main-row .row.header .header_col_search {
		flex: 1 1 auto !important;
		width: auto !important;
		margin: 0 30px !important;
	}
	#header-main-row .row.header .header_col_cart {
		flex: 0 0 auto !important;
		width: auto !important;
	}
}
.header_col_logo {
	display: flex;
	align-items: center;
}
.header_col_logo .logo img {
	max-height: 58px !important;
	display: block;
}
.header_col_logo .logo-text {
	font-size: 24px;
	font-weight: bold;
	letter-spacing: 1px;
	color: #0f172a;
	line-height: 1.1;
	text-decoration: none;
}
.header_col_logo .logo-subtext {
	font-size: 11px;
	color: #64748b;
	margin-left: 12px;
}
.header_col_catalog {
	padding-left: 8px !important;
	padding-right: 8px !important;
}
.header_col_search {
	padding-left: 15px !important;
	padding-right: 15px !important;
}
.header_col_cart {
	text-align: right;
}

/* Form alignment */
#form-currency, #form-language {
	display: inline-block !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Dropdown triggers / text links inside top bar & main header row */
#header-top-bar .btn-link,
#header-top-bar .dropdown-toggle,
#header-main-row .btn-link,
#header-main-row .dropdown-toggle,
.mob-panel-language-currency .btn-link,
.mob-panel-language-currency .dropdown-toggle {
	color: #475569 !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	text-decoration: none !important;
	background: transparent !important;
	border: none !important;
	padding: 4px 8px !important;
	height: auto !important;
	line-height: 1.5 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	text-shadow: none !important;
	box-shadow: none !important;
	transition: color 0.2s !important;
}
#header-top-bar .btn-link:hover,
#header-top-bar .dropdown-toggle:hover,
#header-main-row .btn-link:hover,
#header-main-row .dropdown-toggle:hover,
.mob-panel-language-currency .btn-link:hover,
.mob-panel-language-currency .dropdown-toggle:hover {
	color: var(--tm-blue) !important;
}

/* Hide active lang/currency text labels on desktop */
#header-top-bar .active-lang-name,
#header-top-bar .active-curr-name,
#header-main-row .active-lang-name,
#header-main-row .active-curr-name {
	display: none !important;
}

/* Dropdown menus styling */
#header-top-bar .dropdown-menu,
#header-main-row .dropdown-menu,
.mob-panel-language-currency .dropdown-menu {
	background-color: #ffffff !important;
	border: 1px solid #e2e2e2 !important;
	border-radius: 4px !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
	padding: 5px 0 !important;
	min-width: 150px !important;
	list-style: none !important;
	list-style-type: none !important;
	margin-top: 5px !important;
	position: absolute !important;
	z-index: 1050 !important;
}
#header-top-bar .dropdown-menu li,
#header-main-row .dropdown-menu li,
.mob-panel-language-currency .dropdown-menu li {
	list-style: none !important;
	list-style-type: none !important;
	padding: 0 !important;
	margin: 0 !important;
}
#header-top-bar .dropdown-menu a,
#header-top-bar .dropdown-menu button,
#header-top-bar .dropdown-menu .currency-select,
#header-top-bar .dropdown-menu .language-select,
#header-main-row .dropdown-menu a,
#header-main-row .dropdown-menu button,
#header-main-row .dropdown-menu .currency-select,
#header-main-row .dropdown-menu .language-select,
.mob-panel-language-currency .dropdown-menu a,
.mob-panel-language-currency .dropdown-menu button,
.mob-panel-language-currency .dropdown-menu .currency-select,
.mob-panel-language-currency .dropdown-menu .language-select {
	color: #333333 !important;
	display: block !important;
	width: 100% !important;
	padding: 8px 15px !important;
	clear: both !important;
	font-weight: normal !important;
	line-height: 1.42857143 !important;
	text-align: left !important;
	white-space: nowrap !important;
	border: none !important;
	background: transparent !important;
	font-size: 13px !important;
	transition: background-color 0.2s, color 0.2s !important;
	text-shadow: none !important;
	box-shadow: none !important;
	text-decoration: none !important;
}
#header-top-bar .dropdown-menu a:hover,
#header-top-bar .dropdown-menu button:hover,
#header-top-bar .dropdown-menu .currency-select:hover,
#header-top-bar .dropdown-menu .language-select:hover,
#header-main-row .dropdown-menu a:hover,
#header-main-row .dropdown-menu button:hover,
#header-main-row .dropdown-menu .currency-select:hover,
#header-main-row .dropdown-menu .language-select:hover,
.mob-panel-language-currency .dropdown-menu a:hover,
.mob-panel-language-currency .dropdown-menu button:hover,
.mob-panel-language-currency .dropdown-menu .currency-select:hover,
.mob-panel-language-currency .dropdown-menu .language-select:hover {
	background-color: #f1f5f9 !important;
	color: #0f172a !important;
	text-decoration: none !important;
}

/* Cart Button on Light Background */
#cart {
	width: auto;
	display: inline-block;
}
#cart > .btn.mini_cart {
	background-color: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 12px !important;
	color: #0f172a !important;
	padding: 0 20px !important;
	height: 52px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 14px !important;
	text-shadow: none !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
	transition: all 0.2s ease !important;
	box-sizing: border-box !important;
	width: auto !important;
}
#cart > .btn.mini_cart:hover {
	background-color: #ffffff !important;
	border-color: var(--tm-blue) !important;
	color: var(--tm-blue) !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.1) !important;
}
.cart-icon-wrap {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}
.cart-icon-wrap i {
	font-size: 26px !important;
	color: var(--tm-blue) !important;
	transition: color 0.2s ease;
}
.cart-badge {
	position: absolute;
	top: -4px;
	right: -8px;
	background-color: #3b82f6;
	color: #ffffff;
	font-size: 10px;
	font-weight: 700;
	min-width: 16px;
	height: 16px;
	line-height: 16px;
	text-align: center;
	border-radius: 50%;
	padding: 0 4px;
	box-shadow: 0 0 0 2px #ffffff;
}
.cart-text-wrap {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	line-height: 1.2;
}
.cart-title {
	font-size: 12px !important;
	color: #64748b;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 4px;
}
.cart-title i {
	font-size: 9px !important;
	color: #64748b;
}
.cart-total {
	font-size: 15px !important;
	font-weight: 700;
	color: #0f172a;
}
#cart > .btn.mini_cart:hover .cart-title,
#cart > .btn.mini_cart:hover .cart-title i {
	color: var(--tm-blue) !important;
}
#cart .dropdown-menu {
	background: #ffffff !important;
	border: none !important;
	border-radius: 8px !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15) !important;
	color: #333333 !important;
	min-width: 380px !important;
	padding: 15px !important;
	border-top: 3px solid var(--tm-blue) !important;
	list-style: none !important;
	list-style-type: none !important;
	margin-top: 10px !important;
}


/* --- Row 3: Category Bar (#menu-row-wrapper) --- */
#menu-row-wrapper {
	background-color: #ffffff;
	min-height: 46px;
	border-bottom: 1px solid #e2e8f0;
	margin-bottom: 20px;
}
#menu-row-wrapper .container {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 20px;
}
.menu-left-col {
	flex-grow: 1;
	display: flex;
	align-items: center;
}
.menu-right-col {
	display: none;
}

/* Search bar styling inside Row 2 */
/* Search bar styling inside Row 2 */
.search_wrapper {
	position: relative;
	background-color: #ffffff !important;
	border-radius: 25px !important;
	padding: 0 50px 0 0 !important;
	border: 2px solid #e2e8f0 !important;
	transition: all 0.2s ease;
	height: 48px !important;
	display: flex;
	align-items: center;
	width: 100%;
	box-sizing: border-box;
}
.search_wrapper:focus-within {
	background-color: #ffffff !important;
	border-color: var(--tm-blue) !important;
	box-shadow: 0 0 0 3px rgba(87, 119, 255, 0.15) !important;
}
.search_wrapper #search {
	flex-grow: 1;
	display: flex;
	align-items: center;
	height: 100%;
}
.search_wrapper .search_input {
	width: 100%;
	height: 40px !important;
	border: none !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 16px !important;
	font-size: 14px;
	color: #0f172a;
	outline: none !important;
}
.search_wrapper .button-search {
	position: absolute;
	right: -2px;
	top: -2px;
	bottom: -2px;
	width: 50px;
	height: 48px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 0 25px 25px 0 !important;
	background-color: #cbd5e1 !important;
	color: #475569 !important;
	cursor: pointer;
	font-size: 18px;
	transition: all 0.2s ease;
	box-sizing: border-box;
	border: 2px solid #cbd5e1;
	z-index: 2;
}
.search_wrapper:focus-within .button-search {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
	border-color: var(--tm-blue) !important;
}
.search_wrapper .button-search:hover {
	background-color: var(--tm-blue-hover) !important;
	color: #ffffff !important;
	border-color: var(--tm-blue-hover) !important;
}

/* Popular searches tags below search */
.header_col_search {
	position: relative !important;
}
/* Popular searches tags below search */
.search_message {
	font-size: 12px;
	color: #64748b;
	position: absolute !important;
	left: 15px !important;
	bottom: -22px !important;
	margin: 0 !important;
	white-space: nowrap !important;
}
.search_message span {
	font-weight: 500;
	color: #94a3b8;
}
.search_message .search-link {
	color: #64748b;
	cursor: pointer;
	text-decoration: none;
	border-bottom: 1px dashed #cbd5e1;
	transition: all 0.15s ease;
	display: inline-block;
}
.search_message .search-link:hover {
	color: var(--tm-blue);
	border-bottom-color: var(--tm-blue);
}

#cart .dropdown-menu li {
	list-style: none !important;
	list-style-type: none !important;
}
#cart .dropdown-menu table {
	width: 100% !important;
	border-collapse: collapse !important;
	margin-bottom: 12px !important;
	border: none !important;
}
#cart .dropdown-menu table td {
	padding: 8px !important;
	vertical-align: middle !important;
	border-top: 1px solid #f1f1f1 !important;
	border-bottom: none !important;
	border-left: none !important;
	border-right: none !important;
}
#cart .dropdown-menu table tr:first-child td {
	border-top: none !important;
}
#cart .dropdown-menu .table-striped > tbody > tr:nth-of-type(odd) {
	background-color: transparent !important;
}
#cart .dropdown-menu a:hover {
	color: var(--tm-blue) !important;
}
#cart .dropdown-menu .img-thumbnail {
	border: 1px solid #e2e2e2 !important;
	border-radius: 4px !important;
	max-width: 50px !important;
	padding: 2px !important;
}
#cart .dropdown-menu .btn-danger {
	background-color: #ff4d4d !important;
	border: none !important;
	color: #ffffff !important;
	border-radius: 50% !important;
	width: 22px !important;
	height: 22px !important;
	padding: 0 !important;
	line-height: 22px !important;
	text-align: center !important;
	font-size: 10px !important;
	transition: background-color 0.2s !important;
	display: inline-block !important;
}
#cart .dropdown-menu .btn-danger:hover {
	background-color: #e60000 !important;
}
/* Total table styles */
#cart .dropdown-menu table.table-bordered {
	border: none !important;
	margin-top: 10px !important;
	background-color: #fafafa !important;
	border-radius: 6px !important;
}
#cart .dropdown-menu table.table-bordered td {
	border: none !important;
	padding: 6px 12px !important;
	font-size: 13px !important;
}
#cart .dropdown-menu table.table-bordered tr:last-child td {
	font-size: 15px !important;
	font-weight: bold !important;
	color: #0f172a !important;
	border-top: 1px solid #eeeeee !important;
}
/* Buttons at the bottom of dropdown */
#cart .dropdown-menu p.text-right {
	margin-top: 15px !important;
	margin-bottom: 0 !important;
	display: flex !important;
	justify-content: space-between !important;
	gap: 10px !important;
}
#cart .dropdown-menu p.text-right a {
	flex: 1 !important;
	text-align: center !important;
	padding: 8px 12px !important;
	border-radius: 4px !important;
	font-size: 13px !important;
	font-weight: bold !important;
	text-transform: uppercase !important;
	transition: all 0.2s !important;
	display: block !important;
}
#cart .dropdown-menu p.text-right a:first-child {
	background-color: #f1f1f1 !important;
	color: #333 !important;
	border: 1px solid #e2e2e2 !important;
}
#cart .dropdown-menu p.text-right a:first-child:hover {
	background-color: #e2e2e2 !important;
}
#cart .dropdown-menu p.text-right a:last-child {
	background-color: #0f172a !important;
	color: #fff !important;
	border: 1px solid #0f172a !important;
}
#cart .dropdown-menu p.text-right a:last-child:hover {
	background-color: var(--tm-blue) !important;
	border-color: var(--tm-blue) !important;
}

#header-main-row .container {
	position: relative !important;
}
.header_col_catalog {
	position: static !important;
}
#menu {
	background: transparent;
	border: none;
	margin-bottom: 0;
	min-height: auto;
	width: 100% !important;
	position: static !important;
}
@media (min-width: 768px) {
	#menu .navbar-collapse {
		padding: 0;
		display: block !important;
		width: 100% !important;
		position: static !important;
	}
	#menu .nav {
		display: block !important;
		margin: 0;
		padding: 0;
		list-style: none;
		width: 100% !important;
		position: static !important;
	}
	#menu .nav > li {
		flex: 0 0 auto;
		display: flex;
		align-items: center;
	}
	#menu .nav > li.catalog-item {
		position: static !important;
		width: 100% !important;
		display: block !important;
		float: none !important;
	}
	#menu .nav > li.dropdown:hover > .dropdown-menu,
	#menu .nav > li.dropdown.open > .dropdown-menu {
		display: block !important;
	}
}
#menu .nav > li > a {
	color: #334155;
	text-shadow: none;
	padding: 10px 15px;
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	height: 100%;
	width: auto;
	box-sizing: border-box;
}
#menu .nav > li > a:hover, 
#menu .nav > li.open > a,
#menu .nav > li.active > a {
	background-color: #f1f5f9;
	color: var(--tm-blue);
}
#menu .nav > li.catalog-item > a {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
	border-radius: 8px !important;
	padding: 0 20px !important;
	font-weight: 600 !important;
	font-size: 16px !important;
	text-transform: none !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	transition: all 0.2s ease !important;
	border: none !important;
	text-shadow: none !important;
	height: 48px !important;
	width: 100% !important;
	box-sizing: border-box !important;
}
#menu .nav > li.catalog-item > a:hover,
#menu .nav > li.catalog-item.open > a {
	background-color: var(--tm-blue-hover) !important;
	color: #ffffff !important;
}
#menu .nav > li.catalog-item > a .fa-th {
	font-size: 16px !important;
}
#menu .dropdown-menu {
	display: none;
	background-color: #ffffff;
	border-top: 3px solid var(--tm-blue);
	box-shadow: 0 10px 25px rgba(0,0,0,0.1);
	z-index: 99999 !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	padding: 24px !important;
	border-radius: 0 0 12px 12px !important;
	border: 1px solid #e2e8f0;
	border-top: 3px solid var(--tm-blue);
	top: 100% !important;
}
#menu .dropdown-menu::before {
	content: '';
	position: absolute;
	top: -40px;
	left: 0;
	right: 0;
	height: 40px;
	background: transparent;
}
#menu .dropdown-inner {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 24px !important;
}
#menu .menu-column {
	flex: 1 1 200px !important;
	margin-bottom: 0 !important;
	list-style: none !important;
	padding: 0 !important;
}
#menu .menu-column .hsubmenu {
	font-size: 14px !important;
	font-weight: 700 !important;
	color: var(--tm-slate) !important;
	margin-bottom: 12px !important;
	padding-bottom: 6px !important;
	border-bottom: 1px solid #f1f5f9 !important;
	list-style: none !important;
}
#menu .menu-column .hsubmenu a {
	color: var(--tm-slate) !important;
	font-weight: 700 !important;
}
#menu .menu-column .hsubmenu a:hover {
	color: var(--tm-blue) !important;
}
#menu .menu-column li:not(.hsubmenu) {
	margin-bottom: 8px !important;
	list-style: none !important;
}
#menu .menu-column li:not(.hsubmenu) a {
	font-size: 13px !important;
	color: #64748b !important;
	transition: color 0.2s ease !important;
	font-weight: normal !important;
	text-transform: none !important;
}
#menu .menu-column li:not(.hsubmenu) a:hover {
	color: var(--tm-blue) !important;
	text-decoration: none !important;
}

/* Dark Theme Overrides for default menu */
body.dark-theme #menu .dropdown-menu {
	background-color: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme #menu .menu-column .hsubmenu {
	border-bottom-color: #334155 !important;
}
body.dark-theme #menu .menu-column .hsubmenu a {
	color: #ffffff !important;
}
body.dark-theme #menu .menu-column li:not(.hsubmenu) a {
	color: #cbd5e1 !important;
}
body.dark-theme #menu .menu-column li:not(.hsubmenu) a:hover {
	color: var(--tm-blue) !important;
}


/* Custom Search inside Menu bar (aligned right) */
.menu-search-box {
	display: flex;
	align-items: center;
	padding-right: 15px;
}

/* Breadcrumb Styling */
.breadcrumb {
	background-color: #ffffff;
	border: 1px solid #e2e2e2;
	border-radius: 4px;
	padding: 10px 15px;
	margin-bottom: 25px;
}
.breadcrumb > li {
	text-shadow: none;
}
.breadcrumb > li a {
	color: #666;
}
.breadcrumb > li a:hover {
	color: #ffb700;
}

/* Main Content Area */
#content {
	background-color: #ffffff;
	padding: 20px !important;
	border-radius: 6px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.05);
	min-height: 500px;
}
@media (max-width: 767px) {
	#content {
		padding: 12px !important;
	}
}

/* Product Cards */
.product-layout {
	margin-bottom: 25px;
}
.product-thumb {
	background-color: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: 8px;
	padding: 0;
	margin-bottom: 0;
	text-align: left;
	display: flex;
	flex-direction: column;
	transition: border-color 0.25s ease, box-shadow 0.25s ease;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
	overflow: hidden;
}

/* Product Cards - Grid View */
.product-layout:not(.product-list) .product-thumb {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.product-layout:not(.product-list) .product-thumb > div:last-child {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	justify-content: space-between;
}
.product-layout:not(.product-list) .product-thumb .caption {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

/* Product Cards - List View */
.product-list .product-thumb {
	display: flex;
	flex-direction: row;
	align-items: center;
	text-align: left;
}
.product-list .product-thumb .image {
	flex-shrink: 0;
	margin-bottom: 0;
	margin-right: 20px;
}
.product-list .product-thumb > div:last-child {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

@media (max-width: 767px) {
	.product-list .product-thumb {
		flex-direction: column;
		text-align: center;
	}
	.product-list .product-thumb .image {
		margin-right: 0;
		margin-bottom: 15px;
	}
}
.product-thumb:hover {
	box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
	border-color: #cbd5e1;
}
.product-thumb .image {
	padding: 0;
	margin-bottom: 0;
	background-color: #ffffff;
	height: 200px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: 1px solid var(--tm-border);
	border-radius: 8px 8px 0 0;
	overflow: hidden;
}
.product-thumb .image a {
	display: block;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.product-thumb .image img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	margin: 0 auto;
	transition: transform 0.3s ease;
}
.product-thumb:hover .image img {
	transform: scale(1.05);
}
.product-thumb .caption {
	padding: 16px;
	min-height: auto;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: 6px;
}
.rating {
	display: flex;
	align-items: center;
	gap: 2px;
	margin: 4px 0;
	min-height: 18px;
}
.rating .fa-stack {
	width: 13px !important;
	height: 13px !important;
	line-height: 13px !important;
	font-size: 13px !important;
	display: inline-block !important;
	position: relative !important;
	margin: 0 !important;
}
.rating .fa-stack i {
	font-size: 13px !important;
	width: 13px !important;
	height: 13px !important;
	line-height: 13px !important;
	position: absolute !important;
	left: 0 !important;
	top: 0 !important;
	text-align: center !important;
}
.rating .fa-star {
	color: var(--tm-rating) !important;
}
.rating .fa-star-o {
	color: #cbd5e1 !important;
}
.author-label {
	font-size: 11px;
	color: #748e9a;
	font-weight: 500;
	text-transform: none;
	display: block;
}
.product-thumb h4 {
	font-size: 15px;
	font-weight: 600;
	margin: 2px 0 0 0;
	line-height: 1.4;
	min-height: auto;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-align: left;
}
.product-thumb h4 a {
	color: var(--tm-slate);
}
.product-thumb h4 a:hover {
	color: var(--tm-blue);
}
/* Truncate / hide descriptions based on layout */
.product-layout:not(.product-list) .product-thumb .caption p:not(.price) {
	display: none !important;
}
.product-list .product-thumb .caption p:not(.price) {
	display: -webkit-box !important;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-bottom: 15px;
	font-size: 13px;
	color: #666666;
	line-height: 1.5;
	text-align: left;
}
.product-thumb .price {
	font-size: 18px !important;
	font-weight: 700 !important;
	color: var(--tm-slate) !important;
	margin-bottom: 0 !important;
}
.product-thumb .price-new {
	color: #ef4444 !important;
	font-weight: 700 !important;
}
.product-thumb .price-old {
	color: #9ca3af !important;
	text-decoration: line-through !important;
	font-size: 13px !important;
	margin-left: 6px !important;
}
.product-thumb .price-tax {
	display: block;
	font-size: 11px;
	color: #888888;
	font-weight: normal;
}

/* Buy buttons and Price alignment */
.product-thumb .button-group {
	border-top: 1px solid var(--tm-border) !important;
	background-color: transparent !important;
	margin-top: auto !important;
	padding: 12px 16px !important;
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 10px !important;
	width: 100% !important;
}
.product-thumb .button-group .price-box {
	text-align: left !important;
	flex-grow: 1 !important;
	min-width: 0 !important;
}
.product-thumb .button-group .price-box .price {
	margin-bottom: 0 !important;
	text-align: left !important;
}
.product-thumb .button-group button {
	width: auto !important;
	height: 38px !important;
	padding: 0 16px !important;
	border-radius: 8px !important;
	background-color: #f1f5f9 !important;
	color: var(--tm-slate) !important;
	border: 1px solid #cbd5e1 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	transition: all 0.2s ease !important;
	cursor: pointer !important;
	flex-shrink: 0 !important;
	font-weight: 600 !important;
	font-size: 13px !important;
}
.product-thumb .button-group button:hover {
	background-color: var(--tm-blue) !important;
	border-color: var(--tm-blue) !important;
	color: #ffffff !important;
}
/* Hide Wishlist and Compare in grid */
.product-thumb .button-group button + button {
	display: none !important;
}

/* Review Blocks */
.review-box {
	background-color: #f8fafc;
	border-radius: 6px;
	padding: 15px 20px;
	margin-bottom: 20px;
	border-left: 4px solid #cbd5e1;
	font-style: italic;
	color: #475569;
}
.review-author {
	font-weight: bold;
	margin-top: 10px;
	font-style: normal;
	font-size: 13px;
}

/* Dark Contact Block Above Footer */
.before-footer-bar {
	background-color: #171b23;
	color: #b8bfcf;
	padding: 25px 0;
	font-weight: 600;
	border-top: 1px solid #2a3040;
	border-bottom: 1px solid #2a3040;
}
.before-footer-bar .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
}
.before-footer-item {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 15px;
}
.before-footer-item i {
	font-size: 24px;
	color: var(--tm-blue);
}
.before-footer-item a {
	color: #b8bfcf;
	text-decoration: none;
}
.before-footer-item a:hover {
	color: var(--tm-blue);
}
.payment-icons {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.payment-icons .we-accept-text {
	font-size: 14px;
	color: #b8bfcf;
	margin-right: 4px;
	font-weight: bold;
}
.payment-icons .footer-pay-badge {
	display: inline-block;
	background: #232834;
	border: 1px solid #2a3040;
	border-radius: 4px;
	padding: 4px 10px;
	font-size: 11px;
	font-weight: bold;
	color: #b8bfcf;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* Dark Footer */
footer {
	background-color: var(--tm-slate);
	color: #b8bfcf;
	padding: 40px 0 20px 0;
	margin-top: 0;
	border-top: 1px solid #1c202a;
}
footer h5 {
	color: #ffffff;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 20px;
	padding-bottom: 0;
	letter-spacing: 0.05em;
}
footer a {
	color: #b8bfcf;
}
footer a:hover {
	color: var(--tm-blue);
	text-decoration: none;
}
footer hr {
	border-top: none;
	border-bottom: 1px solid #2a3040;
	margin: 30px 0 20px 0;
}
footer .footer-bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 15px;
	color: #8b94a8;
	font-size: 13px;
}
footer .footer-logo {
	font-size: 20px;
	font-weight: bold;
	color: #ffffff;
}

@media (max-width: 767px) {
	footer .row {
		display: flex;
		flex-wrap: wrap;
	}
	footer .row > div {
		margin-bottom: 25px;
	}
}

/* Buttons overriding bootstrap */
.btn-primary {
	background-color: var(--tm-slate);
	border-color: var(--tm-slate);
	color: #ffffff;
	font-weight: bold;
	border-radius: 4px;
	transition: all 0.2s;
}
.btn-primary:hover, 
.btn-primary:active, 
.btn-primary:focus {
	background-color: var(--tm-blue);
	border-color: var(--tm-blue);
	color: #ffffff;
}

/* Carousel and Slideshow customization */
.swiper-viewport {
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 4px 10px rgba(0,0,0,0.05);
	margin-bottom: 30px;
}

/* ===== Мегаменю каталогу — розмір та сітка колонок ===== */
#menu .catalog-item .dropdown-menu {
	padding: 0 !important;
	font-size: 13px !important;
	border-radius: 8px !important;
	overflow: visible !important;
	border: 1px solid #cbd5e1 !important;
	border-top: 3px solid var(--tm-blue) !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
	position: absolute !important;
	left: 15px !important;
	right: 15px !important;
	width: calc(100% - 30px) !important;
	margin-left: 0px !important; /* Блокуємо від'ємне зміщення від common.js */
	box-sizing: border-box !important;
	z-index: 1000 !important;
	margin-top: 10px !important;
}
#menu .catalog-item .dropdown-menu::before {
	content: '' !important;
	position: absolute !important;
	top: -35px !important; /* Збільшуємо висоту моста, щоб перекрити проміжок */
	left: 0 !important;
	right: 0 !important;
	height: 35px !important;
	background: transparent !important;
}
#menu .catalog-item .dropdown-menu.cols-1,
#menu .catalog-item .dropdown-menu.cols-2,
#menu .catalog-item .dropdown-menu.cols-3,
#menu .catalog-item .dropdown-menu.cols-4,
#menu .catalog-item .dropdown-menu.cols-5,
#menu .catalog-item .dropdown-menu.cols-6 {
	width: calc(100% - 30px) !important;
}

#menu .catalog-item .dropdown-inner.hidden-xs {
	display: grid !important;
	grid-template-columns: repeat(5, 1fr) !important;
	gap: 20px !important;
	padding: 24px !important;
	background-color: #ffffff !important;
	align-items: start !important;
	max-height: calc(100vh - 180px) !important; /* Обмежуємо висоту мегаменю на десктопах */
	overflow-y: auto !important; /* Додаємо внутрішній скролбар */
}

/* Примусово приховуємо другу структуру для мобільних */
#menu .catalog-item .dropdown-inner:not(.hidden-xs) {
	display: none !important;
}

/* Стильний скролбар для мегаменю */
#menu .catalog-item .dropdown-inner.hidden-xs::-webkit-scrollbar {
	width: 6px;
}
#menu .catalog-item .dropdown-inner.hidden-xs::-webkit-scrollbar-track {
	background: #f1f5f9;
	border-radius: 3px;
}
#menu .catalog-item .dropdown-inner.hidden-xs::-webkit-scrollbar-thumb {
	background: #cbd5e1;
	border-radius: 3px;
	transition: background 0.2s;
}
#menu .catalog-item .dropdown-inner.hidden-xs::-webkit-scrollbar-thumb:hover {
	background: var(--tm-blue);
}
#menu .catalog-item .dropdown-menu.cols-1 .dropdown-inner.hidden-xs { grid-template-columns: repeat(1, 1fr) !important; }
#menu .catalog-item .dropdown-menu.cols-2 .dropdown-inner.hidden-xs { grid-template-columns: repeat(2, 1fr) !important; }
#menu .catalog-item .dropdown-menu.cols-3 .dropdown-inner.hidden-xs { grid-template-columns: repeat(3, 1fr) !important; }
#menu .catalog-item .dropdown-menu.cols-4 .dropdown-inner.hidden-xs { grid-template-columns: repeat(4, 1fr) !important; }
#menu .catalog-item .dropdown-menu.cols-5 .dropdown-inner.hidden-xs { grid-template-columns: repeat(5, 1fr) !important; }
#menu .catalog-item .dropdown-menu.cols-6 .dropdown-inner.hidden-xs { grid-template-columns: repeat(6, 1fr) !important; }

@media (max-width: 1199px) {
	#menu .catalog-item .dropdown-menu,
	#menu .catalog-item .dropdown-menu.cols-2,
	#menu .catalog-item .dropdown-menu.cols-3,
	#menu .catalog-item .dropdown-menu.cols-4,
	#menu .catalog-item .dropdown-menu.cols-5,
	#menu .catalog-item .dropdown-menu.cols-6 {
		width: calc(100% - 30px) !important;
	}
	#menu .catalog-item .dropdown-inner.hidden-xs {
		grid-template-columns: repeat(3, 1fr) !important;
		gap: 14px !important;
		padding: 16px !important;
	}
	#menu .catalog-item .dropdown-menu.cols-1 .dropdown-inner.hidden-xs { grid-template-columns: repeat(1, 1fr) !important; }
	#menu .catalog-item .dropdown-menu.cols-2 .dropdown-inner.hidden-xs { grid-template-columns: repeat(2, 1fr) !important; }
	#menu .catalog-item .dropdown-menu.cols-3 .dropdown-inner.hidden-xs { grid-template-columns: repeat(3, 1fr) !important; }
	#menu .catalog-item .dropdown-menu.cols-4 .dropdown-inner.hidden-xs { grid-template-columns: repeat(3, 1fr) !important; }
	#menu .catalog-item .dropdown-menu.cols-5 .dropdown-inner.hidden-xs { grid-template-columns: repeat(3, 1fr) !important; }
	#menu .catalog-item .dropdown-menu.cols-6 .dropdown-inner.hidden-xs { grid-template-columns: repeat(3, 1fr) !important; }
}

@media (max-width: 991px) {
	#menu .catalog-item .dropdown-menu {
		width: 100%;
		position: static !important;
		float: none;
		box-shadow: none;
		border: none;
		border-top: 1px solid var(--tm-border);
	}
	#menu .catalog-item .dropdown-inner.hidden-xs {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
		padding: 14px;
		max-height: none !important; /* Вимикаємо обмеження висоти на мобільних пристроях */
		overflow-y: visible !important; /* Повністю розгортаємо меню */
	}
	#menu .catalog-item .dropdown-menu.cols-2 .dropdown-inner.hidden-xs,
	#menu .catalog-item .dropdown-menu.cols-3 .dropdown-inner.hidden-xs,
	#menu .catalog-item .dropdown-menu.cols-4 .dropdown-inner.hidden-xs { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	#menu .catalog-item .dropdown-inner.hidden-xs,
	#menu .catalog-item .dropdown-menu.cols-2 .dropdown-inner.hidden-xs,
	#menu .catalog-item .dropdown-menu.cols-3 .dropdown-inner.hidden-xs,
	#menu .catalog-item .dropdown-menu.cols-4 .dropdown-inner.hidden-xs { grid-template-columns: 1fr !important; }
}
#menu .dropdown-menu .see-all {
	display: block;
	padding: 12px 24px;
	background-color: var(--tm-bg-subtle);
	color: var(--tm-blue);
	font-weight: 600;
	font-size: 13px;
	text-align: center;
	border-top: 1px solid var(--tm-border);
	transition: all 0.2s ease;
	border-radius: 0 0 8px 8px !important;
}
#menu .dropdown-menu .see-all:hover {
	background-color: #f0f4ff;
	color: var(--tm-blue);
	text-decoration: none;
}

@media (min-width: 768px) {
	#content .row {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#content .row:before,
	#content .row:after {
		display: none;
	}
}

/* Responsive adjustments */
@media (max-width: 991px) {
	#header-main-row .container {
		flex-wrap: wrap !important;
		justify-content: space-between !important;
		gap: 15px !important;
	}
	.main-logo-col {
		order: 1 !important;
	}
	.main-cart-wrapper {
		order: 2 !important;
	}
	.main-search-col {
		order: 3 !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 10px 0 0 0 !important;
	}

	#menu-row-wrapper .container {
		flex-direction: row !important;
		justify-content: center !important;
	}
	#menu .navbar-collapse {
		display: flex !important;
		justify-content: center !important;
		width: 100% !important;
		padding: 0 !important;
	}
	#menu .nav {
		flex-direction: row !important;
		flex-wrap: wrap !important;
		justify-content: center !important;
		gap: 5px !important;
	}
	#menu .nav > li > a {
		padding: 8px 12px !important;
		font-size: 13px !important;
	}
	.menu-search-box {
		display: none !important;
	}
	.before-footer-bar .container {
		flex-direction: column;
		text-align: center;
	}
	.before-footer-item {
		flex-direction: column;
		gap: 5px;
	}
}

/* Login & Register Pages Custom Styling */
.login-wrapper {
	max-width: 500px;
	margin: 50px auto;
	background: #ffffff;
	padding: 40px;
	border-radius: 12px;
	border: 1px solid var(--tm-border);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
}
.login-title {
	text-align: center;
	font-size: 26px;
	font-weight: 700;
	margin-bottom: 30px;
	color: var(--tm-slate);
}
.login-form .form-group {
	margin-bottom: 20px;
}
.login-form .form-control {
	height: 42px;
	font-size: 14px;
	border-radius: 8px;
	border: 1px solid #cbd5e1;
	box-shadow: none;
	transition: all 0.2s ease;
	color: var(--tm-slate);
}
.login-form .form-control:focus {
	border-color: var(--tm-blue);
	box-shadow: 0 0 0 3px rgba(0, 154, 218, 0.1);
	outline: none;
}
.login-form .control-label {
	font-weight: 600;
	margin-bottom: 8px;
	color: var(--tm-slate);
	font-size: 13px;
}
.forgotten-link-wrapper {
	margin-top: 8px;
}
.forgotten-link-wrapper a, .register-link {
	color: var(--tm-blue);
	font-size: 13px;
	text-decoration: none;
	font-weight: 500;
}
.forgotten-link-wrapper a:hover, .register-link:hover {
	text-decoration: underline;
	color: #0081b7;
}
.login-actions {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 25px;
}
.btn-login-submit {
	height: 42px;
	padding: 0 24px;
	border: none;
	border-radius: 8px !important;
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	cursor: pointer;
	transition: all 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-shadow: 0 2px 4px rgba(0, 154, 218, 0.1) !important;
}
.btn-login-submit:hover {
	background-color: #0081b7 !important;
	box-shadow: 0 4px 8px rgba(0, 154, 218, 0.2) !important;
}

/* Account Register Layout Polishing */
#account-register #content {
	background-color: #ffffff;
	padding: 40px;
	border-radius: 12px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
	border: 1px solid var(--tm-border);
	margin-bottom: 30px;
}
#account-register h1 {
	font-size: 26px;
	font-weight: 700;
	color: var(--tm-slate);
	margin-top: 0;
	margin-bottom: 25px;
	border-bottom: 1px solid #f1f5f9;
	padding-bottom: 12px;
}
#account-register fieldset legend {
	font-size: 16px;
	font-weight: 700;
	color: var(--tm-slate);
	border-bottom: 1px solid #f1f5f9;
	padding-bottom: 8px;
	margin-bottom: 20px;
}
#account-register .form-control {
	height: 42px;
	border-radius: 8px;
	border: 1px solid #cbd5e1;
	box-shadow: none;
	font-size: 14px;
	transition: all 0.2s ease;
	color: var(--tm-slate);
}
#account-register .form-control:focus {
	border-color: var(--tm-blue);
	box-shadow: 0 0 0 3px rgba(0, 154, 218, 0.1);
	outline: none;
}
#account-register .control-label {
	font-weight: 600;
	color: var(--tm-slate);
	font-size: 13px;
}
#account-register .buttons {
	background-color: #f8fafc;
	padding: 20px;
	border-radius: 8px;
	border: 1px solid var(--tm-border);
	margin-top: 30px;
}
#account-register .buttons .pull-right {
	display: inline-flex !important;
	align-items: center !important;
	gap: 12px !important;
	flex-wrap: wrap !important;
	justify-content: flex-end !important;
	float: right !important;
	width: auto;
}
#account-register .buttons .pull-right a {
	color: var(--tm-blue);
	font-weight: 600;
	text-decoration: none;
}
#account-register .buttons .pull-right a:hover {
	text-decoration: underline;
}
#account-register input[type="checkbox"] {
	width: 16px;
	height: 16px;
	accent-color: var(--tm-blue);
	cursor: pointer;
	margin: 0 !important;
	vertical-align: middle;
}
#account-register .btn-primary {
	height: 42px;
	padding: 0 24px;
	border-radius: 8px !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	background-color: var(--tm-blue) !important;
	border-color: var(--tm-blue) !important;
	color: #ffffff !important;
	transition: all 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	cursor: pointer;
	box-shadow: 0 2px 4px rgba(0, 154, 218, 0.1) !important;
}
#account-register .btn-primary:hover {
	background-color: #0081b7 !important;
	border-color: #0081b7 !important;
	box-shadow: 0 4px 8px rgba(0, 154, 218, 0.2) !important;
}

/* Product Page Styling */
.product-title-section {
	text-align: left;
	margin-bottom: 25px;
}
.product-title-section h1 {
	font-size: 28px;
	font-weight: 700;
	color: #0f172a;
	position: relative;
	padding-bottom: 0;
	text-transform: none;
}
.product-title-section h1::after {
	display: none !important;
}
.product-images-gallery {
	list-style: none;
	padding: 0;
	margin: 0 0 25px 0;
}
.product-images-gallery .thumbnail {
	border: 1px solid #e5e5e5;
	border-radius: 8px;
	padding: 10px;
	margin-bottom: 15px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.03);
	background-color: #ffffff;
	transition: all 0.2s ease-in-out;
}
a.thumbnail:hover, 
a.thumbnail:focus, 
a.thumbnail.active,
.product-images-gallery .thumbnail:hover,
.product-images-gallery .thumbnail:focus {
	border-color: #2563eb !important;
	box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1) !important;
}
.product-images-gallery .main-image .thumbnail {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 450px;
	padding: 15px;
}
.product-images-gallery .main-image img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}
.additional-images-grid {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	justify-content: flex-start;
}
.additional-images-grid .image-additional {
	width: 70px;
	height: 70px;
	margin-bottom: 0;
}
.additional-images-grid .image-additional .thumbnail {
	width: 100%;
	height: 100%;
	padding: 5px;
	margin-bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.additional-images-grid .image-additional img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

/* Attributes style like Competitor (New Structure) */
.product-attributes-summary {
	background-color: transparent;
	border: none;
	padding: 0;
	margin-bottom: 20px;
}
.attributes {
	list-style: none;
	padding: 0;
	margin: 0;
}
.mod-param {
	padding-top: 8px;
	padding-bottom: 8px;
	font-size: 13px;
	border-bottom: 1px solid #eeeeee;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 15px;
}
.param-name {
	color: #666666;
	font-weight: normal;
	text-align: left;
}
.param-value {
	font-weight: bold;
	color: #333333;
	text-align: right;
}
.param-value a {
	color: #333333;
	font-weight: bold;
}
.param-value a:hover {
	color: #2563eb;
}

/* Fallback for old cached templates using old classes */
.attributes-grid {
	display: flex !important;
	flex-direction: column !important;
	border: none !important;
	border-radius: 0 !important;
	overflow: visible !important;
	grid-template-columns: none !important;
}
.attribute-item {
	padding: 8px 0 !important;
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	border-bottom: 1px solid #eeeeee !important;
	border-right: none !important;
	background-color: transparent !important;
	gap: 15px !important;
}
.attribute-item:last-child {
	border-bottom: none !important;
}
.attribute-item .attr-name {
	color: #666666 !important;
	font-weight: normal !important;
	font-size: 13px !important;
	text-transform: none !important;
	margin-bottom: 0 !important;
	letter-spacing: normal !important;
	text-align: left !important;
}
.attribute-item .attr-val {
	font-size: 13px !important;
	color: #333333 !important;
	font-weight: bold !important;
	text-align: right !important;
}
.attribute-item .attr-val a {
	color: #333333 !important;
	font-weight: bold !important;
}
.attribute-item .attr-val a:hover {
	color: #2563eb !important;
}

/* Buy Action Box */
.product-buy-box {
	background-color: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: 8px;
	padding: 24px;
	margin-bottom: 25px;
	box-shadow: 0 4px 12px rgba(0,0,0,0.03);
}
.open-source-badge {
	background-color: #f0fdf4;
	border: 1px solid #dcfce7;
	border-radius: 6px;
	padding: 15px;
	margin-bottom: 20px;
	display: flex;
	gap: 15px;
	align-items: flex-start;
}
.open-source-badge i {
	font-size: 24px;
	color: var(--tm-green);
	margin-top: 2px;
}
.open-source-badge strong {
	display: block;
	font-size: 15px;
	color: var(--tm-green);
	margin-bottom: 5px;
}
.open-source-badge p {
	font-size: 12px;
	color: var(--tm-slate);
	margin: 0;
	line-height: 1.4;
}

/* Price Box */
.product-price-box {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	background-color: #f8fafc;
	padding: 16px 20px;
	border-radius: 12px;
	border: 1px solid var(--tm-border);
}
.price-amount {
	display: flex;
	flex-direction: column;
}
.price-amount .price-val {
	font-size: 32px;
	font-weight: 700;
	color: var(--tm-slate);
}
.price-amount .price-new {
	font-size: 32px;
	font-weight: 700;
	color: #ef4444;
}
.price-amount .price-old {
	font-size: 16px;
	color: #9ca3af;
	text-decoration: line-through;
}
.wishlist-btn {
	background-color: #ffffff;
	color: #475569;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	width: 44px;
	height: 44px;
	font-size: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.2s ease;
	box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}
.wishlist-btn:hover {
	background-color: #f8fafc;
	color: #ef4444;
	border-color: #cbd5e1;
}

/* Buy Action Inputs */
.product-action-inputs {
	margin-top: 15px;
	margin-bottom: 20px;
}
.btn-buy-now {
	background-color: var(--tm-blue) !important;
	border: none;
	color: #ffffff !important;
	font-size: 16px;
	font-weight: 700;
	height: 50px;
	border-radius: 8px;
	text-transform: uppercase;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	transition: all 0.25s ease;
	box-shadow: 0 4px 15px rgba(0, 154, 218, 0.2);
}
.btn-buy-now:hover {
	background-color: #0081b7 !important;
	color: #ffffff !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 20px rgba(0, 154, 218, 0.3);
}

/* Selectable options custom panels styling */
.product-buy-box .radio, .product-buy-box .checkbox {
	margin: 10px 0 !important;
	padding: 0 !important;
}
.product-buy-box .radio label, .product-buy-box .checkbox label {
	display: flex !important;
	align-items: center;
	padding: 12px 16px !important;
	border: 1px solid var(--tm-border) !important;
	border-radius: 8px !important;
	background-color: #ffffff !important;
	color: var(--tm-slate) !important;
	cursor: pointer !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	transition: all 0.2s ease !important;
	width: 100% !important;
	box-sizing: border-box !important;
	gap: 10px;
}
.product-buy-box .radio label:hover, .product-buy-box .checkbox label:hover {
	border-color: #cbd5e1 !important;
	background-color: #f8fafc !important;
}
.product-buy-box .radio label.active, .product-buy-box .checkbox label.active {
	border-color: var(--tm-blue) !important;
	background-color: #f0f4ff !important;
	color: var(--tm-blue) !important;
}
.product-buy-box .radio label input[type="radio"],
.product-buy-box .checkbox label input[type="checkbox"] {
	margin: 0 !important;
	position: static !important;
	flex-shrink: 0;
}

/* Payment Icons Wrapper */
.payment-icons-wrapper {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 8px;
	margin-top: 15px;
	font-size: 16px;
	color: #555;
	border-top: none;
	padding-top: 0;
	flex-wrap: wrap;
}
.pay-ico {
	display: inline-flex;
	align-items: center;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	border-radius: 0 !important;
	cursor: default;
}

/* Tabs customization - Premium Stripe / Tailwind style */
.product-tabs-section {
	margin-top: 40px;
	margin-bottom: 40px;
}
.product-tabs-section .nav-tabs {
	border-bottom: 2px solid #e2e8f0;
	background-color: transparent;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	margin-bottom: 0;
}
.product-tabs-section .nav-tabs > li {
	margin-bottom: -2px;
	border: none;
}
.product-tabs-section .nav-tabs > li > a {
	border: none;
	border-bottom: 2px solid transparent;
	border-radius: 0;
	color: #64748b;
	font-weight: 600;
	font-size: 15px;
	padding: 12px 4px;
	margin: 0;
	transition: all 0.2s;
	background-color: transparent !important;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	display: block;
}
.product-tabs-section .nav-tabs > li.active > a,
.product-tabs-section .nav-tabs > li.active > a:hover,
.product-tabs-section .nav-tabs > li.active > a:focus {
	background-color: transparent !important;
	color: #0f172a !important;
	border: none;
	border-bottom: 2px solid #0f172a !important;
	box-shadow: none;
}
.product-tabs-section .nav-tabs > li > a:hover {
	background-color: transparent !important;
	color: #0f172a;
	border-bottom: 2px solid #cbd5e1;
}
.product-tabs-section .tab-content {
	border: none;
	border-radius: 0;
	padding: 30px 0;
	background-color: transparent;
	line-height: 1.7;
	font-size: 14px;
	color: #334155;
	margin-top: 0;
	box-shadow: none;
}

/* Refine Search subcategories tags style */
.product-category h3 {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 15px;
}
.product-category ul {
	list-style: none;
	padding-left: 0;
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 25px;
}
.product-category ul li {
	background-color: #f1f5f9;
	border: 1px solid #cbd5e1;
	border-radius: 4px;
	padding: 6px 15px;
	transition: all 0.2s ease;
}
.product-category ul li:hover {
	border-color: #94a3b8;
	background-color: #e2e8f0;
}
.product-category ul li a {
	color: #475569;
	font-weight: 500;
	font-size: 13px;
	text-decoration: none;
}
.product-category ul li a:hover {
	color: #0f172a;
}

/* Category sorting and comparing controls */
.product-category .form-control {
	border-radius: 4px;
	border: 1px solid #e2e2e2;
	height: 36px;
	font-size: 13px;
	box-shadow: none;
}
.product-category .form-control:focus {
	border-color: #2563eb;
	box-shadow: none;
}
#compare-total {
	font-size: 14px;
	font-weight: 500;
	color: #333333;
	text-decoration: underline;
}
#compare-total:hover {
	color: #2563eb;
}

/* Menu Dropdown Enhancements */
#menu .dropdown-menu {
	background-color: #ffffff;
	border-top: 3px solid #2563eb;
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
	border-radius: 0 0 4px 4px;
	padding: 10px 0;
	min-width: 200px;
}
#menu .dropdown-menu li a {
	padding: 8px 20px;
	font-size: 13px;
	color: #333333;
	display: block;
	transition: all 0.2s ease;
}
#menu .dropdown-menu li a:hover {
	background-color: #f1f5f9;
	color: #0f172a;
	padding-left: 25px;
}

/* Top bar menu wrap prevention */
#top-right-links {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: nowrap;
}
#top-right-links a, 
#top-right-links span,
#top-right-links .dropdown-toggle {
	white-space: nowrap !important;
	display: inline-flex !important;
	align-items: center;
	gap: 5px;
	color: #ffffff;
}
#top-right-links .dropdown-toggle:hover {
	color: #2563eb;
}
#top-right-links .dropdown-menu a {
	color: #333333 !important;
	display: block;
}

/* Quick Checkout Styling */
#checkout-quick-container {
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 12px;
	padding: 40px;
	box-shadow: 0 10px 30px rgba(0,0,0,0.03);
	margin-top: 30px;
	margin-bottom: 50px;
}
.checkout-main-title {
	font-weight: 500;
	font-size: 32px;
	margin-bottom: 40px;
	color: #111111;
	text-align: center;
}
.checkout-quick-row {
	display: flex;
	flex-wrap: wrap;
	margin-left: 0;
	margin-right: 0;
}
.checkout-left-col,
.checkout-right-col {
	width: 50%;
	flex: 0 0 50%;
}
@media (min-width: 992px) {
	.checkout-left-col {
		border-right: 1px solid #e8e8e8;
		padding-right: 45px !important;
		padding-left: 0 !important;
	}
	.checkout-right-col {
		padding-left: 45px !important;
		padding-right: 0 !important;
	}
}
@media (max-width: 991px) {
	.checkout-left-col,
	.checkout-right-col {
		width: 100% !important;
		flex: 0 0 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	.checkout-left-col {
		border-right: none;
		margin-bottom: 40px;
	}
}
.checkout-box {
	background: transparent;
	border: none;
	padding: 0;
	box-shadow: none;
	width: 100%;
	height: auto;
}
.cart-items-list {
	margin-bottom: 25px;
}
.cart-item-row {
	display: flex;
	align-items: center;
	padding: 15px 0;
	border-bottom: 1px solid #f2f2f2;
}
.cart-item-row:first-child {
	padding-top: 0;
}
.cart-item-row .item-thumb {
	width: 70px;
	height: 70px;
	flex-shrink: 0;
	margin-right: 15px;
}
.cart-item-row .item-thumb img {
	max-width: 100%;
	max-height: 100%;
	border-radius: 6px;
	border: 1px solid #f0f0f0;
	object-fit: cover;
}
.cart-item-row .item-details {
	flex-grow: 1;
}
.cart-item-row .item-details .item-name {
	font-weight: 500;
	color: #333333;
	font-size: 15px;
	text-decoration: none;
	display: block;
	margin-bottom: 4px;
	line-height: 1.3;
}
.cart-item-row .item-details .item-name:hover {
	color: #2563eb;
}
.cart-item-row .item-details .item-options {
	color: #777777;
	font-size: 12px;
	margin-bottom: 4px;
}
.cart-item-row .item-qty-price {
	font-size: 13px;
	color: #888888;
}
.cart-item-row .item-qty-price .qty-badge {
	font-weight: 600;
	color: #333333;
}
.cart-item-row .item-qty-price .price-val {
	font-weight: 500;
}
.cart-item-row .item-remove {
	margin-left: 20px;
	margin-right: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.cart-item-row .item-total-price {
	margin-left: 0;
	text-align: right;
	min-width: 90px;
}
.cart-item-row .item-total-price .total-val {
	font-weight: 600;
	font-size: 16px;
	color: #333333;
}
.cart-item-row .btn-remove-item {
	background: transparent;
	border: none;
	color: #ff4d4f;
	font-size: 15px;
	cursor: pointer;
	padding: 4px;
	transition: color 0.15s;
}
.cart-item-row .btn-remove-item:hover {
	color: #d32f2f;
}
.totals-and-payments-wrapper {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-top: 30px;
	border-top: 1px solid #f2f2f2;
	padding-top: 25px;
	gap: 20px;
}
.accepted-payments-col {
	flex: 1 1 auto;
}
.totals-col {
	flex: 0 0 auto;
	min-width: 200px;
}
.table-totals {
	width: 100%;
}
.table-totals tr td {
	padding: 6px 0;
	font-size: 14px;
	color: #666666;
}
.table-totals tr td.label-td {
	font-weight: normal;
	color: #666666;
}
.table-totals tr td.val-td {
	font-weight: 500;
	color: #111111;
	text-align: right;
}
.table-totals tr.grand-total td {
	padding-top: 12px;
	border-top: 1px solid #f0f0f0;
}
.table-totals tr.grand-total td.label-td {
	font-size: 16px;
	font-weight: 600;
	color: #111111;
}
.table-totals tr.grand-total td.val-td {
	font-size: 20px;
	font-weight: 700;
	color: #111111;
}
@media (max-width: 767px) {
	.totals-and-payments-wrapper {
		flex-direction: column-reverse;
		align-items: stretch;
		gap: 25px;
	}
	.totals-col {
		width: 100%;
	}
}
.payment-icons-wrapper {
	margin-top: 15px;
}
.customer-header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 25px;
}
.customer-header .box-title {
	font-size: 18px;
	font-weight: 600;
	margin: 0;
	color: #111111;
}
.customer-header .login-link-btn {
	color: #0071b0;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	border-bottom: 1px dotted #0071b0;
	transition: color 0.15s, border-color 0.15s;
}
.customer-header .login-link-btn:hover {
	color: #005a8c;
	border-bottom-color: #005a8c;
}
.logged-info-badge {
	font-size: 14px;
	padding: 10px 15px;
	margin-bottom: 20px;
}
.form-group label.control-label {
	font-weight: 500;
	font-size: 13px;
	color: #444444;
	margin-bottom: 6px;
}
.quick-input {
	height: 42px;
	border-radius: 4px;
	border: 1px solid #dcdcdc;
	box-shadow: none !important;
	font-size: 14px;
	padding: 10px 14px;
	transition: border-color 0.15s ease-in-out;
}
.quick-input:focus {
	border-color: #2563eb !important;
}
.payment-methods-wrapper {
	margin-top: 30px;
	margin-bottom: 25px;
}
.payment-methods-wrapper .box-sub-title {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 15px;
	color: #111111;
}
.payment-radios-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.payment-method-label {
	display: flex;
	align-items: center;
	padding: 4px 0;
	border: none !important;
	background: transparent !important;
	cursor: pointer;
	position: relative;
	user-select: none;
}
.payment-method-label input[type="radio"] {
	position: absolute;
	opacity: 0;
	cursor: pointer;
}
.radio-custom-indicator {
	width: 18px;
	height: 18px;
	border: 2px solid #cccccc;
	border-radius: 50%;
	margin-right: 12px;
	display: inline-block;
	position: relative;
	flex-shrink: 0;
	transition: border-color 0.15s;
}
.payment-method-label:hover .radio-custom-indicator,
.payment-method-label.active .radio-custom-indicator {
	border-color: #2563eb;
}
.payment-method-label.active .radio-custom-indicator::after {
	content: '';
	position: absolute;
	width: 8px;
	height: 8px;
	background-color: #2563eb;
	border-radius: 50%;
	top: 3px;
	left: 3px;
}
.payment-title-text {
	font-weight: 500;
	font-size: 14px;
	color: #333333;
}
.coupon-section {
	margin-top: 20px;
	margin-bottom: 25px;
}
.coupon-toggle-link {
	color: #0071b0;
	font-weight: normal;
	text-decoration: none;
	border-bottom: 1px dotted #0071b0;
	cursor: pointer;
	display: inline-block;
}
.coupon-toggle-link:hover {
	color: #005a8c;
	border-bottom-color: #005a8c;
}
.checkout-submit-wrapper {
	border-top: 1px solid #f2f2f2;
	padding-top: 25px;
}
.btn-checkout-submit {
	background-color: #0f172a;
	color: #ffffff;
	border: none;
	font-weight: 600;
	font-size: 16px;
	padding: 14px 20px;
	border-radius: 6px;
	width: 100%;
	text-align: center;
	transition: all 0.2s;
	box-shadow: none;
}
.btn-checkout-submit:hover, .btn-checkout-submit:focus {
	background-color: #1e293b;
	color: #ffffff;
	box-shadow: none;
}
.policy-agreement-text {
	font-size: 12px;
	color: #999999;
	margin-top: 15px;
	line-height: 1.5;
	text-align: center;
}
.policy-agreement-text a {
	color: #0071b0;
	text-decoration: none;
}
.policy-agreement-text a:hover {
	text-decoration: underline;
}

/* Mobile Cart Layout Styles */
.cart-mobile-cards {
	display: flex;
	flex-direction: column;
	gap: 15px;
	margin-bottom: 25px;
}
.cart-mobile-card {
	background: #ffffff;
	border: 1px solid #e2e2e2;
	border-radius: 6px;
	padding: 15px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}
.cart-mobile-card .card-header {
	display: flex;
	gap: 12px;
	border-bottom: 1px solid #f2f2f2;
	padding-bottom: 10px;
	margin-bottom: 10px;
}
.cart-mobile-card .card-thumb {
	width: 60px;
	height: 60px;
	flex-shrink: 0;
}
.cart-mobile-card .card-thumb img {
	max-width: 100%;
	max-height: 100%;
}
.cart-mobile-card .card-title-area {
	flex-grow: 1;
}
.cart-mobile-card .product-title {
	font-weight: bold;
	color: #333333;
	font-size: 13px;
	display: block;
	line-height: 1.3;
	margin-bottom: 2px;
}
.cart-mobile-card .product-model {
	font-size: 11px;
	color: #777777;
}
.cart-mobile-card .product-options {
	font-size: 11px;
	color: #666;
	margin-top: 2px;
}
.cart-mobile-card .card-body {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.cart-mobile-card .card-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 13px;
}
.cart-mobile-card .card-row .lbl {
	color: #666666;
}
.cart-mobile-card .card-row .val {
	font-weight: 500;
	color: #333333;
}
.cart-mobile-card .card-row.quantity-row {
	align-items: flex-start;
	flex-direction: column;
	gap: 5px;
}
.cart-mobile-card .card-row.total-row {
	border-top: 1px solid #f2f2f2;
	padding-top: 8px;
	font-weight: bold;
}
.cart-mobile-card .card-row.total-row .val {
	font-weight: bold;
	font-size: 14px;
	color: #333;
}
.cart-totals-table {
	background-color: #fafafa;
}
.cart-totals-table tr td {
	padding: 8px 12px !important;
}
.cart-totals-table tr.grand-total-row td {
	font-size: 16px;
	background-color: #f8fafc;
	border-top: 2px solid #0f172a !important;
}
.btn-checkout-action {
	background-color: #0f172a !important;
	border-color: #0f172a !important;
	color: #ffffff !important;
	font-weight: bold;
}
.btn-checkout-action:hover {
	background-color: #1e293b !important;
	border-color: #1e293b !important;
}

/* ===== OFF-CANVAS MOBILE MENU ===== */

/* Mobile menu trigger bar */
#mobile-menu-bar {
	display: none;
	background-color: #f8fafc;
	padding: 8px 15px;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid #cbd5e1;
}
#mobile-menu-trigger {
	background: var(--tm-blue);
	color: #fff;
	border: none;
	border-radius: 9999px;
	padding: 8px 18px;
	font-size: 14px;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 700;
	transition: background 0.2s, transform 0.2s;
}
#mobile-menu-trigger:hover, #mobile-menu-trigger:active {
	background: var(--tm-blue-hover);
	transform: translateY(-1px);
}
#mobile-menu-trigger .fa {
	font-size: 16px;
}
#mob-search-form {
	display: flex;
	align-items: center;
	flex-grow: 1;
	margin-left: 15px;
	max-width: 220px;
	background-color: #ffffff;
	border: 2px solid #cbd5e1;
	border-radius: 9999px;
	height: 36px;
	position: relative;
	box-sizing: border-box;
	transition: border-color 0.2s ease;
}
#mob-search-form:focus-within {
	border-color: var(--tm-blue);
}
#mob-search-form input {
	height: 100%;
	padding: 0 42px 0 14px;
	border: none !important;
	background: transparent !important;
	font-size: 13px;
	width: 100%;
	outline: none;
	color: var(--tm-slate);
	box-sizing: border-box;
}
#mob-search-form button {
	position: absolute;
	right: -2px;
	top: -2px;
	bottom: -2px;
	width: 38px;
	height: 36px;
	background-color: var(--tm-blue);
	color: #ffffff;
	border: 2px solid var(--tm-blue);
	border-radius: 0 9999px 9999px 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	transition: background-color 0.2s, border-color 0.2s;
	box-sizing: border-box;
}
#mob-search-form button:hover, #mob-search-form button:active {
	background-color: var(--tm-blue-hover);
	border-color: var(--tm-blue-hover);
}

/* Off-canvas overlay backdrop */
#mobile-menu-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.55);
	z-index: 9000;
	opacity: 0;
	transition: opacity 0.3s ease;
}
#mobile-menu-overlay.open {
	display: block;
	opacity: 1;
}

/* Off-canvas panel */
#mobile-menu-panel {
	position: fixed;
	top: 0;
	left: 0;
	width: 290px;
	max-width: 85vw;
	height: 100%;
	background: #ffffff;
	z-index: 9100;
	transform: translateX(-100%);
	transition: transform 0.3s ease;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	border-right: 1px solid #cbd5e1;
}
#mobile-menu-panel.open {
	transform: translateX(0);
}

/* Panel header */
.mob-panel-header {
	background: #ffffff;
	padding: 14px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 56px;
	border-bottom: 1px solid #f1f5f9;
}
.mob-panel-header .mob-logo {
	font-size: 16px;
	font-weight: 700;
	color: #0f172a;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.mob-panel-header .mob-logo img {
	max-height: 32px;
	display: block;
}
#mobile-menu-close {
	background: transparent;
	border: none;
	color: #475569;
	font-size: 22px;
	cursor: pointer;
	padding: 4px 8px;
	line-height: 1;
	transition: color 0.2s;
}
#mobile-menu-close:hover {
	color: var(--tm-blue);
}

/* Navigation list inside panel */
#mobile-menu-nav {
	flex-grow: 1;
	padding: 0;
	margin: 0;
	list-style: none;
	padding-bottom: 30px;
}
#mobile-menu-nav > li {
	border-bottom: 1px solid #f1f5f9;
}
#mobile-menu-nav > li > a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 18px;
	color: #334155;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	transition: background 0.15s, color 0.15s;
}
#mobile-menu-nav > li > a:hover {
	background: #f8fafc;
	color: var(--tm-blue);
}
#mobile-menu-nav > li > a .mob-arrow {
	color: #888;
	transition: transform 0.2s;
}
#mobile-menu-nav > li.mob-open > a .mob-arrow {
	transform: rotate(90deg);
	color: var(--tm-blue);
}
#mobile-menu-nav > li.mob-open > a {
	color: var(--tm-blue);
	background: #f1f5f9;
}

/* Subcategory list */
.mob-submenu {
	display: none;
	background: #f8fafc;
	padding: 0;
	margin: 0;
	list-style: none;
}
.mob-submenu.open {
	display: block;
}
.mob-submenu > li > a {
	display: block;
	padding: 10px 18px 10px 32px;
	color: #475569;
	font-size: 13px;
	transition: color 0.15s;
}
.mob-submenu > li > a:hover {
	color: var(--tm-blue);
}
.mob-submenu-header {
	padding: 8px 18px 4px 32px;
	color: var(--tm-blue);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* Bottom footer inside panel */
.mob-panel-footer {
	background: #f8fafc;
	padding: 15px 18px;
	border-top: 1px solid #e2e8f0;
}
.mob-panel-footer a {
	display: inline-block;
	color: #475569;
	font-size: 12px;
	margin-right: 10px;
}
.mob-panel-footer a:hover {
	color: var(--tm-blue);
}

@media (max-width: 767px) {
	/* Hide standard navbar header button on mobile */
	#menu .navbar-header {
		display: none !important;
	}
	#menu .navbar-collapse {
		display: none !important;
	}
	/* Show mobile bar */
	#mobile-menu-bar {
		display: flex;
	}
	/* Compact middle bar on mobile */
	#header-main-row .container {
		display: flex !important;
		flex-direction: row !important;
		justify-content: space-between !important;
		align-items: center !important;
		flex-wrap: nowrap !important;
		padding: 8px 15px !important;
		min-height: auto !important;
	}
	.main-logo-col {
		width: auto !important;
	}
	.main-logo-col img {
		max-height: 35px !important;
	}
	
	/* Cart styling on mobile */
	#cart > .btn {
		padding: 5px 8px !important;
		height: auto !important;
	}
	#cart-total {
		font-size: 12px !important;
	}
	#cart .dropdown-menu {
		min-width: 290px !important;
		max-width: 90vw !important;
		position: absolute !important;
		right: 0 !important;
		left: auto !important;
	}
	/* Hide the entire desktop menu row on mobile - replaced by #mobile-menu-bar */
	#menu-row-wrapper {
		display: none !important;
	}
	
	/* Extra Mobile Panel Elements */
	.mob-panel-body-extra {
		padding: 20px 18px;
		display: flex;
		flex-direction: column;
		gap: 25px;
		border-top: 1px solid #f1f5f9;
	}
	.mob-section-title {
		font-size: 11px;
		font-weight: 700;
		text-transform: uppercase;
		color: var(--tm-blue);
		letter-spacing: 1px;
		margin-bottom: 12px;
	}
	.mob-account-links {
		list-style: none;
		padding: 0;
		margin: 0;
		display: flex;
		flex-direction: column;
		gap: 12px;
	}
	.mob-account-links a {
		color: #475569;
		font-size: 14px;
		display: flex;
		align-items: center;
		gap: 10px;
		text-decoration: none;
		transition: color 0.2s;
	}
	.mob-account-links a:hover {
		color: var(--tm-blue);
	}
	.mob-panel-contacts {
		display: flex;
		flex-direction: column;
		gap: 12px;
	}
	.mob-contact-item {
		color: #475569;
		font-size: 14px;
		display: flex;
		align-items: center;
		gap: 10px;
	}
	.mob-contact-item i {
		color: var(--tm-blue);
		width: 16px;
		text-align: center;
	}
	.mob-contact-item a {
		color: #475569;
		text-decoration: none;
		transition: color 0.2s;
	}
	.mob-contact-item a:hover {
		color: var(--tm-blue);
	}
	.mob-panel-language-currency {
		display: flex;
		flex-direction: column;
		gap: 15px;
	}
	.mob-panel-language-currency .meta-lang-wrapper,
	.mob-panel-language-currency .meta-currency-wrapper {
		display: block !important;
	}
	.mob-panel-language-currency .btn-link,
	.mob-panel-language-currency .dropdown-toggle {
		padding: 6px 0 !important;
		color: #475569 !important;
	}
	/* Display active lang/currency names in mobile panel */
	.mob-panel-language-currency .active-lang-name,
	.mob-panel-language-currency .active-curr-name {
		display: inline-block !important;
		margin-left: 6px;
		color: #475569 !important;
		font-size: 13px !important;
		font-weight: 500 !important;
		vertical-align: middle;
	}
	/* Mobile search within trigger bar */
	#mob-search-form {
		display: flex;
		flex: 1;
		margin-left: 10px;
	}
	#mob-search-form input {
		flex: 1;
		height: 36px;
		font-size: 13px;
		border: 1px solid #cbd5e1;
		border-radius: 4px 0 0 4px;
		padding: 0 10px;
	}
	#mob-search-form button {
		height: 36px;
		padding: 0 12px;
		background: var(--tm-blue);
		color: #fff;
		border: none;
		border-radius: 0 4px 4px 0;
		cursor: pointer;
		transition: background-color 0.2s;
	}
	#mob-search-form button:hover {
		background: #0081b7;
	}
	#checkout-quick-container {
		padding: 20px 15px !important;
		margin-top: 15px !important;
		margin-bottom: 30px !important;
	}
	.checkout-main-title {
		font-size: 24px !important;
		margin-bottom: 25px !important;
	}
}

/* Product Page Layout Flex on Desktop */
@media (min-width: 768px) {
	.product-info-wrapper {
		display: flex !important;
		flex-wrap: wrap;
	}
	.product-left-col {
		order: 1;
	}
	.product-right-col {
		order: 2;
	}
}

/* Responsive fixes for Mobile Screens (attributes, tabs only) */
@media (max-width: 767px) {
	/* 1-column attributes grid on mobile */
	.attributes-grid {
		grid-template-columns: 1fr !important;
	}
	.attribute-item:nth-child(odd) {
		border-right: none !important;
	}
	.attribute-item {
		border-bottom: 1px solid #e2e2e2 !important;
	}
	.attribute-item:last-child {
		border-bottom: none !important;
	}
	.attribute-item:nth-child(even) {
		background-color: #f7f9f5 !important;
	}
	.attribute-item:nth-child(odd) {
		background-color: #ffffff !important;
	}

	/* Product Tabs on mobile - Centered natural-width underline links */
	.product-tabs-section .nav-tabs {
		gap: 16px;
		justify-content: center;
		border-bottom: 2px solid #e2e8f0;
	}
	.product-tabs-section .nav-tabs > li {
		flex: 0 0 auto;
		text-align: center;
	}
	.product-tabs-section .nav-tabs > li > a {
		padding: 10px 4px;
		text-align: center;
		font-size: 13px;
	}

	/* Margin under image block on mobile to prevent merging with buy box */
	.product-image-col {
		margin-bottom: 30px !important;
	}

	/* Before-footer bar stacking */
	.before-footer-bar .container {
		flex-direction: column;
		text-align: center;
	}
	.before-footer-item {
		flex-direction: column;
		gap: 5px;
	}

	/* Mobile product image height adjustment */
	.product-images-gallery .main-image .thumbnail {
		height: 300px;
	}

	/* Mobile Cart Dropdown layout fixes */
	#cart .dropdown-menu table.table-striped {
		display: block !important;
		width: 100% !important;
	}
	#cart .dropdown-menu table.table-striped tbody,
	#cart .dropdown-menu table.table-striped tr {
		display: block !important;
		width: 100% !important;
	}
	#cart .dropdown-menu table.table-striped tr {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		padding: 8px 0 !important;
		border-bottom: 1px solid #f1f1f1 !important;
	}
	#cart .dropdown-menu table.table-striped td {
		display: block !important;
		border: none !important;
		padding: 2px !important;
	}
	#cart .dropdown-menu table.table-striped td:nth-child(1) { /* Image */
		flex: 0 0 50px !important;
	}
	#cart .dropdown-menu table.table-striped td:nth-child(2) { /* Name & Options */
		flex: 1 1 auto !important;
		min-width: 80px !important;
		padding-left: 10px !important;
		font-size: 12px !important;
		text-align: left !important;
	}
	#cart .dropdown-menu table.table-striped td:nth-child(2) a {
		text-align: left !important;
		display: block !important;
	}
	#cart .dropdown-menu table.table-striped td:nth-child(3) { /* Quantity */
		flex: 0 0 auto !important;
		font-weight: bold !important;
		font-size: 12px !important;
		white-space: nowrap !important;
		padding: 0 5px !important;
		text-align: right !important;
	}
	#cart .dropdown-menu table.table-striped td:nth-child(4) { /* Total Price */
		flex: 0 0 auto !important;
		font-weight: bold !important;
		font-size: 12px !important;
		white-space: nowrap !important;
		padding: 0 5px !important;
		text-align: right !important;
	}
	#cart .dropdown-menu table.table-striped td:nth-child(5) { /* Remove button */
		flex: 0 0 auto !important;
		text-align: right !important;
	}

	/* Spacing fix for benefits block on mobile */
	.open-source-badge, .oclab-benefits-container {
		margin-top: 25px !important;
	}

	/* Responsive action buttons stacked layout */
	.buttons {
		margin: 15px 0 !important;
	}
	.buttons .pull-right, 
	.buttons .pull-left {
		float: none !important;
		text-align: center !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		gap: 12px !important;
		width: 100% !important;
	}
	.buttons .pull-right {
		font-size: 13px !important;
		line-height: 1.5 !important;
		color: #333333 !important;
	}
	.buttons .pull-right input[type="checkbox"] {
		margin: 0 0 0 5px !important;
		vertical-align: middle !important;
		display: inline-block !important;
	}
	.buttons .btn,
	.buttons input[type="submit"] {
		width: 100% !important;
		max-width: 320px !important;
		margin: 5px 0 0 0 !important;
		padding: 10px 20px !important;
		font-size: 15px !important;
		font-weight: bold !important;
		box-sizing: border-box !important;
	}
}

/* Force Buy button text visibility on all screen sizes */
.product-thumb .button-group button span {
	display: inline !important;
}

/* Category Navigation (Prev/Next Product) */
.product-navigation {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	width: 100%;
	gap: 12px;
}
.btn-prev-next {
	flex: 1;
	justify-content: center;
	background-color: #ffffff;
	border: 1px solid var(--tm-border);
	color: var(--tm-slate);
	padding: 8px 12px;
	font-size: 13px;
	font-weight: 600;
	border-radius: 6px;
	transition: all 0.2s ease;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.btn-prev-next:hover {
	background-color: var(--tm-blue);
	color: #ffffff;
	border-color: var(--tm-blue);
	text-decoration: none;
}

/* Domain Option Group Layout */
.domain-option-group {
	margin-top: 20px;
	margin-bottom: 20px;
}
.domain-label-wrapper {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 6px;
}
.domain-label-wrapper label {
	margin-bottom: 0 !important;
	display: flex;
	align-items: center;
	gap: 6px;
	font-weight: bold;
}
.domain-tooltip {
	color: #777;
	cursor: pointer;
	font-size: 14px;
}
.domain-tooltip:hover {
	color: #333;
}
.no-domain-link {
	font-size: 12px;
	color: #888;
	text-decoration: underline;
}
.no-domain-link:hover {
	color: var(--tm-blue);
}
.domain-input-wrapper {
	position: relative;
}
.domain-input-wrapper input {
	padding-right: 35px;
	height: 44px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 14px;
	width: 100%;
	box-sizing: border-box;
}
.domain-input-wrapper input:focus {
	border-color: var(--tm-blue);
	outline: 0;
	box-shadow: 0 0 4px rgba(28, 98, 242, 0.2);
}
.domain-info-icon {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: #888;
	cursor: pointer;
	font-size: 14px;
}
.domain-option-group .help-block {
	font-size: 12px;
	color: #666;
	margin-top: 6px;
	display: block;
}

/* ChatGPT Button styling */
.btn-chatgpt {
	background-color: #f1f5f9;
	color: #475569 !important;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	padding: 12px 16px;
	font-size: 14px;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	transition: all 0.2s ease;
	width: 100%;
	margin-top: 15px;
	margin-bottom: 20px;
	cursor: pointer;
}
.btn-chatgpt:hover {
	background-color: #e2e8f0;
	color: var(--tm-slate) !important;
	border-color: #94a3b8;
	text-decoration: none;
}
.btn-chatgpt svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

/* Product Compatibility Card styling */
.product-compatibility-card {
	background-color: #ffffff;
	border-radius: 8px;
	padding: 16px 20px;
	margin-bottom: 20px;
	border: 1px solid var(--tm-border);
}
.compatibility-group h4 {
	font-size: 13px;
	font-weight: 700;
	color: var(--tm-slate);
	margin-top: 0;
	margin-bottom: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
.compatibility-items {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.compatibility-item {
	font-size: 13px;
	line-height: 1.5;
	color: var(--tm-slate);
}
.compatibility-item strong {
	color: var(--tm-slate);
	font-weight: 600;
}

/* Product Developer Card styling */
.product-developer-card {
	margin-top: 15px;
	border: 1px solid var(--tm-border);
	background-color: #ffffff;
	border-radius: 8px;
	padding: 14px 18px;
}
.dev-badge-title {
	background-color: #f0f4ff;
	color: var(--tm-blue);
	font-size: 10px;
	padding: 3px 8px;
	border-radius: 4px;
	font-weight: 700;
	display: inline-block;
	margin-bottom: 10px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
.dev-info-box {
	display: flex;
	align-items: center;
	gap: 12px;
}
.dev-logo svg {
	display: block;
	border-radius: 50%;
}
.dev-details {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.dev-details a {
	font-size: 15px;
	font-weight: bold;
	color: #000;
}
.dev-details a:hover {
	color: var(--tm-blue);
	text-decoration: none;
}
.dev-details span {
	font-size: 11px;
	color: #666;
}

/* Centered breadcrumbs with / separator */
.breadcrumb {
	padding: 8px 15px;
	margin-bottom: 20px;
	list-style: none;
	background-color: transparent !important;
	border-radius: 0;
	text-align: center;
	font-size: 14px;
	border: none;
}
.breadcrumb > li {
	display: inline-block;
}
.breadcrumb > li + li:before {
	padding: 0 8px;
	color: #999;
	content: "/\00a0" !important;
}
.breadcrumb > li > a {
	color: #666;
	transition: color 0.2s;
}
.breadcrumb > li > a:hover {
	color: var(--tm-blue);
	text-decoration: none;
}
.breadcrumb > .active {
	color: #333;
}

/* Product Page Columns Order & Widths on Desktop */
@media (min-width: 768px) {
	.product-info-wrapper {
		display: flex !important;
		flex-wrap: wrap !important;
	}
	.product-image-col {
		order: 1 !important;
	}
	.product-attr-col {
		order: 2 !important;
	}
	.product-buy-col {
		order: 3 !important;
	}
}

/* Inline Language Selector Styling */
.language-inline-selector {
	display: inline-flex !important;
	align-items: center !important;
}
.language-inline-selector .lang-label {
	color: #64748b;
	font-size: 13px !important;
	font-weight: 500 !important;
	margin-right: 8px !important;
}
.language-inline-selector .lang-buttons {
	display: inline-flex !important;
	gap: 6px !important;
}
.language-inline-selector .btn-lang-item {
	background: #f1f5f9 !important;
	border: 1px solid #cbd5e1 !important;
	color: #475569 !important;
	padding: 4px 8px !important;
	font-size: 12px !important;
	font-weight: bold !important;
	border-radius: 4px !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
	line-height: 1.2 !important;
	display: inline-block !important;
	height: auto !important;
}
.language-inline-selector .btn-lang-item:hover {
	border-color: #94a3b8 !important;
	color: var(--tm-blue) !important;
}
.language-inline-selector .btn-lang-item.active {
	background-color: var(--tm-blue) !important;
	border-color: var(--tm-blue) !important;
	color: #ffffff !important;
}

/* Sidebar mobile panel adjustment */
.mob-panel-language-currency .language-inline-selector {
	margin-bottom: 15px !important;
	padding: 0 10px !important;
}

/* Menu link icon + text alignment wrapper */
.menu-link-wrapper {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

/* Forms and layout float clearing safety */
#content {
	display: flow-root !important;
}
.buttons {
	margin: 20px 0;
	display: flow-root !important;
	clear: both !important;
}

/* Fix Bootstrap 3 clearfixes breaking CSS Flexbox layout on containers */
#header-main-row .container::before,
#header-main-row .container::after,
#menu-row-wrapper .container::before,
#menu-row-wrapper .container::after,
.before-footer-bar .container::before,
.before-footer-bar .container::after {
	display: none !important;
	content: none !important;
}

/* ===== ocmod.net Sidebar Menu (yo-menu) Style ===== */
.yo-menu {
	margin-bottom: 25px;
	border: 1px solid var(--tm-border);
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
	background-color: #ffffff;
}
.yo-heading {
	font-size: 15px;
	position: relative;
	padding: 12px 16px;
	cursor: pointer;
	transition: all 0.2s ease;
	border-bottom: 1px solid var(--tm-border);
	background-color: #eef2ff;
	color: #0f1115;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.yo-heading i {
	font-size: 16px;
	order: 2;
}
.yo-heading span {
	order: 1;
}
.yo-wrapper {
	padding: 0;
}
.yo-am {
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}
.yo-am li {
	position: relative;
	display: block;
	float: none;
	margin: 0;
	padding: 0;
}
.yo-am li + li {
	border-top: 1px solid #eef2ff;
}
.yo-am li a {
	position: relative;
	overflow: hidden;
	cursor: pointer;
	padding: 11px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #4a5160;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	background-color: #ffffff;
	transition: all 0.2s ease;
}
.yo-am li a:hover {
	color: #0f1115;
	background-color: #eef2ff;
}
.yo-am li.active > a {
	font-weight: 700;
	color: #0f1115;
	background-color: #eef2ff;
}
.yo-am li a span.am-arrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.yo-am li a span.am-arrow i {
	color: var(--tm-blue);
	min-width: 16px;
	text-align: center;
	font-size: 15px;
}
.yo-am li a span.am-badge {
	background: #eef2ff;
	color: #4a5160;
	font-size: 11px;
	font-weight: 700;
	border-radius: 100px;
	padding: 2px 8px;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 18px;
	transition: all 0.2s ease;
}
.yo-am li a:hover span.am-badge {
	background: var(--tm-blue);
	color: #ffffff;
}
.yo-am li.active > a span.am-badge {
	background: var(--tm-blue);
	color: #ffffff;
}
.yo-am li a.am-parent {
	padding-right: 48px;
}
.yo-am li a.am-tb {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	width: 44px;
	height: 43px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
	background: transparent;
	z-index: 2;
}
/* ===== Вертикальне ліве меню (.yo-menu) у стилі ocmod.net ===== */
.yo-menu {
	margin-bottom: 20px !important;
}
.yo-heading {
	font-size: 16px !important;
	position: relative !important;
	padding: 12px 15px !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
	border: 1px solid var(--tm-light-blue) !important;
	border-radius: 8px !important;
	background-color: var(--tm-light-blue) !important;
	text-shadow: none !important;
	font-weight: 600 !important;
	color: var(--tm-slate) !important;
}
.yo-heading.yo-open {
	border-bottom-color: transparent !important;
	border-bottom-right-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
}
.yo-heading.yo-close {
	background-color: #ffffff !important;
	border-color: #e2e8f0 !important;
}
.yo-heading i.fa-bars {
	font-size: 18px !important;
	line-height: 20px !important;
	float: right !important;
	color: var(--tm-blue) !important;
}
.yo-wrapper {
	border: 1px solid var(--tm-light-blue) !important;
	border-radius: 8px !important;
	background-color: #ffffff !important;
	overflow: hidden !important;
}
.yo-heading + .yo-wrapper {
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
	border-top: none !important;
}
ul.yo-am, ul.yo-am ul {
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	box-sizing: border-box !important;
}
ul.yo-am ul {
	display: none;
}
ul.yo-am li {
	position: relative !important;
	display: block !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
}
.yo-menu ul.yo-am li + li {
	border-top: 1px solid var(--tm-light-blue) !important;
}
ul.yo-am li a {
	position: relative !important;
	overflow: hidden !important;
	cursor: pointer !important;
	border: none !important;
	outline: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 10px 14px !important;
	color: var(--tm-slate) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	text-decoration: none !important;
	background-color: #ffffff !important;
	transition: all 0.2s ease !important;
}
ul.yo-am li a:hover {
	color: var(--tm-blue) !important;
	background-color: var(--tm-light-blue) !important;
}
ul.yo-am li.active > a {
	font-weight: 600 !important;
	color: var(--tm-blue) !important;
	background-color: var(--tm-light-blue) !important;
}
ul.yo-am li a span.am-badge {
	background: var(--tm-light-blue) !important;
	color: #64748b !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	border-radius: 100px !important;
	padding: 2px 8px !important;
	white-space: nowrap !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	height: 18px !important;
	margin-left: 10px !important;
	transition: all 0.2s ease !important;
}
ul.yo-am li a:hover span.am-badge,
ul.yo-am li.active > a span.am-badge {
	background: var(--tm-blue) !important;
	color: #ffffff !important;
}
ul.yo-am li a.am-tb {
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	margin: 0 !important;
	width: 44px !important;
	height: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border: none !important;
	background: transparent !important;
	z-index: 2 !important;
	padding: 0 !important;
}
ul.yo-am li a.am-tb span {
	display: inline-block !important;
	transition: transform 0.2s ease !important;
}
ul.yo-am li a.am-tb span:before {
	font-family: "FontAwesome", "Font Awesome 5 Free", "Font Awesome 6 Free", sans-serif !important;
	font-size: 12px !important;
	font-weight: 900 !important;
	content: '\f054' !important;
	color: #94a3b8 !important;
}
ul.yo-am li.am-item-open > a.am-tb span {
	transform: rotate(90deg) !important;
}
ul.yo-am li ul {
	border-top: 1px solid var(--tm-light-blue) !important;
	background-color: #fafbfc !important;
}
ul.yo-am li ul li a {
	padding-left: 32px !important;
	font-size: 13px !important;
	color: #475569 !important;
	background-color: #fafbfc !important;
}
ul.yo-am li ul li a:hover {
	color: var(--tm-blue) !important;
	background-color: var(--tm-light-blue) !important;
}
ul.yo-am li ul li.active > a {
	font-weight: 600 !important;
	color: var(--tm-blue) !important;
	background-color: var(--tm-light-blue) !important;
}
ul.yo-am i {
	color: var(--tm-blue) !important;
	font-size: 14px !important;
	min-width: 24px !important;
	text-align: left !important;
}
ul.yo-am li ul li a i {
	color: #94a3b8 !important;
}
ul.yo-am li ul li a:hover i,
ul.yo-am li ul li.active > a i {
	color: var(--tm-blue) !important;
}

/* ===== Мегаменю — картки у стилі ocmod.net ===== */

/* Єдина картка (батьківська категорія + дочірні) */
.menu-card {
	background-color: #ffffff !important;
	border: 1px dashed #cbd5e1 !important; /* Пунктирна рамка як у ocmod.net */
	border-radius: 8px !important;
	overflow: hidden !important;
	box-shadow: none !important;
	transition: all 0.2s ease !important;
}
.menu-card:hover {
	border: 1px dashed var(--tm-blue) !important;
	box-shadow: 0 8px 24px rgba(87, 119, 255, 0.08) !important;
}

/* Заголовок картки (батьківська категорія) */
.menu-card-header {
	background-color: #f8fafc !important; /* Світло-сірий бекграунд як у ocmod.net */
	border-bottom: 1px dashed #e2e8f0 !important; /* Пунктирна межа */
	transition: all 0.2s ease !important;
}
.menu-card:hover .menu-card-header {
	background-color: #eef2ff !important; /* Блакитний бекграунд при наведенні */
	border-bottom: 1px dashed #c7d2fe !important;
}
.menu-card-header a {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 10px 14px !important;
	color: #0f1115 !important;
	font-weight: 700 !important;
	font-size: 13px !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}
.menu-card-header a:hover {
	color: var(--tm-blue) !important;
	background-color: transparent !important;
}
.menu-card-title {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}
.menu-card-title .menu-custom-icon {
	color: var(--tm-blue);
	font-size: 13px;
	min-width: 15px;
	text-align: center;
	opacity: 0.85;
}

/* Тіло картки — список підкатегорій */
.menu-card-body {
	padding: 8px 0;
}
.menu-card-child {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 6px 14px !important;
	color: #475569 !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	text-decoration: none !important;
	transition: all 0.15s ease !important;
	border-top: none !important; /* Прибираємо межу між дочірніми елементами */
}
.menu-card-child:hover {
	color: var(--tm-blue) !important;
	background-color: #f8fafc !important;
	padding-left: 17px !important;
}
.menu-child-title {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.menu-child-title .menu-custom-icon {
	color: #94a3b8;
	font-size: 12px;
	min-width: 14px;
	text-align: center;
}
.menu-card-child:hover .menu-child-title .menu-custom-icon {
	color: var(--tm-blue);
}

/* Бейдж — кількість товарів */
.am-badge {
	background: #f1f5f9;
	color: #475569;
	font-size: 11px;
	font-weight: 700;
	border-radius: 100px;
	padding: 2px 8px;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 18px;
	flex-shrink: 0;
	margin-left: 8px;
	transition: all 0.15s ease;
}
.am-badge.am-badge-parent {
	background: var(--tm-blue);
	color: #ffffff;
}
.menu-card-child:hover .am-badge {
	background: var(--tm-blue);
	color: #ffffff;
}

/* --- Dark Mode Override --- */
body.dark-theme {
	background-color: #0b0f19;
	color: #cbd5e1;
}
body.dark-theme #header-top-bar {
	background-color: #0f172a;
	border-color: #1e293b;
	color: #94a3b8;
}
body.dark-theme #header-top-bar a.tb-link,
body.dark-theme #header-top-bar .info-dropdown > a {
	color: #94a3b8;
}
body.dark-theme #header-top-bar a.tb-link:hover,
body.dark-theme #header-top-bar .info-dropdown > a:hover {
	color: var(--tm-blue) !important;
}
body.dark-theme #header-main-row {
	background-color: #0f172a;
	border-color: #1e293b;
}
body.dark-theme #header-main-row .logo-text {
	color: #ffffff;
}
body.dark-theme .search_wrapper {
	background-color: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme .search_wrapper .search_input {
	color: #ffffff;
}
body.dark-theme #cart > .btn.mini_cart {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	color: #ffffff !important;
}
body.dark-theme .cart-total {
	color: #ffffff;
}
body.dark-theme #cart .dropdown-menu {
	background-color: #1e293b !important;
	color: #ffffff !important;
}
body.dark-theme #menu-row-wrapper {
	background-color: #0f172a;
	border-color: #1e293b;
}
body.dark-theme #menu .nav > li > a {
	color: #cbd5e1;
}
body.dark-theme #mobile-menu-bar {
	background-color: #0f172a;
	border-color: #1e293b;
}
body.dark-theme #mobile-menu-trigger {
	color: #ffffff;
}
body.dark-theme #mob-search-form input {
	background-color: #1e293b;
	border-color: #334155;
	color: #ffffff;
}

/* ===== ocmod.net Grid Layout & Product Cards Polish ===== */
.products-grid-row .product-layout {
	padding-left: 0 !important;
	padding-right: 0 !important;
}
@media (min-width: 768px) {
	.products-grid-row {
		display: grid !important;
		grid-template-columns: repeat(3, 1fr) !important;
		gap: 16px !important;
	}
	.products-grid-row::before,
	.products-grid-row::after {
		display: none !important;
		content: none !important;
	}
	.products-grid-row .product-layout {
		width: 100% !important;
		margin-bottom: 0 !important;
		float: none !important;
	}
}
@media (min-width: 1200px) {
	.products-grid-row {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}
@media (max-width: 767px) {
	.products-grid-row {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 12px !important;
	}
	.products-grid-row::before,
	.products-grid-row::after {
		display: none !important;
		content: none !important;
	}
	.products-grid-row .product-layout {
		width: 100% !important;
		margin-bottom: 0 !important;
		float: none !important;
	}
}
@media (max-width: 480px) {
	.products-grid-row {
		grid-template-columns: 1fr !important;
	}
}

/* Float fix for header top-bar meta dropdown wrappers */
#header-top-bar .pull-left,
#header-top-bar .pull-right {
	float: none !important;
}

/* Product card rating & comments row styling */
.rating-box-wrapper {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	margin-top: 6px;
	min-height: 20px;
}
.rating-box-wrapper .rating {
	margin: 0 !important;
}
.rating-box-wrapper .total-comments {
	font-size: 12px;
	color: #64748b;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-weight: 500;
}
.rating-box-wrapper .total-comments i {
	font-size: 13px;
	color: #94a3b8;
}

/* Style categories count pills inside card */
.author-label {
	display: inline-block;
	font-size: 11px;
	background-color: #f1f5f9;
	color: #64748b;
	padding: 2px 8px;
	border-radius: 4px;
	font-weight: 600;
	margin-bottom: 6px;
	align-self: flex-start;
}

/* Dark Mode Overrides for grid items */
body.dark-theme .rating-box-wrapper .total-comments {
	color: #94a3b8;
}
body.dark-theme .rating-box-wrapper .total-comments i {
	color: #64748b;
}
body.dark-theme .author-label {
	background-color: #1e293b;
	color: #94a3b8;
}
body.dark-theme .product-thumb:hover {
	border-color: var(--tm-blue);
	box-shadow: 0 10px 25px rgba(87, 119, 255, 0.15);
}

/* ===== Product Page Modernization Styles ===== */

/* 1. Images Gallery */
.product-images-gallery {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 0 24px 0 !important;
}
.product-images-gallery .main-image {
	list-style: none !important;
	margin-bottom: 12px !important;
	display: block;
}
.product-images-gallery .main-image a.thumbnail {
	display: block !important;
	border: 1px solid #cbd5e1 !important;
	border-radius: 16px !important;
	padding: 12px !important;
	background-color: #ffffff !important;
	transition: all 0.2s ease !important;
	margin-bottom: 0 !important;
}
.product-images-gallery .main-image a.thumbnail:hover {
	border-color: var(--tm-blue) !important;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05) !important;
}
.product-images-gallery .main-image img {
	margin: 0 auto !important;
	border-radius: 8px !important;
	width: 100% !important;
}
.additional-images-grid {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 10px !important;
	margin-top: 12px !important;
}
.image-additional {
	list-style: none !important;
	display: block !important;
}
.image-additional a.thumbnail {
	display: block !important;
	border: 1px solid #cbd5e1 !important;
	border-radius: 12px !important;
	padding: 6px !important;
	background-color: #ffffff !important;
	transition: all 0.2s ease !important;
	margin-bottom: 0 !important;
}
.image-additional a.thumbnail:hover {
	border-color: var(--tm-blue) !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
}
.image-additional img {
	margin: 0 auto !important;
	border-radius: 4px !important;
	width: 100% !important;
}

/* 2. Attributes/Parameters Grid */
.product-attributes-summary {
	background-color: #f8fafc !important;
	border-radius: 16px !important;
	padding: 20px !important;
	border: 1px solid #e2e8f0 !important;
	height: 100% !important;
	box-sizing: border-box !important;
}
.product-attributes-summary ul.attributes {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	gap: 16px !important;
}
@media (max-width: 991px) {
	.product-attributes-summary ul.attributes {
		grid-template-columns: 1fr !important;
	}
}
.mod-param {
	display: flex !important;
	justify-content: space-between !important;
	align-items: flex-start !important;
	gap: 12px !important;
	padding-bottom: 10px !important;
	border-bottom: 1px dashed #e2e8f0 !important;
	list-style: none !important;
	margin-bottom: 0 !important;
	float: none !important;
	width: auto !important;
}
.param-name {
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #64748b !important;
}
.param-value {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--tm-slate) !important;
	text-align: right !important;
}

/* 3. Floating Buy Action Box */
.product-buy-box {
	background-color: #ffffff !important;
	border: 1px solid #cbd5e1 !important;
	border-radius: 16px !important;
	padding: 24px !important;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.03) !important;
	margin-bottom: 24px !important;
}

/* Category Navigation (Prev/Next) */
.product-navigation {
	display: flex !important;
	gap: 8px !important;
	margin-bottom: 20px !important;
}
.btn-prev-next {
	background-color: #f1f5f9 !important;
	color: #475569 !important;
	border-radius: 9999px !important;
	padding: 8px 18px !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	text-align: center !important;
	flex: 1 !important;
	transition: all 0.2s ease !important;
	border: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
}
.btn-prev-next:hover {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
}

/* Price Box & Wishlist */
.product-price-box {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	margin-bottom: 20px !important;
	gap: 16px !important;
}
.price-amount {
	display: flex !important;
	flex-direction: column !important;
}
.price-val, .price-new {
	font-size: 26px !important;
	font-weight: 800 !important;
	color: var(--tm-slate) !important;
	line-height: 1.2 !important;
}
.price-old {
	text-decoration: line-through !important;
	font-size: 15px !important;
	color: #94a3b8 !important;
	margin-bottom: 2px !important;
}
.wishlist-btn {
	width: 44px !important;
	height: 44px !important;
	border-radius: 50% !important;
	border: 1px solid #cbd5e1 !important;
	background: #ffffff !important;
	color: #64748b !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 18px !important;
	transition: all 0.2s ease !important;
	cursor: pointer !important;
	padding: 0 !important;
}
.wishlist-btn:hover {
	border-color: #f43f5e !important;
	color: #f43f5e !important;
	background-color: #fff1f2 !important;
}

/* Custom selectable options labels */
.product-buy-box .form-group {
	margin-bottom: 16px !important;
}
.product-buy-box .form-group.required .control-label::after {
	content: " *";
	color: #ef4444;
}
.product-buy-box .control-label {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: #334155 !important;
	margin-bottom: 8px !important;
	display: block !important;
}
.product-buy-box .form-control {
	height: 44px !important;
	border-radius: 8px !important;
	border: 1px solid #cbd5e1 !important;
	box-shadow: none !important;
	font-size: 14px !important;
	color: #0f172a !important;
	background-color: #ffffff !important;
	transition: all 0.2s ease !important;
	padding: 10px 14px !important;
}
.product-buy-box .form-control:focus {
	border-color: var(--tm-blue) !important;
	box-shadow: 0 0 0 3px rgba(87, 119, 255, 0.15) !important;
}
.product-buy-box .radio,
.product-buy-box .checkbox {
	margin: 0 0 8px 0 !important;
	padding: 0 !important;
}
.product-buy-box .radio label,
.product-buy-box .checkbox label {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 10px 14px !important;
	border: 1px solid #cbd5e1 !important;
	border-radius: 8px !important;
	background-color: #ffffff !important;
	cursor: pointer !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #334155 !important;
	transition: all 0.2s ease !important;
	margin-bottom: 0 !important;
	position: relative !important;
	min-height: auto !important;
	width: 100% !important;
}
.product-buy-box .radio label input[type="radio"],
.product-buy-box .checkbox label input[type="checkbox"] {
	position: absolute !important;
	opacity: 0 !important;
	width: 0 !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	pointer-events: none !important;
}
.product-buy-box .radio label.active,
.product-buy-box .checkbox label.active {
	border-color: var(--tm-blue) !important;
	background-color: var(--tm-light-blue) !important;
	color: var(--tm-blue-hover) !important;
}
.product-buy-box .radio label img,
.product-buy-box .checkbox label img {
	max-width: 24px !important;
	max-height: 24px !important;
	border-radius: 4px !important;
	margin: 0 !important;
}

/* Domain Option Inputs styling */
.domain-option-group {
	border: 1px solid #cbd5e1 !important;
	border-radius: 8px !important;
	padding: 12px 14px !important;
	background-color: #f8fafc !important;
}
.domain-label-wrapper {
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	margin-bottom: 6px !important;
}
.domain-label-wrapper .control-label {
	margin-bottom: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
}
.domain-tooltip {
	color: #94a3b8 !important;
	cursor: pointer !important;
}
.domain-tooltip:hover {
	color: var(--tm-blue) !important;
}
.no-domain-link {
	font-size: 11px !important;
	color: var(--tm-blue) !important;
	font-weight: 600 !important;
	text-decoration: underline !important;
}
.no-domain-link:hover {
	color: var(--tm-blue-hover) !important;
}
.domain-input-wrapper {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
}
.domain-input-wrapper .form-control {
	padding-right: 36px !important;
	background-color: #ffffff !important;
	width: 100% !important;
}
.domain-info-icon {
	position: absolute !important;
	right: 12px !important;
	color: #94a3b8 !important;
	cursor: pointer !important;
	font-size: 14px !important;
}
.domain-info-icon:hover {
	color: var(--tm-blue) !important;
}
.domain-option-group .help-block {
	font-size: 11px !important;
	color: #64748b !important;
	margin-top: 4px !important;
	margin-bottom: 0 !important;
}

/* Buy Action Inputs & Button */
.product-action-inputs {
	margin-top: 20px !important;
}
.btn-buy-now {
	height: 52px !important;
	border-radius: 8px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	background-color: var(--tm-blue) !important;
	border-color: var(--tm-blue) !important;
	color: #ffffff !important;
	text-transform: none !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	transition: all 0.2s ease !important;
	cursor: pointer !important;
	width: 100% !important;
}
.btn-buy-now:hover {
	background-color: var(--tm-blue-hover) !important;
	border-color: var(--tm-blue-hover) !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.25) !important;
}

/* ChatGPT Button */
.btn-chatgpt {
	background: linear-gradient(135deg, #10a37f 0%, #1a7f64 100%) !important;
	color: #ffffff !important;
	border: none !important;
	height: 44px !important;
	border-radius: 9999px !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	width: 100% !important;
	margin-top: 12px !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
}
.btn-chatgpt:hover {
	filter: brightness(1.1) !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 12px rgba(16, 163, 127, 0.2) !important;
}
.btn-chatgpt svg {
	width: 18px !important;
	height: 18px !important;
	fill: currentColor !important;
}

/* Payment Icons Badges */
.payment-icons-wrapper {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 6px !important;
	margin-top: 16px !important;
	margin-bottom: 16px !important;
	justify-content: center !important;
}
.footer-pay-badge {
	font-size: 10px !important;
	font-weight: 700 !important;
	color: #64748b !important;
	background-color: #f1f5f9 !important;
	padding: 4px 12px !important;
	border-radius: 9999px !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
}

/* Developer Block */
.product-developer-card {
	margin-top: 20px !important;
	border-top: 1px solid #cbd5e1 !important;
	padding-top: 16px !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}
.dev-badge-title {
	font-size: 10px !important;
	text-transform: uppercase !important;
	color: #94a3b8 !important;
	font-weight: 700 !important;
	letter-spacing: 0.5px !important;
}
.dev-info-box {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
}
.dev-logo {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 6px !important;
	width: 40px !important;
	height: 40px !important;
	background-color: #2a2b2e !important;
	overflow: hidden !important;
}
.dev-details {
	display: flex !important;
	flex-direction: column !important;
}
.dev-details a {
	font-size: 13px !important;
	font-weight: 700 !important;
	color: var(--tm-slate) !important;
	text-decoration: none !important;
}
.dev-details a:hover {
	color: var(--tm-blue) !important;
}
.dev-details span {
	font-size: 11px !important;
	color: #64748b !important;
}

/* 4. Product Page Tabs Section */
.product-tabs-section {
	margin-top: 40px !important;
	background-color: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 12px !important;
	padding: 24px !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}
.product-tabs-section .nav-tabs {
	border-bottom: 2px solid #e2e8f0 !important;
	display: flex !important;
	gap: 16px !important;
	margin-bottom: 24px !important;
}
.product-tabs-section .nav-tabs > li {
	float: none !important;
	margin-bottom: -2px !important;
}
.product-tabs-section .nav-tabs > li > a {
	border: none !important;
	background: transparent !important;
	color: #64748b !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	padding: 12px 4px !important;
	position: relative !important;
	border-radius: 0 !important;
	transition: color 0.2s !important;
}
.product-tabs-section .nav-tabs > li > a::after {
	content: '' !important;
	position: absolute !important;
	bottom: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: 2px !important;
	background-color: transparent !important;
	transition: background-color 0.2s !important;
}
.product-tabs-section .nav-tabs > li.active > a, 
.product-tabs-section .nav-tabs > li > a:hover {
	color: var(--tm-blue) !important;
}
.product-tabs-section .nav-tabs > li.active > a::after {
	background-color: var(--tm-blue) !important;
}
.product-tabs-section .tab-content {
	font-size: 14px !important;
	line-height: 1.7 !important;
	color: #475569 !important;
}

/* Review Form Styling inside Tab */
#form-review h2 {
	font-size: 20px !important;
	font-weight: 700 !important;
	margin-top: 0 !important;
	margin-bottom: 20px !important;
}
#form-review .control-label {
	font-weight: 600 !important;
	color: var(--tm-slate) !important;
	margin-bottom: 8px !important;
}
#form-review input.form-control,
#form-review textarea.form-control {
	border-radius: 8px !important;
	border: 1px solid #cbd5e1 !important;
	box-shadow: none !important;
	padding: 10px 14px !important;
	font-size: 14px !important;
	transition: all 0.2s ease !important;
}
#form-review input.form-control:focus,
#form-review textarea.form-control:focus {
	border-color: var(--tm-blue) !important;
	box-shadow: 0 0 0 3px rgba(87, 119, 255, 0.15) !important;
}
#form-review button#button-review {
	background-color: var(--tm-blue) !important;
	border-color: var(--tm-blue) !important;
	color: #ffffff !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	border-radius: 8px !important;
	transition: all 0.2s ease !important;
}
#form-review button#button-review:hover {
	background-color: var(--tm-blue-hover) !important;
	border-color: var(--tm-blue-hover) !important;
}
#form-review .form-group.required input[type="radio"] {
	margin: 0 4px !important;
	cursor: pointer !important;
	display: inline-block !important;
}

/* 5. Dark Theme Overrides for Product Page */
body.dark-theme .product-buy-box {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2) !important;
}
body.dark-theme .btn-prev-next {
	background-color: #334155 !important;
	color: #cbd5e1 !important;
}
body.dark-theme .btn-prev-next:hover {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
}
body.dark-theme .price-val, 
body.dark-theme .price-new {
	color: #ffffff !important;
}
body.dark-theme .wishlist-btn {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	color: #94a3b8 !important;
}
body.dark-theme .wishlist-btn:hover {
	background-color: #881337 !important;
	border-color: #f43f5e !important;
	color: #f43f5e !important;
}
body.dark-theme .product-buy-box .control-label {
	color: #cbd5e1 !important;
}
body.dark-theme .product-buy-box .form-control {
	background-color: #0f172a !important;
	border-color: #334155 !important;
	color: #ffffff !important;
}
body.dark-theme .product-buy-box .radio label,
body.dark-theme .product-buy-box .checkbox label {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	color: #cbd5e1 !important;
}
body.dark-theme .product-buy-box .radio label.active,
body.dark-theme .product-buy-box .checkbox label.active {
	background-color: rgba(87, 119, 255, 0.15) !important;
	border-color: var(--tm-blue) !important;
	color: #ffffff !important;
}
body.dark-theme .domain-option-group {
	background-color: #0f172a !important;
	border-color: #334155 !important;
}
body.dark-theme .domain-option-group .help-block {
	color: #94a3b8 !important;
}
body.dark-theme .domain-tooltip {
	color: #64748b !important;
}
body.dark-theme .domain-info-icon {
	color: #64748b !important;
}
body.dark-theme .footer-pay-badge {
	background-color: #334155 !important;
	color: #cbd5e1 !important;
}
body.dark-theme .product-developer-card {
	border-top-color: #334155 !important;
}
body.dark-theme .product-developer-card .dev-badge-title {
	color: #64748b !important;
}
body.dark-theme .product-developer-card .dev-details a {
	color: #ffffff !important;
}
body.dark-theme .product-developer-card .dev-details span {
	color: #cbd5e1 !important;
}
body.dark-theme .product-images-gallery .main-image a.thumbnail,
body.dark-theme .image-additional a.thumbnail {
	background-color: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme .product-images-gallery .main-image a.thumbnail:hover,
body.dark-theme .image-additional a.thumbnail:hover {
	border-color: var(--tm-blue) !important;
}
body.dark-theme .product-attributes-summary {
	background-color: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme .mod-param {
	border-bottom-color: #334155 !important;
}
body.dark-theme .param-name {
	color: #94a3b8 !important;
}
body.dark-theme .param-value {
	color: #ffffff !important;
}
body.dark-theme .product-tabs-section {
	background-color: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme .product-tabs-section .nav-tabs {
	border-bottom-color: #334155 !important;
}
body.dark-theme .product-tabs-section .nav-tabs > li > a {
	color: #94a3b8 !important;
}
body.dark-theme .product-tabs-section .nav-tabs > li.active > a {
	color: var(--tm-blue) !important;
}
body.dark-theme .product-tabs-section .tab-content {
	color: #cbd5e1 !important;
}
body.dark-theme #form-review .control-label {
	color: #cbd5e1 !important;
}
body.dark-theme #form-review input.form-control,
body.dark-theme #form-review textarea.form-control {
	background-color: #0f172a !important;
	border-color: #334155 !important;
	color: #ffffff !important;
}

/* ===== Оптимізація мобільної шапки та кошика ===== */
@media (max-width: 767px) {
	#header-main-row {
		padding: 10px 0 !important;
		min-height: 0 !important;
	}
	.header_col_logo {
		display: flex !important;
		align-items: center !important;
		min-height: 44px !important;
	}
	.header_col_logo .logo img {
		max-height: 44px !important;
	}
	.header_col_cart {
		display: flex !important;
		align-items: center !important;
		justify-content: flex-end !important;
		min-height: 44px !important;
	}
	#cart {
		display: inline-block !important;
	}
	#cart > .btn.mini_cart {
		background: transparent !important;
		border: none !important;
		box-shadow: none !important;
		padding: 0 !important;
		height: auto !important;
		min-height: 0 !important;
		display: inline-flex !important;
		align-items: center !important;
		gap: 10px !important;
		width: auto !important;
	}
	#cart > .btn.mini_cart:hover {
		box-shadow: none !important;
	}
	#cart > .btn.mini_cart .cart-title {
		display: none !important; /* Приховуємо текст "Кошик" на мобільному */
	}
	#cart > .btn.mini_cart .cart-total {
		font-size: 14px !important;
		color: #0f172a !important;
		font-weight: 700 !important;
	}
	#cart > .btn.mini_cart .cart-icon-wrap i {
		font-size: 24px !important;
		color: var(--tm-blue) !important;
	}
	#cart > .btn.mini_cart .cart-badge {
		top: -4px !important;
		right: -8px !important;
		background-color: #3b82f6 !important;
		color: #ffffff !important;
		font-size: 9px !important;
		min-width: 14px !important;
		height: 14px !important;
		line-height: 14px !important;
	}
	/* Темна тема для мобільного кошика */
	body.dark-theme #cart > .btn.mini_cart {
		background: transparent !important;
		border: none !important;
		box-shadow: none !important;
	}
	body.dark-theme #cart > .btn.mini_cart .cart-total {
		color: #ffffff !important;
	}
}

/* ===== Спливаючі сповіщення (Growl/Toast alerts) ===== */
.alert-dismissible {
	position: fixed !important;
	top: 24px !important;
	right: 24px !important;
	z-index: 9999999 !important;
	width: 360px !important;
	max-width: 90vw !important;
	padding: 16px 40px 16px 16px !important;
	border-radius: 12px !important;
	border: none !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	color: #0f172a !important;
	animation: alertSlideIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}
@keyframes alertSlideIn {
	from {
		transform: translateX(120%) scale(0.9);
		opacity: 0;
	}
	to {
		transform: translateX(0) scale(1);
		opacity: 1;
	}
}
.alert-success {
	background-color: #ecfdf5 !important;
	border-left: 4px solid #10b981 !important;
}
.alert-success i {
	color: #10b981 !important;
	margin-right: 8px !important;
	font-size: 16px !important;
}
.alert-info {
	background-color: #f0f9ff !important;
	border-left: 4px solid #0ea5e9 !important;
}
.alert-info i {
	color: #0ea5e9 !important;
	margin-right: 8px !important;
	font-size: 16px !important;
}
.alert-warning {
	background-color: #fffbeb !important;
	border-left: 4px solid #f59e0b !important;
}
.alert-warning i {
	color: #f59e0b !important;
	margin-right: 8px !important;
	font-size: 16px !important;
}
.alert-danger {
	background-color: #fef2f2 !important;
	border-left: 4px solid #ef4444 !important;
}
.alert-danger i {
	color: #ef4444 !important;
	margin-right: 8px !important;
	font-size: 16px !important;
}
.alert-dismissible .close {
	top: 14px !important;
	right: 14px !important;
	color: #64748b !important;
	opacity: 0.7 !important;
	font-size: 20px !important;
	outline: none !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
}
.alert-dismissible .close:hover {
	opacity: 1 !important;
}

/* ===== Іконки параметрів товару ===== */
.param-icon {
	color: var(--tm-blue);
	margin-right: 6px;
	font-size: 12px;
	width: 14px;
	text-align: center;
	opacity: 0.8;
}

/* ===== Анімації кнопок & Бейдж акції ===== */
.wishlist-btn:hover {
	transform: scale(1.08) !important;
	border-color: #f43f5e !important;
	color: #f43f5e !important;
	background-color: #fff1f2 !important;
}
.sale-badge {
	background-color: #ef4444 !important;
	color: #ffffff !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	padding: 2px 6px !important;
	border-radius: 4px !important;
	line-height: 1 !important;
	display: inline-block !important;
}
.product-buy-box {
	border: 1px solid #cbd5e1 !important;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04) !important;
	transition: all 0.3s ease;
}
.product-buy-box:hover {
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.07) !important;
}

/* ===== Dark Theme Overrides ===== */
body.dark-theme .alert-dismissible {
	background-color: #1e293b !important;
	color: #cbd5e1 !important;
}
body.dark-theme .alert-success {
	border-left-color: #10b981 !important;
}
body.dark-theme .alert-info {
	border-left-color: #0ea5e9 !important;
}
body.dark-theme .alert-warning {
	border-left-color: #f59e0b !important;
}
body.dark-theme .alert-danger {
	border-left-color: #ef4444 !important;
}
body.dark-theme .wishlist-btn:hover {
	background-color: #881337 !important;
	border-color: #f43f5e !important;
}

/* ===== Shopping Cart Page Redesign ===== */
#checkout-cart {
	margin-top: 30px;
	margin-bottom: 50px;
}
#checkout-cart h1 {
	font-size: 26px;
	font-weight: 700;
	color: var(--tm-slate);
	margin-bottom: 24px;
	margin-top: 10px;
	display: flex;
	align-items: center;
	gap: 8px;
}
#checkout-cart .table-responsive {
	background: #ffffff;
	border: 1px solid #cbd5e1;
	border-radius: 12px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.03);
	margin-bottom: 30px;
	overflow: hidden;
}
#checkout-cart .table {
	margin-bottom: 0;
	border-collapse: separate;
	border-spacing: 0;
}
#checkout-cart .table > thead > tr > td {
	background-color: #f8fafc;
	color: #475569;
	font-weight: 600;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 0.05em;
	padding: 14px 16px;
	border-bottom: 1px solid #e2e8f0;
	border-top: none;
}
#checkout-cart .table > tbody > tr > td {
	padding: 16px;
	vertical-align: middle;
	border-bottom: 1px solid #f1f5f9;
	border-top: none;
	background: #ffffff;
	color: var(--tm-slate);
	font-size: 14px;
}
#checkout-cart .table > tbody > tr:last-child > td {
	border-bottom: none;
}
#checkout-cart .table .img-thumbnail {
	max-width: 70px;
	height: auto;
	border-radius: 8px;
	border: 1px solid #e2e8f0;
	padding: 4px;
	background-color: #ffffff;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
#checkout-cart .table .img-thumbnail:hover {
	transform: scale(1.05);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
#checkout-cart .table a {
	color: var(--tm-slate);
	font-size: 15px;
	font-weight: 600;
	transition: color 0.2s ease;
}
#checkout-cart .table a:hover {
	color: var(--tm-blue);
}
#checkout-cart .table small {
	display: block;
	color: #64748b;
	font-size: 12px;
	margin-top: 3px;
}
#checkout-cart .input-group.btn-block {
	max-width: 140px !important;
	display: flex !important;
	align-items: center;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	overflow: hidden;
	background-color: #ffffff;
}
#checkout-cart .input-group.btn-block .form-control {
	border: none;
	height: 34px;
	box-shadow: none;
	text-align: center;
	font-weight: 600;
	color: var(--tm-slate);
	width: 50px !important;
	padding: 0;
	flex: 1;
}
#checkout-cart .input-group-btn {
	display: flex;
	align-items: stretch;
	height: 34px;
	width: auto;
}
#checkout-cart .input-group-btn .btn {
	border: none !important;
	border-radius: 0 !important;
	margin: 0 !important;
	height: 34px;
	width: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	transition: all 0.2s ease;
}
#checkout-cart .input-group-btn .btn-primary {
	background-color: #eef2ff !important;
	color: var(--tm-blue) !important;
}
#checkout-cart .input-group-btn .btn-primary:hover {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
}
#checkout-cart .input-group-btn .btn-danger {
	background-color: #fef2f2 !important;
	color: #ef4444 !important;
}
#checkout-cart .input-group-btn .btn-danger:hover {
	background-color: #ef4444 !important;
	color: #ffffff !important;
}

/* Accordion Panel Group styling */
#checkout-cart #accordion {
	margin-top: 20px;
	margin-bottom: 30px;
}
#checkout-cart h2 {
	font-size: 20px;
	font-weight: 700;
	color: var(--tm-slate);
	margin-top: 30px;
	margin-bottom: 10px;
}
#checkout-cart p {
	color: #64748b;
	margin-bottom: 20px;
}
#checkout-cart .panel-default {
	border: 1px solid #cbd5e1;
	border-radius: 12px !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.01);
	margin-bottom: 14px;
	overflow: hidden;
	background: #ffffff;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
#checkout-cart .panel-default:hover {
	border-color: #b4c6fc;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.04);
}
#checkout-cart .panel-heading {
	background-color: #ffffff !important;
	padding: 0;
	border-bottom: none;
}
#checkout-cart .panel-title {
	font-size: 15px;
	font-weight: 600;
}
#checkout-cart .panel-title a {
	display: block;
	padding: 16px 20px;
	color: var(--tm-slate);
	text-decoration: none;
	position: relative;
	transition: background-color 0.2s ease;
}
#checkout-cart .panel-title a:hover {
	background-color: #f8fafc;
	color: var(--tm-blue);
}
#checkout-cart .panel-title a::after {
	font-family: 'FontAwesome';
	content: "\f107";
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 16px;
	color: #94a3b8;
	transition: transform 0.2s ease;
}
#checkout-cart .panel-title a[aria-expanded="true"] {
	background-color: #f8fafc;
	color: var(--tm-blue);
	border-bottom: 1px solid #e2e8f0;
}
#checkout-cart .panel-title a[aria-expanded="true"]::after {
	transform: translateY(-50%) rotate(180deg);
	color: var(--tm-blue);
}
#checkout-cart .panel-body {
	padding: 20px;
	background-color: #ffffff;
	border-top: none !important;
}

/* Totals styling */
#checkout-cart .cart-totals-table {
	background: #ffffff;
	border: 1px solid #cbd5e1;
	border-radius: 12px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.02);
	overflow: hidden;
	margin-bottom: 24px;
	border-collapse: separate;
	border-spacing: 0;
}
#checkout-cart .cart-totals-table tr td {
	padding: 12px 20px;
	font-size: 14px;
	color: #475569;
	border-bottom: 1px solid #f1f5f9;
	border-top: none;
}
#checkout-cart .cart-totals-table tr:last-child td {
	border-bottom: none;
}
#checkout-cart .cart-totals-table tr td.label-td {
	color: #64748b;
	font-weight: 500;
}
#checkout-cart .cart-totals-table tr td.val-td {
	color: var(--tm-slate);
	font-weight: 600;
	font-size: 15px;
}
#checkout-cart .cart-totals-table tr.grand-total-row td {
	background-color: #f8fafc;
	border-top: 1px dashed #cbd5e1;
}
#checkout-cart .cart-totals-table tr.grand-total-row td.label-td {
	color: var(--tm-slate);
	font-weight: 700;
}
#checkout-cart .cart-totals-table tr.grand-total-row td.val-td {
	color: var(--tm-blue);
	font-size: 20px;
	font-weight: 700;
}

/* Checkout Footer Buttons */
#checkout-cart .buttons {
	margin-top: 30px;
	padding-top: 20px;
	border-top: 1px solid #e2e8f0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#checkout-cart .btn-default {
	background-color: #ffffff;
	color: #475569;
	border: 1px solid #cbd5e1;
	border-radius: 10px;
	font-weight: 500;
	padding: 12px 24px;
	font-size: 14px;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}
#checkout-cart .btn-default:hover {
	background-color: #f8fafc;
	color: var(--tm-slate);
	border-color: #94a3b8;
}
#checkout-cart .btn-checkout-action {
	background: var(--tm-blue);
	color: #ffffff;
	border: none;
	border-radius: 10px;
	font-weight: 600;
	padding: 12px 30px;
	font-size: 15px;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.2);
	transition: all 0.2s ease;
}
#checkout-cart .btn-checkout-action:hover {
	background: var(--tm-blue-hover);
	color: #ffffff;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(87, 119, 255, 0.3);
}

/* Mobile Responsive Cart Cards Styles */
@media (max-width: 767px) {
	#checkout-cart h1 {
		font-size: 22px;
		margin-bottom: 16px;
	}
	.cart-mobile-cards {
		margin-bottom: 24px;
	}
	.cart-mobile-card {
		background: #ffffff;
		border: 1px solid #cbd5e1;
		border-radius: 12px;
		padding: 16px;
		margin-bottom: 16px;
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
	}
	.cart-mobile-card .card-header {
		display: flex;
		gap: 16px;
		border-bottom: 1px dashed #f1f5f9;
		padding-bottom: 12px;
		margin-bottom: 12px;
		background: transparent;
		border-radius: 0;
	}
	.cart-mobile-card .card-thumb {
		width: 70px;
		flex-shrink: 0;
	}
	.cart-mobile-card .card-thumb img {
		border-radius: 8px;
		border: 1px solid #e2e8f0;
		padding: 2px;
	}
	.cart-mobile-card .card-title-area {
		flex: 1;
	}
	.cart-mobile-card .product-title {
		font-size: 14px;
		font-weight: 600;
		color: var(--tm-slate);
		line-height: 1.4;
		margin-bottom: 4px;
		display: block;
	}
	.cart-mobile-card .product-model {
		font-size: 12px;
		color: #64748b;
		margin-top: 2px;
	}
	.cart-mobile-card .product-options {
		font-size: 11px;
		color: #64748b;
		margin-top: 4px;
	}
	.cart-mobile-card .card-body {
		padding: 0;
	}
	.cart-mobile-card .card-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 8px;
		font-size: 14px;
	}
	.cart-mobile-card .card-row:last-child {
		margin-bottom: 0;
	}
	.cart-mobile-card .card-row .lbl {
		color: #64748b;
		font-weight: 500;
	}
	.cart-mobile-card .card-row .val {
		font-weight: 600;
		color: var(--tm-slate);
	}
	.cart-mobile-card .quantity-row {
		flex-direction: row;
		align-items: center;
	}
	.cart-mobile-card .total-row {
		border-top: 1px solid #f1f5f9;
		padding-top: 8px;
		margin-top: 8px;
	}
	.cart-mobile-card .total-row .val {
		color: var(--tm-blue);
		font-size: 16px;
		font-weight: 700;
	}
	.cart-mobile-card .input-group {
		border: 1px solid #cbd5e1;
		border-radius: 8px;
		overflow: hidden;
		background: #ffffff;
	}
	.cart-mobile-card .input-group .form-control {
		border: none;
		height: 30px;
		box-shadow: none;
		font-weight: 600;
	}
	.cart-mobile-card .input-group-btn .btn {
		height: 30px;
		width: 32px;
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	#checkout-cart .buttons {
		flex-direction: column-reverse;
		gap: 12px;
		align-items: stretch;
	}
	#checkout-cart .buttons .btn {
		width: 100%;
		text-align: center;
	}
}

/* ===== Dark Theme Overrides for Cart Page ===== */
body.dark-theme #checkout-cart h1,
body.dark-theme #checkout-cart h2,
body.dark-theme #checkout-cart p {
	color: #f1f5f9;
}
body.dark-theme #checkout-cart .table-responsive {
	background: #1e293b;
	border-color: #334155;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.2);
}
body.dark-theme #checkout-cart .table > thead > tr > td {
	background-color: #151e2e;
	color: #94a3b8;
	border-bottom-color: #334155;
}
body.dark-theme #checkout-cart .table > tbody > tr > td {
	background-color: #1e293b;
	color: #f1f5f9;
	border-bottom-color: #334155;
}
body.dark-theme #checkout-cart .table .img-thumbnail {
	border-color: #334155;
	background-color: #0f172a;
}
body.dark-theme #checkout-cart .table a {
	color: #f1f5f9;
}
body.dark-theme #checkout-cart .table a:hover {
	color: var(--tm-blue);
}
body.dark-theme #checkout-cart .table small {
	color: #94a3b8;
}
body.dark-theme #checkout-cart .input-group.btn-block {
	border-color: #334155;
	background-color: #0f172a;
}
body.dark-theme #checkout-cart .input-group.btn-block .form-control {
	background-color: #0f172a;
	color: #f1f5f9;
}
body.dark-theme #checkout-cart .input-group-btn .btn-primary {
	background-color: #1e293b !important;
	color: var(--tm-blue) !important;
}
body.dark-theme #checkout-cart .input-group-btn .btn-primary:hover {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
}
body.dark-theme #checkout-cart .input-group-btn .btn-danger {
	background-color: #311515 !important;
	color: #ef4444 !important;
}
body.dark-theme #checkout-cart .input-group-btn .btn-danger:hover {
	background-color: #ef4444 !important;
	color: #ffffff !important;
}

body.dark-theme #checkout-cart .panel-default {
	border-color: #334155;
	background: #1e293b;
}
body.dark-theme #checkout-cart .panel-default:hover {
	border-color: #4f46e5;
}
body.dark-theme #checkout-cart .panel-heading {
	background-color: #1e293b !important;
}
body.dark-theme #checkout-cart .panel-title a {
	color: #f1f5f9;
}
body.dark-theme #checkout-cart .panel-title a:hover {
	background-color: #151e2e;
}
body.dark-theme #checkout-cart .panel-title a[aria-expanded="true"] {
	background-color: #151e2e;
	border-bottom-color: #334155;
}
body.dark-theme #checkout-cart .panel-body {
	background-color: #1e293b;
	color: #cbd5e1;
}

body.dark-theme #checkout-cart .cart-totals-table {
	background: #1e293b;
	border-color: #334155;
}
body.dark-theme #checkout-cart .cart-totals-table tr td {
	color: #cbd5e1;
	border-bottom-color: #334155;
}
body.dark-theme #checkout-cart .cart-totals-table tr td.label-td {
	color: #94a3b8;
}
body.dark-theme #checkout-cart .cart-totals-table tr td.val-td {
	color: #f1f5f9;
}
body.dark-theme #checkout-cart .cart-totals-table tr.grand-total-row td {
	background-color: #151e2e;
	border-top-color: #334155;
}
body.dark-theme #checkout-cart .cart-totals-table tr.grand-total-row td.label-td {
	color: #f1f5f9;
}

body.dark-theme #checkout-cart .btn-default {
	background-color: #1e293b;
	color: #cbd5e1;
	border-color: #334155;
}
body.dark-theme #checkout-cart .btn-default:hover {
	background-color: #151e2e;
	color: #f1f5f9;
}

body.dark-theme .cart-mobile-card {
	background: #1e293b;
	border-color: #334155;
}
body.dark-theme .cart-mobile-card .card-header {
	border-bottom-color: #334155;
}
body.dark-theme .cart-mobile-card .card-thumb img {
	border-color: #334155;
	background-color: #0f172a;
}
body.dark-theme .cart-mobile-card .product-title {
	color: #f1f5f9;
}
body.dark-theme .cart-mobile-card .product-model,
body.dark-theme .cart-mobile-card .product-options,
body.dark-theme .cart-mobile-card .card-row .lbl {
	color: #94a3b8;
}
body.dark-theme .cart-mobile-card .card-row .val {
	color: #f1f5f9;
}
body.dark-theme .cart-mobile-card .total-row {
	border-top-color: #334155;
}
body.dark-theme .cart-mobile-card .input-group {
	border-color: #334155;
	background-color: #0f172a;
}
body.dark-theme .cart-mobile-card .input-group .form-control {
	background-color: #0f172a;
	color: #f1f5f9;
}

/* ===== One-Page Quick Checkout Page Styles ===== */
#checkout-quick-container {
	margin-top: 30px;
	margin-bottom: 50px;
}
#checkout-quick-container .checkout-main-title {
	font-weight: 700;
	font-size: 28px;
	margin-bottom: 30px;
	color: var(--tm-slate);
}
.checkout-quick-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
}
.checkout-left-col,
.checkout-right-col {
	margin-bottom: 30px;
}
.checkout-box {
	background: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: 16px;
	padding: 24px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
	height: 100%;
}
.cart-summary-box {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.cart-items-list {
	margin-bottom: 20px;
}
.cart-item-row {
	display: flex;
	align-items: center;
	padding: 16px 0;
	border-bottom: 1px dashed #e2e8f0;
	gap: 16px;
}
.cart-item-row:last-child {
	border-bottom: none;
}
.cart-item-row .item-thumb {
	width: 64px;
	height: 64px;
	flex-shrink: 0;
}
.cart-item-row .item-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 10px;
	border: 1px solid #e2e8f0;
	padding: 2px;
	background: #fff;
	transition: transform 0.2s ease;
}
.cart-item-row:hover .item-thumb img {
	transform: scale(1.05);
}
.cart-item-row .item-details {
	flex: 1;
}
.cart-item-row .item-name {
	font-size: 14px;
	font-weight: 600;
	color: var(--tm-slate);
	line-height: 1.4;
	display: block;
}
.cart-item-row .item-name:hover {
	color: var(--tm-blue);
}
.cart-item-row .item-options {
	margin-top: 4px;
	font-size: 11px;
	color: #64748b;
	line-height: 1.4;
}
.cart-item-row .item-remove {
	width: 32px;
	text-align: center;
}
.cart-item-row .btn-remove-item {
	background: #fef2f2;
	color: #ef4444;
	border: none;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	cursor: pointer;
	transition: all 0.2s ease;
}
.cart-item-row .btn-remove-item:hover {
	background: #ef4444;
	color: #ffffff;
	transform: scale(1.1);
}
.cart-item-row .item-total-price {
	font-size: 15px;
	font-weight: 700;
	color: var(--tm-slate);
	min-width: 80px;
}

.totals-and-payments-wrapper {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-top: 20px;
	padding-top: 20px;
	border-top: 2px solid #f1f5f9;
	gap: 20px;
	flex-wrap: wrap;
}
.accepted-payments-col {
	flex: 1;
	min-width: 200px;
}
.accepted-payments .payment-icons {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.accepted-payments .footer-pay-badge {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	color: #64748b;
	font-size: 10px;
	font-weight: 700;
	padding: 4px 8px;
	border-radius: 6px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}
.totals-col {
	width: 240px;
}
.table-totals {
	width: 100%;
}
.table-totals .total-row td {
	padding: 6px 0;
	font-size: 14px;
	color: #64748b;
}
.table-totals .total-row td.label-td {
	padding-right: 12px;
	font-weight: 500;
}
.table-totals .total-row td.val-td {
	font-weight: 600;
	color: var(--tm-slate);
}
.table-totals .total-row.grand-total td {
	font-size: 18px;
	font-weight: 700;
	color: var(--tm-blue);
	border-top: 1px solid #e2e8f0;
	padding-top: 12px;
	margin-top: 6px;
}
.table-totals .total-row.grand-total td.label-td {
	color: var(--tm-slate);
}

.customer-details-box .customer-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	border-bottom: 1px solid #f1f5f9;
	padding-bottom: 15px;
}
.customer-details-box .box-title {
	font-size: 18px;
	font-weight: 700;
	color: var(--tm-slate);
	margin: 0;
}
.customer-details-box .login-link-btn {
	font-size: 13px;
	font-weight: 600;
	color: var(--tm-blue);
	text-decoration: underline;
}
.customer-details-box .login-link-btn:hover {
	color: var(--tm-blue-hover);
}
.logged-info-badge {
	background: #f0fdf4;
	border: 1px solid #bbf7d0;
	color: #166534;
	border-radius: 10px;
	padding: 12px 16px;
	font-size: 13px;
	margin-bottom: 20px;
}
.logged-info-badge i {
	font-size: 16px;
	margin-right: 6px;
}
.customer-fields-wrapper {
	margin-bottom: 24px;
}
.customer-fields-wrapper .form-group {
	margin-bottom: 16px;
}
.customer-fields-wrapper .control-label {
	font-size: 13px;
	font-weight: 600;
	color: var(--tm-slate);
	margin-bottom: 6px;
}
.customer-fields-wrapper .quick-input {
	height: 44px;
	border-radius: 8px;
	border: 1px solid #cbd5e1;
	box-shadow: none;
	font-size: 14px;
	padding: 10px 14px;
	transition: all 0.2s ease;
	background-color: #fff;
}
.customer-fields-wrapper .quick-input:focus {
	border-color: var(--tm-blue);
	box-shadow: 0 0 0 3px rgba(87, 119, 255, 0.1);
	outline: none;
}
.payment-methods-wrapper {
	margin-bottom: 24px;
}
.payment-methods-wrapper .box-sub-title {
	font-size: 16px;
	font-weight: 700;
	color: var(--tm-slate);
	margin-bottom: 14px;
	margin-top: 0;
}
.payment-radios-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.payment-method-label {
	display: flex;
	align-items: center;
	padding: 12px 16px;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	cursor: pointer;
	transition: all 0.2s ease;
	background: #f8fafc;
	margin-bottom: 0 !important;
	font-weight: 500;
}
.payment-method-label:hover {
	border-color: #cbd5e1;
	background: #f1f5f9;
}
.payment-method-label input[type="radio"] {
	display: none;
}
.radio-custom-indicator {
	width: 18px;
	height: 18px;
	border: 2px solid #cbd5e1;
	border-radius: 50%;
	margin-right: 12px;
	display: inline-block;
	position: relative;
	background: #fff;
	transition: all 0.2s ease;
	flex-shrink: 0;
}
.payment-method-label.active {
	border-color: var(--tm-blue);
	background: var(--tm-light-blue);
}
.payment-method-label.active .radio-custom-indicator {
	border-color: var(--tm-blue);
}
.payment-method-label.active .radio-custom-indicator::after {
	content: "";
	display: block;
	width: 8px;
	height: 8px;
	background: var(--tm-blue);
	border-radius: 50%;
	position: absolute;
	top: 3px;
	left: 3px;
}
.payment-title-text {
	font-size: 14px;
	color: var(--tm-slate);
	font-weight: 600;
}

.coupon-section {
	margin-bottom: 24px;
	border-top: 1px solid #f1f5f9;
	padding-top: 16px;
}
.coupon-toggle-link {
	font-size: 13px;
	font-weight: 600;
	color: #64748b;
	text-decoration: none;
	border-bottom: 1px dashed #94a3b8;
	display: inline-block;
	transition: all 0.2s;
}
.coupon-toggle-link:hover {
	color: var(--tm-blue);
	border-bottom-color: var(--tm-blue);
}
#coupon-input-wrapper .input-group {
	width: 100%;
}
#coupon-input-wrapper .form-control {
	height: 38px;
	border-radius: 8px 0 0 8px;
	border: 1px solid #cbd5e1;
	border-right: none;
	box-shadow: none;
}
#coupon-input-wrapper .btn-default {
	height: 38px;
	border-radius: 0 8px 8px 0;
	background: #0f172a;
	color: #fff;
	font-weight: 600;
	border: 1px solid #0f172a;
	padding: 0 16px;
	font-size: 13px;
}
#coupon-input-wrapper .btn-default:hover {
	background: #1e293b;
	border-color: #1e293b;
}

.checkout-submit-wrapper {
	border-top: 1px solid #f1f5f9;
	padding-top: 20px;
}
.btn-checkout-submit {
	height: 50px;
	font-size: 16px;
	font-weight: 700;
	border-radius: 12px;
	background: #ffb700;
	color: #0f172a;
	border: none;
	box-shadow: 0 4px 12px rgba(255, 183, 0, 0.2);
	transition: all 0.2s ease;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
.btn-checkout-submit:hover {
	background: #e0a100;
	color: #0f172a;
	transform: translateY(-1px);
	box-shadow: 0 6px 16px rgba(255, 183, 0, 0.3);
}
.policy-agreement-text {
	margin-top: 12px;
	font-size: 11px;
	color: #64748b;
	line-height: 1.5;
}
.policy-agreement-text a {
	color: var(--tm-blue);
	text-decoration: underline;
}
.policy-agreement-text a:hover {
	color: var(--tm-blue-hover);
}

/* ===== Dark Theme Overrides for Checkout Page ===== */
body.dark-theme #checkout-quick-container .checkout-main-title {
	color: #f1f5f9;
}
body.dark-theme .checkout-box {
	background: #1e293b;
	border-color: #334155;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
body.dark-theme .cart-item-row {
	border-bottom-color: #334155;
}
body.dark-theme .cart-item-row .item-thumb img {
	border-color: #334155;
	background: #0f172a;
}
body.dark-theme .cart-item-row .item-name {
	color: #f1f5f9;
}
body.dark-theme .cart-item-row .item-name:hover {
	color: var(--tm-blue);
}
body.dark-theme .cart-item-row .item-options {
	color: #94a3b8;
}
body.dark-theme .cart-item-row .btn-remove-item {
	background: #311515;
	color: #ef4444;
}
body.dark-theme .cart-item-row .btn-remove-item:hover {
	background: #ef4444;
	color: #ffffff;
}
body.dark-theme .cart-item-row .item-total-price {
	color: #f1f5f9;
}
body.dark-theme .totals-and-payments-wrapper {
	border-top-color: #334155;
}
body.dark-theme .accepted-payments .footer-pay-badge {
	background: #0f172a;
	border-color: #334155;
	color: #94a3b8;
}
body.dark-theme .table-totals .total-row td {
	color: #94a3b8;
}
body.dark-theme .table-totals .total-row td.val-td {
	color: #f1f5f9;
}
body.dark-theme .table-totals .total-row.grand-total td {
	border-top-color: #334155;
	color: var(--tm-blue);
}
body.dark-theme .table-totals .total-row.grand-total td.label-td {
	color: #f1f5f9;
}

body.dark-theme .customer-details-box .customer-header {
	border-bottom-color: #334155;
}
body.dark-theme .customer-details-box .box-title {
	color: #f1f5f9;
}
body.dark-theme .customer-details-box .login-link-btn {
	color: var(--tm-blue);
}
body.dark-theme .customer-details-box .login-link-btn:hover {
	color: var(--tm-blue-hover);
}
body.dark-theme .logged-info-badge {
	background: #064e3b;
	border-color: #047857;
	color: #a7f3d0;
}
body.dark-theme .customer-fields-wrapper .control-label {
	color: #cbd5e1;
}
body.dark-theme .customer-fields-wrapper .quick-input {
	background-color: #0f172a;
	border-color: #334155;
	color: #f1f5f9;
}
body.dark-theme .customer-fields-wrapper .quick-input:focus {
	border-color: var(--tm-blue);
	box-shadow: 0 0 0 3px rgba(87, 119, 255, 0.15);
}
body.dark-theme .payment-methods-wrapper .box-sub-title {
	color: #cbd5e1;
}
body.dark-theme .payment-method-label {
	background: #151e2e;
	border-color: #334155;
}
body.dark-theme .payment-method-label:hover {
	background: #0f172a;
	border-color: #475569;
}
body.dark-theme .payment-method-label.active {
	background: #1e293b;
	border-color: var(--tm-blue);
}
body.dark-theme .radio-custom-indicator {
	background: #0f172a;
	border-color: #334155;
}
body.dark-theme .payment-title-text {
	color: #cbd5e1;
}

body.dark-theme .coupon-section {
	border-top-color: #334155;
}
body.dark-theme .coupon-toggle-link {
	color: #94a3b8;
	border-bottom-color: #475569;
}
body.dark-theme .coupon-toggle-link:hover {
	color: var(--tm-blue);
	border-bottom-color: var(--tm-blue);
}
body.dark-theme #coupon-input-wrapper .form-control {
	background-color: #0f172a;
	border-color: #334155;
	color: #f1f5f9;
}
body.dark-theme #coupon-input-wrapper .btn-default {
	background-color: #0f172a;
	border-color: #334155;
	color: #f1f5f9;
}
body.dark-theme #coupon-input-wrapper .btn-default:hover {
	background-color: #1e293b;
}

body.dark-theme .checkout-submit-wrapper {
	border-top-color: #334155;
}
body.dark-theme .policy-agreement-text {
	color: #94a3b8;
}

/* Responsive checkout spacing details */
@media (max-width: 991px) {
	.checkout-left-col {
		margin-bottom: 20px;
	}
	.checkout-box {
		padding: 20px;
	}
	.totals-and-payments-wrapper {
		flex-direction: column-reverse;
		align-items: stretch;
	}
	.totals-col {
		width: 100%;
		margin-bottom: 15px;
	}
	.accepted-payments-col {
		border-top: 1px dashed #e2e8f0;
		padding-top: 15px;
	}
	body.dark-theme .accepted-payments-col {
		border-top-color: #334155;
	}
}

/* ===== Category Page Design Improvements ===== */
.category-header-card {
	background: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: 16px;
	padding: 24px;
	margin-bottom: 24px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
	display: flex;
	align-items: center;
	gap: 24px;
}
.category-header-card .category-thumb {
	width: 80px;
	height: 80px;
	flex-shrink: 0;
}
.category-header-card .category-thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	border-radius: 12px;
	border: 1px solid #cbd5e1;
	padding: 4px;
	background: #fff;
}
.category-header-card .category-info {
	flex: 1;
}
.category-header-card h1 {
	font-size: 26px;
	font-weight: 700;
	margin-top: 0;
	margin-bottom: 8px;
	color: var(--tm-slate);
}
.category-header-card .category-description {
	font-size: 14px;
	color: #64748b;
	line-height: 1.6;
}

.refine-categories-wrapper {
	margin-bottom: 30px;
	background: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: 16px;
	padding: 24px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
}
.refine-title {
	font-size: 16px;
	font-weight: 700;
	margin-top: 0;
	margin-bottom: 16px;
	color: var(--tm-slate);
}
.refine-chips-list {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.refine-chip {
	display: inline-flex;
	align-items: center;
	background: #f8fafc;
	color: var(--tm-slate) !important;
	padding: 8px 16px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 600;
	transition: all 0.2s ease;
	border: 1px solid #e2e8f0;
	text-decoration: none;
	cursor: pointer;
}
.refine-chip:hover {
	background: var(--tm-light-blue);
	color: var(--tm-blue) !important;
	border-color: #c7d2fe;
	transform: translateY(-1px);
}
.refine-chip .chip-badge {
	background: #e2e8f0;
	color: #64748b;
	font-size: 11px;
	font-weight: 700;
	padding: 2px 8px;
	border-radius: 100px;
	margin-left: 8px;
	transition: all 0.2s ease;
	height: 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.refine-chip:hover .chip-badge {
	background: var(--tm-blue);
	color: #ffffff;
}

/* ===== Dark Theme Overrides for Category Page ===== */
body.dark-theme .category-header-card {
	background: #1e293b;
	border-color: #334155;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
body.dark-theme .category-header-card h1 {
	color: #f1f5f9;
}
body.dark-theme .category-header-card .category-description {
	color: #cbd5e1;
}
body.dark-theme .category-header-card .category-thumb img {
	border-color: #334155;
	background: #0f172a;
}
body.dark-theme .refine-categories-wrapper {
	background: #1e293b;
	border-color: #334155;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
body.dark-theme .refine-title {
	color: #f1f5f9;
}
body.dark-theme .refine-chip {
	background: #151e2e;
	border-color: #334155;
	color: #cbd5e1 !important;
}
body.dark-theme .refine-chip:hover {
	background: #1e293b;
	border-color: var(--tm-blue);
	color: var(--tm-blue) !important;
}
body.dark-theme .refine-chip .chip-badge {
	background: #0f172a;
	color: #94a3b8;
}
body.dark-theme .refine-chip:hover .chip-badge {
	background: var(--tm-blue);
	color: #ffffff;
}

/* Responsive adjustments for category header */
@media (max-width: 767px) {
	.category-header-card {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
		padding: 16px;
	}
	.category-header-card .category-thumb {
		width: 60px;
		height: 60px;
	}
	.category-header-card h1 {
		font-size: 20px;
	}
	.refine-categories-wrapper {
		padding: 16px;
	}
}

/* ===== PREMIUM PRODUCT CARDS REDESIGN (mockup style) ===== */

/* Grid Columns: Force exactly 3 columns on desktop (above 768px) */
@media (min-width: 1200px) {
	.products-grid-row {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}

/* 1. Card Wrapper & Shadows */
.product-thumb {
	position: relative !important;
	border-radius: 16px !important;
	border: 1px solid rgba(87, 119, 255, 0.12) !important;
	box-shadow: 0 10px 30px rgba(87, 119, 255, 0.04), 0 4px 12px rgba(0, 0, 0, 0.01) !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
	background-color: #ffffff !important;
}

.product-thumb:hover {
	transform: translateY(-5px) !important;
	box-shadow: 0 16px 36px rgba(87, 119, 255, 0.12), 0 8px 20px rgba(0, 0, 0, 0.02) !important;
	border-color: var(--tm-blue) !important;
}

/* Remove separating borders */
.product-thumb .image {
	border-bottom: none !important;
	padding: 15px 15px 0 15px !important;
	height: 350px !important;
	background-color: transparent !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

@media (min-width: 768px) {
	.product-thumb .image {
		padding: 20px 20px 0 20px !important;
		height: 350px !important;
	}
}

.product-thumb .image a {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	height: 100% !important;
}

.product-thumb .image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain !important;
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.product-thumb:hover .image img {
	transform: scale(1.06) !important;
}

/* 2. Caption Layout */
.product-thumb .caption {
	padding: 20px 20px 12px 20px !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}

/* 3. Title Styling (Uppercase, Blue) */
.product-thumb h4 {
	font-size: 15px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	margin: 0 !important;
	min-height: 42px !important;
	line-height: 1.4 !important;
}

.product-thumb h4 a {
	color: #1e3a8a !important; /* Premium dark blue from mockup */
	transition: color 0.2s ease !important;
}

.product-thumb h4 a:hover {
	color: var(--tm-blue-hover) !important;
}

/* 4. Author Label */
.product-thumb .author-label {
	font-size: 12px !important;
	color: #64748b !important;
	font-weight: 600 !important;
	margin-bottom: 2px !important;
	display: block !important;
	background: none !important;
	padding: 0 !important;
}

/* 5. Compatibility Badges */
.compatibility-tags {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 6px !important;
	margin-bottom: 2px !important;
}

.comp-badge {
	font-size: 11px !important;
	font-weight: 700 !important;
	padding: 3px 10px !important;
	border-radius: 9999px !important;
	text-transform: uppercase !important;
	display: inline-flex !important;
	align-items: center !important;
	letter-spacing: 0.2px !important;
}

.comp-badge.badge-blue {
	background-color: #e0f2fe !important;
	color: #0369a1 !important;
}

.comp-badge.badge-gray {
	background-color: #cbd5e1 !important;
	color: #334155 !important;
}

/* 6. Ratings & Comments Box */
.rating-box-wrapper {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	font-size: 12px !important;
	color: #475569 !important;
	margin: 4px 0 !important;
}

.rating-box-wrapper .rating {
	margin: 0 !important;
	display: flex !important;
	gap: 2px !important;
}

.rating-box-wrapper .rating i {
	color: #f59e0b !important; /* Gold stars */
	font-size: 13px !important;
}

.rating-box-wrapper .total-comments {
	font-size: 12px !important;
	color: #64748b !important;
	font-weight: 600 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
}

/* 7. Product Description (Shown in Grid View) */
.product-layout:not(.product-list) .product-thumb .caption p:not(.price) {
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	margin: 4px 0 8px 0 !important;
	font-size: 13px !important;
	color: #475569 !important;
	line-height: 1.5 !important;
	text-align: left !important;
	min-height: 38px !important;
}

/* 8. Button Group & Price */
.product-thumb .button-group {
	border-top: none !important;
	padding: 0 20px 20px 20px !important;
	background-color: transparent !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	margin-top: auto !important;
}

.product-thumb .price {
	font-size: 20px !important;
	font-weight: 700 !important;
	color: #1e3a8a !important; /* Bold blue price */
}

.product-thumb .price-new {
	color: #1e3a8a !important;
	font-weight: 700 !important;
}

.product-thumb .price-old {
	color: #94a3b8 !important;
	text-decoration: line-through !important;
	font-size: 13px !important;
	margin-left: 6px !important;
}

/* Pill Checkout Button */
.product-thumb .button-group button {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 9999px !important; /* Pill button */
	padding: 8px 24px !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	height: 40px !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.2) !important;
	transition: all 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
}

.product-thumb .button-group button:hover {
	background-color: var(--tm-blue-hover) !important;
	box-shadow: 0 6px 16px rgba(87, 119, 255, 0.3) !important;
	transform: translateY(-1px) !important;
}

/* ===== Dark Theme Overrides for Product Cards ===== */
body.dark-theme .product-thumb {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
}

body.dark-theme .product-thumb:hover {
	border-color: var(--tm-blue) !important;
	box-shadow: 0 16px 36px rgba(87, 119, 255, 0.15), 0 8px 20px rgba(0, 0, 0, 0.2) !important;
}

body.dark-theme .product-thumb h4 a {
	color: #ffffff !important;
}

body.dark-theme .product-thumb h4 a:hover {
	color: var(--tm-blue) !important;
}

body.dark-theme .product-thumb .author-label {
	color: #94a3b8 !important;
}

body.dark-theme .product-thumb .caption p:not(.price) {
	color: #cbd5e1 !important;
}

body.dark-theme .product-thumb .price {
	color: #38bdf8 !important; /* Sky blue/light blue in dark mode */
}

body.dark-theme .product-thumb .price-new {
	color: #38bdf8 !important;
}

body.dark-theme .comp-badge.badge-gray {
	background-color: #334155 !important;
	color: #cbd5e1 !important;
}

body.dark-theme .rating-box-wrapper .total-comments {
	color: #cbd5e1 !important;
}

/* ===== Spacing & Alignment matching product card style ===== */

/* 1. Category Header Card Styling */
.category-header-card {
	border-radius: 16px !important;
	border: 1px solid rgba(87, 119, 255, 0.12) !important;
	box-shadow: 0 10px 30px rgba(87, 119, 255, 0.04), 0 4px 12px rgba(0, 0, 0, 0.01) !important;
	background-color: #ffffff !important;
	transition: all 0.3s ease !important;
}

body.dark-theme .category-header-card {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
}

/* 2. Refine Subcategories Box Styling */
.refine-categories-wrapper {
	border-radius: 16px !important;
	border: 1px solid rgba(87, 119, 255, 0.12) !important;
	box-shadow: 0 10px 30px rgba(87, 119, 255, 0.04), 0 4px 12px rgba(0, 0, 0, 0.01) !important;
	background-color: #ffffff !important;
	transition: all 0.3s ease !important;
}

body.dark-theme .refine-categories-wrapper {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
}

/* 3. Sidebar Categories Menu (yo-menu) Styling */
.yo-menu {
	border-radius: 16px !important;
	border: 1px solid rgba(87, 119, 255, 0.12) !important;
	box-shadow: 0 10px 30px rgba(87, 119, 255, 0.04), 0 4px 12px rgba(0, 0, 0, 0.01) !important;
	background-color: #ffffff !important;
	overflow: hidden !important;
	transition: all 0.3s ease !important;
}

.yo-heading {
	border: none !important;
	border-bottom: 1px solid rgba(87, 119, 255, 0.12) !important;
	border-radius: 16px 16px 0 0 !important;
	background-color: var(--tm-light-blue) !important;
	color: var(--tm-blue) !important;
	padding: 14px 18px !important;
}

.yo-heading span {
	font-weight: 700 !important;
	letter-spacing: 0.3px !important;
}

.yo-wrapper {
	border: none !important;
	border-radius: 0 0 16px 16px !important;
}

.yo-am li a {
	padding: 12px 18px !important;
	background-color: #ffffff !important;
	border-bottom: 1px solid #f8fafc !important;
}

.yo-am li a:hover {
	background-color: var(--tm-light-blue) !important;
	color: var(--tm-blue) !important;
}

.yo-am li.active > a {
	background-color: var(--tm-light-blue) !important;
	color: var(--tm-blue) !important;
}

.yo-am li ul {
	background-color: #fcfdfe !important;
	border-top: 1px solid #eef2ff !important;
}

.yo-am li ul li a {
	padding-left: 36px !important;
	background-color: #fcfdfe !important;
}

/* Sidebar Menu Dark Mode Overrides */
body.dark-theme .yo-menu {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
}

body.dark-theme .yo-heading {
	background-color: #151e2e !important;
	border-bottom-color: #334155 !important;
	color: #ffffff !important;
}

body.dark-theme .yo-am li a {
	background-color: #1e293b !important;
	color: #cbd5e1 !important;
	border-bottom-color: #1e293b !important;
}

body.dark-theme .yo-am li a:hover {
	background-color: #151e2e !important;
	color: #ffffff !important;
}

body.dark-theme .yo-am li.active > a {
	background-color: #151e2e !important;
	color: #ffffff !important;
}

body.dark-theme .yo-am li ul {
	background-color: #0f172a !important;
	border-top-color: #334155 !important;
}

body.dark-theme .yo-am li ul li a {
	background-color: #0f172a !important;
}

body.dark-theme .yo-am li a span.am-badge {
	background-color: #0f172a !important;
	color: #94a3b8 !important;
}

body.dark-theme .yo-am li a:hover span.am-badge,
body.dark-theme .yo-am li.active > a span.am-badge {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
}

/* Card Height Collapse Fix for CSS Grid Layout on Desktop */
.product-layout:not(.product-list) .product-thumb {
	height: 100% !important;
	display: flex !important;
	flex-direction: column !important;
}

.product-layout:not(.product-list) .product-thumb > div:last-child {
	flex-grow: 0 !important;
	display: flex !important;
	flex-direction: row !important;
	justify-content: space-between !important;
}

.product-layout:not(.product-list) .product-thumb .caption {
	flex-grow: 1 !important;
}

/* ===== 4. Filter and Sort Bar Styling ===== */
.filter-sort-bar {
	background-color: #ffffff !important;
	border: 1px solid rgba(87, 119, 255, 0.12) !important;
	border-radius: 16px !important;
	padding: 12px 20px !important;
	margin-bottom: 24px !important;
	box-shadow: 0 10px 30px rgba(87, 119, 255, 0.04), 0 4px 12px rgba(0, 0, 0, 0.01) !important;
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 16px !important;
}

.filter-sort-bar::before,
.filter-sort-bar::after {
	display: none !important;
	content: none !important;
}

/* Remove default Bootstrap margins/padding from columns inside sort bar */
.filter-sort-bar > div {
	padding: 0 !important;
	margin: 0 !important;
	float: none !important;
	width: auto !important;
	flex: 0 0 auto !important;
}

/* Specific alignments for elements in sort bar */
.filter-sort-bar .btn-group {
	display: inline-flex !important;
	gap: 4px !important;
}

.filter-sort-bar .btn-group button {
	background: #f8fafc !important;
	border: 1px solid #cbd5e1 !important;
	color: #64748b !important;
	border-radius: 8px !important;
	width: 36px !important;
	height: 36px !important;
	padding: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.2s ease !important;
}

.filter-sort-bar .btn-group button:hover,
.filter-sort-bar .btn-group button.active {
	background: var(--tm-light-blue) !important;
	color: var(--tm-blue) !important;
	border-color: #c7d2fe !important;
}

.filter-sort-bar .form-group {
	margin: 0 !important;
	display: flex !important;
}

/* Compare link styling */
.filter-sort-bar #compare-total,
.filter-sort-bar #wishlist-total-link {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--tm-blue) !important;
	text-decoration: none !important;
	padding: 8px 16px !important;
	background-color: var(--tm-light-blue) !important;
	border-radius: 8px !important;
	transition: all 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
}

.filter-sort-bar #compare-total:hover,
.filter-sort-bar #wishlist-total-link:hover {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
}

/* Dropdown input group styling */
.filter-sort-bar .sort-group {
	display: flex !important;
	flex-direction: row !important;
	width: 100% !important;
	align-items: center !important;
	border: 1px solid #cbd5e1 !important;
	border-radius: 8px !important;
	background-color: #f8fafc !important;
	overflow: hidden !important;
	height: 36px !important;
}

.filter-sort-bar .sort-label {
	background: #f1f5f9 !important;
	color: #64748b !important;
	border: none !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	padding: 0 12px !important;
	height: 100% !important;
	display: flex !important;
	align-items: center !important;
	white-space: nowrap !important;
	flex: 0 0 auto !important;
	position: static !important;
	float: none !important;
	margin: 0 !important;
}

.filter-sort-bar select.sort-select {
	background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364748b' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19.5 8.25l-7.5 7.5-7.5-7.5'/%3E%3C/svg%3E") no-repeat right 12px center !important;
	background-size: 12px !important;
	border: none !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: var(--tm-slate) !important;
	padding: 0 32px 0 12px !important;
	height: 100% !important;
	box-shadow: none !important;
	outline: none !important;
	cursor: pointer !important;
	flex: 1 1 auto !important;
	width: 1% !important;
	min-width: 175px !important;
	display: block !important;
	position: static !important;
	float: none !important;
	margin: 0 !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	appearance: none !important;
}

/* Flex layout spacing on desktop */
@media (min-width: 992px) {
	.filter-sort-bar {
		justify-content: space-between !important;
	}
	.filter-sort-bar > div:last-child {
		margin-left: auto !important; /* Push sorting options to the right */
	}
}

@media (max-width: 767px) {
	.filter-sort-bar {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 12px !important;
		padding: 16px !important;
	}
	.filter-sort-bar > div {
		width: 100% !important;
	}
	.filter-sort-bar .btn-group {
		width: 100% !important;
	}
	.filter-sort-bar .btn-group button {
		flex: 1 !important;
	}
	.filter-sort-bar #compare-total,
	.filter-sort-bar #wishlist-total-link {
		width: 100% !important;
		justify-content: center !important;
	}
	.filter-sort-bar .sort-group {
		width: 100% !important;
	}
	.filter-sort-bar select.sort-select {
		width: 1% !important;
		flex: 1 1 auto !important;
	}
}

/* Dark Mode Overrides for sort bar */
body.dark-theme .filter-sort-bar {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
}

body.dark-theme .filter-sort-bar .btn-group button {
	background: #151e2e !important;
	border-color: #334155 !important;
	color: #94a3b8 !important;
}

body.dark-theme .filter-sort-bar .btn-group button:hover,
body.dark-theme .filter-sort-bar .btn-group button.active {
	background: #1e293b !important;
	color: var(--tm-blue) !important;
	border-color: var(--tm-blue) !important;
}

body.dark-theme .filter-sort-bar #compare-total,
body.dark-theme .filter-sort-bar #wishlist-total-link {
	background-color: #151e2e !important;
	color: #38bdf8 !important;
}

body.dark-theme .filter-sort-bar #compare-total:hover,
body.dark-theme .filter-sort-bar #wishlist-total-link:hover {
	background-color: var(--tm-blue) !important;
	color: #ffffff !important;
}

body.dark-theme .filter-sort-bar .sort-group {
	border-color: #334155 !important;
	background-color: #151e2e !important;
}

body.dark-theme .filter-sort-bar .sort-label {
	background: #1e293b !important;
	color: #94a3b8 !important;
}

body.dark-theme .filter-sort-bar select.sort-select {
	color: #ffffff !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2394a3b8' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19.5 8.25l-7.5 7.5-7.5-7.5'/%3E%3C/svg%3E") !important;
}


/* ===== 5. Product Cards - List View Layout ===== */

.products-grid-row:has(.product-list),
.products-grid-row.list-active {
	display: flex !important;
	flex-direction: column !important;
	gap: 20px !important;
}

.products-grid-row:has(.product-list) .product-layout,
.products-grid-row.list-active .product-layout {
	width: 100% !important;
	margin-bottom: 0 !important;
}

.product-list .product-thumb {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 20px !important;
	border-radius: 16px !important;
	border: 1px solid rgba(87, 119, 255, 0.12) !important;
	box-shadow: 0 10px 30px rgba(87, 119, 255, 0.04), 0 4px 12px rgba(0, 0, 0, 0.01) !important;
	background-color: #ffffff !important;
	min-height: 180px !important;
	gap: 20px !important;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.product-list .product-thumb:hover {
	transform: translateY(-3px) !important;
	box-shadow: 0 16px 36px rgba(87, 119, 255, 0.12), 0 8px 20px rgba(0, 0, 0, 0.02) !important;
	border-color: var(--tm-blue) !important;
}

.product-list .product-thumb .image {
	width: 150px !important;
	height: 150px !important;
	flex-shrink: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
	background: transparent !important;
}

.product-list .product-thumb .image img {
	max-height: 100% !important;
	max-width: 100% !important;
	object-fit: contain !important;
}

.product-list .product-thumb .caption {
	flex-grow: 1 !important;
	padding: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;
	margin: 0 !important;
}

.product-list .product-thumb .caption p:not(.price) {
	display: -webkit-box !important;
	-webkit-line-clamp: 3 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	margin: 4px 0 !important;
	font-size: 13px !important;
	color: #475569 !important;
	line-height: 1.5 !important;
	min-height: auto !important;
}

.product-list .product-thumb .button-group {
	flex-shrink: 0 !important;
	width: 180px !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-end !important;
	justify-content: center !important;
	gap: 12px !important;
	padding: 0 !important;
	border-left: 1px dashed rgba(87, 119, 255, 0.15) !important;
	padding-left: 20px !important;
	margin: 0 !important;
	border-top: none !important;
}

.product-list .product-thumb .button-group .price-box {
	text-align: right !important;
	width: 100% !important;
}

.product-list .product-thumb .button-group button {
	width: 100% !important;
	height: 40px !important;
}

/* Mobile Responsive List View */
@media (max-width: 767px) {
	.product-list .product-thumb {
		flex-direction: column !important;
		align-items: stretch !important;
		padding: 16px !important;
		gap: 16px !important;
	}
	
	.product-list .product-thumb .image {
		width: 100% !important;
		height: 160px !important;
		margin-bottom: 8px !important;
	}
	
	.product-list .product-thumb .caption {
		margin-right: 0 !important;
	}
	
	.product-list .product-thumb .button-group {
		width: 100% !important;
		border-left: none !important;
		border-top: 1px dashed rgba(87, 119, 255, 0.15) !important;
		padding-left: 0 !important;
		padding-top: 16px !important;
		align-items: center !important;
	}
	
	.product-list .product-thumb .button-group .price-box {
		text-align: center !important;
	}
}

/* Dark Theme List View Overrides */
body.dark-theme .product-list .product-thumb {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
}

body.dark-theme .product-list .product-thumb .button-group {
	border-left-color: #334155 !important;
}

@media (max-width: 767px) {
	body.dark-theme .product-list .product-thumb .button-group {
		border-top-color: #334155 !important;
	}
}

/* Floating Wishlist Button on Product Cards */
.product-thumb .btn-wishlist {
	position: absolute !important;
	top: 16px !important;
	right: 16px !important;
	width: 36px !important;
	height: 36px !important;
	border-radius: 50% !important;
	background-color: #ffffff !important;
	border: 1px solid rgba(87, 119, 255, 0.12) !important;
	color: #94a3b8 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	cursor: pointer !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
	z-index: 10 !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
	padding: 0 !important;
	outline: none !important;
}

.product-thumb .btn-wishlist:hover {
	color: #ef4444 !important;
	background-color: #fef2f2 !important;
	border-color: #fca5a5 !important;
	transform: scale(1.1) !important;
}

.product-thumb .btn-wishlist i {
	font-size: 16px !important;
	line-height: 1 !important;
	display: inline-block !important;
}

body.dark-theme .product-thumb .btn-wishlist {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	color: #64748b !important;
}

body.dark-theme .product-thumb .btn-wishlist:hover {
	background-color: #271c24 !important;
	color: #ef4444 !important;
	border-color: #ef4444 !important;
}

/* Custom Premium Pill Button Shapes Alignment */
.btn-primary:not(#checkout-cart .input-group-btn .btn) {
	background-color: var(--tm-blue) !important;
	border-color: var(--tm-blue) !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 9999px !important;
	padding: 10px 28px !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.2) !important;
	transition: all 0.2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	height: auto !important;
}

.btn-primary:not(#checkout-cart .input-group-btn .btn):hover,
.btn-primary:not(#checkout-cart .input-group-btn .btn):active,
.btn-primary:not(#checkout-cart .input-group-btn .btn):focus {
	background-color: var(--tm-blue-hover) !important;
	border-color: var(--tm-blue-hover) !important;
	box-shadow: 0 6px 16px rgba(87, 119, 255, 0.3) !important;
	transform: translateY(-1px) !important;
	color: #ffffff !important;
}

/* Catalog button in header */
#menu .nav > li.catalog-item > a {
	border-radius: 9999px !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.2) !important;
}
#menu .nav > li.catalog-item > a:hover,
#menu .nav > li.catalog-item.open > a {
	box-shadow: 0 6px 16px rgba(87, 119, 255, 0.3) !important;
	transform: translateY(-1px) !important;
}

/* Header cart button */
#cart > .btn.mini_cart {
	border-radius: 9999px !important;
}
#cart > .btn.mini_cart:hover {
	transform: translateY(-1px) !important;
}

/* Product page buy button */
.btn-buy-now {
	border-radius: 9999px !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.2) !important;
}
.btn-buy-now:hover {
	box-shadow: 0 6px 16px rgba(87, 119, 255, 0.3) !important;
}

/* Quick checkout submit button */
.btn-checkout-submit {
	border-radius: 9999px !important;
}

/* Shopping cart page checkout button */
#checkout-cart .btn-checkout-action {
	border-radius: 9999px !important;
}

/* Shopping cart page continue shopping button */
#checkout-cart .btn-default {
	border-radius: 9999px !important;
	padding: 12px 30px !important;
}

/* Language switcher buttons */
.language-inline-selector .btn-lang-item {
	border-radius: 9999px !important;
	padding: 4px 12px !important;
}

/* Review write button */
#form-review button#button-review {
	border-radius: 9999px !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.2) !important;
}
#form-review button#button-review:hover {
	box-shadow: 0 6px 16px rgba(87, 119, 255, 0.3) !important;
	transform: translateY(-1px) !important;
}

/* Quick checkout modal login button */
#btn-modal-login {
	border-radius: 9999px !important;
}

/* ===== Premium Account Sidebar List Group ===== */
.list-group {
	background: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
	margin-bottom: 30px;
}
.list-group a.list-group-item {
	background-color: #ffffff;
	border: none;
	border-bottom: 1px dashed #e2e8f0;
	color: #475569;
	font-weight: 500;
	font-size: 14px;
	padding: 12px 20px;
	transition: all 0.2s ease;
}
.list-group a.list-group-item:last-child {
	border-bottom: none;
}
.list-group a.list-group-item:hover,
.list-group a.list-group-item.active,
.list-group a.list-group-item.active:hover {
	background-color: #eef2ff !important;
	color: var(--tm-blue) !important;
	padding-left: 24px !important;
	border: none !important;
}

/* ===== Wishlist Page Premium Styles ===== */
#account-wishlist {
	margin-top: 30px;
	margin-bottom: 50px;
}
#account-wishlist .wishlist-main-title {
	font-weight: 700;
	font-size: 28px;
	margin-bottom: 24px;
	color: var(--tm-slate);
}
.wishlist-table-box {
	background: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
	margin-bottom: 30px;
}
.wishlist-table-box .table-responsive {
	border: none !important;
	margin: 0 !important;
}
.wishlist-table {
	margin: 0 !important;
	border: none !important;
}
.wishlist-table thead tr td {
	background-color: #f8fafc !important;
	color: #475569 !important;
	font-weight: 700 !important;
	font-size: 13px !important;
	text-transform: uppercase !important;
	border-bottom: 1px solid var(--tm-border) !important;
	padding: 14px 20px !important;
	border-top: none !important;
	border-left: none !important;
	border-right: none !important;
}
.wishlist-table tbody tr td {
	vertical-align: middle !important;
	border-bottom: 1px dashed #cbd5e8 !important;
	padding: 16px 20px !important;
	color: #334155;
	border-top: none !important;
	border-left: none !important;
	border-right: none !important;
}
.wishlist-table tbody tr:last-child td {
	border-bottom: none !important;
}
.wishlist-table .image-td img {
	border-radius: 8px;
	border: 1px solid #e2e8f0;
	padding: 2px;
	max-width: 60px;
	transition: transform 0.2s ease;
}
.wishlist-table .image-td img:hover {
	transform: scale(1.05);
}
.wishlist-table .name-td a.product-title-link {
	font-weight: 600;
	color: var(--tm-slate);
	font-size: 14px;
	transition: color 0.2s;
}
.wishlist-table .name-td a.product-title-link:hover {
	color: var(--tm-blue);
}
.wishlist-table .model-td {
	color: #64748b;
	font-size: 13px;
}

/* Stock status badges */
.stock-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	padding: 4px 10px;
	border-radius: 9999px;
}
.stock-badge.in-stock {
	background-color: #f0fdf4;
	color: #16a34a;
	border: 1px solid #bbf7d0;
}
.stock-badge.out-of-stock {
	background-color: #fef2f2;
	color: #dc2626;
	border: 1px solid #fecaca;
}

/* Price block */
.price-wrapper {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
.price-regular, .price-new {
	font-weight: 700;
	font-size: 15px;
	color: var(--tm-slate);
}
.price-old {
	font-size: 12px;
	color: #94a3b8;
	text-decoration: line-through;
	margin-top: 2px;
}

/* Action buttons wrapper */
.action-buttons-wrap {
	display: inline-flex;
	gap: 8px;
	justify-content: center;
	align-items: center;
}
.btn-action-cart, .btn-action-remove {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	cursor: pointer;
	transition: all 0.2s ease;
	border: none;
}
.btn-action-cart {
	background-color: #eef2ff;
	color: var(--tm-blue);
}
.btn-action-cart:hover {
	background-color: var(--tm-blue);
	color: #ffffff;
	transform: scale(1.05);
}
.btn-action-remove {
	background-color: #fef2f2;
	color: #ef4444;
}
.btn-action-remove:hover {
	background-color: #ef4444;
	color: #ffffff;
	transform: scale(1.05);
}

/* Wishlist empty state */
.wishlist-empty-box {
	background: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: 16px;
	padding: 40px 20px;
	text-align: center;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
	margin-bottom: 30px;
}
.wishlist-empty-box i {
	color: #94a3b8 !important;
}
.wishlist-empty-box p {
	font-size: 15px;
	color: #64748b;
	margin: 0;
}

/* Wishlist footer continue button area */
.wishlist-footer-buttons {
	margin-top: 20px;
}
.btn-continue-wishlist {
	border-radius: 9999px !important;
	padding: 12px 30px !important;
}

/* Mobile responsive cards for wishlist */
.wishlist-mobile-cards {
	margin-bottom: 24px;
}
.wishlist-mobile-card {
	background: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: 16px;
	padding: 16px;
	margin-bottom: 16px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
}
.wishlist-mobile-card .card-header {
	display: flex;
	gap: 12px;
	border-bottom: 1px dashed #f1f5f9;
	padding-bottom: 12px;
	margin-bottom: 12px;
	position: relative;
}
.wishlist-mobile-card .card-thumb {
	width: 60px;
	flex-shrink: 0;
}
.wishlist-mobile-card .card-thumb img {
	border-radius: 8px;
	border: 1px solid #e2e8f0;
	padding: 2px;
	width: 100%;
}
.wishlist-mobile-card .card-title-area {
	flex: 1;
	padding-right: 24px;
}
.wishlist-mobile-card .product-title {
	font-size: 14px;
	font-weight: 600;
	color: var(--tm-slate);
	line-height: 1.4;
	display: block;
}
.wishlist-mobile-card .product-model {
	font-size: 12px;
	color: #64748b;
	margin-top: 4px;
}
.wishlist-mobile-card .btn-card-remove {
	position: absolute;
	right: 0;
	top: 0;
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #94a3b8;
	font-size: 14px;
}
.wishlist-mobile-card .btn-card-remove:hover {
	color: #ef4444;
}
.wishlist-mobile-card .card-body {
	padding: 0;
}
.wishlist-mobile-card .card-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
	font-size: 13px;
}
.wishlist-mobile-card .card-row:last-child {
	margin-bottom: 0;
}
.wishlist-mobile-card .card-row .lbl {
	color: #64748b;
	font-weight: 500;
}
.wishlist-mobile-card .card-row .val {
	font-weight: 600;
	color: var(--tm-slate);
}
.wishlist-mobile-card .price-row {
	margin-top: 8px;
	border-top: 1px dashed #f1f5f9;
	padding-top: 8px;
}
.wishlist-mobile-card .price-row .val {
	color: var(--tm-blue);
}
.wishlist-mobile-card .card-footer {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px dashed #f1f5f9;
}

/* ===== Dark Theme Overrides for Wishlist and List-Group ===== */
body.dark-theme #mob-search-form {
	background-color: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme .list-group {
	background: #1e293b;
	border-color: #334155;
	box-shadow: none;
}
body.dark-theme .list-group a.list-group-item {
	background-color: #1e293b;
	color: #cbd5e1;
	border-bottom-color: #334155;
}
body.dark-theme .list-group a.list-group-item:hover,
body.dark-theme .list-group a.list-group-item.active {
	background-color: #151e2e !important;
	color: #ffffff !important;
}
body.dark-theme #account-wishlist h1.wishlist-main-title {
	color: #ffffff;
}
body.dark-theme .wishlist-table-box {
	background: #1e293b;
	border-color: #334155;
}
body.dark-theme .wishlist-table thead tr td {
	background-color: #151e2e !important;
	color: #94a3b8 !important;
	border-bottom-color: #334155 !important;
}
body.dark-theme .wishlist-table tbody tr td {
	border-bottom-color: #334155 !important;
	color: #cbd5e1;
}
body.dark-theme .wishlist-table .image-td img {
	border-color: #334155;
	background-color: #0f172a;
}
body.dark-theme .wishlist-table .name-td a.product-title-link {
	color: #ffffff;
}
body.dark-theme .wishlist-table .name-td a.product-title-link:hover {
	color: var(--tm-blue);
}
body.dark-theme .wishlist-table .model-td {
	color: #94a3b8;
}
body.dark-theme .stock-badge.in-stock {
	background-color: #052e16;
	color: #4ade80;
	border-color: #14532d;
}
body.dark-theme .stock-badge.out-of-stock {
	background-color: #450a0a;
	color: #f87171;
	border-color: #7f1d1d;
}
body.dark-theme .price-regular,
body.dark-theme .price-new {
	color: #ffffff;
}
body.dark-theme .price-old {
	color: #64748b;
}
body.dark-theme .btn-action-cart {
	background-color: #151e2e;
	color: var(--tm-blue);
}
body.dark-theme .btn-action-cart:hover {
	background-color: var(--tm-blue);
	color: #ffffff;
}
body.dark-theme .btn-action-remove {
	background-color: #311515;
	color: #ef4444;
}
body.dark-theme .btn-action-remove:hover {
	background-color: #ef4444;
	color: #ffffff;
}
body.dark-theme .wishlist-empty-box {
	background-color: #1e293b;
	border-color: #334155;
}
body.dark-theme .wishlist-empty-box p {
	color: #cbd5e1;
}
body.dark-theme .wishlist-mobile-card {
	background-color: #1e293b;
	border-color: #334155;
}
body.dark-theme .wishlist-mobile-card .card-header {
	border-bottom-color: #334155;
}
body.dark-theme .wishlist-mobile-card .card-thumb img {
	border-color: #334155;
	background-color: #0f172a;
}
body.dark-theme .wishlist-mobile-card .product-title {
	color: #ffffff;
}
body.dark-theme .wishlist-mobile-card .product-model,
body.dark-theme .wishlist-mobile-card .card-row .lbl {
	color: #94a3b8;
}
body.dark-theme .wishlist-mobile-card .card-row .val {
	color: #ffffff;
}
body.dark-theme .wishlist-mobile-card .price-row {
	border-top-color: #334155;
}
body.dark-theme .wishlist-mobile-card .card-footer {
	border-top-color: #334155;
}

/* ===== SaaS Product Page Layout: Sticky Buy Column (v1.2.90) ===== */

/* Make product-info-wrapper a flex row on desktop so sticky works */
@media (min-width: 768px) {
	.product-info-wrapper {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: flex-start !important;
		gap: 24px !important;
	}
	/* Left wide column (image + attributes + tabs) */
	.product-main-col {
		flex: 1 1 auto !important;
		min-width: 0 !important;
	}
	/* Right narrow column (buy box) — sticky */
	.product-buy-col {
		flex: 0 0 340px !important;
		max-width: 340px !important;
		position: sticky !important;
		top: 20px !important;
		align-self: flex-start !important;
	}
}

/* Product buy box card premium styling */
.product-buy-box {
	background: #ffffff;
	border: 1px solid rgba(87, 119, 255, 0.12);
	border-radius: 16px !important;
	box-shadow: 0 8px 32px rgba(87, 119, 255, 0.06), 0 2px 8px rgba(0,0,0,0.04);
	padding: 24px !important;
}

/* Product tabs — SaaS underline style */
.product-tabs-section .nav-tabs {
	border-bottom: 2px solid #e2e8f0 !important;
	display: flex !important;
	gap: 4px !important;
	flex-wrap: nowrap !important;
	overflow-x: auto !important;
	margin-bottom: 20px !important;
	background: transparent !important;
}
.product-tabs-section .nav-tabs > li > a {
	border: none !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: #64748b !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	padding: 10px 18px !important;
	white-space: nowrap !important;
	border-bottom: 3px solid transparent !important;
	margin-bottom: -2px !important;
	transition: color 0.2s, border-color 0.2s !important;
}
.product-tabs-section .nav-tabs > li > a:hover {
	color: var(--tm-blue) !important;
	border-bottom-color: rgba(87, 119, 255, 0.3) !important;
	background: transparent !important;
}
.product-tabs-section .nav-tabs > li.active > a,
.product-tabs-section .nav-tabs > li.active > a:hover,
.product-tabs-section .nav-tabs > li.active > a:focus {
	color: var(--tm-blue) !important;
	border-bottom-color: var(--tm-blue) !important;
	background: transparent !important;
	box-shadow: none !important;
}
.product-tabs-section .tab-content {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	padding: 24px !important;
}

/* Product attributes summary card */
.product-attributes-summary {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	padding: 16px !important;
	margin-bottom: 20px !important;
}

/* Dark theme overrides for product page */
body.dark-theme .product-buy-box {
	background: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
}
body.dark-theme .product-tabs-section .nav-tabs {
	border-bottom-color: #334155 !important;
}
body.dark-theme .product-tabs-section .nav-tabs > li > a {
	color: #94a3b8 !important;
}
body.dark-theme .product-tabs-section .nav-tabs > li > a:hover {
	color: var(--tm-blue) !important;
}
body.dark-theme .product-tabs-section .nav-tabs > li.active > a {
	color: var(--tm-blue) !important;
	border-bottom-color: var(--tm-blue) !important;
}
body.dark-theme .product-tabs-section .tab-content {
	background: #0f172a !important;
	border-color: #334155 !important;
}
body.dark-theme .product-attributes-summary {
	background: #0f172a !important;
	border-color: #334155 !important;
}

/* Mobile: un-sticky the buy column */
@media (max-width: 767px) {
	.product-info-wrapper {
		flex-direction: column !important;
	}
	.product-main-col,
	.product-buy-col {
		flex: 0 0 100% !important;
		max-width: 100% !important;
		position: static !important;
	}
	.product-buy-box {
		padding: 16px !important;
	}
}

/* ===== SaaS Product Hero Layout (v1.2.94) ===== */

/* Hide leftover old wrapper row — now content is outside it */
.row.product-info-wrapper,
.saas-compat-extras,
#content > .row.product-info-wrapper {
	display: none !important;
}

/* Main horizontal hero wrapper */
.saas-product-hero {
	display: flex;
	gap: 32px;
	align-items: flex-start;
	margin-bottom: 40px;
	position: relative;
}

/* Left column (54%) */
.saas-hero-left {
	flex: 0 0 54%;
	max-width: 54%;
}

/* Right column (43%) */
.saas-hero-right {
	flex: 0 0 43%;
	max-width: 43%;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* Product title */
.saas-product-title {
	font-size: 30px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	color: #0f172a !important;
	margin: 0 0 14px 0 !important;
}

/* macOS Browser mockup frame */
.saas-hero-image-wrap {
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 12px 48px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
	background: #ffffff;
	border: 1px solid #e2e8f0;
	margin-bottom: 30px;
}
.saas-browser-bar {
	background: #f1f5f9;
	padding: 10px 16px;
	display: flex;
	align-items: center;
	gap: 6px;
	border-bottom: 1px solid #e2e8f0;
}
.saas-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	display: inline-block;
}
.saas-dot-red    { background: #ff5f57; }
.saas-dot-yellow { background: #febc2e; }
.saas-dot-green  { background: #28c840; }
.saas-url-bar {
	margin-left: 12px;
	font-size: 12px;
	color: #94a3b8;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 20px;
	padding: 2px 14px;
	flex: 1;
}
/* Swiper Image Slider */
.saas-main-image-slider {
	position: relative;
	width: 100%;
	height: 420px;
	background: #ffffff;
}
.saas-main-image-slider .swiper-slide {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #ffffff;
	height: 100%;
}
.saas-main-image-link {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	height: 100% !important;
}
.saas-main-image {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}
.saas-image-slider-prev,
.saas-image-slider-next {
	width: 36px !important;
	height: 36px !important;
	border-radius: 50% !important;
	background-color: rgba(255, 255, 255, 0.9) !important;
	border: 1px solid #e2e8f0 !important;
	box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
	color: #475569 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin-top: -18px !important;
	transition: all 0.2s ease !important;
	background-image: none !important;
	z-index: 10 !important;
}
.saas-image-slider-prev:before,
.saas-image-slider-next:before,
.saas-image-slider-prev:after,
.saas-image-slider-next:after {
	display: none !important;
	content: "" !important;
}
.saas-image-slider-prev:hover,
.saas-image-slider-next:hover {
	background-color: #ffffff !important;
	color: var(--tm-blue) !important;
	transform: scale(1.05) !important;
	border-color: #c7d2fe !important;
}
.saas-image-slider-prev {
	left: 16px !important;
}
.saas-image-slider-next {
	right: 16px !important;
}
.saas-image-slider-prev i,
.saas-image-slider-next i {
	font-size: 14px !important;
}
.saas-image-slider-pagination {
	bottom: 12px !important;
	z-index: 10 !important;
}
.saas-image-slider-pagination .swiper-pagination-bullet-active {
	background: var(--tm-blue) !important;
}

/* Thumbnail strip */
.saas-thumb-strip {
	display: flex;
	gap: 10px;
	padding: 12px 16px;
	background: #f8fafc;
	border-top: 1px solid #e2e8f0;
	overflow-x: auto;
}
.saas-thumb-item {
	flex: 0 0 80px;
	cursor: pointer;
}
.saas-thumb-item img {
	width: 80px;
	height: 54px;
	object-fit: contain;
	background: #ffffff;
	border-radius: 6px;
	border: 1px solid #cbd5e1;
	transition: all 0.2s ease;
	box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}
.saas-thumb-item:hover img,
.saas-thumb-item.active img {
	border-color: var(--tm-blue);
	box-shadow: 0 2px 8px rgba(87, 119, 255, 0.15);
	transform: translateY(-2px);
}

/* Price + buy row */
.saas-price-buy-row {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 16px;
	margin-bottom: 10px;
	width: 100%;
}

/* Horizontal price row */
.saas-price-row-horizontal {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: #ffffff;
	border: 1px solid rgba(87, 119, 255, 0.15);
	border-radius: 12px;
	padding: 16px 20px;
	box-shadow: 0 4px 16px rgba(87, 119, 255, 0.03);
	width: 100%;
	transition: all 0.25s ease;
}
.saas-price-row-horizontal:hover {
	border-color: var(--tm-blue);
	box-shadow: 0 6px 20px rgba(87, 119, 255, 0.06);
}
.saas-price-value-wrap {
	display: flex;
	align-items: baseline;
	gap: 10px;
}
.saas-price-amount {
	font-size: 28px;
	font-weight: 850;
	color: #0f172a;
	line-height: 1;
}
.saas-price-special-old {
	font-size: 18px;
	color: #94a3b8;
	text-decoration: line-through;
	font-weight: 500;
}
.saas-price-special-new {
	color: #ef4444;
}
.saas-price-license-badge {
	background: #eef2ff;
	color: var(--tm-blue);
	font-size: 11px;
	font-weight: 700;
	padding: 6px 14px;
	border-radius: 9999px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	border: 1px solid #dbeafe;
}


/* Buy actions */
.saas-buy-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
	flex: 1;
	min-width: 0;
}

/* Product Options inside form */
.saas-product-form {
	width: 100%;
}
.saas-options-wrap {
	width: 100%;
	margin-bottom: 16px;
}
.saas-options-wrap .form-group {
	margin-bottom: 16px;
}
.saas-options-wrap .control-label {
	font-weight: 600;
	font-size: 13px;
	color: #475569;
	margin-bottom: 6px;
	display: block;
}
.saas-options-wrap .form-control {
	border: 1px solid #cbd5e1;
	border-radius: 8px !important;
	padding: 10px 14px !important;
	height: auto !important;
	font-size: 14px !important;
	color: #334155 !important;
	background-color: #ffffff !important;
	box-shadow: none !important;
	transition: border-color 0.2s, box-shadow 0.2s !important;
}
.saas-options-wrap .form-control:focus {
	border-color: var(--tm-blue) !important;
	box-shadow: 0 0 0 3px rgba(87, 119, 255, 0.12) !important;
}
.saas-options-wrap textarea.form-control {
	resize: vertical;
	min-height: 100px;
}

/* Custom Radios & Checkboxes */
.saas-options-wrap .radio,
.saas-options-wrap .checkbox {
	margin: 8px 0 !important;
	padding: 0 !important;
}
.saas-options-wrap .radio label,
.saas-options-wrap .checkbox label {
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #334155 !important;
	cursor: pointer !important;
	padding: 6px 12px !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 8px !important;
	background: #ffffff !important;
	width: 100% !important;
	min-height: 42px !important;
	transition: all 0.2s ease !important;
	box-sizing: border-box !important;
}
.saas-options-wrap .radio label:hover,
.saas-options-wrap .checkbox label:hover {
	border-color: rgba(87, 119, 255, 0.3) !important;
	background: #f8fafc !important;
}
.saas-options-wrap .radio label.active,
.saas-options-wrap .checkbox label.active {
	border-color: var(--tm-blue) !important;
	background: rgba(87, 119, 255, 0.04) !important;
	color: var(--tm-blue) !important;
}
.saas-options-wrap input[type="radio"],
.saas-options-wrap input[type="checkbox"] {
	appearance: none !important;
	-webkit-appearance: none !important;
	width: 18px !important;
	height: 18px !important;
	border: 2px solid #cbd5e1 !important;
	border-radius: 50% !important;
	outline: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 !important;
	background: #ffffff !important;
	cursor: pointer !important;
	position: relative !important;
	flex-shrink: 0 !important;
	transition: border-color 0.2s, background-color 0.2s !important;
}
.saas-options-wrap input[type="checkbox"] {
	border-radius: 4px !important;
}
.saas-options-wrap input[type="radio"]:checked {
	border-color: var(--tm-blue) !important;
	background: var(--tm-blue) !important;
}
.saas-options-wrap input[type="radio"]:checked::after {
	content: '' !important;
	width: 6px !important;
	height: 6px !important;
	border-radius: 50% !important;
	background: #ffffff !important;
	display: block !important;
}
.saas-options-wrap input[type="checkbox"]:checked {
	border-color: var(--tm-blue) !important;
	background: var(--tm-blue) !important;
}
.saas-options-wrap input[type="checkbox"]:checked::after {
	content: '' !important;
	width: 4px !important;
	height: 8px !important;
	border: solid white !important;
	border-width: 0 2px 2px 0 !important;
	transform: rotate(45deg) !important;
	display: block !important;
	margin-top: -2px !important;
}

/* Option images */
.option-image-thumb {
	width: 28px !important;
	height: 28px !important;
	object-fit: cover !important;
	border-radius: 4px !important;
	border: 1px solid #e2e8f0 !important;
	padding: 0 !important;
	margin: 0 !important;
}
.option-price-prefix {
	font-size: 12px;
	color: #64748b;
	margin-left: auto;
}
.saas-options-wrap .radio label.active .option-price-prefix,
.saas-options-wrap .checkbox label.active .option-price-prefix {
	color: var(--tm-blue);
}

/* File Upload option button */
.saas-options-wrap .btn-upload-option {
	background: #f8fafc !important;
	border: 1px dashed #cbd5e1 !important;
	border-radius: 8px !important;
	color: #475569 !important;
	font-weight: 600 !important;
	padding: 12px 20px !important;
	transition: all 0.2s !important;
	width: 100% !important;
	text-align: center !important;
	box-shadow: none !important;
	height: auto !important;
}
.saas-options-wrap .btn-upload-option:hover {
	background: #f1f5f9 !important;
	border-color: var(--tm-blue) !important;
	color: var(--tm-blue) !important;
}

/* Date / Time options input groups */
.saas-options-wrap .input-group .form-control {
	border-radius: 8px 0 0 8px !important;
}
.saas-options-wrap .input-group .input-group-btn .btn {
	border-radius: 0 8px 8px 0 !important;
	border: 1px solid #cbd5e1 !important;
	border-left: none !important;
	background: #f8fafc !important;
	color: #64748b !important;
	padding: 10px 16px !important;
	height: 42px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-shadow: none !important;
}

/* Buy now button */
.saas-buy-btn {
	width: 100% !important;
	border-radius: 9999px !important;
	padding: 14px 24px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	letter-spacing: 0.01em !important;
	background: var(--tm-blue) !important;
	border-color: var(--tm-blue) !important;
	box-shadow: 0 4px 16px rgba(87, 119, 255, 0.3) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	transition: background 0.2s, box-shadow 0.2s, transform 0.15s !important;
	margin-bottom: 12px !important;
	white-space: nowrap !important;
}
.saas-buy-btn:hover {
	background: #3d60f0 !important;
	box-shadow: 0 6px 20px rgba(87, 119, 255, 0.45) !important;
	transform: translateY(-1px) !important;
}

/* Wishlist text button */
.saas-wishlist-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: transparent;
	border: 1px solid #e2e8f0;
	border-radius: 9999px;
	padding: 8px 22px;
	font-size: 13px;
	font-weight: 600;
	color: #64748b;
	cursor: pointer;
	transition: color 0.2s, border-color 0.2s, background-color 0.2s;
}
.saas-wishlist-btn:hover {
	color: #ef4444;
	border-color: #fca5a5;
	background-color: #fef2f2;
}
.saas-wishlist-btn .fa-heart {
	color: #ef4444;
}

/* Compatibility badges */
.saas-compat-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 14px;
}
.saas-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 600;
	padding: 4px 12px;
	border-radius: 9999px;
	letter-spacing: 0.02em;
}
.saas-badge-green {
	background: #dcfce7;
	color: #166534;
	border: 1px solid #bbf7d0;
}
.saas-badge-blue {
	background: #dbeafe;
	color: #1e40af;
	border: 1px solid #bfdbfe;
}

/* Rating row */
.saas-rating-row {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 14px;
}
.saas-stars {
	display: flex;
	gap: 2px;
}
.saas-stars .fa-star {
	color: #f59e0b;
	font-size: 15px;
}
.saas-stars .fa-star-o {
	color: #d1d5db;
	font-size: 15px;
}
.saas-rating-text {
	font-weight: 700;
	font-size: 14px;
	color: #374151;
}
.saas-rating-link {
	font-size: 13px;
	color: #64748b;
	text-decoration: none;
}
.saas-rating-link:hover {
	color: var(--tm-blue);
	text-decoration: underline;
}

/* Release Details Card */
.saas-metadata-card {
	background: #ffffff;
	border: 1px solid rgba(87, 119, 255, 0.12);
	border-radius: 16px;
	box-shadow: 0 10px 30px rgba(87, 119, 255, 0.04), 0 4px 12px rgba(0, 0, 0, 0.01);
	padding: 20px;
	width: 100%;
}
.saas-metadata-title {
	font-size: 15px;
	font-weight: 700;
	color: #0f172a;
	margin: 0 0 14px 0;
	padding-bottom: 8px;
	border-bottom: 1px dashed #e2e8f0;
}
.saas-metadata-rows {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.saas-metadata-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 13px;
}
.saas-meta-label {
	color: #64748b;
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.saas-meta-label i {
	font-size: 12px;
	color: #94a3b8;
	width: 14px;
	text-align: center;
}
.saas-meta-value {
	color: #0f172a;
	font-weight: 600;
}

/* Payment icons */
.saas-payment-icons {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: flex-start;
	width: 100%;
	margin-top: 4px;
}

/* Developer row */
.saas-developer-row {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: #64748b;
	margin-top: 4px;
}
.saas-dev-link {
	font-weight: 600;
	color: #0f172a;
	text-decoration: none;
}
.saas-dev-link:hover {
	color: var(--tm-blue);
}
.saas-dev-sep {
	color: #d1d5db;
}
.saas-dev-subtitle {
	color: #94a3b8;
}

/* ChatGPT Button */
.saas-chatgpt-btn {
	width: 100% !important;
	border-radius: 9999px !important;
	padding: 10px 20px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	box-shadow: 0 4px 12px rgba(16, 163, 127, 0.15) !important;
	margin-top: 4px !important;
}

/* Tabs Section (Full width, below hero) */
.saas-tabs-section {
	margin-top: 40px;
	margin-bottom: 40px;
}
.saas-nav-tabs {
	background: #eef2ff !important;
	border: 1px solid rgba(87, 119, 255, 0.1) !important;
	border-radius: 30px !important;
	display: inline-flex !important;
	padding: 4px !important;
	gap: 4px !important;
	flex-wrap: nowrap !important;
	overflow-x: auto !important;
	margin-bottom: 0 !important;
}
.saas-nav-tabs > li {
	float: none !important;
	display: inline-block !important;
}
.saas-nav-tabs > li > a {
	border: none !important;
	border-radius: 26px !important;
	background: transparent !important;
	color: #475569 !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	padding: 8px 20px !important;
	white-space: nowrap !important;
	transition: all 0.25s ease !important;
	margin-bottom: 0 !important;
	display: block !important;
}
.saas-nav-tabs > li > a:hover {
	color: var(--tm-blue) !important;
	background: rgba(87, 119, 255, 0.05) !important;
}
.saas-nav-tabs > li.active > a,
.saas-nav-tabs > li.active > a:hover,
.saas-nav-tabs > li.active > a:focus {
	color: var(--tm-blue) !important;
	background: #ffffff !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.12) !important;
	border-bottom: none !important;
}
.saas-tab-content {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 16px !important;
	padding: 32px !important;
	margin-top: 16px !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02) !important;
}

/* Dark theme overrides */
body.dark-theme .saas-product-title {
	color: #f1f5f9 !important;
}
body.dark-theme .saas-hero-image-wrap {
	background: #1e293b;
	border-color: #334155;
}
body.dark-theme .saas-main-image-slider,
body.dark-theme .saas-main-image-slider .swiper-slide {
	background: #1e293b !important;
}
body.dark-theme .saas-image-slider-prev,
body.dark-theme .saas-image-slider-next {
	background-color: rgba(30, 41, 59, 0.9) !important;
	border-color: #334155 !important;
	color: #94a3b8 !important;
}
body.dark-theme .saas-image-slider-prev:hover,
body.dark-theme .saas-image-slider-next:hover {
	background-color: #334155 !important;
	color: #ffffff !important;
	border-color: #475569 !important;
}
body.dark-theme .saas-browser-bar {
	background: #0f172a;
	border-color: #334155;
}
body.dark-theme .saas-url-bar {
	background: #1e293b;
	border-color: #334155;
	color: #64748b;
}
body.dark-theme .saas-thumb-strip {
	background: #0f172a;
	border-color: #334155;
}
body.dark-theme .saas-thumb-item img {
	background: #1e293b;
	border-color: #334155;
}
body.dark-theme .saas-thumb-item:hover img,
body.dark-theme .saas-thumb-item.active img {
	border-color: var(--tm-blue);
}
body.dark-theme .saas-price-row-horizontal {
	background: #1e293b;
	border-color: #334155;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}
body.dark-theme .saas-price-row-horizontal:hover {
	border-color: #475569;
}
body.dark-theme .saas-price-amount {
	color: #f1f5f9;
}
body.dark-theme .saas-price-license-badge {
	background: #0f172a;
	color: #60a5fa;
	border-color: #1e293b;
}
body.dark-theme .saas-metadata-card {
	background: #1e293b;
	border-color: #334155;
}
body.dark-theme .saas-metadata-title {
	color: #f1f5f9;
	border-bottom-color: #334155;
}
body.dark-theme .saas-meta-value {
	color: #f1f5f9;
}
body.dark-theme .saas-wishlist-btn {
	border-color: #334155;
	color: #94a3b8;
}
body.dark-theme .saas-wishlist-btn:hover {
	background-color: rgba(239, 68, 68, 0.15);
	border-color: #ef4444;
}
body.dark-theme .saas-dev-link {
	color: #f1f5f9;
}
body.dark-theme .saas-nav-tabs {
	background: #0f172a !important;
	border-color: #334155 !important;
}
body.dark-theme .saas-nav-tabs > li > a {
	color: #94a3b8 !important;
}
body.dark-theme .saas-nav-tabs > li > a:hover {
	color: #60a5fa !important;
	background: rgba(96, 165, 250, 0.05) !important;
}
body.dark-theme .saas-nav-tabs > li.active > a,
body.dark-theme .saas-nav-tabs > li.active > a:hover,
body.dark-theme .saas-nav-tabs > li.active > a:focus {
	background: #1e293b !important;
	color: #60a5fa !important;
	box-shadow: none !important;
}
body.dark-theme .saas-tab-content {
	background: #1e293b !important;
	border-color: #334155 !important;
	color: #cbd5e1 !important;
	box-shadow: none !important;
}

/* Mobile viewports */
@media (max-width: 991px) {
	.saas-product-hero {
		flex-direction: column !important;
		gap: 24px !important;
	}
	.saas-hero-left,
	.saas-hero-right {
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}
	.saas-product-title {
		font-size: 24px !important;
	}
	.saas-main-image {
		max-height: 320px !important;
	}
	.saas-image-slider-prev,
	.saas-image-slider-next {
		display: none !important;
	}
	.saas-price-buy-row {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 16px !important;
	}
	.saas-price-amount {
		font-size: 24px !important;
	}
	.saas-price-row-horizontal {
		padding: 14px 18px !important;
	}
	.saas-buy-btn {
		width: 100% !important;
		justify-content: center !important;
	}
	.saas-tab-content {
		padding: 16px !important;
	}
	.saas-sub-nav-links {
		display: none !important;
	}
}

/* ===== SAAS SUB NAVIGATION ===== */
.saas-sub-nav {
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid rgba(226, 232, 240, 0.8);
	border-radius: 12px;
	padding: 12px 24px;
	margin-top: 15px;
	margin-bottom: 25px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
	position: sticky;
	top: 15px;
	z-index: 1000;
}
.saas-sub-nav-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.saas-sub-nav-left {
	display: flex;
	align-items: center;
	gap: 12px;
}
.saas-sub-nav-thumb {
	width: 32px;
	height: 32px;
	border-radius: 6px;
	object-fit: cover;
	border: 1px solid #e2e8f0;
	background: #ffffff;
}
.saas-sub-nav-brand {
	font-weight: 700;
	font-size: 15px;
	color: #0f172a;
}
.saas-sub-nav-right {
	display: flex;
	align-items: center;
	gap: 16px;
}
.saas-sub-nav-price {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	line-height: 1.2;
}
.sub-nav-price-amount,
.sub-nav-price-new {
	font-size: 16px;
	font-weight: 700;
	color: #0f172a;
}
.sub-nav-price-old {
	font-size: 12px;
	color: #94a3b8;
	text-decoration: line-through;
}
.saas-sub-nav-buy-btn {
	border-radius: 9999px !important;
	padding: 8px 18px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	line-height: 1 !important;
}
.saas-sub-nav-buy-btn i {
	font-size: 13px !important;
}
.saas-sub-nav-links {
	display: flex;
	gap: 20px;
}
.sub-nav-link {
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	padding: 4px 12px;
	border-radius: 9999px;
	transition: all 0.2s ease;
}
.sub-nav-link:hover, .sub-nav-link.active {
	color: var(--tm-blue);
	background: var(--tm-light-blue);
}

/* ===== SAAS FEATURES GRID SECTION ===== */
.saas-features-outer-wrap {
	background: #f8fafc;
	border-top: 1px solid #e2e8f0;
	border-bottom: 1px solid #e2e8f0;
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	padding: 45px 0;
	width: 100vw;
	margin-bottom: 40px;
}
.saas-features-container {
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 15px;
}
.saas-benefits-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	width: 100%;
}
.saas-benefit-card {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 16px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	align-items: flex-start;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.015);
}
.saas-benefit-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 24px rgba(15, 23, 42, 0.04), 0 2px 4px rgba(15, 23, 42, 0.02);
	border-color: rgba(87, 119, 255, 0.2);
}
.saas-benefit-icon-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: var(--benefit-bg, #eef2ff);
	border: 1px solid var(--benefit-border, #dbeafe);
	color: var(--benefit-color, var(--tm-blue));
	flex-shrink: 0;
}
.saas-benefit-icon-img {
	width: 24px;
	height: 24px;
	object-fit: contain;
}
.saas-benefit-icon-fa {
	font-size: 20px;
}
.saas-benefit-icon-raw svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}
.saas-benefit-content {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.saas-benefit-title {
	font-size: 16px;
	font-weight: 700;
	color: #0f172a;
	margin: 0;
}
.saas-benefit-desc {
	font-size: 13px;
	line-height: 1.5;
	color: #475569;
	margin: 0;
}

/* ===== SAAS LIVE DEMO BLOCK ===== */
.saas-demo-section-wrap {
	max-width: 1400px;
	margin: 32px auto 0 auto;
	padding: 0 15px;
	width: 100%;
}
.saas-demo-card {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 20px;
	padding: 30px;
	display: flex;
	align-items: center;
	gap: 24px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02);
	flex-wrap: wrap;
}
.saas-demo-icon {
	width: 56px;
	height: 56px;
	background: #e0f2fe;
	color: #0284c7;
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 26px;
	flex-shrink: 0;
}
.saas-demo-info {
	flex: 1;
	min-width: 280px;
}
.saas-demo-title {
	font-size: 18px;
	font-weight: 700;
	color: #0f172a;
	margin: 0 0 6px 0;
}
.saas-demo-text {
	font-size: 13px;
	color: #64748b;
	margin: 0;
	line-height: 1.5;
}
.saas-demo-actions {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}
.btn-demo {
	font-size: 14px;
	font-weight: 600;
	padding: 10px 20px;
	border-radius: 9999px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	transition: all 0.2s;
	border: 1px solid transparent;
}
.btn-demo-store {
	background: #0284c7;
	color: #ffffff !important;
}
.btn-demo-store:hover {
	background: #0369a1;
	transform: translateY(-1px);
}
.btn-demo-admin {
	background: #ffffff;
	border-color: #cbd5e1;
	color: #334155 !important;
}
.btn-demo-admin:hover {
	background: #f8fafc;
	border-color: #94a3b8;
	transform: translateY(-1px);
}
.saas-demo-credentials {
	width: 100%;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 8px 16px;
	display: flex;
	gap: 20px;
	font-size: 12px;
	color: #475569;
}
.cred-item strong {
	color: #0f172a;
}

/* ===== UPGRADED BUY BUTTON STYLING ===== */
.saas-buy-btn {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 16px !important;
	padding: 12px 28px !important;
}
.saas-buy-btn-icon-wrap {
	font-size: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0.9;
}
.saas-buy-btn-text-wrap {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	line-height: 1.2;
}
.saas-buy-btn-main {
	font-size: 16px;
	font-weight: 700;
}
.saas-buy-btn-sub {
	font-size: 11px;
	font-weight: 400;
	opacity: 0.8;
	margin-top: 2px;
}

/* ===== DARK THEME SUPPORT OVERRIDES ===== */
body.dark-theme .saas-sub-nav {
	background: rgba(30, 41, 59, 0.8);
	border-color: rgba(51, 65, 85, 0.8);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}
body.dark-theme .saas-sub-nav-brand {
	color: #f1f5f9;
}
body.dark-theme .sub-nav-link {
	color: #94a3b8;
}
body.dark-theme .sub-nav-link:hover, body.dark-theme .sub-nav-link.active {
	color: #60a5fa;
	background: rgba(96, 165, 250, 0.1);
}

/* Dark theme overrides for product options */
body.dark-theme .saas-options-wrap .control-label {
	color: #94a3b8;
}
body.dark-theme .saas-options-wrap .form-control {
	background-color: #0f172a !important;
	border-color: #334155 !important;
	color: #f1f5f9 !important;
}
body.dark-theme .saas-options-wrap .form-control:focus {
	border-color: var(--tm-blue) !important;
}
body.dark-theme .saas-options-wrap .radio label,
body.dark-theme .saas-options-wrap .checkbox label {
	background: #1e293b !important;
	border-color: #334155 !important;
	color: #cbd5e1 !important;
}
body.dark-theme .saas-options-wrap .radio label:hover,
body.dark-theme .saas-options-wrap .checkbox label:hover {
	background: #151e2e !important;
	border-color: #475569 !important;
}
body.dark-theme .saas-options-wrap .radio label.active,
body.dark-theme .saas-options-wrap .checkbox label.active {
	background: rgba(96, 165, 250, 0.05) !important;
	border-color: var(--tm-blue) !important;
	color: #60a5fa !important;
}
body.dark-theme .saas-options-wrap input[type="radio"],
body.dark-theme .saas-options-wrap input[type="checkbox"] {
	border-color: #475569 !important;
	background: #0f172a !important;
}
body.dark-theme .saas-options-wrap input[type="radio"]:checked,
body.dark-theme .saas-options-wrap input[type="checkbox"]:checked {
	border-color: var(--tm-blue) !important;
	background: var(--tm-blue) !important;
}
body.dark-theme .option-image-thumb {
	border-color: #334155 !important;
}
body.dark-theme .option-price-prefix {
	color: #94a3b8;
}
body.dark-theme .saas-options-wrap .radio label.active .option-price-prefix,
body.dark-theme .saas-options-wrap .checkbox label.active .option-price-prefix {
	color: #60a5fa;
}
body.dark-theme .saas-options-wrap .btn-upload-option {
	background: #1e293b !important;
	border-color: #334155 !important;
	color: #cbd5e1 !important;
}
body.dark-theme .saas-options-wrap .btn-upload-option:hover {
	background: #151e2e !important;
	border-color: var(--tm-blue) !important;
	color: #60a5fa !important;
}
body.dark-theme .saas-options-wrap .input-group .input-group-btn .btn {
	border-color: #334155 !important;
	background: #1e293b !important;
	color: #94a3b8 !important;
}

/* Dark theme overrides for sticky sub-nav new elements */
body.dark-theme .saas-sub-nav-thumb {
	border-color: #334155 !important;
	background-color: #0f172a !important;
}
body.dark-theme .sub-nav-price-amount,
body.dark-theme .sub-nav-price-new {
	color: #f1f5f9;
}
body.dark-theme .sub-nav-price-old {
	color: #64748b;
}
body.dark-theme .saas-features-outer-wrap {
	background: #0f172a;
	border-color: #1e293b;
}
body.dark-theme .saas-benefit-card {
	background: #1e293b;
	border-color: #334155;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
body.dark-theme .saas-benefit-card:hover {
	border-color: rgba(96, 165, 250, 0.3);
	box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
}
body.dark-theme .saas-benefit-title {
	color: #f1f5f9;
}
body.dark-theme .saas-benefit-desc {
	color: #94a3b8;
}
body.dark-theme .saas-demo-card {
	background: #1e293b;
	border-color: #334155;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}
body.dark-theme .saas-demo-icon {
	background: #0369a1;
	color: #e0f2fe;
}
body.dark-theme .saas-demo-title {
	color: #f1f5f9;
}
body.dark-theme .saas-demo-text {
	color: #94a3b8;
}
body.dark-theme .btn-demo-admin {
	background: #1e293b;
	border-color: #475569;
	color: #cbd5e1 !important;
}
body.dark-theme .btn-demo-admin:hover {
	background: #334155;
	border-color: #64748b;
}
body.dark-theme .saas-demo-credentials {
	background: #0f172a;
	border-color: #334155;
	color: #94a3b8;
}
body.dark-theme .cred-item strong {
	color: #f1f5f9;
}

/* Responsive Grid Adapters */
@media (max-width: 1200px) {
	.saas-benefits-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}
}
@media (max-width: 768px) {
	.saas-sub-nav {
		display: none !important;
	}
	.saas-benefits-grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	.saas-demo-card {
		padding: 20px;
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}
	.saas-demo-icon {
		width: 48px;
		height: 48px;
		font-size: 20px;
	}
	.saas-demo-actions {
		width: 100%;
	}
	.btn-demo {
		width: 100%;
		justify-content: center;
	}
	.saas-demo-credentials {
		flex-direction: column;
		gap: 6px;
	}
}

/* Related products section fixes */
.product-product #content {
	background-color: transparent !important;
	padding: 0 15px !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	min-height: auto !important;
}
.product-product #content h3 {
	text-align: left;
	font-weight: 700;
	font-size: 26px;
	color: #0f172a;
	margin-top: 40px;
	margin-bottom: 24px;
}
body.dark-theme .product-product #content h3 {
	color: #f1f5f9;
}

/* ==========================================================================
   SAAS PRODUCT PAGE ENHANCEMENTS (Version 1.3.00)
   ========================================================================== */

/* 1. Interactive Star Rating */
.saas-rating-selector-group {
	margin-top: 20px;
	margin-bottom: 20px;
}
.saas-interactive-stars {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 8px;
}
.star-rating-item {
	cursor: pointer;
	font-size: 26px;
	color: #cbd5e1;
	transition: transform 0.15s cubic-bezier(0.34, 1.56, 0.64, 1), color 0.15s ease;
	display: inline-block;
}
.star-rating-item:hover {
	transform: scale(1.2);
}
.star-rating-item.active,
.star-rating-item.hover {
	color: #f59e0b; /* Vibrant gold */
}

/* 2. Guarantees Card (Sidebar) */
.saas-guarantees-card {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 16px;
	padding: 20px;
	margin-top: 24px;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.02);
}
.saas-guarantee-item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin-bottom: 16px;
}
.saas-guarantee-item:last-child {
	margin-bottom: 0;
}
.saas-guarantee-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(59, 130, 246, 0.08);
	color: var(--tm-blue, #3b82f6);
	font-size: 16px;
	flex-shrink: 0;
	transition: background-color 0.2s ease, color 0.2s ease;
}
.saas-guarantee-item:hover .saas-guarantee-icon {
	background: var(--tm-blue, #3b82f6);
	color: #ffffff;
}
.saas-guarantee-content {
	flex-grow: 1;
}
.saas-guarantee-title {
	font-size: 14px;
	font-weight: 600;
	color: #0f172a;
	margin: 0 0 4px 0;
	line-height: 1.3;
}
.saas-guarantee-desc {
	font-size: 12px;
	color: #64748b;
	margin: 0;
	line-height: 1.4;
}

/* 3. Changelog Vertical Timeline */
.saas-changelog-timeline {
	position: relative;
	padding-left: 24px;
	margin: 24px 0;
}
.saas-changelog-timeline::before {
	content: '';
	position: absolute;
	left: 7px;
	top: 10px;
	bottom: 10px;
	width: 2px;
	background: #e2e8f0;
}
.saas-timeline-item {
	position: relative;
	margin-bottom: 30px;
}
.saas-timeline-item:last-child {
	margin-bottom: 0;
}
.saas-timeline-marker {
	position: absolute;
	left: -24px;
	top: 4px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #ffffff;
	border: 3px solid var(--tm-blue, #3b82f6);
	z-index: 1;
	box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.1);
	transition: background-color 0.2s ease, transform 0.2s ease;
}
.saas-timeline-item:hover .saas-timeline-marker {
	background: var(--tm-blue, #3b82f6);
	transform: scale(1.1);
}
.saas-timeline-info {
	padding-left: 12px;
}
.saas-timeline-version {
	font-size: 16px;
	font-weight: 700;
	color: #0f172a;
	margin-bottom: 10px;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.saas-timeline-date {
	font-size: 13px;
	font-weight: 500;
	color: #64748b;
	background: #f1f5f9;
	padding: 2px 8px;
	border-radius: 9999px;
}
.saas-timeline-details {
	font-size: 14px;
	color: #334155;
	line-height: 1.6;
}
.saas-timeline-details ul,
.saas-timeline-details ol {
	padding-left: 20px;
	margin: 0;
}
.saas-timeline-details li {
	margin-bottom: 8px;
}
.saas-timeline-details li:last-child {
	margin-bottom: 0;
}

/* Status Badges for Changelog */
.saas-status-badge {
	display: inline-flex;
	align-items: center;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	padding: 2px 8px;
	border-radius: 4px;
	margin-right: 8px;
	letter-spacing: 0.05em;
	line-height: 1.2;
}
.saas-status-badge.badge-added {
	background-color: #dcfce7;
	color: #15803d;
}
.saas-status-badge.badge-fixed {
	background-color: #fee2e2;
	color: #b91c1c;
}
.saas-status-badge.badge-improved {
	background-color: #dbeafe;
	color: #1d4ed8;
}

/* 4. FAQ Interactive Accordion */
.saas-faq-accordion {
	margin: 24px 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.faq-accordion-item {
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	background: #ffffff;
	overflow: hidden;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.faq-accordion-item:hover {
	border-color: #cbd5e1;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
}
.faq-accordion-item.active {
	border-color: #cbd5e1;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}
.faq-accordion-header {
	padding: 16px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	user-select: none;
	gap: 16px;
}
.faq-question-text {
	font-size: 15px;
	font-weight: 600;
	color: #0f172a;
	line-height: 1.4;
}
.faq-toggle-icon {
	color: #64748b;
	font-size: 14px;
	transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.faq-accordion-item.active .faq-toggle-icon {
	transform: rotate(180deg);
	color: var(--tm-blue, #3b82f6);
}
.faq-accordion-body {
	border-top: 1px solid transparent;
	transition: border-color 0.2s ease;
}
.faq-accordion-item.active .faq-accordion-body {
	border-top-color: #f1f5f9;
}
.faq-accordion-body-inner {
	padding: 18px 20px 20px 20px;
	font-size: 14px;
	color: #334155;
	line-height: 1.6;
}
.faq-accordion-body-inner p:last-child {
	margin-bottom: 0;
}

/* 5. Dark Theme Overrides for All New Elements */
body.dark-theme .saas-guarantees-card {
	background: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}
body.dark-theme .saas-guarantee-title {
	color: #f1f5f9 !important;
}
body.dark-theme .saas-guarantee-desc {
	color: #94a3b8 !important;
}
body.dark-theme .saas-guarantee-icon {
	background: rgba(96, 165, 250, 0.12) !important;
	color: #60a5fa !important;
}
body.dark-theme .saas-guarantee-item:hover .saas-guarantee-icon {
	background: #3b82f6 !important;
	color: #ffffff !important;
}
body.dark-theme .saas-changelog-timeline::before {
	background: #334155 !important;
}
body.dark-theme .saas-timeline-marker {
	background: #0f172a !important;
	border-color: #60a5fa !important;
	box-shadow: 0 0 0 4px rgba(96, 165, 250, 0.1) !important;
}
body.dark-theme .saas-timeline-item:hover .saas-timeline-marker {
	background: #60a5fa !important;
}
body.dark-theme .saas-timeline-version {
	color: #f1f5f9 !important;
}
body.dark-theme .saas-timeline-date {
	color: #94a3b8 !important;
	background: #334155 !important;
}
body.dark-theme .saas-timeline-details {
	color: #cbd5e1 !important;
}
body.dark-theme .saas-status-badge.badge-added {
	background-color: rgba(21, 128, 61, 0.2) !important;
	color: #4ade80 !important;
}
body.dark-theme .saas-status-badge.badge-fixed {
	background-color: rgba(185, 28, 28, 0.2) !important;
	color: #f87171 !important;
}
body.dark-theme .saas-status-badge.badge-improved {
	background-color: rgba(29, 78, 216, 0.2) !important;
	color: #60a5fa !important;
}
body.dark-theme .faq-accordion-item {
	background: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme .faq-accordion-item:hover {
	border-color: #475569 !important;
}
body.dark-theme .faq-accordion-item.active {
	border-color: #475569 !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
}
body.dark-theme .faq-question-text {
	color: #f1f5f9 !important;
}
body.dark-theme .faq-toggle-icon {
	color: #94a3b8 !important;
}
body.dark-theme .faq-accordion-item.active .faq-toggle-icon {
	color: #60a5fa !important;
}
body.dark-theme .faq-accordion-item.active .faq-accordion-body {
	border-top-color: #334155 !important;
}
body.dark-theme .faq-accordion-body-inner {
	color: #cbd5e1 !important;
}
body.dark-theme .star-rating-item {
	color: #475569 !important;
}

/* ===== SAAS SIDEBAR MEGA MENU (Version 1.3.02) ===== */
.saas-mega-menu-wrapper {
	display: flex;
	gap: 24px;
	min-height: 350px;
	width: 100%;
}

/* Left Sidebar Navigation */
.saas-menu-sidebar {
	width: 240px;
	border-right: 1px solid #f1f5f9;
	padding-right: 16px;
	flex-shrink: 0;
}
.saas-sidebar-item {
	margin-bottom: 4px;
	border-radius: 8px;
	transition: all 0.2s ease;
}
.saas-sidebar-item a {
	display: block;
	padding: 10px 14px;
	color: #475569 !important;
	font-weight: 500;
	font-size: 14px;
	text-decoration: none !important;
	transition: all 0.2s ease;
}
.saas-sidebar-item:hover a,
.saas-sidebar-item.active a {
	color: var(--tm-blue, #3b82f6) !important;
}
.saas-sidebar-item.active {
	background-color: #eef2ff;
}
.saas-sidebar-item-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}
.saas-sidebar-arrow {
	font-size: 11px;
	opacity: 0;
	transform: translateX(-4px);
	transition: all 0.2s ease;
}
.saas-sidebar-item.active .saas-sidebar-arrow {
	opacity: 1;
	transform: translateX(0);
}

/* Right Content Area */
.saas-menu-content-wrap {
	display: flex;
	flex-grow: 1;
	gap: 24px;
	min-width: 0; /* Prevents flex blowout */
}
.saas-menu-panels {
	flex-grow: 1;
	min-width: 0;
}
.saas-menu-panel {
	display: none;
	animation: saasFadeIn 0.25s ease;
}
.saas-menu-panel.active {
	display: block;
}
@keyframes saasFadeIn {
	from { opacity: 0; transform: translateY(4px); }
	to { opacity: 1; transform: translateY(0); }
}
.saas-panel-title {
	margin: 0 0 16px 0 !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	color: #0f172a !important;
}
.saas-panel-title a {
	color: #0f172a !important;
	text-decoration: none !important;
}
.saas-panel-title a:hover {
	color: var(--tm-blue, #3b82f6) !important;
}
.saas-subcategories-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}
.saas-subcategory-card {
	display: flex;
	flex-direction: column;
	padding: 14px 16px;
	background: #f8fafc;
	border: 1px solid #f1f5f9;
	border-radius: 10px;
	text-decoration: none !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.saas-subcategory-card:hover {
	background: #ffffff;
	border-color: #cbd5e1;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.04);
	transform: translateY(-1px);
}
.saas-sub-card-title {
	font-size: 14px;
	font-weight: 600;
	color: #0f172a;
	margin-bottom: 2px;
	transition: color 0.15s ease;
}
.saas-subcategory-card:hover .saas-sub-card-title {
	color: var(--tm-blue, #3b82f6);
}
.saas-sub-card-desc {
	font-size: 11px;
	color: #64748b;
	line-height: 1.4;
}
.saas-no-subcategories {
	color: #64748b;
	font-size: 14px;
	padding: 20px 0;
}

/* Promo Banner Card */
.saas-menu-promo-card {
	width: 220px;
	padding: 20px;
	background: linear-gradient(135deg, var(--tm-blue, #3b82f6) 0%, #1d4ed8 100%);
	color: #ffffff;
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex-shrink: 0;
	box-shadow: 0 10px 20px rgba(59, 130, 246, 0.15);
	transition: all 0.25s ease;
}
.saas-menu-promo-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 24px rgba(59, 130, 246, 0.25);
}
.saas-promo-badge {
	align-self: flex-start;
	background: rgba(255, 255, 255, 0.2);
	color: #ffffff;
	font-size: 9px;
	font-weight: 800;
	padding: 2px 8px;
	border-radius: 9999px;
	letter-spacing: 0.08em;
	margin-bottom: 12px;
}
.saas-promo-info {
	margin-bottom: 16px;
}
.saas-promo-title {
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 6px 0;
	line-height: 1.3;
	color: #ffffff;
}
.saas-promo-desc {
	font-size: 11px;
	line-height: 1.4;
	margin: 0;
	color: rgba(255, 255, 255, 0.85);
}
.btn-promo-action {
	background: #ffffff !important;
	color: var(--tm-blue, #3b82f6) !important;
	font-weight: 700 !important;
	font-size: 12px !important;
	border: none !important;
	border-radius: 6px !important;
	padding: 8px 16px !important;
	text-align: center;
	transition: all 0.2s ease !important;
}
.btn-promo-action:hover {
	background: #f1f5f9 !important;
	transform: translateY(-1px);
}

/* ===== DARK THEME OVERRIDES FOR SIDEBAR MEGA MENU ===== */
body.dark-theme .saas-menu-sidebar {
	border-right-color: #334155 !important;
}
body.dark-theme .saas-sidebar-item a {
	color: #94a3b8 !important;
}
body.dark-theme .saas-sidebar-item:hover a,
body.dark-theme .saas-sidebar-item.active a {
	color: #60a5fa !important;
}
body.dark-theme .saas-sidebar-item.active {
	background-color: rgba(96, 165, 250, 0.12) !important;
}
body.dark-theme .saas-panel-title a {
	color: #ffffff !important;
}
body.dark-theme .saas-panel-title a:hover {
	color: #60a5fa !important;
}
body.dark-theme .saas-subcategory-card {
	background: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme .saas-subcategory-card:hover {
	background: #151e2e !important;
	border-color: #475569 !important;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3) !important;
}
body.dark-theme .saas-sub-card-title {
	color: #f1f5f9 !important;
}
body.dark-theme .saas-subcategory-card:hover .saas-sub-card-title {
	color: #60a5fa !important;
}
body.dark-theme .saas-sub-card-desc {
	color: #64748b !important;
}
body.dark-theme .saas-no-subcategories {
	color: #94a3b8 !important;
}

/* ===== SaaS Tags Card & Product Page Content Container ===== */
.product-product #content {
	min-height: auto !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 15px !important;
	border: none !important;
}

.saas-tags-card {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	padding: 16px 20px !important;
	margin-top: 24px !important;
	margin-bottom: 24px !important;
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}
.saas-tags-title {
	font-weight: 700;
	font-size: 14px;
	color: #475569;
	white-space: nowrap;
}
.saas-tags-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.saas-tag-item {
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
	color: #334155 !important;
	background: #f1f5f9;
	border: 1px solid #e2e8f0;
	padding: 6px 14px;
	border-radius: 9999px;
	transition: all 0.2s ease;
	text-decoration: none !important;
}
.saas-tag-item:hover {
	background: var(--tm-blue);
	color: #ffffff !important;
	border-color: var(--tm-blue);
	transform: translateY(-1px);
}

body.dark-theme .saas-tags-card {
	background: #1e293b !important;
	border-color: #334155 !important;
}
.saas-subcategory-card {
	display: flex;
	flex-direction: column;
	padding: 14px 16px;
	background: #f8fafc;
	border: 1px solid #f1f5f9;
	border-radius: 10px;
	text-decoration: none !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.saas-subcategory-card:hover {
	background: #ffffff;
	border-color: #cbd5e1;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.04);
	transform: translateY(-1px);
}
.saas-sub-card-title {
	font-size: 14px;
	font-weight: 600;
	color: #0f172a;
	margin-bottom: 2px;
	transition: color 0.15s ease;
}
.saas-subcategory-card:hover .saas-sub-card-title {
	color: var(--tm-blue, #3b82f6);
}
.saas-sub-card-desc {
	font-size: 11px;
	color: #64748b;
	line-height: 1.4;
}
.saas-no-subcategories {
	color: #64748b;
	font-size: 14px;
	padding: 20px 0;
}

/* Promo Banner Card */
.saas-menu-promo-card {
	width: 220px;
	padding: 20px;
	background: linear-gradient(135deg, var(--tm-blue, #3b82f6) 0%, #1d4ed8 100%);
	color: #ffffff;
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex-shrink: 0;
	box-shadow: 0 10px 20px rgba(59, 130, 246, 0.15);
	transition: all 0.25s ease;
}
.saas-menu-promo-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 24px rgba(59, 130, 246, 0.25);
}
.saas-promo-badge {
	align-self: flex-start;
	background: rgba(255, 255, 255, 0.2);
	color: #ffffff;
	font-size: 9px;
	font-weight: 800;
	padding: 2px 8px;
	border-radius: 9999px;
	letter-spacing: 0.08em;
	margin-bottom: 12px;
}
.saas-promo-info {
	margin-bottom: 16px;
}
.saas-promo-title {
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 6px 0;
	line-height: 1.3;
	color: #ffffff;
}
.saas-promo-desc {
	font-size: 11px;
	line-height: 1.4;
	margin: 0;
	color: rgba(255, 255, 255, 0.85);
}
.btn-promo-action {
	background: #ffffff !important;
	color: var(--tm-blue, #3b82f6) !important;
	font-weight: 700 !important;
	font-size: 12px !important;
	border: none !important;
	border-radius: 6px !important;
	padding: 8px 16px !important;
	text-align: center;
	transition: all 0.2s ease !important;
}
.btn-promo-action:hover {
	background: #f1f5f9 !important;
	transform: translateY(-1px);
}

/* ===== DARK THEME OVERRIDES FOR SIDEBAR MEGA MENU ===== */
body.dark-theme .saas-menu-sidebar {
	border-right-color: #334155 !important;
}
body.dark-theme .saas-sidebar-item a {
	color: #94a3b8 !important;
}
body.dark-theme .saas-sidebar-item:hover a,
body.dark-theme .saas-sidebar-item.active a {
	color: #60a5fa !important;
}
body.dark-theme .saas-sidebar-item.active {
	background-color: rgba(96, 165, 250, 0.12) !important;
}
body.dark-theme .saas-panel-title a {
	color: #ffffff !important;
}
body.dark-theme .saas-panel-title a:hover {
	color: #60a5fa !important;
}
body.dark-theme .saas-subcategory-card {
	background: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme .saas-subcategory-card:hover {
	background: #151e2e !important;
	border-color: #475569 !important;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3) !important;
}
body.dark-theme .saas-sub-card-title {
	color: #f1f5f9 !important;
}
body.dark-theme .saas-subcategory-card:hover .saas-sub-card-title {
	color: #60a5fa !important;
}
body.dark-theme .saas-sub-card-desc {
	color: #64748b !important;
}
body.dark-theme .saas-no-subcategories {
	color: #94a3b8 !important;
}

/* ===== SaaS Tags Card & Product Page Content Container ===== */
.product-product #content {
	min-height: auto !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 15px !important;
	border: none !important;
}

.saas-tags-card {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	padding: 16px 20px !important;
	margin-top: 24px !important;
	margin-bottom: 24px !important;
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}
.saas-tags-title {
	font-weight: 700;
	font-size: 14px;
	color: #475569;
	white-space: nowrap;
}
.saas-tags-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.saas-tag-item {
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
	color: #334155 !important;
	background: #f1f5f9;
	border: 1px solid #e2e8f0;
	padding: 6px 14px;
	border-radius: 9999px;
	transition: all 0.2s ease;
	text-decoration: none !important;
}
.saas-tag-item:hover {
	background: var(--tm-blue);
	color: #ffffff !important;
	border-color: var(--tm-blue);
	transform: translateY(-1px);
}

body.dark-theme .saas-tags-card {
	background: #1e293b !important;
	border-color: #334155 !important;
}
body.dark-theme .saas-tags-title {
	color: #94a3b8;
}
body.dark-theme .saas-tag-item {
	background: #0f172a;
	border-color: #334155;
	color: #cbd5e1 !important;
}
body.dark-theme .saas-tag-item:hover {
	background: var(--tm-blue);
	color: #ffffff !important;
	border-color: var(--tm-blue);
}


/* --- Mega Menu Category Products Styling (v1.3.21) --- */

/* === Wrap контейнера для товарів у середній панелі === */
.saas-menu-products-wrap {
  padding: 0;
  min-height: 100px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* === Стан завантаження / помилки === */
.saas-menu-products-loading,
.saas-menu-products-error,
.saas-menu-products-empty {
  text-align: center;
  color: #64748b;
  font-size: 13px;
  padding: 30px 0;
}

.saas-menu-products-loading i {
  margin-right: 8px;
  color: var(--tm-blue, #3b82f6);
}

/* === Сітка товарів у стилі категорій === */
.saas-menu-products-list {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
  padding: 5px 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* === Картка товару === */
.saas-menu-product-item {
  display: flex !important;
  flex-direction: column !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 12px !important;
  gap: 10px !important;
  text-decoration: none !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-sizing: border-box !important;
}

.saas-menu-product-item:hover {
  border-color: var(--tm-blue, #3b82f6) !important;
  box-shadow: 0 8px 24px rgba(59, 130, 246, 0.08) !important;
  transform: translateY(-2px) !important;
}

/* === Зображення (чисто біле) === */
.saas-menu-product-thumb {
  width: 100% !important;
  height: 130px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #ffffff !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
}

.saas-menu-product-thumb img {
  max-width: 90% !important;
  max-height: 90% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.06)) !important;
  transition: transform 0.3s ease !important;
  display: block !important;
}

.saas-menu-product-item:hover .saas-menu-product-thumb img {
  transform: scale(1.04) !important;
}

/* === Інформація (назва, опис, кнопка) === */
.saas-menu-product-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  flex-grow: 1 !important;
  justify-content: flex-start !important;
  min-width: 0 !important;
  text-align: left !important;
}

.saas-menu-product-name {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1e3a8a !important;
  text-decoration: none !important;
  line-height: 1.3 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 34px !important;
  transition: color 0.15s ease !important;
  white-space: normal !important;
}

.saas-menu-product-item:hover .saas-menu-product-name {
  color: var(--tm-blue, #3b82f6) !important;
}

/* === Короткий опис === */
.saas-menu-product-desc {
  font-size: 11px !important;
  color: #64748b !important;
  line-height: 1.35 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  margin-bottom: 2px !important;
  white-space: normal !important;
  min-height: 30px !important;
}

/* === Футер картки === */
.saas-menu-product-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: auto !important;
  width: 100% !important;
  gap: 6px !important;
}

/* === Ціна === */
.saas-menu-product-price {
  font-size: 13.5px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}

.saas-menu-product-price .price-regular {
  color: #1e3a8a !important;
  font-weight: 700 !important;
}

.saas-menu-product-price .price-new {
  color: #ef4444 !important;
  font-weight: 700 !important;
}

.saas-menu-product-price .price-old {
  color: #94a3b8 !important;
  text-decoration: line-through !important;
  font-size: 10px !important;
}

/* === Кнопка "Купити" === */
.saas-menu-product-buy-btn {
  background: var(--tm-blue, #3b82f6) !important;
  color: #ffffff !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  transition: all 0.2s ease !important;
  white-space: nowrap !important;
  border: 1px solid var(--tm-blue, #3b82f6) !important;
}

.saas-menu-product-item:hover .saas-menu-product-buy-btn {
  background: #2563eb !important;
  border-color: #2563eb !important;
}

/* === Promo Banner Card === */
.saas-menu-promo-card {
	width: 220px;
	padding: 20px;
	background: linear-gradient(135deg, #1e3a8a 0%, #0e1e38 100%) !important;
	color: #ffffff;
	border-radius: 14px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex-shrink: 0;
	border: 1px solid rgba(255, 255, 255, 0.15) !important;
	box-shadow: 0 10px 30px rgba(15, 23, 42, 0.3) !important;
	transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
	position: relative;
	overflow: hidden;
}
.saas-menu-promo-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 35px rgba(30, 58, 138, 0.4) !important;
	border-color: rgba(255, 255, 255, 0.25) !important;
}
.saas-promo-badge {
	align-self: flex-start;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.25);
	color: #ffffff;
	font-size: 9px;
	font-weight: 800;
	padding: 3px 10px;
	border-radius: 9999px;
	letter-spacing: 0.08em;
	margin-bottom: 12px;
	text-transform: uppercase;
}
.saas-promo-info {
	margin-bottom: 16px;
}
.saas-promo-title {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 8px 0;
	line-height: 1.35;
	color: #ffffff;
}
.saas-promo-desc {
	font-size: 11.5px;
	line-height: 1.45;
	margin: 0;
	color: rgba(255, 255, 255, 0.8);
}
.btn-promo-action {
	background: #ffffff !important;
	color: #1e3a8a !important;
	font-weight: 700 !important;
	font-size: 12px !important;
	border: none !important;
	border-radius: 8px !important;
	padding: 10px 16px !important;
	text-align: center;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.btn-promo-action:hover {
	background: #f8fafc !important;
	transform: scale(1.02);
	box-shadow: 0 6px 16px rgba(255, 255, 255, 0.25) !important;
}

/* === Promo Product Card (Restored & Upgraded) === */
.promo-product-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  padding: 16px !important;
}

.saas-promo-image-wrap {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-radius: 10px !important;
  height: 120px !important;
  width: 100% !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  transition: all 0.25s ease !important;
  margin-bottom: 12px !important;
}

.saas-promo-image-wrap img {
  max-width: 85% !important;
  max-height: 85% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  transition: transform 0.3s ease !important;
}

.promo-product-card:hover .saas-promo-image-wrap {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
}

.promo-product-card:hover .saas-promo-image-wrap img {
  transform: scale(1.04) !important;
}

.promo-product-card .saas-promo-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  align-items: flex-start !important;
  text-align: left !important;
  margin-bottom: 12px !important;
  flex-grow: 1 !important;
}

.promo-product-card .saas-promo-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  text-decoration: none !important;
  line-height: 1.4 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  white-space: normal !important;
  min-height: 36px !important;
  transition: opacity 0.15s ease !important;
}

.promo-product-card .saas-promo-title:hover {
  opacity: 0.9 !important;
}

.saas-promo-price {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.saas-promo-price .price-regular {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

.saas-promo-price .price-new {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #fca5a5 !important;
}

.saas-promo-price .price-old {
  font-size: 11px !important;
  color: rgba(255, 255, 255, 0.6) !important;
  text-decoration: line-through !important;
}

.promo-product-card .btn-promo-action {
  background: #ffffff !important;
  color: #1e3a8a !important;
  font-weight: 700 !important;
  text-align: center !important;
  display: block !important;
  width: 100% !important;
  padding: 8px 10px !important;
  border-radius: 8px !important;
  border: none !important;
  transition: all 0.2s ease !important;
  margin-top: auto !important;
  font-size: 12px !important;
}

/* === Dark Theme Overrides === */
body.dark-theme .saas-menu-product-item {
  background: #1e293b !important;
  border-color: #334155 !important;
}
.saas-sidebar-item a {
	display: block !important;
	padding: 10px 14px !important;
	color: #475569 !important;
	font-weight: 500 !important;
	font-size: 14px !important;
	text-decoration: none !important;
	white-space: normal !important;
	transition: all 0.2s ease !important;
}
.saas-subcategory-card {
	display: flex !important;
	flex-direction: column !important;
	padding: 14px 16px !important;
	background: #f8fafc !important;
	border: 1px solid #f1f5f9 !important;
	border-radius: 10px !important;
	text-decoration: none !important;
	white-space: normal !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

body.dark-theme .saas-menu-product-item:hover {
  background: #151e2e !important;
  border-color: #60a5fa !important;
  box-shadow: 0 8px 24px rgba(96, 165, 250, 0.15) !important;
}

body.dark-theme .saas-menu-product-thumb {
  background: #1e293b !important;
}

body.dark-theme .saas-menu-product-name {
  color: #ffffff !important;
}

body.dark-theme .saas-menu-product-item:hover .saas-menu-product-name {
  color: #60a5fa !important;
}

body.dark-theme .saas-menu-product-desc {
  color: #94a3b8 !important;
}

body.dark-theme .saas-menu-product-price .price-regular {
  color: #60a5fa !important;
}

body.dark-theme .saas-menu-product-price .price-new {
  color: #fca5a5 !important;
}

body.dark-theme .saas-menu-product-buy-btn {
  background: #60a5fa !important;
  color: #0f172a !important;
  border-color: #60a5fa !important;
}

body.dark-theme .saas-menu-product-item:hover .saas-menu-product-buy-btn {
  background: #38bdf8 !important;
  border-color: #38bdf8 !important;
}

body.dark-theme .promo-product-card .saas-promo-image-wrap {
  background: #1e293b !important;
  border-color: #334155 !important;
}

/* ===== SaaS Product navigation (v1.3.21) ===== */
.saas-product-navigation-wrap {
	margin: 30px 0;
	width: 100%;
}
.saas-product-navigation-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}
.saas-nav-card {
	display: flex;
	align-items: center;
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	padding: 18px 24px;
	text-decoration: none !important;
	transition: all 0.2s ease;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
}
.saas-nav-card:hover {
	border-color: var(--tm-blue, #3b82f6);
	box-shadow: 0 6px 16px rgba(59, 130, 246, 0.08);
	transform: translateY(-1px);
}
.saas-nav-arrow {
	font-size: 20px;
	color: #94a3b8;
	transition: color 0.2s ease, transform 0.2s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.saas-nav-card:hover .saas-nav-arrow {
	color: var(--tm-blue, #3b82f6);
}
.prev-card .saas-nav-arrow {
	margin-right: 18px;
}
.next-card .saas-nav-arrow {
	margin-left: 18px;
}
.prev-card:hover .saas-nav-arrow {
	transform: translateX(-3px);
}
.next-card:hover .saas-nav-arrow {
	transform: translateX(3px);
}
.saas-nav-content {
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex-grow: 1;
	min-width: 0;
}
.saas-nav-label {
	font-size: 11px;
	text-transform: uppercase;
	font-weight: 700;
	color: #94a3b8;
	letter-spacing: 0.05em;
	display: block;
}
.saas-nav-name {
	font-size: 14px;
	font-weight: 700;
	color: #1e293b;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: block;
}
.saas-nav-card:hover .saas-nav-name {
	color: var(--tm-blue, #3b82f6);
}
.saas-nav-card.empty-card {
	background: transparent;
	border: none;
	box-shadow: none;
	pointer-events: none;
}
@media (max-width: 767px) {
	.saas-product-navigation-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 10px !important;
	}
	.saas-nav-card {
		padding: 10px 12px !important;
		border-radius: 8px !important;
	}
	.saas-nav-name {
		display: none !important;
	}
	.saas-nav-label {
		font-size: 10px !important;
		white-space: nowrap !important;
	}
	.saas-nav-arrow {
		font-size: 12px !important;
	}
	.prev-card .saas-nav-arrow {
		margin-right: 6px !important;
	}
	.next-card .saas-nav-arrow {
		margin-left: 6px !important;
	}
	.saas-nav-card.empty-card {
		display: block !important;
		visibility: hidden !important;
	}
}

/* Dark Theme support */
body.dark-theme .saas-nav-card {
	background: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}
body.dark-theme .saas-nav-card:hover {
	border-color: #60a5fa !important;
}
body.dark-theme .saas-nav-name {
	color: #f1f5f9 !important;
}
body.dark-theme .saas-nav-card:hover .saas-nav-name {
	color: #60a5fa !important;
}
body.dark-theme .saas-nav-label {
	color: #64748b !important;
}
body.dark-theme .saas-nav-arrow {
	color: #475569 !important;
}
body.dark-theme .saas-nav-card:hover .saas-nav-arrow {
	color: #60a5fa !important;
}

.saas-promo-title {
	font-size: 15px !important;
	font-weight: 700 !important;
	margin: 0 0 6px 0 !important;
	line-height: 1.3 !important;
	color: #ffffff !important;
	white-space: normal !important;
}

/* ==========================================================================
   VERSION 1.3.30 FIXES: DROPDOWNS, RESPONSIVENESS & PROMO SPECIFICITY
   ========================================================================== */

/* 1. Reset active tab borders and styles on top bar info-dropdown */
#header-top-bar .info-dropdown.open > a.dropdown-toggle,
#header-top-bar .info-dropdown > a.dropdown-toggle:hover,
#header-top-bar .info-dropdown > a.dropdown-toggle:focus,
#header-top-bar .info-dropdown > a.dropdown-toggle {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	outline: none !important;
	padding: 4px 8px !important;
	border-radius: 0 !important;
}

/* Explicit clean styling for top bar dropdown menu */
#header-top-bar .info-dropdown .dropdown-menu {
	position: absolute !important;
	top: 100% !important;
	left: 0 !important;
	right: auto !important;
	min-width: 170px !important;
	width: auto !important;
	background-color: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 8px !important;
	box-shadow: 0 10px 25px rgba(15, 23, 42, 0.08) !important;
	padding: 6px 0 !important;
	margin-top: 6px !important;
	z-index: 10000 !important;
	display: none;
}

#header-top-bar .info-dropdown.open .dropdown-menu {
	display: block !important;
}

#header-top-bar .info-dropdown .dropdown-menu li {
	display: block !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

#header-top-bar .info-dropdown .dropdown-menu a {
	color: #334155 !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	padding: 8px 16px !important;
	display: block !important;
	transition: all 0.2s ease !important;
	text-decoration: none !important;
	line-height: 1.4 !important;
	white-space: nowrap !important;
	text-align: left !important;
	background: transparent !important;
}

#header-top-bar .info-dropdown .dropdown-menu a:hover {
	background-color: #f1f5f9 !important;
	color: var(--tm-blue, #3b82f6) !important;
}

/* Dark theme overrides for info-dropdown menu */
body.dark-theme #header-top-bar .info-dropdown .dropdown-menu {
	background-color: #1e293b !important;
	border-color: #334155 !important;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3) !important;
}

body.dark-theme #header-top-bar .info-dropdown .dropdown-menu a {
	color: #cbd5e1 !important;
}

body.dark-theme #header-top-bar .info-dropdown .dropdown-menu a:hover {
	background-color: #334155 !important;
	color: #60a5fa !important;
}


/* 2. Promo Product Card Specificity & Styling Fixes */
.saas-menu-promo-card .saas-promo-image-wrap {
	background: #ffffff !important;
	border-radius: 10px !important;
	padding: 10px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	height: 140px !important;
	margin-bottom: 14px !important;
	overflow: hidden !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02) !important;
}

.saas-menu-promo-card .saas-promo-image-wrap img {
	max-height: 100% !important;
	max-width: 100% !important;
	object-fit: contain !important;
	display: block !important;
}

/* Override high-specificity selectors for links in the mega menu promo card */
#header-main-row .dropdown-menu .saas-menu-promo-card a,
#header-main-row .dropdown-menu .saas-menu-promo-card a.saas-promo-title {
	color: #ffffff !important;
	opacity: 1 !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	line-height: 1.35 !important;
	text-decoration: none !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	white-space: normal !important;
	min-height: 38px !important;
	margin-bottom: 8px !important;
	padding: 0 !important;
}

#header-main-row .dropdown-menu .saas-menu-promo-card a:hover,
#header-main-row .dropdown-menu .saas-menu-promo-card a.saas-promo-title:hover {
	color: #ffffff !important;
	opacity: 0.9 !important;
}

/* Force promo button styling */
#header-main-row .dropdown-menu .saas-menu-promo-card .btn-promo-action,
#header-main-row .dropdown-menu .saas-menu-promo-card a.btn-promo-action {
	background: #ffffff !important;
	color: #1e3a8a !important;
	font-weight: 700 !important;
	font-size: 12px !important;
	border: none !important;
	border-radius: 8px !important;
	padding: 10px 16px !important;
	display: block !important;
	width: 100% !important;
	text-align: center !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
	opacity: 1 !important;
	margin-top: auto !important;
}

#header-main-row .dropdown-menu .saas-menu-promo-card .btn-promo-action:hover,
#header-main-row .dropdown-menu .saas-menu-promo-card a.btn-promo-action:hover {
	background: #f1f5f9 !important;
	color: var(--tm-blue, #3b82f6) !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2) !important;
	opacity: 1 !important;
}


/* 3. Layout Responsiveness (Tablets & Small Desktops) */

/* Hide text labels on header top bar to keep layout on 1 line below 1200px */
@media (max-width: 1200px) {
	#header-top-bar .tb-text {
		display: none !important;
	}
	#header-top-bar .tb-link, 
	#header-top-bar .info-dropdown > a {
		gap: 0 !important;
		padding: 4px 6px !important;
	}
}

/* Hide mega menu promo card and adjust columns on smaller viewports */
@media (max-width: 1200px) {
	.saas-menu-content-wrap .saas-menu-promo-card {
		display: none !important;
	}
}

@media (max-width: 991px) {
	.saas-menu-products-list {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 10px !important;
	}
}


/* 4. Elegant Empty Product State Styling */
.saas-menu-products-empty {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	color: #94a3b8 !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	min-height: 250px !important;
	text-align: center !important;
	width: 100% !important;
	gap: 8px !important;
	padding: 20px !important;
	box-sizing: border-box !important;
}

body.dark-theme .saas-menu-products-empty {
	color: #64748b !important;
}

/* ==========================================================================
   VERSION 1.3.31 FIXES: HOVER RESETS, FLEX LIMITS & DESIGN POLISH
   ========================================================================== */

/* 1. Explicit Hover Background Color Resets */

/* Prevent the entire vertical product card from turning grey when hovered */
#header-main-row .dropdown-menu a.saas-menu-product-item:hover {
	background-color: #ffffff !important;
	background: #ffffff !important;
}

/* Prevent category sidebar links in mega menu from turning grey on hover */
#header-main-row .dropdown-menu .saas-menu-sidebar a:hover {
	background-color: transparent !important;
	background: transparent !important;
}

/* Prevent title link inside promo card from turning grey on hover */
#header-main-row .dropdown-menu .saas-menu-promo-card a.saas-promo-title:hover {
	background-color: transparent !important;
	background: transparent !important;
	color: #ffffff !important;
	opacity: 0.9 !important;
}

/* Prevent image link inside promo card from turning grey on hover */
#header-main-row .dropdown-menu .saas-menu-promo-card a.saas-promo-image-wrap:hover {
	background-color: transparent !important;
	background: transparent !important;
}


/* 2. Flexbox Grid Blowout Prevention */

.saas-menu-panels {
	flex-grow: 1 !important;
	min-width: 0 !important;
	overflow: hidden !important;
}

.saas-menu-panel {
	width: 100% !important;
	min-width: 0 !important;
}

.saas-menu-products-wrap {
	width: 100% !important;
	min-width: 0 !important;
}


/* 3. Products Header & Gold Ratings Styling */

.saas-menu-products-header {
	font-size: 11px !important;
	font-weight: 700 !important;
	color: #64748b !important;
	margin-bottom: 12px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.08em !important;
	border-bottom: 1px solid #f1f5f9 !important;
	padding-bottom: 6px !important;
	text-align: left !important;
}

body.dark-theme .saas-menu-products-header {
	color: #94a3b8 !important;
	border-bottom-color: #334155 !important;
}

.saas-menu-product-info .rating-box-wrapper {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	margin-bottom: 4px !important;
	min-height: 16px !important;
}

.saas-menu-product-info .rating {
	margin: 0 !important;
	display: flex !important;
	align-items: center !important;
	gap: 2px !important;
}

.saas-menu-product-info .rating .fa-stack {
	width: 12px !important;
	height: 12px !important;
	line-height: 12px !important;
	font-size: 11px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.saas-menu-product-info .rating .fa-stack i {
	font-size: 11px !important;
}

/* Dark theme overrides for product card hover background */
body.dark-theme #header-main-row .dropdown-menu a.saas-menu-product-item:hover {
	background-color: #1e293b !important;
	background: #1e293b !important;
}

/* Promo Card Description Spacing */
.promo-product-card .saas-promo-desc {
	margin-top: 10px !important;
}

/* Custom Wide Banner under products grid */
.saas-menu-products-banner {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
	background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%) !important;
	border: 1px solid #bfdbfe !important;
	border-radius: 12px !important;
	padding: 16px 20px !important;
	margin-top: 24px !important;
	width: 100% !important;
	box-sizing: border-box !important;
	transition: all 0.25s ease !important;
}

.saas-menu-products-banner:hover {
	border-color: var(--tm-blue, #5777ff) !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.08) !important;
}

.saas-menu-banner-icon {
	width: 42px !important;
	height: 42px !important;
	min-width: 42px !important;
	background: #ffffff !important;
	border-radius: 10px !important;
	border: 1px solid #bfdbfe !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-shadow: 0 2px 6px rgba(30, 58, 138, 0.04) !important;
}

.saas-menu-banner-icon i {
	font-size: 18px !important;
	color: var(--tm-blue, #5777ff) !important;
}

.saas-menu-banner-content {
	flex-grow: 1 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 3px !important;
}

.saas-menu-banner-title {
	font-size: 13.5px !important;
	font-weight: 700 !important;
	color: #1e3a8a !important;
	margin: 0 !important;
	line-height: 1.3 !important;
}

.saas-menu-banner-desc {
	font-size: 11.5px !important;
	font-weight: 500 !important;
	color: #475569 !important;
	margin: 0 !important;
	line-height: 1.4 !important;
}

.btn-menu-banner-action {
	background: var(--tm-blue, #5777ff) !important;
	color: #ffffff !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	padding: 10px 18px !important;
	border-radius: 8px !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
	box-shadow: 0 2px 6px rgba(87, 119, 255, 0.15) !important;
}

.btn-menu-banner-action:hover {
	background: var(--tm-blue-hover, #4361e8) !important;
	color: #ffffff !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 12px rgba(87, 119, 255, 0.25) !important;
}