/**
 * VendifyTech Component Styles
 * 
 * V10 — Component-specific styles
 * Product cards, buttons, forms, navigation, etc.
 * 
 * @version 1.0.0
 */

/* Placeholder — component styles will be added progressively */


/**
 * VendifyTech Header & Navigation Polish
 * V10 LOOP 10 — merged into vt-components.css
 */
.whb-header { transition: box-shadow var(--vt-transition-normal), background-color var(--vt-transition-normal); }
.whb-header.vt-scrolled, .whb-header.vt-scrolled .whb-general-header { box-shadow: var(--vt-shadow-md); }
.whb-header.vt-scrolled .whb-general-header .whb-row { padding-top: var(--vt-space-2); padding-bottom: var(--vt-space-2); }
.whb-general-header .whb-row { transition: padding var(--vt-transition-normal); }
.whb-logo img, .site-logo img { max-height: 40px; width: auto; transition: max-height var(--vt-transition-normal); }
.whb-header.vt-scrolled .whb-logo img, .whb-header.vt-scrolled .site-logo img { max-height: 32px; }
.whb-navigation .menu > li > a, .main-nav .menu > li > a { text-transform: uppercase; font-size: var(--vt-font-size-sm); font-weight: var(--vt-font-weight-semibold); letter-spacing: 0.05em; color: var(--vt-color-gray-800); padding: var(--vt-space-3) var(--vt-space-4); position: relative; transition: color var(--vt-transition-fast); }
.whb-navigation .menu > li > a::after, .main-nav .menu > li > a::after { content: ''; position: absolute; bottom: var(--vt-space-2); left: var(--vt-space-4); right: var(--vt-space-4); height: 2px; background-color: var(--vt-color-primary); transform: scaleX(0); transform-origin: left; transition: transform var(--vt-transition-normal); }
.whb-navigation .menu > li > a:hover::after, .main-nav .menu > li > a:hover::after, .whb-navigation .menu > li.current-menu-item > a::after, .main-nav .menu > li.current-menu-item > a::after { transform: scaleX(1); }
.whb-navigation .menu > li > a:hover, .main-nav .menu > li > a:hover, .whb-navigation .menu > li.current-menu-item > a, .main-nav .menu > li.current-menu-item > a { color: var(--vt-color-primary); }
.mobile-nav { background-color: var(--vt-color-white); }
.mobile-nav .menu > li > a { text-transform: uppercase; font-size: var(--vt-font-size-base); font-weight: var(--vt-font-weight-medium); letter-spacing: 0.03em; color: var(--vt-color-gray-900); padding: var(--vt-space-4) var(--vt-space-5); border-bottom: 1px solid var(--vt-color-gray-100); transition: background-color var(--vt-transition-fast), color var(--vt-transition-fast); }
.mobile-nav .menu > li > a:hover, .mobile-nav .menu > li > a:active { background-color: var(--vt-color-gray-50); color: var(--vt-color-primary); }
.whb-mobile-nav-icon a, .mobile-nav-icon a { color: var(--vt-color-gray-900); transition: color var(--vt-transition-fast), transform var(--vt-transition-fast); }
.whb-mobile-nav-icon a:hover, .mobile-nav-icon a:hover { color: var(--vt-color-primary); }
.whb-mobile-nav-icon a:active, .mobile-nav-icon a:active { transform: scale(0.95); }
.whb-header .wd-tools-element > a, .whb-header .wd-header-cart > a { color: var(--vt-color-gray-700); transition: color var(--vt-transition-fast), transform var(--vt-transition-fast); }
.whb-header .wd-tools-element > a:hover, .whb-header .wd-header-cart > a:hover { color: var(--vt-color-primary); transform: translateY(-1px); }
.wd-cart-number, .whb-header .wd-cart-number { background-color: var(--vt-color-primary); color: var(--vt-color-white); font-size: var(--vt-font-size-xs); font-weight: var(--vt-font-weight-bold); min-width: 20px; height: 20px; line-height: 20px; }
.whb-header .wd-search-form { border-radius: var(--vt-radius-lg); overflow: hidden; }
.whb-header .wd-search-form input[type="search"], .whb-header .wd-search-form input[type="text"] { border: 1px solid var(--vt-color-gray-200); border-radius: var(--vt-radius-lg); padding: var(--vt-space-3) var(--vt-space-4); font-size: var(--vt-font-size-base); transition: border-color var(--vt-transition-fast), box-shadow var(--vt-transition-fast); }
.whb-header .wd-search-form input[type="search"]:focus, .whb-header .wd-search-form input[type="text"]:focus { border-color: var(--vt-color-primary); box-shadow: var(--vt-focus-ring); outline: none; }
.whb-navigation .sub-menu, .main-nav .sub-menu { border-radius: var(--vt-radius-lg); box-shadow: var(--vt-shadow-lg); border: 1px solid var(--vt-color-gray-100); padding: var(--vt-space-3); }
.whb-navigation .sub-menu > li > a, .main-nav .sub-menu > li > a { padding: var(--vt-space-2) var(--vt-space-3); border-radius: var(--vt-radius-md); font-size: var(--vt-font-size-sm); color: var(--vt-color-gray-700); transition: background-color var(--vt-transition-fast), color var(--vt-transition-fast); }
.whb-navigation .sub-menu > li > a:hover, .main-nav .sub-menu > li > a:hover { background-color: var(--vt-color-gray-50); color: var(--vt-color-primary); }
.whb-top-bar { background-color: var(--vt-color-gray-900); color: var(--vt-color-gray-300); font-size: var(--vt-font-size-xs); }
.whb-top-bar a { color: var(--vt-color-gray-300); transition: color var(--vt-transition-fast); }
.whb-top-bar a:hover { color: var(--vt-color-white); }
@media (max-width: 1024px) { .whb-navigation.whb-desktop-nav { display: none; } }
@media (min-width: 1025px) { .whb-mobile-nav-icon { display: none; } }
@media (prefers-reduced-motion: reduce) {
    .whb-header, .whb-general-header .whb-row, .whb-logo img, .site-logo img, .whb-navigation .menu > li > a, .whb-navigation .menu > li > a::after, .main-nav .menu > li > a, .main-nav .menu > li > a::after { transition: none; }
    .whb-navigation .menu > li > a::after, .main-nav .menu > li > a::after { transform: scaleX(1); opacity: 0; }
    .whb-navigation .menu > li > a:hover::after, .main-nav .menu > li > a:hover::after { opacity: 1; }
}

