/* ==========================================================================
Rekster.eu — 2026 visual refresh, Blueprint (v3 — full homepage redesign)
Loaded AFTER the theme's own CSS files so these rules win the cascade.
Safe to remove: deleting the one tags with no class, not
covered by the earlier h3/h5/[class*=title] footer rule. */
#footer h4{ color:#FFFFFF !important; }
/* Fix: themeeditor_s_1.css sets .footer-container #footer h4 {color:orange !important},
which out-specifies the plain #footer h4 rule above. Match its exact
selector specificity so ours (loaded later) wins the cascade. */
.footer-container #footer h4, .footer-container #footer h4 a,
.footer-container #footer h4 a:link{
color:#FFFFFF !important;
}
/* ==========================================================================
SITE-WIDE DARK THEME
Everything below applies to every page, not just the homepage: category
listings, product pages, cart, account, CMS, search, contact, auth.
The homepage-only fixes above (left_column, tab-content, footer, HOOK_HOME)
still apply too since #left_column and #footer exist on every page.
========================================================================== */
body{ background: var(--rk-ink) !important; }
#columns, #columns.container{ background: transparent !important; }
/* Breadcrumb */
.breadcrumb{
background: var(--rk-ink-2) !important;
border-color: rgba(255,255,255,.08) !important;
}
.breadcrumb, .breadcrumb a{ color:#8FA3B8 !important; }
.breadcrumb a:hover{ color: var(--rk-accent) !important; }
/* Page headings on category / cms / account pages */
h1.page-heading, #center_column > h1, #center_column h2, #center_column h3,
.page-subheading{
color:#FFFFFF !important;
border-color: rgba(255,255,255,.08) !important;
}
/* Category / search / related-products listing cards (site-wide, not just
inside .tab-content on the homepage) */
.product_list .product-container, .product-miniature, .product-container{
background: var(--rk-ink-2) !important;
border-color: rgba(255,255,255,.08) !important;
}
.product_list .product-container .left-block, .product_list .product-container .right-block,
.product-container .left-block, .product-container .right-block{
background: var(--rk-ink-2) !important;
}
.product-container .product-name, .product-container .product-name a,
.product-container h5, .product-container h5 a{ color:#FFFFFF !important; }
.product-container .product-desc{ color:#8FA3B8 !important; }
.product-container .price, .product-container .product-price{ color: var(--rk-accent) !important; }
/* Add-to-cart buttons everywhere */
.ajax_add_to_cart_button, a.button, .btn-default, .exclusive-add-to-cart,
#add_to_cart button, .product-container .button-container .btn{
background-color: var(--rk-accent) !important;
border-color: var(--rk-accent) !important;
color:#ffffff !important;
}
/* Sort / pagination bar */
.content_sortPagiBar, .sortPagiBar{
background: var(--rk-ink-2) !important;
border-color: rgba(255,255,255,.08) !important;
color:#C7D2DE !important;
}
.content_sortPagiBar select, .content_sortPagiBar .select-title,
.content_sortPagiBar a{
background: var(--rk-ink) !important;
color:#C7D2DE !important;
border-color: rgba(255,255,255,.15) !important;
}
.pagination{ color:#C7D2DE !important; }
.pagination a, .pagination span{
background: var(--rk-ink-2) !important;
color:#C7D2DE !important;
border-color: rgba(255,255,255,.08) !important;
}
.pagination .current a, .pagination .current span, .pagination a:hover{
background: var(--rk-accent) !important;
color:#fff !important;
}
/* Product page: name, reference, description, price, tabs */
.product-name, h1[itemprop="name"]{ color:#FFFFFF !important; }
#short_description_content, .product-description-short, .rte, .std{ color:#C7D2DE !important; }
#product_reference, .product_reference, .product-reference,
#product_condition, .product_condition{ color:#8FA3B8 !important; }
.product-prices .price, #our_price_display, .our_price_display,
span.price{ color: var(--rk-accent) !important; }
/* Nav tabs on product page (More info / Data sheet / Reviews) */
.nav-tabs{ border-color: rgba(255,255,255,.08) !important; }
.nav-tabs > li > a{
background: var(--rk-ink-2) !important;
color:#C7D2DE !important;
border-color: rgba(255,255,255,.08) !important;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus{
background: var(--rk-ink) !important;
color:#FFFFFF !important;
border-bottom-color: var(--rk-ink) !important;
}
.tab-content .tab-pane, #idTab1, #idTab2, #idTab3{ color:#C7D2DE !important; }
/* Cart / checkout / account tables & panels */
table.table, .cart_summary, .box-account, .table-condensed{
background: transparent !important;
color:#C7D2DE !important;
}
table.table td, table.table th{ border-color: rgba(255,255,255,.08) !important; color:#C7D2DE !important; }
.panel, .box, .std{ color:#C7D2DE !important; }
.panel-heading, .page-heading{ color:#FFFFFF !important; }
/* Form fields (contact, auth, addresses, search) */
input[type="text"], input[type="email"], input[type="password"], input[type="tel"],
input[type="number"], textarea, select{
background:#15263A !important;
color:#EAF2FA !important;
border-color: rgba(255,255,255,.15) !important;
}
label, .control-label{ color:#C7D2DE !important; }
/* Fix: product-page (plain, no class) was still theme-default blue link color. */
#center_column h1{ color:#FFFFFF !important; }
/* Fix: checkout/cart page (body#order-opc) has its own
"#order-opc #columns{background:white!important}" rule in global.css,
which out-specifies the plain "#columns" rule above (2 IDs > 1 ID).
Match/beat that specificity so the dark background wins everywhere,
on every page, regardless of body id. */
#order-opc #columns, #columns#columns, body #columns#columns{
background: transparent !important;
}
/* Fix: found the real source of the remaining white page background —
.columns-container is a wrapper AROUND #columns (not #columns itself)
with its own light-gray background, present on every page template. */
.columns-container{ background: transparent !important; }
#page{ background: transparent !important; }
/* Fix: cart/order table (#cart_summary) header cells and footer totals
rows had explicit light-gray backgrounds from the theme's table styles. */
#cart_summary thead th, #cart_summary tfoot tr, #cart_summary tfoot td,
table.table thead th, table.table tfoot tr, table.table tfoot td{
background: var(--rk-ink-2) !important;
color:#C7D2DE !important;
border-color: rgba(255,255,255,.08) !important;
}
#cart_summary tbody tr, table.table tbody tr{
background: transparent !important;
}
#cart_summary tbody tr:nth-child(odd), table.table tbody tr:nth-child(odd),
table.table-striped tbody tr:nth-of-type(odd){
background: rgba(255,255,255,.02) !important;
}
/* Fix: generic ".box" panels (checkout account-choice box, and similar
theme panels) had an explicit light-gray background. */
.box{ background: var(--rk-ink-2) !important; border-color: rgba(255,255,255,.08) !important; }
.box, .box *{ color:#C7D2DE !important; }
.box h1, .box h2, .box h3, .box h4, .box h5, .box strong{ color:#FFFFFF !important; }
/* Fix: checkout step headers (h1.page-heading.step-num, "1 ACCOUNT" /
"2 ADDRESSES" etc.) had a peach/orange background clashing with the
dark theme. Restyle to the dark ink + accent-teal number, matching
the rest of the Blueprint palette. */
h1.page-heading.step-num{
background: var(--rk-ink-2) !important;
color:#FFFFFF !important;
border-left: 3px solid var(--rk-accent) !important;
}
/* ==========================================================================
FIX: "empty meter of blue space" after Featured Equipment.
There are TWO separate .tab-content widgets on the homepage:
1) #center_column > .tab-content (holds #homefeatured) — needed the
earlier "always show" fix because it wasn't marked .active.
2) .homepagetabs_module_list .tab-content (the secondary "Biometric
Readers / Minibars / ..." category-preview tabs, further down) —
this one is a NORMAL bootstrap tab widget and should only show
its .active pane. The earlier blanket ".tab-content .tab-pane{
display:block!important}" rule wrongly forced ALL SEVEN of its
inactive panes visible too, stacking ~300px of near-empty content
each = the empty gap.
Scope the "always show" behaviour to widget #1 only, and restore
normal show/hide behaviour for widget #2.
========================================================================== */
.homepagetabs_module_list .tab-pane{ display:none !important; }
.homepagetabs_module_list .tab-pane.active{ display:block !important; }
/* Fix: footer copyright line was hardcoded "2014 Powered by
iqit-commerce.com. All Rights Reserved" in the template (not something
CSS can edit the text of) — visually swap it out via a pseudo-element
since it's the sole content of a plain, unstyled . */
.footer_copyrights p{
font-size:0 !important;
line-height:0 !important;
}
.footer_copyrights p::before{
content: "\00A9 2026 Rekster.eu. All Rights Reserved";
font-size: 13px;
line-height: 1.5;
color:#8FA3B8;
}
/* ==========================================================================
FIX: the logo