.product-card > *:not(.product-inner):not([class]):not(.product-image):not(.product-content) {
display: none !important;
height: 0 !important;
width: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
} .product-inner > *:not([class]):not(.product-image):not(.product-content):not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.product-details-container) {
display: none !important;
height: 0 !important;
width: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
} .product-inner > *:empty:not(.product-image):not(.product-content):not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.spec-icon),
.product-card > *:empty:not(.product-inner):not(.product-image):not(.product-content):not(.spec-icon) {
display: none !important;
height: 0 !important;
line-height: 0 !important;
font-size: 0 !important;
margin: 0 !important;
padding: 0 !important;
} .product-inner {
display: flex !important;
flex-direction: row !important;
height: auto !important;
min-height: auto !important;
max-height: none !important;
align-items: stretch !important;
justify-content: flex-start !important;
} @media (max-width: 740px) { .product-card {
height: auto !important;
min-height: auto !important;
max-height: none !important;
width: 100% !important;
margin: 0 0 20px 0 !important;
padding: 0 !important;
} .product-card > *:not(.product-inner):not([class]):not(.product-image):not(.product-content),
.product-inner > *:not([class]):not(.product-image):not(.product-content):not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.product-details-container):not(.product-meta-icons-wrapper):not(.specification-icons) {
display: none !important;
height: 0 !important;
width: 0 !important;
margin: 0 !important;
padding: 0 !important;
line-height: 0 !important;
font-size: 0 !important;
overflow: hidden !important;
visibility: hidden !important;
} .product-inner {
display: flex !important;
flex-direction: column !important;
height: auto !important;
min-height: auto !important;
max-height: none !important;
align-items: center !important;
justify-content: flex-start !important;
padding: 0 !important;
margin: 0 !important;
}
}  .product-card {
height: auto !important;
min-height: 240px !important;
max-height: none !important; box-sizing: border-box !important;
width: 100% !important;
max-width: 1150px !important;
margin: 0 !important;
padding: 0 !important;
background: rgb(255, 255, 255) !important;
border: 1px solid rgb(255, 255, 255) !important;
display: block !important;
position: static !important;
} .highlight-text .product-card,
.section-header + * .product-card,
.spec-box .product-card,
.highlight-box .product-card,
.cta-box .product-card,
.cta-text .product-card {
height: auto !important;
min-height: 240px !important;
max-height: none !important;
padding: 0 !important;
margin: 0 !important; } .spec-box .wp-block-shortcode,
.highlight-box .wp-block-shortcode,
.cta-box .wp-block-shortcode,
.section-header + .wp-block-shortcode {
padding: 0 !important;
margin: 0 !important;
height: auto !important;
} .entry-content .product-card,
.post .product-card,
.wp-block-shortcode .product-card {
height: auto !important;
min-height: 240px !important;
max-height: none !important;
width: 100% !important;
max-width: 1150px !important;
margin: 0 !important;
padding: 0 !important; box-sizing: border-box !important;
} .products-rank .product-card,
.products-wrapper-rank .product-card,
.product-display-wrapper .product-card {
height: auto !important;
min-height: 240px !important;
max-height: none !important;
} .post-6635.post.type-post .product-card,
.post-3772.post.type-post .product-card,
body .entry-content .product-card,
html body .product-card {
height: auto !important;
min-height: 240px !important;
max-height: none !important; } .highlight-text,
.spec-box,
.highlight-box,
.cta-box { }
.highlight-text .product-card .product-inner,
.spec-box .product-card .product-inner,
.highlight-box .product-card .product-inner,
.cta-box .product-card .product-inner {
padding: 0 !important;
margin: 0 !important;
height: auto !important;
} .products-rank:has(.product-card) {
gap: 0 !important;
}
.products-rank .product-card {
margin-top: 0 !important;
margin-bottom: 0 !important;
} @media (max-width: 775px) and (min-width: 741px) {
.product-inner {
display: flex;
flex-direction: row;
}
.product-card {
width: 100% !important;
max-width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
} .products-list,
.products-rank {
width: 100% !important;
max-width: 100% !important;
} div[class*="td-"] .product-card,
div[class*="content"] .product-card,
.td-main-content .product-card,
.td-ss-main-content .product-card,
.td-page-content .product-card {
width: 100% !important;
max-width: 100% !important;
box-sizing: border-box !important;
} .product-card,
.product-card * {
box-sizing: border-box !important;
} div:has(> .products-list),
div:has(> .products-rank),
div:has(> .products-wrapper-list),
div:has(> .products-wrapper-rank) {
width: 100% !important;
max-width: 100% !important;
} .td-container .product-card,
.td-main-content-wrap .product-card,
.td-main-wrap .product-card {
width: 100% !important;
max-width: none !important;
}
.product-title {
text-align: left;
margin-left: 0;
}
.product-meta {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 12px;
justify-content: flex-start;
}
.product-meta-icons-wrapper {
display: flex;
flex-direction: row;
justify-content: flex-start;
margin-bottom: 15px;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.product-manufacturer {
margin-right: 10px;
max-height: 50px;
flex: 0 0 auto;
}
.specification-icons {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
gap: 8px;
margin: 0;
}
.product-image {
flex: 0 0 200px;
min-width: 180px;
width: 180px;
height: 180px;
padding: 0 0 0 40px;
}
.product-content {
padding: 15px;
}
} @media (max-width: 1048px) and (min-width: 946px) {
.product-meta-icons-wrapper {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
gap: 10px !important;
margin-bottom: 12px !important;
justify-content: flex-start !important;
}
.product-manufacturer {
margin-right: 10px !important;
margin-bottom: 0 !important;
flex: 0 0 auto !important;
order: -1 !important;
}
.specification-icons {
display: flex !important;
flex-wrap: wrap !important;
gap: 8px !important;
margin: 0 !important;
justify-content: flex-start !important;
flex: 1 !important;
}
.spec-icon {
flex: 0 0 auto !important;
}
} @media (max-width: 945px) and (min-width: 741px) {
.product-meta-icons-wrapper {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
gap: 10px !important;
margin-bottom: 12px !important;
justify-content: flex-start !important;
}
.product-manufacturer {
margin-right: 10px !important;
margin-bottom: 0 !important;
flex: 0 0 auto !important;
order: -1 !important;
float: left !important;
}
.specification-icons {
display: flex !important;
flex-wrap: wrap !important;
gap: 8px !important;
margin: 0 !important;
justify-content: flex-start !important;
flex: 1 !important;
width: auto !important;
}
.spec-icon {
flex: 0 0 auto !important;
display: inline-block !important;
}
}  @media (min-width: 921px) {
.buttons-wrapper {
display: flex !important;
flex-direction: row !important;
gap: 15px !important;
margin: 10px 0 !important;
justify-content: flex-start !important;
width: 100% !important;
min-width: 388px !important;
}
.product-details-container {
width: 100% !important;
min-width: 388px !important;
}
.details-button,
.check-price-button,
.product-compare-btn {
flex: 1 !important;
min-width: 140px !important;
max-width: 250px !important;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
min-height: 48px !important;
}
.product-image {
flex: 0 0 320px;
min-width: 240px;
width: 240px;
height: 240px;
padding: 0 0 0 40px;
}
.product-content {
padding: calc(12px + (100vw - 760px) * 0.004);
}
.product-title {
text-align: left;
margin-left: 0;
}
.product-meta-icons-wrapper {
justify-content: flex-start;
flex-wrap: wrap;
}
.specification-icons {
justify-content: flex-start;
}
} @media (min-width: 771px) and (max-width: 920px) {
.buttons-wrapper {
display: flex !important;
flex-direction: row !important;
gap: 8px !important;
justify-content: flex-start !important;
width: 100% !important;
margin: 10px 0 !important;
min-width: 388px !important;
}
.product-details-container {
width: 100% !important;
min-width: 388px !important;
}
.details-button,
.check-price-button,
.product-compare-btn {
flex: 1 !important;
min-width: 120px !important;
max-width: 220px !important;
margin: 0 !important;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
min-height: 48px !important;
font-size: 0.9em !important;
padding: 0px 15px !important;
}
} @media (max-width: 767px) and (min-width: 561px) {
.buttons-wrapper {
display: flex !important;
flex-direction: row !important;
gap: 6px !important;
justify-content: flex-start !important;
width: 100% !important;
margin: 10px 0 !important;
min-width: 0 !important;
}
.product-details-container {
width: 100% !important;
min-width: 0 !important;
}
.details-button,
.check-price-button,
.product-compare-btn {
flex: 1 !important;
min-width: 0 !important;
max-width: none !important;
margin: 0 !important;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
min-height: 48px !important;
font-size: 0.85em !important;
padding: 0px 8px !important;
}
} @media (max-width: 770px) and (min-width: 768px) {
.buttons-wrapper {
display: flex !important;
flex-direction: row !important;
gap: 10px !important;
justify-content: flex-start !important;
width: 100% !important;
margin: 10px 0 !important;
min-width: 388px !important;
}
.product-details-container {
width: 100% !important;
min-width: 388px !important;
}
.details-button,
.check-price-button,
.product-compare-btn {
flex: 1 !important;
min-width: 0 !important;
margin: 0 !important;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
min-height: 48px !important;
}
.product-title {
text-align: left;
margin-left: 0;
}
.product-meta-icons-wrapper {
justify-content: flex-start;
flex-wrap: wrap;
}
.specification-icons {
justify-content: flex-start;
}
} @media (max-width: 560px) and (min-width: 501px) {
.buttons-wrapper {
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
justify-content: center !important;
gap: 10px !important;
width: 100% !important;
max-width: none !important;
margin: 10px auto !important;
box-sizing: border-box !important;
padding: 0 10px !important;
}
.details-button,
.check-price-button,
.product-compare-btn {
width: 100% !important;
min-width: 0 !important;
max-width: 100% !important;
margin: 0 !important;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
min-height: 48px !important;
box-sizing: border-box !important;
}
.product-details-container {
width: 100% !important;
min-width: 0 !important;
box-sizing: border-box !important;
}
.product-title {
margin-left: auto;
margin-right: auto;
}
.product-meta-icons-wrapper {
justify-content: center;
}
.specification-icons {
justify-content: center;
}
} @media (max-width: 500px) {
.buttons-wrapper {
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
justify-content: center !important;
gap: 10px !important;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 10px !important;
box-sizing: border-box !important;
}
.details-button,
.check-price-button,
.product-compare-btn {
width: 100% !important;
min-width: 0 !important;
max-width: 100% !important;
margin: 0 !important;
border-radius: 10px !important;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
padding-left: 20px !important;
padding-right: 20px !important;
min-height: 48px !important;
box-sizing: border-box !important;
}
.product-content {
width: 100% !important;
padding: 15px 10px !important;
min-width: 0 !important;
box-sizing: border-box !important;
}
.product-details-container {
width: 100% !important;
min-width: 0 !important;
box-sizing: border-box !important;
}
.product-title {
margin-left: auto;
margin-right: auto;
}
.product-meta-icons-wrapper {
justify-content: center;
}
.specification-icons {
justify-content: center;
}
}  :root {
--primary-color: #2c3e50;
--secondary-color: #1e435e;
--background-color: #ffffff;
--gray-background: #f0f0f0;
--text-color: #333333;
--light-text: #666666;
--border-color: #ffffff;
--card-shadow: 0 2px 15px rgba(0,0,0,0.1);
--hover-transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
--orange-color: #0e7300;
--graphite-color: #2c3e50;
--theme-container-edge-spacing: 95vw;
--spec-blue-color: #007acc;
} .product-rank-number {
position: absolute;
left: 15px;
top: 15px;
transform: none;
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: white;
z-index: 3;
border: 2px solid;
padding: 0px;
}
.products-rank {
width: 100%;
margin: 0 auto;
padding: 20px 0;
display: flex;
flex-direction: column;
gap: 20px;
}
.product-rank-number-1 {
background: linear-gradient(135deg, #f6e27a, #d4af37);
border-color: #ffd700;
box-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
font-size: 1.8em;
font-weight: 1000;
width: 48px;
height: 48px;
left: 10px;
top: 10px;
border-width: 3px;
}
.product-rank-number-2 {
background: linear-gradient(135deg, #e3e3e3, #c0c0c0);
border-color: #c0c0c0;
box-shadow: 0 0 10px rgba(192, 192, 192, 0.5);
font-size: 1.5em;
font-weight: 900;
width: 45px;
height: 45px;
left: 12px;
top: 12px;
border-width: 3px; 
}
.product-rank-number-3 {
background: linear-gradient(135deg, #d7995e, #cd7f32);
border-color: #cd7f32;
box-shadow: 0 0 10px rgba(205, 127, 50, 0.5);
font-size: 1.4em;
font-weight: 800;
width: 43px;
height: 43px;
left: 13px;
top: 13px;
border-width: 2px; 
}
.product-rank-number-default {
background: linear-gradient(135deg, #4e5d6c, #2c3e50);
border-color: #2c3e50;
box-shadow: 0 0 10px rgba(44, 62, 80, 0.3);
font-size: 1.3em;
font-weight: 700;
} .product-specifications {
max-height: 0;
opacity: 0;
overflow: hidden;
transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
background: var(--gray-background);
border-radius: 8px;
margin-top: 15px;
}
.product-specifications.hidden {
max-height: 0;
opacity: 0;
}
.product-specifications:not(.hidden) {
max-height: 3000px;
opacity: 1;
transition: max-height 0.5s ease-in, opacity 0.3s ease-in;
} .products-wrapper-list,
.products-wrapper-rank {
position: relative !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin-right: auto !important;
box-sizing: border-box !important;
padding-left: 15px !important;
padding-right: 15px !important;
width: 100% !important;
max-width: 1200px !important;
overflow: hidden !important;
}
div:has(> .products-wrapper-list),
div:has(> .products-wrapper-rank) {
width: 100% !important;
max-width: 100% !important;
padding: 0 !important;
margin: 0 auto !important;
overflow: hidden !important;
}
.products-list,
.products-rank {
width: 100%;
margin: 0 auto;
padding: 20px 0;
display: flex;
flex-direction: column;
gap: 20px;
max-width: 1200px !important;
} .product-card {
width: 100%;
max-width: 1150px;
min-height: 200px;
background: var(--background-color);
border: 1px solid var(--border-color);
border-radius: 8px;
overflow: hidden;
transition: var(--hover-transition);
margin: 0 auto;
box-sizing: border-box;
}
.product-card:hover {
transform: translateY(-5px);
box-shadow: var(--card-shadow);
z-index: 2;
}
.product-inner {
display: flex;
width: 100%;
background: var(--background-color);
position: relative;
flex-wrap: nowrap;
} .product-image {
flex: 0 0 300px;
min-width: 250px;
width: 250px;
height: 250px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: 0 20px 0 60px;
}
.product-image img {
max-width: 100%;
max-height: 88%;
object-fit: contain;
display: block;
transition: transform 0.5s ease;
margin: auto;
}
.product-card:hover .product-image img {
transform: scale(1.05);
} .product-content {
flex: 1;
padding: 15px 20px;
padding-top: 30px;
display: flex;
flex-direction: column;
min-width: 0;
box-sizing: border-box;
} .product-title {
font-size: 1.2em;
color: var(--primary-color);
margin: 15px 0 15px 0;
font-weight: 600;
line-height: 1.3;
word-wrap: break-word;
max-height: 2.6em;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.product-card:hover .product-title {
color: var(--secondary-color);
}
.product-title a {
color: inherit;
text-decoration: none;
} .product-meta {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 4px;
align-items: center;
}
.product-manufacturer {
background: white;
border: 2px solid var(--spec-blue-color);
color: var(--spec-blue-color);
padding: 8px 12px;
border-radius: 8px;
font-size: 0.85em;
font-weight: 600;
transition: all 0.3s ease;
text-align: center;
min-width: 56px;
min-height: 56px;
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
white-space: nowrap;
max-height: 50px;
}
.product-card:hover .product-manufacturer {
background: var(--spec-blue-color);
color: white;
} .product-meta-icons-wrapper {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 12px;
align-items: center;
justify-content: flex-start;
} .no-image {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: var(--gray-background);
color: var(--light-text);
font-size: 0.9em;
} .product-badge {
position: absolute;
top: 10px;
right: 10px;
background: var(--secondary-color);
color: white;
padding: 4px 10px;
border-radius: 12px;
font-size: 0.85em;
font-weight: 500;
z-index: 1;
} .product-details-container {
display: flex;
flex-direction: column;
margin-top: auto;
padding-top: 10px;
width: 100% !important;
box-sizing: border-box !important;
} .buttons-wrapper {
display: flex;
gap: 15px;
margin: 10px 0;
flex-wrap: wrap;
justify-content: flex-start;
width: 100%;
box-sizing: border-box !important;
} .details-button,
.product-compare-btn {
flex: 1;
min-width: 140px;
padding: 0px 30px;
border-radius: 15px;
font-weight: 600;
font-size: 1em;
text-align: center;
transition: all 0.3s ease;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
height: auto;
min-height: 48px;
line-height: 1.3;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
letter-spacing: 0.05em !important;
}
.check-price-button {
background-color: var(--orange-color) !important;
color: white !important;
border: 2px solid var(--orange-color) !important;
flex: 1;
min-width: 140px;
padding: 0px 42px;
border-radius: 15px;
font-weight: 600;
font-size: 1.1em !important;
text-align: center;
transition: all 0.3s ease;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
height: auto;
min-height: 48px;
line-height: 1.3;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
letter-spacing: 0.05em !important;
}
.details-button,
.product-compare-btn {
background-color: white;
color: var(--graphite-color);
border: 2px solid var(--graphite-color);
}
.check-price-button:hover {
background-color: white !important;
color: var(--orange-color) !important;
border: 2px solid var(--orange-color) !important;
transform: translateY(-2px);
}
.details-button:hover {
background-color: var(--graphite-color);
color: white;
transform: translateY(-2px);
} .products-list .product-card .check-price-button,
.products-rank .product-card .check-price-button,
html body .check-price-button,
.td-main-content .check-price-button,
.content-wrapper .check-price-button,
div[class*="content"] .check-price-button {
background-color: var(--orange-color) !important;
color: white !important;
border: 2px solid var(--orange-color) !important;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
min-height: 48px !important;
font-size: 1.1em !important;
}
.products-list .product-card .check-price-button:hover,
.products-rank .product-card .check-price-button:hover,
html body .check-price-button:hover,
.td-main-content .check-price-button:hover,
.content-wrapper .check-price-button:hover,
div[class*="content"] .check-price-button:hover {
background-color: white !important;
color: var(--orange-color) !important;
border: 2px solid var(--orange-color) !important;
font-size: 1.1em !important;
} .specifications-table {
width: 100%;
border-collapse: collapse;
margin-top: 0px;
background: var(--gray-background);
border-radius: 8px;
overflow: hidden;
}
.specifications-table tr {
border-bottom: 1px solid rgba(0,0,0,0.1);
}
.specifications-table tr:last-child {
border-bottom: none;
}
.specifications-table td {
padding: 1px 5px;
border-width: 3px;
}
.spec-label {
font-weight: 600;
color: var(--primary-color);
width: 0%;
}
.spec-value {
color: var(--text-color);
} .specifications-table,
.specifications-table tr,
.specifications-table td,
.specifications-table .spec-value,
.specifications-table .spec-label,
.td-main-content .specifications-table td,
.td-main-content .specifications-table .spec-value,
div[class*="content"] .specifications-table td,
div[class*="content"] .specifications-table .spec-value {
word-break: normal !important;
white-space: normal !important;
word-wrap: normal !important;
overflow-wrap: normal !important;
text-overflow: initial !important;
width: auto !important;
}
.specifications-table .spec-value {
min-width: 60% !important;
} .report-error-link {
margin-top: 12px;
text-align: right;
border-top: 1px solid rgba(0,0,0,0.1);
padding: 8px 15px;
}
.report-error-link a {
font-size: 12px;
color: #FF0000;
text-decoration: none;
transition: var(--hover-transition);
}
.report-error-link a:hover {
color: #CC0000;
text-decoration: underline;
} .report-error-row {
background: var(--gray-background);
}
.report-error-button {
font-size: 12px;
color: #FF0000;
background: none;
border: none;
padding: 5px 10px;
cursor: pointer;
text-decoration: underline;
width: 100%;
text-align: right;
}
.report-error-button:hover {
color: #CC0000;
}
.report-error-form {
background: var(--gray-background);
padding: 15px;
margin-top: 10px;
border-top: 1px solid rgba(0,0,0,0.1);
transition: opacity 0.3s ease, max-height 0.3s ease;
max-height: 400px;
opacity: 1;
}
.report-error-form.hidden {
max-height: 0;
opacity: 0;
overflow: hidden;
padding-top: 0;
padding-bottom: 0;
margin-top: 0;
border-top: none;
}
.report-error-form:not(.hidden) {
max-height: 400px;
padding: 15px;
border-top: 1px solid rgba(0,0,0,0.1);
}
.error-report-form .form-group {
margin-bottom: 15px;
}
.error-report-form label {
display: block;
margin-bottom: 5px;
font-size: 14px;
color: var(--text-color);
}
.error-report-form textarea,
.error-report-form input[type="email"] {
width: 100%;
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
}
.error-report-form .submit-error-report {
background-color: #FF0000;
color: white;
border: none;
padding: 10px 20px;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
transition: background-color 0.3s ease;
}
.error-report-form .submit-error-report:hover {
background-color: #CC0000;
}
.error-report-form .error-message {
color: #FF0000;
font-size: 12px;
margin-top: 10px;
}
.error-report-form .error-message:not(.hidden) {
display: block;
} .details-button:focus:not(:focus-visible) {
outline: none;
}
.details-button:focus-visible {
outline: 2px solid var(--graphite-color);
outline-offset: 2px;
}
.product-compare-btn:hover {
background-color: var(--primary-color);
color: white;
transform: translateY(-2px);
}
.product-compare-btn.active {
background-color: var(--primary-color);
color: white;
}
.product-compare-float-btn {
position: fixed;
top: 20px;
right: 20px;
z-index: 9999;
background-color: #4CAF50;
color: white;
border: none;
border-radius: 4px;
padding: 10px 15px;
font-size: 14px;
cursor: pointer;
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
opacity: 0;
transform: translateY(-20px);
transition: opacity 0.3s ease, transform 0.3s ease;
}
.product-compare-float-btn.show {
opacity: 1;
transform: translateY(0);
} body.modal-open {
overflow: hidden !important;
position: fixed !important;
width: 100% !important;
height: 100% !important;
} .product-compare-modal {
display: none;
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
background-color: rgba(0,0,0,0.7) !important;
z-index: 10000 !important;
overflow: hidden !important;
touch-action: none !important;
}   .product-compare-modal-content::-webkit-scrollbar {
width: 8px !important;
background-color: #f5f5f5 !important;
}
.product-compare-modal-content::-webkit-scrollbar-thumb {
background-color: #888 !important;
border-radius: 10px !important;
}
.product-compare-modal-content::-webkit-scrollbar-thumb:hover {
background-color: #555 !important;
} .product-compare-modal-content {
position: relative !important;
max-height: 80vh !important;
overflow-y: scroll !important;
-webkit-overflow-scrolling: touch !important;
overscroll-behavior: contain !important;
touch-action: pan-y !important;
padding-right: 25px !important;
} .mobile-compare-view, 
.product-compare-table {
overflow-y: visible !important;
width: 100% !important;
} @media (max-width: 700px) {
.product-compare-modal-content {
height: auto !important;
max-height: 75vh !important;
overflow-y: scroll !important;
margin: 5% auto !important;
width: 100% !important;
padding: 15px !important;
border-radius: 8px !important;
position: absolute !important;
top: 1% !important;
left: 0% !important;
right: 0% !important;
}
.mobile-specs-container {
overflow-y: visible !important; 
max-height: none !important;
}
.product-compare-modal::after {
content: '';
position: fixed;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
width: 50px;
height: 5px;
background-color: rgba(255, 255, 255, 0.7);
border-radius: 3px;
z-index: 10001;
pointer-events: none;
}
}
.product-compare-close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
cursor: pointer;
}
.product-compare-close:hover {
color: black;
}
.product-compare-table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
.product-compare-table th {
background-color: #f2f2f2;
}
.product-compare-products {
display: flex;
justify-content: space-around;
margin-bottom: 20px;
}
.product-compare-product {
text-align: center;
width: 30%;
}
.product-compare-product img {
max-width: 100%;
height: auto;
max-height: 200px;
object-fit: contain;
}
.product-compare-remove {
margin-top: 10px;
color: red;
cursor: pointer;
font-size: 12px;
} @keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
} .product-meta {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 4px;
align-items: center;
} .specification-icons {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 0;
align-items: center;
justify-content: flex-start;
}
.spec-icon {
width: 56px;
height: 56px;
object-fit: contain;
border-radius: 4px;
background: rgba(255, 255, 255, 0.1);
padding: 2px;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.spec-icon:hover {
transform: scale(1.1);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
} @media (min-width: 741px) {
.product-inner {
display: flex;
flex-direction: row;
}
.product-content {
text-align: left;
align-items: flex-start;
}
.product-title {
text-align: left;
margin-left: 0;
margin-right: 0;
}
.product-meta {
justify-content: flex-start;
}
.product-meta-icons-wrapper {
justify-content: flex-start;
margin-left: 0;
}
.product-manufacturer {
margin-right: 10px;
margin-left: 0;
}
.specification-icons {
justify-content: flex-start;
margin-left: 0;
}
.buttons-wrapper {
justify-content: flex-start;
flex-direction: row;
}
.product-details-container {
display: flex;
flex-direction: column;
margin-top: auto;
padding-top: 10px;
}
} @media (max-width: 740px) {
.product-inner {
display: flex;
flex-direction: column;
align-items: center;
}
.product-image {
width: 100%;
max-width: 300px;
min-width: auto;
height: 240px;
border-right: none;
border-bottom: 1px solid var(--border-color);
padding: 0;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto;
}
.product-content {
width: 100%;
padding: 15px;
display: flex;
flex-direction: column;
align-items: center;
}
.product-title {
text-align: center;
margin-left: auto;
margin-right: auto;
}
.product-meta {
justify-content: center;
}
.product-meta-icons-wrapper {
justify-content: center;
margin: 0 auto;
flex-wrap: wrap;
}
.product-manufacturer {
margin-right: 0px;
}
.specification-icons {
justify-content: center;
margin: 8px auto;
flex-wrap: wrap;
}
.buttons-wrapper {
width: 100% !important;
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
margin: 10px auto !important;
max-width: none !important;
padding: 0 10px !important;
box-sizing: border-box !important;
}
.details-button,
.check-price-button,
.product-compare-btn {
width: 100% !important;
min-width: 0 !important;
max-width: 100% !important;
margin: 0 !important;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
min-height: 48px !important;
box-sizing: border-box !important;
}
.product-details-container {
width: 100% !important;
min-width: 0 !important;
box-sizing: border-box !important;
}
} .product-rank-number {
left: 10px;
top: 10px;
} @media (min-width: 820px) {
.product-image {
flex: 0 0 320px;
min-width: 240px;
width: 240px;
height: 240px;
padding: 0 0 0 40px;
}
.product-content {
padding: calc(12px + (100vw - 760px) * 0.004);
}
}
@media (max-width: 820px) and (min-width: 741px) {
.product-image {
flex: 0 0 200px;
min-width: 200px;
width: 200px;
height: 200px;
padding: 0 0 0 40px;
} .product-meta-icons-wrapper {
display: flex;
flex-direction: row;
justify-content: flex-start;
margin-bottom: 15px;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.specification-icons {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 0;
justify-content: flex-start;
}
.product-manufacturer {
margin-right: 10px;
max-height: 50px;
flex: 0 0 auto;
}
}
@media (max-width: 820px) and (min-width: 741px) {
.product-image {
flex: 0 0 240px;
height: 240px;
padding: 0 0 0 30px;
}
.product-rank-number {
left: 10px;
top: 10px;
width: 35px;
height: 35px;
font-size: 1.2em;
}
.product-rank-number-1,
.product-rank-number-2,
.product-rank-number-3 {
left: 10px;
top: 10px;
width: 40px;
height: 40px;
}
.product-content {
padding-top: 25px;
}
.product-title {
margin-top: 10px;
}
.product-compare-btn,
.details-button,
.check-price-button {
min-width: 120px;
font-size: 0.95em;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
min-height: 48px !important;
}
} @media (min-width: 1200px) {
.products-wrapper-list,
.products-wrapper-rank {
width: 1140px !important;
max-width: 1140px !important;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.products-wrapper-list,
.products-wrapper-rank {
width: 940px !important;
max-width: 940px !important;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.products-wrapper-list,
.products-wrapper-rank {
width: 720px !important;
max-width: 720px !important;
}
}
@media (max-width: 767px) {
.products-wrapper-list,
.products-wrapper-rank {
width: 100% !important;
max-width: 100% !important;
padding-left: 3px !important;
padding-right: 3px !important;
} .td-main-content,
.td-main-content-wrap,
.td-page-content,
.td-pb-span8,
.td-pb-span12,
.td-ss-main-content,
div[class*="content"] {
} html body .td-container,
html body .tdc-row,
html body .vc_row,
html body .wpb_row,
html body .row,
html body [class*="container"],
html body [class*="wrapper"] {
}
} .product-card,
.product-inner,
.product-content,
.product-title,
.product-meta,
.product-meta-icons-wrapper,
.specification-icons,
.buttons-wrapper {
max-width: 100% !important;
box-sizing: border-box !important;
} .td-main-content .products-wrapper-list,
.td-main-content .products-wrapper-rank,
.td-main-content-wrap .products-wrapper-list,
.td-main-content-wrap .products-wrapper-rank,
.td-page-content .products-wrapper-list,
.td-page-content .products-wrapper-rank,
div[class*="content"] .products-wrapper-list,
div[class*="content"] .products-wrapper-rank {
max-width: 1200px !important;
width: 100% !important;
box-sizing: border-box !important;
float: none !important;
left: 50% !important;
transform: translateX(-50%) !important;
} .td-main-content,
.td-main-content-wrap,
.td-page-content,
.td-pb-span8,
.td-pb-span12,
.td-ss-main-content,
div[class*="content"] {
} html body .td-container,
html body .tdc-row,
html body .vc_row,
html body .wpb_row,
html body .row,
html body [class*="container"],
html body [class*="wrapper"] {
} html body .td-container *,
html body .tdc-row *,
html body .vc_row *,
html body .wpb_row *,
html body .row *,
html body [class*="container"] *,
html body [class*="wrapper"] * {
} .td-container .products-wrapper-list,
.td-container .products-wrapper-rank,
.tdc-row .products-wrapper-list,
.tdc-row .products-wrapper-rank,
.vc_row .products-wrapper-list,
.vc_row .products-wrapper-rank,
.wpb_row .products-wrapper-list,
.wpb_row .products-wrapper-rank,
.row .products-wrapper-list,
.row .products-wrapper-rank {
max-width: 1200px !important;
box-sizing: border-box !important;
}  .product-card > *:empty:not(.product-inner):not(.product-image):not(.product-content):not(.spec-icon),
.product-inner > *:empty:not(.product-image):not(.product-content):not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.product-details-container):not(.spec-icon),
.product-content > *:empty:not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.product-details-container):not(.spec-icon) {
display: none !important;
height: 0 !important;
width: 0 !important;
margin: 0 !important;
padding: 0 !important;
line-height: 0 !important;
font-size: 0 !important;
overflow: hidden !important;
visibility: hidden !important;
position: absolute !important;
left: -9999px !important;
top: -9999px !important;
} html body .product-card,
html body .product-inner,
html body .product-content,
html body .product-details-container,
html body .buttons-wrapper {
height: auto !important;
min-height: auto !important;
max-height: none !important;
} .product-card *:empty:not(.product-image):not(.product-content):not(.product-inner):not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.product-details-container):not(.product-meta-icons-wrapper):not(.specification-icons):not(.spec-icon) {
display: none !important;
} .product-card::before,
.product-card::after,
.product-inner::before,
.product-inner::after {
display: none !important;
content: none !important;
height: 0 !important;
width: 0 !important;
} .product-card *:empty:not(.product-image):not(.product-content):not(.product-inner):not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.product-details-container):not(.product-meta-icons-wrapper):not(.specification-icons):not(.product-manufacturer):not(.spec-icon) {
display: none !important;
height: 0 !important;
width: 0 !important;
margin: 0 !important;
padding: 0 !important;
line-height: 0 !important;
font-size: 0 !important;
overflow: hidden !important;
visibility: hidden !important;
} .product-card div:not([class]):not([id]):not(.product-image):not(.product-content):not(.product-inner):not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.product-details-container),
.product-inner div:not([class]):not([id]):not(.product-image):not(.product-content):not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.product-details-container),
.product-content div:not([class]):not([id]):not(.product-title):not(.product-meta):not(.buttons-wrapper):not(.product-details-container) {
display: none !important;
height: 0 !important;
width: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
position: absolute !important;
left: -9999px !important;
top: -9999px !important;
}.yasr-star-rating {
width: 0;
position: relative;
display:inline-block;
background-position: 0 0;
background-repeat: repeat-x;
vertical-align: bottom;
}
.yasr-star-rating[data-title]:hover:after {
content: attr(data-title);
padding: 4px 8px;
color: #333;
position: absolute;
left: 0;
top: 100%;
z-index: 20;
white-space: nowrap;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0px 0px 4px #222;
-webkit-box-shadow: 0px 0px 4px #222;
box-shadow: 0px 0px 4px #222;
background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #eeeeee),color-stop(1, #cccccc));
background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
}
.yasr-star-rating .yasr-star-value {
height: 100%;
position: absolute;
}
.yasr-star-rating .yasr-star-value {
position: absolute;
height: 100%;
width: 100%;
background-repeat: repeat-x;
}
.yasr-star-rating::before {
content: none !important;
}
.yasr-star-value::before {
content: none !important;
} .yasr-auto-insert-overall {
margin-top: 10px;
}
.yasr-auto-insert-visitor {
margin-top: 10px;
}
#yasr-custom-text-before-overall {
display: block;
padding-right: 15px;
vertical-align: top;
}
.yasr-vv-second-row-container {
line-height: normal;
display: inline-block;
}
.yasr-vv-stats-text-container {
display: inline-block;
vertical-align: bottom;
}
.yasr-dashicons-visitor-stats {
cursor: pointer;
display: inline-block;
vertical-align: bottom;
}
.yasr-vv-container-loader {
display: inline-block;
}
.yasr-small-block-bold {
display: block;
font-weight: bold;
font-size: 12px;
}
.yasr-most-rated-text{
display: block;
}
.yasr-loader-multiset-visitor {
display: none;
}
.yasr-multiset-average {
text-align: center;
}
.yasr-multiset-average-text {
vertical-align: super;
}
.yasr-vv-stars-title-container {
display: inline;
}
.yasr-stars-title {
margin-left: 4px;
vertical-align: baseline;
}
.yasr-stars-title-average {
font-size: 12px;
margin-left: 4px;
vertical-align: baseline;
} .yasr-widget-recent-ratings-table {
border: none;
}
.yasr-widget-recent-ratings-td {
border: none;
}
.yasr-widget-recent-ratings-text {
font-weight: bold;
} #yasr-medium-rating-tooltip {
font-size: 14px;
}
.yasr-progress-bar-row-container {
width: 100%;
display: flex;
align-items: center;
padding-top: 2px;
padding-bottom: 2px;
}
.yasr-progress-bar-name {
min-width: 72px;
font-size: 14px !important;
}
.yasr-single-progress-bar-container {
flex-grow: 12;
}
.yasr-progress-bar-votes-count {
flex-grow: 0;
text-align: center;
font-size: 14px !important;
min-width: 40px;
}  .yasr-visitors-stats-tooltip {
min-width:300px;
text-align: center;
background-color: white;
color: #0a0a0a;
}
.tippy-tooltip.yasr-theme {
background-color: white;
color: black;
} .tippy-tooltip.yasr-theme {
border: 1px solid #aaaaaa;
}
.tippy-roundarrow {
fill: #aaa !important;
} .yasr-w3-border-0{border:0!important}.yasr-w3-border{border:1px solid #ccc!important; background: linear-gradient(to bottom,#eee,#f6f6f6);}
.yasr-w3-border-top{border-top:1px solid #ccc!important}.yasr-w3-border-bottom{border-bottom:1px solid #ccc!important}
.yasr-w3-border-left{border-left:1px solid #ccc!important}.yasr-w3-border-right{border-right:1px solid #ccc!important}
.yasr-w3-amber,.yasr-w3-hover-amber:hover{color:#000!important;background: linear-gradient(to bottom,#ffda44,#f1cb32);
background-color: #ffce00;
} .yasr-log-container {
width: 98%;
}
.yasr-log-div-child {
padding-top: 5px;
border-bottom: 1px solid #BBD8E7;
padding-bottom: 20px;
}
.yasr-log-image {
list-style-type: none;
display: inline-block;
float: left;
}
.yasr-log-child-head {
padding-left: 37px;
}
.yasr-log-vote {
color: red;
}
#yasr-log-vote-users {
color: green;
}
.yasr-log-post {
color: #2683AE;
}
.yasr-log-ip-date {
padding-top: 5px;
}
.yasr-log-ip {
float: left;
padding-left: 5px;
}
.yasr-log-date {
float: right;
}
#yasr-log-next-rows {
padding-top: 15px;
text-align: right;
}
.yasr-log-page-navigation {
padding-top: 7px;
text-align: center;
}
.yasr-last-ratings-loader {
display: none;
} .yasr-entry-title {
font-size: 33px;
font-weight: 300;
line-height: 1.0909090909;
margin: 0 0 12px 0;
text-transform: uppercase;
}
.yasr-entry-meta {
clear: both;
color: #767676;
font-size: 12px;
font-weight: 400;
line-height: 1.3333333333;
text-transform: uppercase;
}
.yasr-entry-content {
margin: 10px 0 20px 10px;
}