/**
 * VendifyTech Homepage Experience
 * V10 LOOP 11 — Homepage Experience
 * @version 1.0.0
 */
.vt-hero { position: relative; overflow: hidden; }
.vt-hero-content { max-width: var(--vt-container-xl); margin: 0 auto; padding: var(--vt-space-16) var(--vt-space-6); }
.vt-hero-title { font-family: var(--vt-font-display); font-size: var(--vt-font-size-5xl); font-weight: var(--vt-font-weight-bold); line-height: var(--vt-line-height-tight); color: var(--vt-color-gray-900); margin-bottom: var(--vt-space-4); }
.vt-hero-subtitle { font-size: var(--vt-font-size-xl); color: var(--vt-color-gray-600); margin-bottom: var(--vt-space-8); max-width: 600px; }
.vt-hero-cta { display: inline-flex; gap: var(--vt-space-4); }
.vt-category-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--vt-space-6); max-width: var(--vt-container-xl); margin: 0 auto; padding: 0 var(--vt-space-6); }
.vt-category-card { position: relative; border-radius: var(--vt-radius-xl); overflow: hidden; background-color: var(--vt-color-white); box-shadow: var(--vt-shadow-card); transition: transform var(--vt-transition-normal), box-shadow var(--vt-transition-normal); }
.vt-category-card:hover { transform: translateY(-4px); box-shadow: var(--vt-shadow-card-hover); }
.vt-category-card img { width: 100%; height: 200px; object-fit: cover; transition: transform var(--vt-transition-slow); }
.vt-category-card:hover img { transform: scale(1.05); }
.vt-category-card-content { padding: var(--vt-space-5); }
.vt-category-card-title { font-family: var(--vt-font-display); font-size: var(--vt-font-size-lg); font-weight: var(--vt-font-weight-semibold); color: var(--vt-color-gray-900); margin-bottom: var(--vt-space-2); }
.vt-category-card-count { font-size: var(--vt-font-size-sm); color: var(--vt-color-gray-500); }
.vt-showcase { max-width: var(--vt-container-xl); margin: 0 auto; padding: var(--vt-space-16) var(--vt-space-6); }
.vt-showcase-header { text-align: center; margin-bottom: var(--vt-space-10); }
.vt-showcase-title { font-family: var(--vt-font-display); font-size: var(--vt-font-size-3xl); font-weight: var(--vt-font-weight-bold); color: var(--vt-color-gray-900); margin-bottom: var(--vt-space-3); }
.vt-showcase-subtitle { font-size: var(--vt-font-size-lg); color: var(--vt-color-gray-600); max-width: 600px; margin: 0 auto; }
.vt-product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: var(--vt-space-6); }
.vt-trust-badges { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--vt-space-6); max-width: var(--vt-container-lg); margin: 0 auto; padding: var(--vt-space-12) var(--vt-space-6); }
.vt-trust-badge { text-align: center; padding: var(--vt-space-6); }
.vt-trust-badge-icon { width: 48px; height: 48px; margin: 0 auto var(--vt-space-4); color: var(--vt-color-primary); }
.vt-trust-badge-title { font-weight: var(--vt-font-weight-semibold); color: var(--vt-color-gray-900); margin-bottom: var(--vt-space-2); }
.vt-trust-badge-text { font-size: var(--vt-font-size-sm); color: var(--vt-color-gray-600); }
.vt-newsletter { background-color: var(--vt-color-gray-900); color: var(--vt-color-white); padding: var(--vt-space-16) var(--vt-space-6); text-align: center; }
.vt-newsletter-title { font-family: var(--vt-font-display); font-size: var(--vt-font-size-2xl); font-weight: var(--vt-font-weight-bold); margin-bottom: var(--vt-space-3); }
.vt-newsletter-text { color: var(--vt-color-gray-300); margin-bottom: var(--vt-space-6); max-width: 500px; margin-left: auto; margin-right: auto; }
.vt-newsletter-form { display: flex; gap: var(--vt-space-3); max-width: 500px; margin: 0 auto; }
.vt-newsletter-form input[type="email"] { flex: 1; padding: var(--vt-space-3) var(--vt-space-4); border: 1px solid var(--vt-color-gray-700); border-radius: var(--vt-radius-lg); background-color: var(--vt-color-gray-800); color: var(--vt-color-white); font-size: var(--vt-font-size-base); }
.vt-newsletter-form input[type="email"]::placeholder { color: var(--vt-color-gray-500); }
.vt-newsletter-form input[type="email"]:focus { border-color: var(--vt-color-primary); outline: none; box-shadow: var(--vt-focus-ring); }
.vt-section { padding-top: var(--vt-space-16); padding-bottom: var(--vt-space-16); }
.vt-section-sm { padding-top: var(--vt-space-10); padding-bottom: var(--vt-space-10); }
@media (max-width: 768px) {
    .vt-hero-title { font-size: var(--vt-font-size-3xl); }
    .vt-hero-subtitle { font-size: var(--vt-font-size-lg); }
    .vt-newsletter-form { flex-direction: column; }
    .vt-category-grid, .vt-product-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    .vt-category-card, .vt-category-card img { transition: none; }
    .vt-category-card:hover { transform: none; }
    .vt-category-card:hover img { transform: none; }
}
	
/**
 * VendifyTech Product Catalog
 * V10 LOOP 12 — Product Catalog
 * @version 1.0.0
 */
.vt-catalog { max-width: var(--vt-container-xl); margin: 0 auto; padding: var(--vt-space-8) var(--vt-space-6); }
.vt-catalog-header { margin-bottom: var(--vt-space-8); }
.vt-catalog-title { font-family: var(--vt-font-display); font-size: var(--vt-font-size-3xl); font-weight: var(--vt-font-weight-bold); color: var(--vt-color-gray-900); margin-bottom: var(--vt-space-3); }
.vt-catalog-description { color: var(--vt-color-gray-600); max-width: 700px; }
.vt-catalog-count { font-size: var(--vt-font-size-sm); color: var(--vt-color-gray-500); margin-top: var(--vt-space-4); }.vt-catalog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: var(--vt-space-6); }
.woocommerce ul.products { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: var(--vt-space-6); }
.woocommerce ul.products li.product { margin: 0; width: auto; float: none; }
.vt-product-card, .woocommerce ul.products li.product { background-color: var(--vt-color-white); border-radius: var(--vt-radius-xl); overflow: hidden; box-shadow: var(--vt-shadow-card); transition: transform var(--vt-transition-normal), box-shadow var(--vt-transition-normal); }
.vt-product-card:hover, .woocommerce ul.products li.product:hover { transform: translateY(-4px); box-shadow: var(--vt-shadow-card-hover); }.vt-product-image, .woocommerce ul.products li.product .woocommerce-loop-product__link { display: block; overflow: hidden; position: relative; aspect-ratio: 1; background-color: var(--vt-color-gray-50); }
.vt-product-image img, .woocommerce ul.products li.product img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--vt-transition-slow); margin: 0; }
.vt-product-card:hover .vt-product-image img, .woocommerce ul.products li.product:hover img { transform: scale(1.05); }
.vt-sale-badge, .woocommerce ul.products li.product .onsale { position: absolute; top: var(--vt-space-3); left: var(--vt-space-3); background-color: var(--vt-color-error); color: var(--vt-color-white); font-size: var(--vt-font-size-xs); font-weight: var(--vt-font-weight-bold); text-transform: uppercase; letter-spacing: 0.05em; padding: var(--vt-space-1) var(--vt-space-3); border-radius: var(--vt-radius-full); z-index: 2; }.vt-product-info, .woocommerce ul.products li.product .woocommerce-loop-product__title { padding: var(--vt-space-4); }
.vt-product-title, .woocommerce ul.products li.product .woocommerce-loop-product__title { font-family: var(--vt-font-display); font-size: var(--vt-font-size-base); font-weight: var(--vt-font-weight-semibold); color: var(--vt-color-gray-900); margin-bottom: var(--vt-space-2); line-height: var(--vt-line-height-snug); }
.vt-product-category { font-size: var(--vt-font-size-xs); text-transform: uppercase; letter-spacing: 0.05em; color: var(--vt-color-gray-500); margin-bottom: var(--vt-space-2); }
.vt-product-price, .woocommerce ul.products li.product .price { font-size: var(--vt-font-size-lg); font-weight: var(--vt-font-weight-bold); color: var(--vt-color-gray-900); margin-bottom: var(--vt-space-3); }
.woocommerce ul.products li.product .price del { color: var(--vt-color-gray-400); font-weight: var(--vt-font-weight-normal); margin-right: var(--vt-space-2); }
.woocommerce ul.products li.product .price ins { text-decoration: none; color: var(--vt-color-error); }


.vt-product-rating, .woocommerce ul.products li.product .star-rating { color: var(--vt-color-warning); font-size: var(--vt-font-size-sm); margin-bottom: var(--vt-space-3); }
.vt-add-to-cart, .woocommerce ul.products li.product .button { width: 100%; background-color: var(--vt-color-primary); color: var(--vt-color-white); border: none; border-radius: var(--vt-radius-lg); padding: var(--vt-space-3) var(--vt-space-4); font-weight: var(--vt-font-weight-semibold); font-size: var(--vt-font-size-sm); text-transform: uppercase; letter-spacing: 0.03em; cursor: pointer; transition: background-color var(--vt-transition-fast), transform var(--vt-transition-fast); }
.vt-add-to-cart:hover, .woocommerce ul.products li.product .button:hover { background-color: var(--vt-color-primary-dark); transform: translateY(-1px); }
.vt-add-to-cart:active, .woocommerce ul.products li.product .button:active { transform: translateY(0) scale(0.98); }.vt-catalog-toolbar { display: flex; justify-content: space-between; align-items: center; gap: var(--vt-space-4); margin-bottom: var(--vt-space-6); padding: var(--vt-space-4); background-color: var(--vt-color-white); border-radius: var(--vt-radius-lg); box-shadow: var(--vt-shadow-sm); }
.woocommerce .woocommerce-ordering select, .vt-sort-select { border: 1px solid var(--vt-color-gray-200); border-radius: var(--vt-radius-md); padding: var(--vt-space-2) var(--vt-space-3); font-size: var(--vt-font-size-sm); background-color: var(--vt-color-white); cursor: pointer; }
.woocommerce .woocommerce-ordering select:focus, .vt-sort-select:focus { border-color: var(--vt-color-primary); outline: none; box-shadow: var(--vt-focus-ring); }
.vt-filters { background-color: var(--vt-color-white); border-radius: var(--vt-radius-lg); padding: var(--vt-space-6); box-shadow: var(--vt-shadow-sm); }
.vt-filter-group { margin-bottom: var(--vt-space-6); }
.vt-filter-title { font-weight: var(--vt-font-weight-semibold); font-size: var(--vt-font-size-sm); text-transform: uppercase; letter-spacing: 0.05em; color: var(--vt-color-gray-900); margin-bottom: var(--vt-space-3); }
.vt-filter-option { display: flex; align-items: center; gap: var(--vt-space-2); padding: var(--vt-space-2) 0; font-size: var(--vt-font-size-sm); color: var(--vt-color-gray-700); cursor: pointer; transition: color var(--vt-transition-fast); }
.vt-pagination, .woocommerce nav.woocommerce-pagination { margin-top: var(--vt-space-10); text-align: center; }

.vt-pagination ul, .woocommerce nav.woocommerce-pagination ul { display: inline-flex; gap: var(--vt-space-2); list-style: none; margin: 0; padding: 0; border: none; }
.vt-pagination a, .vt-pagination span, .woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 var(--vt-space-3); border-radius: var(--vt-radius-md); font-weight: var(--vt-font-weight-medium); color: var(--vt-color-gray-700); background-color: var(--vt-color-white); border: 1px solid var(--vt-color-gray-200); transition: all var(--vt-transition-fast); }
.vt-pagination a:hover, .woocommerce nav.woocommerce-pagination ul li a:hover { border-color: var(--vt-color-primary); color: var(--vt-color-primary); }
.vt-pagination .current, .woocommerce nav.woocommerce-pagination ul li span.current { background-color: var(--vt-color-primary); border-color: var(--vt-color-primary); color: var(--vt-color-white); }

.vt-filter-option:hover { color: var(--vt-color-primary); }.vt-empty-catalog { text-align: center; padding: var(--vt-space-16) var(--vt-space-6); }
.vt-empty-catalog-icon { width: 64px; height: 64px; margin: 0 auto var(--vt-space-4); color: var(--vt-color-gray-300); }
.vt-empty-catalog-title { font-size: var(--vt-font-size-xl); font-weight: var(--vt-font-weight-semibold); color: var(--vt-color-gray-900); margin-bottom: var(--vt-space-2); }
.vt-empty-catalog-text { color: var(--vt-color-gray-600); margin-bottom: var(--vt-space-6); }
@media (max-width: 768px) {
.vt-catalog-toolbar { flex-direction: column; align-items: stretch; }
.vt-catalog-grid, .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); gap: var(--vt-space-4); }
}
@media (max-width: 480px) {
.vt-catalog-grid, .woocommerce ul.products { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
.vt-product-card, .woocommerce ul.products li.product, .vt-product-image img, .woocommerce ul.products li.product img, .vt-add-to-cart, .woocommerce ul.products li.product .button { transition: none; }
.vt-product-card:hover, .woocommerce ul.products li.product:hover { transform: none; }
}