/**
* Contx.ro - Dark Premium Theme Fixes
* Version: 1.7.0
*/
/* ============================================
0. NUCLEAR — FORCE ALL HEADINGS WHITE
============================================ */
/* Force ALL headings to white everywhere (overrides Elementor inline styles) */
h1, h2, h3, h4, h5, h6,
.elementor-heading-title,
.elementor-widget-heading .elementor-heading-title,
.elementor-widget-heading .elementor-heading-title[style],
h1.elementor-heading-title,
h2.elementor-heading-title,
h3.elementor-heading-title,
h4.elementor-heading-title,
.elementor-section[data-settings] h1,
.elementor-section[data-settings] h2,
.elementor-section[data-settings] h3,
.elementor-section[data-settings] h4,
.elementor-section[data-settings] h5,
.elementor-section[data-settings] h6,
.e-con h1, .e-con h2, .e-con h3,
.e-con h4, .e-con h5, .e-con h6,
.e-con .elementor-heading-title,
.e-con .elementor-widget-heading .elementor-heading-title,
.uagb-heading-text,
.uagb-block .uagb-heading-text,
.wp-block-heading,
.wp-block-uagb-advanced-heading .uagb-heading-text,
.wp-block-uagb-advanced-heading h1,
.wp-block-uagb-advanced-heading h2,
.wp-block-uagb-advanced-heading h3,
.wp-block-uagb-advanced-heading h4 {
color: #FFFFFF !important;
}
/* Page titles (Astra) */
.entry-title,
.page-title,
.ast-archive-title,
.ast-archive-description .ast-archive-title,
.woocommerce-products-header__title {
color: #FFFFFF !important;
}
/* Body text also force light on dark pages */
body p, body li, body span, body td, body label,
.elementor-widget-text-editor p,
.elementor-widget-text-editor,
.elementor-text-editor p,
.uagb-desc,
.wp-block-paragraph {
color: var(--contx-text-secondary) !important;
}
/* Links on dark backgrounds */
body a:not(.elementor-button):not(.wp-block-button__link):not(.ast-custom-button):not(.button):not(.menu-link):not(.ast-menu-toggle) {
color: #26C6DA !important;
}
/* ============================================
CSS VARIABLES - PALETA CONTX
============================================ */
:root {
--contx-dark-bg: #0B1A2E;
--contx-darker-bg: #061222;
--contx-card-bg: rgba(11, 26, 46, 0.8);
--contx-text-primary: #FFFFFF;
--contx-text-secondary: #B0BEC5;
--contx-accent-cyan: #26C6DA;
--contx-accent-blue: #1565C0;
--contx-gradient-cta: linear-gradient(135deg, #1565C0, #26C6DA);
--contx-border-subtle: rgba(38, 198, 218, 0.2);
--contx-border-glow: rgba(38, 198, 218, 0.5);
/* Override Astra light CSS variables */
--ast-global-dark-bg-style: #0B1A2E !important;
--ast-global-dark-lfs: #0B1A2E !important;
--ast-widget-bg-color: #0B1A2E !important;
--ast-wc-container-head-bg-color: #0B1A2E !important;
--ast-title-layout-bg: #0B1A2E !important;
--ast-code-block-background: #061222 !important;
--ast-comment-inputs-background: rgba(11, 26, 46, 0.6) !important;
--ast-search-border-color: rgba(38, 198, 218, 0.2) !important;
--ast-lifter-hover-bg: rgba(38, 198, 218, 0.1) !important;
--ast-gallery-block-color: #FFFFFF !important;
--ast-shadow-style-guide: 0px 0px 4px 0 rgba(38, 198, 218, 0.2) !important;
}
/* ============================================
1. FOOTER — DARK NAVY, TEXT VIZIBIL
============================================ */
/* Footer principal */
.site-footer,
footer.site-footer,
.ast-footer,
.ast-small-footer,
.site-below-footer-wrap,
.site-above-footer-wrap,
.ast-footer-overlay,
footer,
.ast-small-footer .ast-container,
.ast-footer-copyright,
.footer-adv,
.footer-adv .footer-adv-overlay,
.ast-above-footer,
.ast-above-footer-wrap,
.ast-below-footer,
.ast-below-footer-wrap {
background-color: var(--contx-darker-bg) !important;
background: var(--contx-darker-bg) !important;
}
/* Footer text */
.site-footer,
.site-footer *,
.ast-small-footer *,
.site-below-footer-wrap *,
footer p,
footer span,
footer li,
footer td,
footer div,
.ast-footer-copyright *,
.footer-adv *,
.ast-small-footer .ast-footer-site-title {
color: var(--contx-text-secondary) !important;
}
/* Footer headings */
.site-footer h1, .site-footer h2, .site-footer h3,
.site-footer h4, .site-footer h5, .site-footer h6,
footer h1, footer h2, footer h3,
footer h4, footer h5, footer h6,
.footer-adv h1, .footer-adv h2, .footer-adv h3,
.footer-adv h4, .footer-adv h5, .footer-adv h6,
.ast-small-footer h1, .ast-small-footer h2, .ast-small-footer h3,
.ast-small-footer h4, .ast-small-footer h5, .ast-small-footer h6 {
color: var(--contx-text-primary) !important;
}
/* Footer links */
.site-footer a,
footer a,
.ast-small-footer a,
.ast-footer-copyright a,
.footer-adv a {
color: var(--contx-accent-cyan) !important;
text-decoration: none !important;
transition: color 0.3s ease !important;
}
.site-footer a:hover,
footer a:hover,
.ast-small-footer a:hover,
.footer-adv a:hover {
color: #4DD0E1 !important;
}
/* Footer Elementor sections (dacă footer-ul e construit cu Elementor) */
footer .elementor-section,
footer .elementor-container,
footer .elementor-column,
footer .elementor-widget,
footer .e-con,
footer .e-con-inner {
background-color: transparent !important;
}
footer .elementor-heading-title,
footer .elementor-widget-heading .elementor-heading-title {
color: var(--contx-text-primary) !important;
}
footer .elementor-widget-text-editor,
footer .elementor-widget-text-editor p,
footer .elementor-widget-text-editor span,
footer .elementor-text-editor,
footer .elementor-text-editor p {
color: var(--contx-text-secondary) !important;
}
footer .elementor-icon-list-text,
footer .elementor-icon-list-icon svg {
color: var(--contx-text-secondary) !important;
fill: var(--contx-text-secondary) !important;
}
footer .elementor-icon-list-item a {
color: var(--contx-accent-cyan) !important;
}
/* Footer Gutenberg/UAGB blocks */
footer .wp-block-heading,
footer .uagb-heading-text {
color: var(--contx-text-primary) !important;
}
footer .wp-block-paragraph,
footer .uagb-desc {
color: var(--contx-text-secondary) !important;
}
/* ============================================
2. CONTACT PAGE — DARK BG, VISIBLE TEXT
============================================ */
/* Contact page body background */
.page-id-254 #content,
.page-id-254 .site-content,
.page-id-254 .ast-container,
.page-id-254 article,
.page-id-254 .entry-content {
background-color: var(--contx-dark-bg) !important;
}
.page-id-254 .elementor-section,
.page-id-254 .e-con {
background-color: var(--contx-dark-bg) !important;
}
/* Contact page text */
.page-id-254 h1, .page-id-254 h2, .page-id-254 h3,
.page-id-254 h4, .page-id-254 h5, .page-id-254 h6,
.page-id-254 .elementor-heading-title,
.page-id-254 .uagb-heading-text {
color: var(--contx-text-primary) !important;
}
.page-id-254 p,
.page-id-254 span,
.page-id-254 li,
.page-id-254 div:not([class*="elementor-"]),
.page-id-254 .elementor-text-editor,
.page-id-254 .elementor-text-editor p,
.page-id-254 .elementor-widget-text-editor p,
.page-id-254 .uagb-desc {
color: var(--contx-text-secondary) !important;
}
.page-id-254 a:not(.elementor-button):not(.wp-block-button__link) {
color: var(--contx-accent-cyan) !important;
}
/* Contact form fields */
.page-id-254 input[type="text"],
.page-id-254 input[type="email"],
.page-id-254 input[type="tel"],
.page-id-254 input[type="url"],
.page-id-254 input[type="number"],
.page-id-254 textarea,
.page-id-254 select,
.page-id-254 .elementor-field,
.page-id-254 .wpcf7-form-control,
.page-id-254 .sureforms-input,
.page-id-254 .srfm-input-common,
.page-id-254 .srfm-input,
.page-id-254 .srfm-block input,
.page-id-254 .srfm-block textarea,
.page-id-254 .srfm-block select {
background-color: rgba(11, 26, 46, 0.9) !important;
border: 1px solid var(--contx-border-subtle) !important;
color: var(--contx-text-primary) !important;
border-radius: 8px !important;
padding: 12px 16px !important;
transition: border-color 0.3s ease !important;
}
.page-id-254 input:focus,
.page-id-254 textarea:focus,
.page-id-254 select:focus {
border-color: var(--contx-accent-cyan) !important;
box-shadow: 0 0 0 2px rgba(38, 198, 218, 0.15) !important;
outline: none !important;
}
/* Contact form labels */
.page-id-254 label,
.page-id-254 .elementor-field-label,
.page-id-254 .srfm-block-label,
.page-id-254 .srfm-label {
color: var(--contx-text-primary) !important;
font-weight: 500 !important;
}
/* Contact form placeholder */
.page-id-254 input::placeholder,
.page-id-254 textarea::placeholder {
color: rgba(176, 190, 197, 0.5) !important;
}
/* Contact submit button */
.page-id-254 input[type="submit"],
.page-id-254 button[type="submit"],
.page-id-254 .elementor-button,
.page-id-254 .wp-block-button__link,
.page-id-254 .srfm-btn,
.page-id-254 .srfm-submit-btn {
background: var(--contx-gradient-cta) !important;
color: var(--contx-text-primary) !important;
border: none !important;
border-radius: 8px !important;
padding: 14px 32px !important;
font-weight: 600 !important;
cursor: pointer !important;
transition: all 0.3s ease !important;
}
.page-id-254 input[type="submit"]:hover,
.page-id-254 button[type="submit"]:hover,
.page-id-254 .elementor-button:hover,
.page-id-254 .srfm-btn:hover {
box-shadow: 0 4px 20px rgba(38, 198, 218, 0.4) !important;
transform: translateY(-1px) !important;
}
/* Contact page icons */
.page-id-254 .elementor-icon i,
.page-id-254 .elementor-icon svg {
color: var(--contx-accent-cyan) !important;
fill: var(--contx-accent-cyan) !important;
}
/* ============================================
3. DESPRE NOI (About) — STATISTICI VIZIBILE
============================================ */
/* About page - page ID 251 */
.page-id-251 .elementor-element-08ea929,
.page-id-251 .elementor-counter,
.page-id-251 [data-widget_type="counter.default"] {
background-color: var(--contx-dark-bg) !important;
}
/* Forțăm secțiunea de statistici pe dark bg */
.page-id-251 .elementor-element-08ea929 {
background-color: var(--contx-dark-bg) !important;
padding: 60px 0 !important;
}
.page-id-251 .elementor-element-08ea929 *,
.page-id-251 .elementor-element-08ea929 .elementor-counter-number-wrapper,
.page-id-251 .elementor-element-08ea929 .elementor-counter-number,
.page-id-251 .elementor-element-08ea929 .elementor-counter-number-prefix,
.page-id-251 .elementor-element-08ea929 .elementor-counter-number-suffix {
color: var(--contx-accent-cyan) !important;
font-weight: 700 !important;
}
.page-id-251 .elementor-element-08ea929 .elementor-counter-title {
color: var(--contx-text-primary) !important;
font-weight: 400 !important;
}
/* Generic counter styling for any counter section on about page */
.page-id-251 .elementor-widget-counter .elementor-counter-number-wrapper {
color: var(--contx-accent-cyan) !important;
font-size: 2.5em !important;
font-weight: 700 !important;
}
.page-id-251 .elementor-widget-counter .elementor-counter-title {
color: var(--contx-text-secondary) !important;
}
/* UAGB counter/info blocks on about page */
.page-id-251 .uagb-counter__number,
.page-id-251 .uagb-counter-block__number {
color: var(--contx-accent-cyan) !important;
font-weight: 700 !important;
}
.page-id-251 .uagb-counter__title,
.page-id-251 .uagb-counter-block__title {
color: var(--contx-text-primary) !important;
}
/* Despre Noi — image styling (all breakpoints) */
.page-id-251 .wp-block-uagb-image img {
max-width: 100% !important;
height: auto !important;
object-fit: cover !important;
border-radius: 12px !important;
}
/* Prevent absolute positioning overlaps */
.page-id-251 .wp-block-uagb-advanced-heading,
.page-id-251 .wp-block-uagb-container {
position: relative !important;
}
/* Counter grid on About page */
.page-id-251 .wp-block-uagb-counter {
text-align: center !important;
}
@media (max-width: 921px) {
.page-id-251 .uagb-container-inner-blocks-wrap {
flex-direction: column !important;
flex-wrap: nowrap !important;
}
/* Text containers first, images second on mobile */
.page-id-251 .wp-block-uagb-image {
order: 2 !important;
width: 100% !important;
}
.page-id-251 .wp-block-uagb-container:not(.uagb-is-root-container) {
order: 1 !important;
}
.page-id-251 .wp-block-uagb-info-box {
order: 1 !important;
}
}
/* ============================================
4. PACHETE/SHOP PAGE — PRODUCT CARDS
============================================ */
/* Shop page background */
.post-type-archive-product .site-content,
.post-type-archive-product #content,
.post-type-archive-product .ast-container,
.woocommerce-page.post-type-archive-product #primary {
background-color: var(--contx-dark-bg) !important;
}
/* Shop page title */
.post-type-archive-product .woocommerce-products-header h1,
.post-type-archive-product .page-title,
.post-type-archive-product .ast-archive-title,
.post-type-archive-product .woocommerce-products-header__title {
color: var(--contx-text-primary) !important;
}
/* Result count & ordering */
.post-type-archive-product .woocommerce-result-count,
.post-type-archive-product .woocommerce-ordering select {
color: var(--contx-text-secondary) !important;
}
.post-type-archive-product .woocommerce-ordering select {
background-color: var(--contx-card-bg) !important;
border: 1px solid var(--contx-border-subtle) !important;
border-radius: 6px !important;
padding: 8px 12px !important;
}
/* Product grid - 3 columns desktop */
.woocommerce ul.products {
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
gap: 30px !important;
}
/* Product cards */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
background: var(--contx-card-bg) !important;
border: 1px solid var(--contx-border-subtle) !important;
border-radius: 16px !important;
padding: 0 !important;
overflow: hidden !important;
transition: all 0.3s ease !important;
margin: 0 !important;
width: 100% !important;
float: none !important;
}
.woocommerce ul.products li.product:hover {
border-color: var(--contx-border-glow) !important;
box-shadow: 0 8px 32px rgba(38, 198, 218, 0.15) !important;
transform: translateY(-4px) !important;
}
/* Product image - placeholder handling */
.woocommerce ul.products li.product .woocommerce-product-gallery__image,
.woocommerce ul.products li.product img,
.woocommerce ul.products li.product .attachment-woocommerce_thumbnail {
border-radius: 16px 16px 0 0 !important;
width: 100% !important;
height: auto !important;
object-fit: cover !important;
}
/* Hide placeholder images if broken */
.woocommerce ul.products li.product img.wp-post-image[src*="placeholder"],
.woocommerce ul.products li.product img.woocommerce-placeholder {
display: none !important;
}
/* Product content area */
.woocommerce ul.products li.product .astra-shop-summary-wrap,
.woocommerce ul.products li.product .ast-loop-product__link {
padding: 24px !important;
}
/* Product title */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product .ast-loop-product__link h2 {
color: var(--contx-text-primary) !important;
font-size: 1.2em !important;
font-weight: 600 !important;
margin-bottom: 8px !important;
}
/* Product price */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price span,
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price .amount {
color: var(--contx-accent-cyan) !important;
font-size: 1.4em !important;
font-weight: 700 !important;
}
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount {
color: var(--contx-text-secondary) !important;
opacity: 0.6 !important;
font-size: 0.9em !important;
}
/* Product short description */
.woocommerce ul.products li.product .ast-woo-product-category,
.woocommerce ul.products li.product .star-rating {
color: var(--contx-text-secondary) !important;
}
/* Add to cart button */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.add_to_cart_button,
.woocommerce ul.products li.product a.product_type_simple,
.woocommerce ul.products li.product a.product_type_variable {
background: var(--contx-gradient-cta) !important;
color: var(--contx-text-primary) !important;
border: none !important;
border-radius: 8px !important;
padding: 12px 24px !important;
font-weight: 600 !important;
text-transform: none !important;
width: calc(100% - 48px) !important;
margin: 0 24px 24px !important;
text-align: center !important;
display: block !important;
transition: all 0.3s ease !important;
}
.woocommerce ul.products li.product .button:hover {
box-shadow: 0 4px 20px rgba(38, 198, 218, 0.4) !important;
transform: translateY(-1px) !important;
}
/* On sale badge */
.woocommerce ul.products li.product .onsale {
background: var(--contx-gradient-cta) !important;
color: #fff !important;
border-radius: 4px !important;
}
/* Pagination */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
color: var(--contx-text-secondary) !important;
background: var(--contx-card-bg) !important;
border-color: var(--contx-border-subtle) !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current {
background: var(--contx-gradient-cta) !important;
color: #fff !important;
}
/* ============================================
5. CART PAGE — DARK WOOCOMMERCE
============================================ */
/* Cart page background */
.woocommerce-cart .site-content,
.woocommerce-cart #content,
.woocommerce-cart .ast-container,
.woocommerce-cart article,
.woocommerce-cart .entry-content,
.page-id-9 .site-content,
.page-id-9 #content {
background-color: var(--contx-dark-bg) !important;
}
/* Cart page title */
.woocommerce-cart h1, .woocommerce-cart h2,
.woocommerce-cart .entry-title,
.woocommerce-cart .cart_totals h2 {
color: var(--contx-text-primary) !important;
}
/* Cart table */
.woocommerce-cart table.cart,
.woocommerce table.shop_table {
background: var(--contx-card-bg) !important;
border: 1px solid var(--contx-border-subtle) !important;
border-radius: 12px !important;
overflow: hidden !important;
border-collapse: separate !important;
}
.woocommerce table.shop_table th {
background: rgba(6, 18, 34, 0.9) !important;
color: var(--contx-text-primary) !important;
border-bottom: 1px solid var(--contx-border-subtle) !important;
padding: 16px !important;
font-weight: 600 !important;
}
.woocommerce table.shop_table td {
color: var(--contx-text-secondary) !important;
border-bottom: 1px solid rgba(38, 198, 218, 0.08) !important;
padding: 16px !important;
background: transparent !important;
}
.woocommerce table.shop_table tr:nth-child(even) td {
background: rgba(6, 18, 34, 0.3) !important;
}
/* Cart product name */
.woocommerce-cart .product-name a {
color: var(--contx-text-primary) !important;
font-weight: 500 !important;
}
.woocommerce-cart .product-name a:hover {
color: var(--contx-accent-cyan) !important;
}
/* Cart price */
.woocommerce-cart .product-price .amount,
.woocommerce-cart .product-subtotal .amount,
.woocommerce-cart .cart-subtotal .amount,
.woocommerce-cart .order-total .amount {
color: var(--contx-accent-cyan) !important;
font-weight: 600 !important;
}
/* Cart quantity input */
.woocommerce-cart input.qty,
.woocommerce .quantity .qty {
background: rgba(11, 26, 46, 0.9) !important;
color: var(--contx-text-primary) !important;
border: 1px solid var(--contx-border-subtle) !important;
border-radius: 6px !important;
padding: 8px !important;
width: 60px !important;
text-align: center !important;
}
/* Remove button */
.woocommerce-cart a.remove,
.woocommerce a.remove {
color: #ef5350 !important;
font-size: 1.5em !important;
transition: all 0.3s ease !important;
}
.woocommerce-cart a.remove:hover,
.woocommerce a.remove:hover {
background: #ef5350 !important;
color: #fff !important;
border-radius: 50% !important;
}
/* Cart totals */
.woocommerce-cart .cart_totals,
.cart_totals {
background: var(--contx-card-bg) !important;
border: 1px solid var(--contx-border-subtle) !important;
border-radius: 12px !important;
padding: 24px !important;
}
.woocommerce-cart .cart_totals th,
.woocommerce-cart .cart_totals td {
color: var(--contx-text-secondary) !important;
}
/* Update cart button */
.woocommerce-cart button[name="update_cart"],
.woocommerce button.button[name="update_cart"] {
background: transparent !important;
color: var(--contx-accent-cyan) !important;
border: 1px solid var(--contx-accent-cyan) !important;
border-radius: 8px !important;
padding: 12px 24px !important;
}
.woocommerce-cart button[name="update_cart"]:hover {
background: rgba(38, 198, 218, 0.1) !important;
}
/* Checkout button - BIG & PROMINENT */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce a.checkout-button {
background: var(--contx-gradient-cta) !important;
color: var(--contx-text-primary) !important;
border: none !important;
border-radius: 12px !important;
padding: 18px 32px !important;
font-size: 1.2em !important;
font-weight: 700 !important;
text-transform: none !important;
display: block !important;
text-align: center !important;
transition: all 0.3s ease !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
box-shadow: 0 6px 30px rgba(38, 198, 218, 0.5) !important;
transform: translateY(-2px) !important;
}
/* Coupon field */
.woocommerce-cart .coupon input[type="text"] {
background: rgba(11, 26, 46, 0.9) !important;
color: var(--contx-text-primary) !important;
border: 1px solid var(--contx-border-subtle) !important;
border-radius: 8px !important;
padding: 12px !important;
}
.woocommerce-cart .coupon button,
.woocommerce-cart .coupon input[type="submit"] {
background: transparent !important;
color: var(--contx-accent-cyan) !important;
border: 1px solid var(--contx-accent-cyan) !important;
border-radius: 8px !important;
}
/* Empty cart message */
.woocommerce-cart .cart-empty,
.woocommerce-cart .return-to-shop {
color: var(--contx-text-secondary) !important;
}
.woocommerce-cart .return-to-shop a {
background: var(--contx-gradient-cta) !important;
color: var(--contx-text-primary) !important;
}
/* Checkout page dark styling */
.woocommerce-checkout .site-content,
.woocommerce-checkout #content,
.woocommerce-checkout .ast-container,
.woocommerce-checkout article,
.woocommerce-checkout .entry-content {
background-color: var(--contx-dark-bg) !important;
}
.woocommerce-checkout h1, .woocommerce-checkout h2, .woocommerce-checkout h3 {
color: var(--contx-text-primary) !important;
}
.woocommerce-checkout label {
color: var(--contx-text-primary) !important;
}
.woocommerce-checkout input,
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.woocommerce-checkout .select2-container .select2-selection {
background: rgba(11, 26, 46, 0.9) !important;
color: var(--contx-text-primary) !important;
border: 1px solid var(--contx-border-subtle) !important;
border-radius: 8px !important;
}
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-message {
background: var(--contx-card-bg) !important;
color: var(--contx-text-secondary) !important;
border-left-color: var(--contx-accent-cyan) !important;
}
.woocommerce-checkout #place_order {
background: var(--contx-gradient-cta) !important;
color: var(--contx-text-primary) !important;
border: none !important;
border-radius: 12px !important;
padding: 18px 32px !important;
font-size: 1.1em !important;
font-weight: 700 !important;
}
/* ============================================
6. FLOATING CART BUTTON (dreapta-jos)
============================================ */
.contx-floating-cart {
position: fixed !important;
bottom: 30px !important;
right: 30px !important;
z-index: 99998 !important;
background: var(--contx-gradient-cta) !important;
color: #fff !important;
width: 56px !important;
height: 56px !important;
border-radius: 50% !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
box-shadow: 0 4px 20px rgba(38, 198, 218, 0.4) !important;
transition: all 0.3s ease !important;
text-decoration: none !important;
}
.contx-floating-cart:hover {
transform: scale(1.1) !important;
box-shadow: 0 6px 30px rgba(38, 198, 218, 0.6) !important;
color: #fff !important;
}
.contx-floating-cart svg {
width: 24px !important;
height: 24px !important;
stroke: #fff !important;
}
.contx-floating-cart-count {
position: absolute !important;
top: -4px !important;
right: -4px !important;
background: #ef5350 !important;
color: #fff !important;
font-size: 11px !important;
font-weight: 700 !important;
min-width: 20px !important;
height: 20px !important;
border-radius: 10px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 0 5px !important;
line-height: 1 !important;
}
/* Hide count badge when 0 */
.contx-floating-cart-count:empty,
.contx-floating-cart-count[data-count="0"] {
display: none !important;
}
/* ============================================
7. HEADER CART ICON — NEXT TO CTA BUTTON
============================================ */
/* Astra cart in header */
.ast-site-header-cart,
.ast-cart-menu-wrap,
.ast-woo-header-cart {
display: flex !important;
align-items: center !important;
visibility: visible !important;
}
/* Cart icon styling */
.ast-site-header-cart .ast-cart-menu-wrap .count,
.ast-site-header-cart .ast-addon-cart-wrap .count,
.ast-woo-header-cart .count {
background: var(--contx-accent-cyan) !important;
color: var(--contx-darker-bg) !important;
font-weight: 700 !important;
border-radius: 50% !important;
min-width: 20px !important;
height: 20px !important;
line-height: 20px !important;
font-size: 11px !important;
}
.ast-site-header-cart .ast-cart-menu-wrap svg,
.ast-site-header-cart i,
.ast-woo-header-cart svg {
color: #1a1a2e !important;
fill: #1a1a2e !important;
}
/* ============================================
7a. HEADER — WHITE/LIGHT BACKGROUND
============================================ */
header,
.site-header,
#masthead,
.ast-primary-header,
.ast-primary-header-bar,
.main-header-bar,
.main-header-container,
.ast-builder-header-row,
.ast-main-header-wrap,
.ast-main-header-wrap.main-header-bar-wrap,
.site-primary-header-wrap,
.ast-main-header-bar-alignment,
.site-header .ast-container,
header .ast-builder-layout-element,
header .site-header-primary-section-left,
header .site-header-primary-section-center,
header .site-header-primary-section-right {
background: #FFFFFF !important;
background-color: #FFFFFF !important;
}
/* Subtle shadow under header */
.site-header,
.ast-primary-header-bar,
#masthead {
border-bottom: none !important;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08) !important;
}
/* Menu links — dark text on white */
.main-header-menu .menu-item > a,
.main-header-menu .menu-item > .menu-link,
.ast-builder-menu .menu-item > a,
.ast-nav-menu .menu-item > a {
color: #1a1a2e !important;
font-weight: 500 !important;
font-size: 0.95rem !important;
}
.main-header-menu .menu-item > a:hover,
.main-header-menu .menu-item > .menu-link:hover,
.main-header-menu .current-menu-item > a,
.main-header-menu .current-menu-item > .menu-link {
color: #1565C0 !important;
}
/* CTA button in header — gradient rounded */
.ast-custom-button,
.ast-custom-button-link .ast-custom-button {
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
color: #FFFFFF !important;
border: none !important;
border-radius: 25px !important;
padding: 10px 24px !important;
}
.ast-custom-button-link:hover .ast-custom-button {
box-shadow: 0 4px 15px rgba(38, 198, 218, 0.4) !important;
}
/* Mobile menu — white bg, dark text */
.ast-builder-menu-mobile .main-navigation .main-header-menu,
.ast-builder-menu-mobile .main-navigation .main-header-menu .menu-link,
.ast-builder-menu-mobile .main-navigation .main-header-menu .sub-menu {
background-color: #FFFFFF !important;
}
.ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item > .menu-link {
color: #1a1a2e !important;
}
.ast-builder-menu-mobile .main-navigation .menu-item.current-menu-item > .menu-link {
color: #1565C0 !important;
}
.ast-builder-menu-mobile .main-navigation .menu-item > .ast-menu-toggle {
color: #1a1a2e !important;
}
/* Mobile trigger button */
[data-section="section-header-mobile-trigger"] .ast-button-wrap .ast-mobile-menu-trigger-fill {
color: #FFFFFF !important;
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
}
[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg {
fill: #FFFFFF !important;
}
/* ============================================
7b. HEADER LAYOUT — Single row, properly aligned
============================================ */
/* Main header container — flex single row */
.ast-primary-header-bar .site-primary-header-wrap {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
flex-wrap: nowrap !important;
}
/* Header grid — proper 3-column layout */
.ast-primary-header-bar .ast-builder-grid-row {
display: grid !important;
grid-template-columns: auto 1fr auto !important;
align-items: center !important;
width: 100% !important;
}
/* Left: Logo */
.ast-primary-header-bar .site-header-primary-section-left {
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
}
/* Center: Menu — nav links in a single row */
.ast-primary-header-bar .site-header-primary-section-center {
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.ast-primary-header-bar .main-header-menu,
.ast-primary-header-bar .ast-builder-menu .main-header-menu {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: center !important;
gap: 8px !important;
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
.ast-primary-header-bar .main-header-menu > .menu-item {
white-space: nowrap !important;
}
.ast-primary-header-bar .main-header-menu > .menu-item > .menu-link {
padding: 8px 14px !important;
font-size: 14px !important;
font-weight: 500 !important;
}
/* Right: Cart icon + CTA button on same line */
.ast-primary-header-bar .site-header-primary-section-right {
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 12px !important;
flex-wrap: nowrap !important;
}
/* Cart icon in header right */
.ast-primary-header-bar .ast-header-woo-cart {
order: 1 !important;
display: flex !important;
align-items: center !important;
}
/* CTA button in header right */
.ast-primary-header-bar .ast-builder-button-wrap {
order: 2 !important;
}
/* ============================================
8. REMOVE ORANGE STRIPE UNDER HEADER
(keep subtle shadow for white header)
============================================ */
#masthead,
.site-header,
.main-header-bar,
.ast-primary-header-bar,
.ast-primary-header,
header.site-header {
border-bottom: none !important;
}
/* Also check for Astra below-header area separator */
.ast-below-header,
.ast-below-header-wrap,
.ast-above-header,
.ast-above-header-wrap {
border-bottom: none !important;
border-top: none !important;
}
/* Remove any separator from header builder rows */
.ast-header-break-point .main-header-bar,
.ast-header-break-point .ast-primary-header-bar {
border-bottom: none !important;
}
/* Remove Elementor dividers/separators after header */
.site-header + .elementor-widget-divider,
.site-header + hr,
.ast-header-separator {
display: none !important;
}
/* ============================================
9. GLOBAL WOO NOTICES & MESSAGES
============================================ */
.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
background: var(--contx-card-bg) !important;
color: var(--contx-text-secondary) !important;
border-left-color: var(--contx-accent-cyan) !important;
border-radius: 8px !important;
}
.woocommerce-error {
border-left-color: #ef5350 !important;
}
.woocommerce-info a,
.woocommerce-message a {
color: var(--contx-accent-cyan) !important;
}
/* ============================================
10. MY ACCOUNT PAGE DARK
============================================ */
.woocommerce-account .site-content,
.woocommerce-account #content,
.woocommerce-account article,
.woocommerce-account .entry-content {
background-color: var(--contx-dark-bg) !important;
}
.woocommerce-account h1, .woocommerce-account h2, .woocommerce-account h3 {
color: var(--contx-text-primary) !important;
}
.woocommerce-account p,
.woocommerce-account label,
.woocommerce-account span {
color: var(--contx-text-secondary) !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
color: var(--contx-text-secondary) !important;
transition: color 0.3s ease !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
color: var(--contx-accent-cyan) !important;
}
.woocommerce-account input,
.woocommerce-account select {
background: rgba(11, 26, 46, 0.9) !important;
color: var(--contx-text-primary) !important;
border: 1px solid var(--contx-border-subtle) !important;
border-radius: 8px !important;
}
.woocommerce-account button[type="submit"],
.woocommerce-account input[type="submit"] {
background: var(--contx-gradient-cta) !important;
color: var(--contx-text-primary) !important;
border: none !important;
border-radius: 8px !important;
}
/* ============================================
11. RESPONSIVE — MOBILE
============================================ */
@media (max-width: 768px) {
/* Shop grid 1 column on mobile */
.woocommerce ul.products {
grid-template-columns: 1fr !important;
gap: 20px !important;
}
/* Floating cart smaller on mobile */
.contx-floating-cart {
width: 48px !important;
height: 48px !important;
bottom: 20px !important;
right: 20px !important;
}
.contx-floating-cart svg {
width: 20px !important;
height: 20px !important;
}
/* Cart table responsive */
.woocommerce table.shop_table {
border-radius: 8px !important;
}
/* Footer mobile */
footer .elementor-column,
.site-footer .elementor-column {
width: 100% !important;
text-align: center !important;
margin-bottom: 20px !important;
}
}
@media (min-width: 769px) and (max-width: 1024px) {
/* Shop grid 2 columns on tablet */
.woocommerce ul.products {
grid-template-columns: repeat(2, 1fr) !important;
}
}
/* ============================================
12. SINGLE PRODUCT PAGE DARK
============================================ */
.single-product .site-content,
.single-product #content,
.single-product article,
.single-product .entry-content,
.single-product .entry-summary {
background-color: var(--contx-dark-bg) !important;
}
.single-product h1.product_title,
.single-product h2, .single-product h3 {
color: var(--contx-text-primary) !important;
}
.single-product .price,
.single-product .price .amount {
color: var(--contx-accent-cyan) !important;
font-size: 1.5em !important;
font-weight: 700 !important;
}
.single-product .woocommerce-product-details__short-description,
.single-product .woocommerce-product-details__short-description p,
.single-product .product_meta,
.single-product .product_meta span {
color: var(--contx-text-secondary) !important;
}
.single-product .single_add_to_cart_button {
background: var(--contx-gradient-cta) !important;
color: var(--contx-text-primary) !important;
border: none !important;
border-radius: 8px !important;
padding: 14px 32px !important;
font-weight: 600 !important;
}
.single-product .single_add_to_cart_button:hover {
box-shadow: 0 4px 20px rgba(38, 198, 218, 0.4) !important;
}
.single-product .woocommerce-tabs .tabs li a {
color: var(--contx-text-secondary) !important;
}
.single-product .woocommerce-tabs .tabs li.active a {
color: var(--contx-accent-cyan) !important;
}
.single-product .woocommerce-Tabs-panel {
background: var(--contx-card-bg) !important;
color: var(--contx-text-secondary) !important;
border: 1px solid var(--contx-border-subtle) !important;
border-radius: 8px !important;
}
/* ============================================
13. ASTRA DYNAMIC CSS OVERRIDES
Override colors from Astra's auto-generated
dynamic CSS that we can't change via settings
============================================ */
/* WooCommerce cart hover states (Astra generates #252425/#000000 for these) */
.ast-site-header-cart .cart-container:hover .count,
.ast-menu-cart-fill .ast-cart-menu-wrap .count,
.ast-menu-cart-fill .ast-cart-menu-wrap,
.ast-menu-cart-fill .ast-addon-cart-wrap .ast-woo-header-cart-info-wrap,
.ast-menu-cart-fill .ast-addon-cart-wrap {
color: var(--contx-darker-bg) !important;
}
.ast-menu-cart-fill .ast-site-header-cart-li:hover .ast-cart-menu-wrap .count,
.ast-menu-cart-fill .ast-site-header-cart-li:hover .ast-cart-menu-wrap,
.ast-menu-cart-fill .ast-site-header-cart-li:hover .ast-addon-cart-wrap,
.ast-site-header-cart .ast-site-header-cart-li:hover .ast-addon-cart-wrap i.astra-icon:after {
background-color: var(--contx-accent-cyan) !important;
color: var(--contx-darker-bg) !important;
}
.ast-site-header-cart .ast-site-header-cart-li:hover .ast-cart-menu-wrap .count,
.ast-menu-cart-outline .ast-site-header-cart-li:hover .ast-addon-cart-wrap,
.ast-site-header-cart.ast-menu-cart-outline .ast-site-header-cart-li:hover .ast-cart-menu-wrap .count {
border-color: var(--contx-accent-cyan) !important;
color: var(--contx-accent-cyan) !important;
}
.ast-site-header-cart .ast-site-header-cart-li:hover .ast-cart-menu-wrap .count .ast-count-text {
color: var(--contx-accent-cyan) !important;
}
.ast-site-header-cart-li:hover .ast-woo-header-cart-info-wrap,
.ast-site-header-cart .ast-site-header-cart-li:hover .ast-addon-cart-wrap,
.ast-menu-cart-outline .ast-site-header-cart-li:hover .ast-addon-cart-wrap .astra-icon {
color: var(--contx-accent-cyan) !important;
}
.ast-site-header-cart .ast-site-header-cart-li:hover .ast-cart-menu-wrap .count:after,
.ast-site-header-cart .ast-site-header-cart-li:hover .ast-addon-cart-wrap .count {
color: var(--contx-accent-cyan) !important;
border-color: var(--contx-accent-cyan) !important;
}
.ast-menu-cart-fill .ast-site-header-cart-li:hover .astra-icon {
color: var(--contx-darker-bg) !important;
}
.ast-site-header-cart .ast-site-header-cart-li:hover .ast-addon-cart-wrap i.astra-icon:after {
color: var(--contx-accent-cyan) !important;
background-color: transparent !important;
}
/* Footer background override (Astra dynamic generates old #222222) */
.site-footer,
.site-primary-footer-wrap,
.site-below-footer-wrap,
.site-above-footer-wrap {
background-color: var(--contx-darker-bg) !important;
background-image: none !important;
}
/* Astra mobile trigger colors */
[data-section="section-header-mobile-trigger"] .ast-button-wrap .ast-mobile-menu-trigger-fill {
color: #FFFFFF !important;
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
}
[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg {
fill: #FFFFFF !important;
}
[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-wrap .mobile-menu {
color: #FFFFFF !important;
}
/* Astra primary header border override */
.ast-primary-header-bar {
border-bottom-color: transparent !important;
border-bottom-width: 0 !important;
}
/* ============================================
14. HOME PAGE (ID 250) — Layout & Centering
============================================ */
/* Full page text center */
.page-id-250 .entry-content {
text-align: center !important;
max-width: 1200px !important;
margin: 0 auto !important;
padding: 0 20px !important;
}
/* Hero section — first H1 */
.page-id-250 .entry-content > h1:first-of-type {
font-size: clamp(2rem, 5vw, 3.5rem) !important;
font-weight: 700 !important;
margin-bottom: 20px !important;
line-height: 1.2 !important;
}
/* Sub-headline */
.page-id-250 .entry-content > p[style*="max-width:700px"] {
margin: 0 auto 30px !important;
}
/* ---- CTA Links → Styled as buttons ---- */
.page-id-250 .entry-content > p > a[href="/contact"],
.page-id-250 .entry-content > p > a[href="/shop"] {
display: inline-block !important;
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
color: #FFFFFF !important;
padding: 16px 40px !important;
border-radius: 12px !important;
font-weight: 700 !important;
font-size: 1rem !important;
text-decoration: none !important;
text-transform: uppercase !important;
letter-spacing: 1px !important;
transition: all 0.3s ease !important;
box-shadow: 0 4px 15px rgba(38, 198, 218, 0.3) !important;
margin: 10px 0 40px !important;
}
.page-id-250 .entry-content > p > a[href="/contact"]:hover,
.page-id-250 .entry-content > p > a[href="/shop"]:hover {
transform: translateY(-2px) !important;
box-shadow: 0 6px 25px rgba(38, 198, 218, 0.5) !important;
}
/* Remove
tags inside CTA link paragraphs */
.page-id-250 .entry-content > p > a[href="/contact"] br,
.page-id-250 .entry-content > p > a[href="/shop"] br {
display: none !important;
}
/* ---- Statistics — 4-col grid ---- */
/* Stats are H2 + next P pairs: 15+, 200+, 2000+, 500+ */
/* We need a wrapper — use CSS grid on the content area between CTA and "Noi suntem" */
/* Target stats H2 elements (the ones that are numbers) */
.page-id-250 .entry-content > h2 {
text-align: center !important;
}
/* Stats numbers styling */
.page-id-250 .entry-content > h2:nth-of-type(1),
.page-id-250 .entry-content > h2:nth-of-type(2),
.page-id-250 .entry-content > h2:nth-of-type(3),
.page-id-250 .entry-content > h2:nth-of-type(4) {
color: #26C6DA !important;
font-size: 3rem !important;
font-weight: 700 !important;
margin-bottom: 4px !important;
line-height: 1 !important;
}
/* Stats labels (the p after each number h2) */
.page-id-250 .entry-content > h2:nth-of-type(1) + p,
.page-id-250 .entry-content > h2:nth-of-type(2) + p,
.page-id-250 .entry-content > h2:nth-of-type(3) + p,
.page-id-250 .entry-content > h2:nth-of-type(4) + p {
margin-bottom: 30px !important;
font-size: 14px !important;
text-transform: uppercase !important;
letter-spacing: 1px !important;
}
/* ---- "Noi suntem ContX" section — full width, clear break ---- */
/* This is h2:nth-of-type(5), followed by 2 paragraphs */
.page-id-250 .entry-content > h2:nth-of-type(5) {
display: block !important;
width: 100% !important;
clear: both !important;
margin-top: 60px !important;
margin-bottom: 15px !important;
font-size: clamp(1.6rem, 4vw, 2.2rem) !important;
}
/* Paragraphs after "Noi suntem ContX" — must be block, full width */
.page-id-250 .entry-content > h2:nth-of-type(5) ~ p[style*="max-width:800px"] {
display: block !important;
width: 100% !important;
max-width: 800px !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* ---- "SERVICIILE NOASTRE" heading — clear break before services grid ---- */
.page-id-250 .entry-content > h2:nth-of-type(6) {
display: block !important;
width: 100% !important;
clear: both !important;
margin-top: 60px !important;
margin-bottom: 8px !important;
font-size: clamp(1.6rem, 4vw, 2.2rem) !important;
}
/* Subtitle after SERVICIILE — full width block */
.page-id-250 .entry-content > h2:nth-of-type(6) + p {
display: block !important;
width: 100% !important;
margin-bottom: 30px !important;
}
/* ---- Services section — 4-col grid ---- */
.page-id-250 .entry-content > h3 {
color: #FFFFFF !important;
font-size: 1.2rem !important;
margin-bottom: 10px !important;
}
/* ---- Section headings (non-stat H2s) ---- */
.page-id-250 .entry-content > h2:nth-of-type(n+5) {
font-size: clamp(1.5rem, 3.5vw, 2rem) !important;
margin-top: 60px !important;
margin-bottom: 10px !important;
color: #FFFFFF !important;
line-height: 1.3 !important;
}
/* ---- Global heading size cap for all pages ---- */
/* Force override inline styles on Elementor headings */
.elementor-heading-title[style*="font-size"],
h1.elementor-heading-title[style],
h2.elementor-heading-title[style],
h3.elementor-heading-title[style] {
font-size: clamp(1.2rem, 3vw, 2.5rem) !important;
}
h1.elementor-heading-title,
.elementor-widget-heading h1 {
font-size: clamp(1.8rem, 4vw, 2.8rem) !important;
line-height: 1.2 !important;
}
h2.elementor-heading-title,
.elementor-widget-heading h2 {
font-size: clamp(1.4rem, 3vw, 2.2rem) !important;
line-height: 1.3 !important;
}
h3.elementor-heading-title,
.elementor-widget-heading h3 {
font-size: clamp(1.1rem, 2.5vw, 1.6rem) !important;
}
h4.elementor-heading-title,
.elementor-widget-heading h4 {
font-size: clamp(1rem, 2vw, 1.3rem) !important;
}
/* Desktop */
@media (min-width: 1025px) {
.elementor-widget-heading .elementor-heading-title,
.uagb-heading-text,
.wp-block-heading {
font-size: clamp(1.5rem, 3vw, 2.8rem) !important;
}
}
/* Tablet */
@media (min-width: 768px) and (max-width: 1024px) {
.elementor-widget-heading .elementor-heading-title,
.uagb-heading-text,
.wp-block-heading {
font-size: clamp(1.3rem, 3vw, 2.2rem) !important;
}
}
/* Mobile — critical fix */
@media (max-width: 767px) {
.elementor-widget-heading .elementor-heading-title,
.elementor-heading-title[style*="font-size"],
.uagb-heading-text,
.wp-block-heading,
h1, h2, h3 {
font-size: clamp(1.2rem, 5vw, 1.8rem) !important;
line-height: 1.3 !important;
word-wrap: break-word !important;
overflow-wrap: break-word !important;
}
.page-id-250 .entry-content > h1:first-of-type {
font-size: clamp(1.5rem, 6vw, 2.2rem) !important;
}
h3, h4 {
font-size: clamp(1rem, 4vw, 1.3rem) !important;
}
}
/* Contact page heading sizes */
.page-id-254 .elementor-heading-title {
font-size: clamp(1.2rem, 2.5vw, 1.8rem) !important;
}
/* ---- "De ce sa ne alegi" icons ---- */
.page-id-250 .entry-content > p[style*="font-size:48px"] {
margin-top: 30px !important;
}
.page-id-250 .entry-content > h4 {
color: #FFFFFF !important;
font-size: 1.1rem !important;
margin-bottom: 8px !important;
}
/* ---- Responsive stats grid via JS-injected wrapper ---- */
/* We'll handle grid layout with a JS wrapper approach below */
/* ============================================
14b. HOME PAGE — CSS Grid Layout
REMOVED: Old nth-of-type inline-block rules that
conflicted with contx-animations.js grid wrappers.
Stats layout is now handled by .contx-stats-grid (JS + Section 36 CSS).
============================================ */
/* ============================================
15. CART PAGE — Modern Design (override S5)
============================================ */
/* Cart page background */
.woocommerce-cart .site-content,
.woocommerce-cart #content,
.woocommerce-cart .ast-container,
.woocommerce-cart article,
.woocommerce-cart .entry-content,
.page-id-9 .site-content,
.page-id-9 #content {
background-color: var(--contx-dark-bg) !important;
}
/* Cart table — modern separated rows */
.woocommerce-cart table.shop_table {
border: none !important;
border-collapse: separate !important;
border-spacing: 0 12px !important;
background: transparent !important;
border-radius: 0 !important;
}
.woocommerce-cart table.shop_table thead th {
background: rgba(38, 198, 218, 0.15) !important;
color: #26C6DA !important;
border: none !important;
padding: 15px 20px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
font-size: 0.85rem !important;
letter-spacing: 1px !important;
}
.woocommerce-cart table.shop_table thead th:first-child {
border-radius: 12px 0 0 12px !important;
}
.woocommerce-cart table.shop_table thead th:last-child {
border-radius: 0 12px 12px 0 !important;
}
.woocommerce-cart table.shop_table tbody tr {
background: rgba(11, 26, 46, 0.6) !important;
transition: all 0.3s ease !important;
}
.woocommerce-cart table.shop_table tbody tr:hover {
background: rgba(38, 198, 218, 0.08) !important;
transform: translateY(-2px) !important;
box-shadow: 0 4px 20px rgba(38, 198, 218, 0.1) !important;
}
.woocommerce-cart table.shop_table tbody td {
border: none !important;
border-top: 1px solid rgba(38, 198, 218, 0.15) !important;
border-bottom: 1px solid rgba(38, 198, 218, 0.15) !important;
padding: 20px !important;
color: #FFFFFF !important;
vertical-align: middle !important;
background: transparent !important;
}
.woocommerce-cart table.shop_table tbody td:first-child {
border-left: 1px solid rgba(38, 198, 218, 0.15) !important;
border-radius: 12px 0 0 12px !important;
}
.woocommerce-cart table.shop_table tbody td:last-child {
border-right: 1px solid rgba(38, 198, 218, 0.15) !important;
border-radius: 0 12px 12px 0 !important;
}
/* Product name link */
.woocommerce-cart table.shop_table td.product-name a {
color: #26C6DA !important;
font-weight: 600 !important;
text-decoration: none !important;
font-size: 1.05rem !important;
}
/* Price */
.woocommerce-cart table.shop_table .amount {
color: #26C6DA !important;
font-weight: 700 !important;
font-size: 1.1rem !important;
}
/* Quantity input */
.woocommerce-cart table.shop_table .quantity .qty {
background: rgba(11, 26, 46, 0.8) !important;
border: 1px solid rgba(38, 198, 218, 0.3) !important;
color: #FFFFFF !important;
border-radius: 8px !important;
padding: 8px 12px !important;
text-align: center !important;
width: 70px !important;
}
/* Remove button */
.woocommerce-cart table.shop_table .remove {
color: #ff6b6b !important;
font-size: 1.5rem !important;
transition: all 0.3s ease !important;
}
.woocommerce-cart table.shop_table .remove:hover {
background: #ff6b6b !important;
color: #fff !important;
border-radius: 50% !important;
}
/* Coupon section */
.woocommerce-cart .coupon .input-text {
background: rgba(11, 26, 46, 0.8) !important;
border: 1px solid rgba(38, 198, 218, 0.3) !important;
color: #FFFFFF !important;
border-radius: 8px !important;
padding: 10px 15px !important;
}
/* Cart totals box — premium gradient */
.woocommerce-cart .cart_totals {
background: linear-gradient(145deg, rgba(11, 26, 46, 0.9), rgba(21, 101, 192, 0.15)) !important;
border: 1px solid rgba(38, 198, 218, 0.2) !important;
border-radius: 16px !important;
padding: 30px !important;
}
.woocommerce-cart .cart_totals h2,
.cart-collaterals h2 {
color: #FFFFFF !important;
font-size: 1.5rem !important;
margin-bottom: 20px !important;
}
.woocommerce-cart .cart_totals th,
.woocommerce-cart .cart_totals td {
color: #FFFFFF !important;
border-color: rgba(38, 198, 218, 0.15) !important;
padding: 15px !important;
}
/* Checkout button — large and prominent */
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
color: #FFFFFF !important;
border: none !important;
border-radius: 12px !important;
padding: 18px 32px !important;
font-size: 1.1rem !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: 1px !important;
transition: all 0.3s ease !important;
box-shadow: 0 4px 15px rgba(38, 198, 218, 0.3) !important;
display: block !important;
text-align: center !important;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
transform: translateY(-2px) !important;
box-shadow: 0 6px 25px rgba(38, 198, 218, 0.5) !important;
}
/* Update cart button */
.woocommerce-cart button[name="update_cart"] {
background: transparent !important;
color: #26C6DA !important;
border: 1px solid #26C6DA !important;
border-radius: 8px !important;
padding: 12px 24px !important;
font-weight: 600 !important;
transition: all 0.3s ease !important;
}
.woocommerce-cart button[name="update_cart"]:hover {
background: rgba(38, 198, 218, 0.1) !important;
}
/* Placeholder images — hide broken */
.woocommerce-cart table.shop_table img.wp-post-image[src*="placeholder"],
.woocommerce-cart table.shop_table .product-thumbnail img:not([src*="uploads"]) {
display: none !important;
}
/* Empty cart */
.woocommerce-cart .cart-empty {
color: var(--contx-text-secondary) !important;
font-size: 1.2rem !important;
}
.woocommerce-cart .return-to-shop a {
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
color: #FFFFFF !important;
border-radius: 12px !important;
padding: 14px 32px !important;
}
/* ============================================
16. CONTACT PAGE — Form spacing & button
============================================ */
/* Form field spacing */
.page-id-254 .wpcf7-form .wpcf7-form-control-wrap,
.page-id-254 .elementor-field-group,
.page-id-254 .wpcf7 p,
.page-id-254 .srfm-block {
margin-bottom: 15px !important;
}
/* Form fields — refined */
.page-id-254 input[type="text"],
.page-id-254 input[type="email"],
.page-id-254 input[type="tel"],
.page-id-254 input[type="url"],
.page-id-254 textarea,
.page-id-254 select,
.page-id-254 .srfm-input-common,
.page-id-254 .srfm-block input,
.page-id-254 .srfm-block textarea {
background: rgba(11, 26, 46, 0.6) !important;
border: 1px solid rgba(38, 198, 218, 0.3) !important;
color: #FFFFFF !important;
border-radius: 10px !important;
padding: 14px 18px !important;
font-size: 1rem !important;
transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}
.page-id-254 input:focus,
.page-id-254 textarea:focus,
.page-id-254 select:focus {
border-color: #26C6DA !important;
outline: none !important;
box-shadow: 0 0 10px rgba(38, 198, 218, 0.2) !important;
}
/* Placeholders */
.page-id-254 ::placeholder {
color: rgba(176, 190, 197, 0.6) !important;
}
/* Submit button — high contrast */
.page-id-254 input[type="submit"],
.page-id-254 button[type="submit"],
.page-id-254 .wpcf7-submit,
.page-id-254 .srfm-btn,
.page-id-254 .srfm-submit-btn,
.page-id-254 .elementor-button[type="submit"] {
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
color: #FFFFFF !important;
border: none !important;
border-radius: 12px !important;
padding: 16px 40px !important;
font-size: 1.1rem !important;
font-weight: 700 !important;
cursor: pointer !important;
transition: all 0.3s ease !important;
text-transform: uppercase !important;
letter-spacing: 1px !important;
box-shadow: 0 4px 15px rgba(38, 198, 218, 0.3) !important;
}
.page-id-254 input[type="submit"]:hover,
.page-id-254 button[type="submit"]:hover,
.page-id-254 .wpcf7-submit:hover,
.page-id-254 .srfm-btn:hover {
transform: translateY(-2px) !important;
box-shadow: 0 6px 25px rgba(38, 198, 218, 0.4) !important;
}
/* ============================================
17. FIX — White bar above header
============================================ */
/* Kill any above-header area */
.ast-above-header-wrap,
.ast-above-header,
.ast-above-header-bar {
display: none !important;
}
/* Page title bar / breadcrumbs — dark or hidden */
.ast-archive-description,
.page-title-bar,
.ast-breadcrumbs-wrapper,
.ast-archive-description .ast-archive-title {
background: var(--contx-dark-bg) !important;
border: none !important;
color: #FFFFFF !important;
}
/* No gap between header and content */
.site-header,
#masthead {
margin-top: 0 !important;
padding-top: 0 !important;
}
body, html {
margin-top: 0 !important;
}
/* Force dark on all page wrappers */
#page,
.site,
#content,
.site-content,
.ast-container,
.ast-separate-container .site-content > .ast-container,
main,
.ast-separate-container #primary {
background-color: var(--contx-dark-bg) !important;
background: var(--contx-dark-bg) !important;
}
/* Astra separate container styles */
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-comment-list li,
.ast-separate-container .comment-respond {
background: transparent !important;
}
/* WooCommerce shop page wrapper */
.post-type-archive-product .site-content,
.post-type-archive-product #primary,
.post-type-archive-product .ast-woocommerce-container {
background-color: var(--contx-dark-bg) !important;
}
/* WooCommerce breadcrumb & products header */
.woocommerce-breadcrumb {
color: var(--contx-text-secondary) !important;
background: transparent !important;
}
.woocommerce-breadcrumb a {
color: var(--contx-accent-cyan) !important;
}
.woocommerce-products-header,
.woocommerce-products-header__title {
background: transparent !important;
color: #FFFFFF !important;
}
/* WooCommerce result count and ordering */
.woocommerce-result-count {
color: var(--contx-text-secondary) !important;
}
/* Force all Astra containers dark */
.ast-separate-container #content .ast-container {
background: var(--contx-dark-bg) !important;
}
/* Contact page main container */
.page-id-254 #content,
.page-id-254 #primary,
.page-id-254 main {
background-color: var(--contx-dark-bg) !important;
}
/* Cart page main container */
.page-id-9 #content,
.page-id-9 #primary,
.page-id-9 main {
background-color: var(--contx-dark-bg) !important;
}
/* ============================================
18. FIX — Cart "Total cos" text invisible
============================================ */
.cart_totals h2,
.cart-collaterals h2,
.woocommerce-cart .cart_totals h2,
.woocommerce-cart .cart-collaterals h2 {
color: #FFFFFF !important;
background: rgba(6, 18, 34, 0.9) !important;
padding: 15px 20px !important;
border-radius: 8px 8px 0 0 !important;
margin: 0 0 0 0 !important;
}
.cart_totals,
.woocommerce-cart .cart_totals {
background: rgba(11, 26, 46, 0.9) !important;
border: 1px solid rgba(38, 198, 218, 0.2) !important;
border-radius: 12px !important;
overflow: hidden !important;
}
.cart_totals table,
.cart_totals th,
.cart_totals td,
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
background: transparent !important;
color: #FFFFFF !important;
border-color: rgba(38, 198, 218, 0.15) !important;
}
.cart_totals .order-total .amount,
.woocommerce-cart .cart_totals .order-total .amount {
color: #26C6DA !important;
font-size: 1.3rem !important;
font-weight: 700 !important;
}
/* ============================================
19. CHECKOUT PAGE — Full dark styling
============================================ */
/* Checkout page background */
.woocommerce-checkout .site-content,
.woocommerce-checkout #content,
.woocommerce-checkout .ast-container,
.woocommerce-checkout article,
.woocommerce-checkout .entry-content,
.woocommerce-checkout #primary {
background-color: var(--contx-dark-bg) !important;
}
.woocommerce-checkout h1, .woocommerce-checkout h2, .woocommerce-checkout h3 {
color: #FFFFFF !important;
}
/* Payment area */
.woocommerce-checkout #payment {
background: rgba(11, 26, 46, 0.8) !important;
border: 1px solid rgba(38, 198, 218, 0.2) !important;
border-radius: 12px !important;
}
.woocommerce-checkout #payment div.payment_box {
background: rgba(6, 18, 34, 0.9) !important;
color: #B0BEC5 !important;
border-radius: 8px !important;
}
.woocommerce-checkout #payment div.payment_box::before {
border-bottom-color: rgba(6, 18, 34, 0.9) !important;
}
/* Payment method labels */
.woocommerce-checkout #payment ul.payment_methods li label {
color: #FFFFFF !important;
}
/* Stripe fields */
.woocommerce-checkout .wc-stripe-elements-field,
.woocommerce-checkout .stripe-card-group,
.woocommerce-checkout .wc-stripe-iban-element-field {
background: rgba(11, 26, 46, 0.6) !important;
border: 1px solid rgba(38, 198, 218, 0.3) !important;
border-radius: 8px !important;
padding: 12px !important;
}
/* Stripe/Woo notices */
.woocommerce-checkout .wc-stripe-test-mode-notice,
.woocommerce-checkout .woocommerce-info {
background: rgba(38, 198, 218, 0.1) !important;
color: #B0BEC5 !important;
border-left-color: #26C6DA !important;
border-radius: 8px !important;
}
/* Checkout labels */
.woocommerce-checkout label {
color: #B0BEC5 !important;
}
/* Checkout form inputs */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select,
.woocommerce-checkout #billing_state,
.woocommerce-checkout #billing_country,
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout textarea,
.woocommerce-checkout select {
background: rgba(11, 26, 46, 0.6) !important;
border: 1px solid rgba(38, 198, 218, 0.2) !important;
color: #FFFFFF !important;
border-radius: 8px !important;
padding: 12px 15px !important;
}
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout input:focus,
.woocommerce-checkout textarea:focus {
border-color: #26C6DA !important;
box-shadow: 0 0 8px rgba(38, 198, 218, 0.2) !important;
}
/* Order review table */
.woocommerce-checkout-review-order-table,
.woocommerce-checkout #order_review {
background: rgba(11, 26, 46, 0.6) !important;
border: 1px solid rgba(38, 198, 218, 0.15) !important;
border-radius: 12px !important;
}
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
color: #FFFFFF !important;
border-color: rgba(38, 198, 218, 0.1) !important;
padding: 12px 15px !important;
}
.woocommerce-checkout-review-order-table .amount {
color: #26C6DA !important;
}
/* Place order button */
.woocommerce-checkout #place_order {
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
color: #FFFFFF !important;
border: none !important;
border-radius: 12px !important;
padding: 16px 32px !important;
font-size: 1.1rem !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: 1px !important;
width: 100% !important;
transition: all 0.3s ease !important;
box-shadow: 0 4px 15px rgba(38, 198, 218, 0.3) !important;
}
.woocommerce-checkout #place_order:hover {
transform: translateY(-2px) !important;
box-shadow: 0 6px 25px rgba(38, 198, 218, 0.4) !important;
}
/* Stripe card labels */
.wc-stripe-elements-field label,
.payment_method_stripe label,
#stripe-card-element label {
color: #B0BEC5 !important;
}
/* Select2 dropdowns (country/state) */
.select2-container--default .select2-selection--single {
background: rgba(11, 26, 46, 0.6) !important;
border: 1px solid rgba(38, 198, 218, 0.2) !important;
color: #FFFFFF !important;
border-radius: 8px !important;
height: 45px !important;
padding: 8px 12px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
color: #FFFFFF !important;
}
.select2-dropdown {
background: #0B1A2E !important;
border: 1px solid rgba(38, 198, 218, 0.3) !important;
}
.select2-results__option {
color: #FFFFFF !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background: rgba(38, 198, 218, 0.2) !important;
}
.select2-search__field {
background: rgba(6, 18, 34, 0.9) !important;
color: #FFFFFF !important;
border-color: rgba(38, 198, 218, 0.3) !important;
}
/* ============================================
20. CONTACT FORM — Tighter spacing (SureForms)
============================================ */
/* SureForms form container */
.page-id-254 .srfm-form-container {
max-width: 600px !important;
}
/* SureForms block spacing — aggressive */
.page-id-254 .srfm-block,
.page-id-254 .srfm-block-single,
.page-id-254 .srfm-block-wrap {
margin-bottom: 10px !important;
padding-bottom: 0 !important;
}
/* SureForms labels */
.page-id-254 .srfm-block-label,
.page-id-254 label.srfm-block-label {
margin-bottom: 4px !important;
font-size: 0.9rem !important;
}
/* SureForms inputs */
.page-id-254 .srfm-input-common,
.page-id-254 .srfm-input-email,
.page-id-254 .srfm-input-text,
.page-id-254 .srfm-textarea-common,
.page-id-254 textarea.srfm-input-common {
background: rgba(11, 26, 46, 0.6) !important;
border: 1px solid rgba(38, 198, 218, 0.3) !important;
color: #FFFFFF !important;
border-radius: 10px !important;
padding: 12px 16px !important;
font-size: 1rem !important;
}
.page-id-254 .srfm-input-common:focus,
.page-id-254 textarea.srfm-input-common:focus {
border-color: #26C6DA !important;
box-shadow: 0 0 8px rgba(38, 198, 218, 0.2) !important;
outline: none !important;
}
/* SureForms submit button */
.page-id-254 .srfm-btn-frontend,
.page-id-254 .srfm-submit-button,
.page-id-254 .srfm-button {
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
color: #FFFFFF !important;
border: none !important;
border-radius: 10px !important;
padding: 14px 36px !important;
font-weight: 600 !important;
font-size: 1rem !important;
min-width: 200px !important;
cursor: pointer !important;
transition: all 0.3s ease !important;
}
.page-id-254 .srfm-btn-frontend:hover {
transform: translateY(-2px) !important;
box-shadow: 0 6px 25px rgba(38, 198, 218, 0.4) !important;
}
/* Kill Gutenberg/UAGB block margins in form area */
.page-id-254 .uagb-container-inner-blocks-wrap {
gap: 8px !important;
}
.page-id-254 .wp-block-uagb-container {
margin-bottom: 8px !important;
padding-bottom: 0 !important;
}
/* Reduce widget/section gaps */
.page-id-254 .elementor-widget-wrap,
.page-id-254 .e-con-inner {
row-gap: 10px !important;
gap: 10px !important;
}
/* ============================================
21. FLOATING WhatsApp + Phone buttons
============================================ */
#contx-floating-buttons {
position: fixed;
bottom: 24px;
right: 24px;
display: flex;
flex-direction: column;
gap: 12px;
z-index: 9999;
}
.contx-float-btn {
width: 56px;
height: 56px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none !important;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
transition: all 0.3s ease;
animation: contx-float-in 0.5s ease forwards;
opacity: 0;
transform: scale(0.5) translateY(20px);
position: relative;
}
.contx-float-btn:nth-child(1) { animation-delay: 0.3s; }
.contx-float-btn:nth-child(2) { animation-delay: 0.5s; }
@keyframes contx-float-in {
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
.contx-whatsapp {
background: #25D366 !important;
color: #fff !important;
}
.contx-whatsapp:hover {
background: #20BD5A !important;
transform: scale(1.1);
box-shadow: 0 6px 30px rgba(37, 211, 102, 0.4);
}
.contx-phone {
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
color: #fff !important;
}
.contx-phone:hover {
transform: scale(1.1);
box-shadow: 0 6px 30px rgba(38, 198, 218, 0.4);
}
/* WhatsApp pulse */
.contx-whatsapp::before {
content: '';
position: absolute;
width: 56px;
height: 56px;
border-radius: 50%;
background: #25D366;
animation: contx-pulse 2s infinite;
z-index: -1;
}
@keyframes contx-pulse {
0% { transform: scale(1); opacity: 0.5; }
100% { transform: scale(1.5); opacity: 0; }
}
/* Move existing floating cart higher to avoid overlap */
.contx-floating-cart {
bottom: 160px !important;
}
@media (max-width: 768px) {
#contx-floating-buttons {
bottom: 16px;
right: 16px;
}
.contx-float-btn {
width: 50px;
height: 50px;
}
.contx-whatsapp::before {
width: 50px;
height: 50px;
}
.contx-floating-cart {
bottom: 140px !important;
}
}
/* ============================================
22. HEADER — Social media icons
============================================ */
#contx-header-social {
display: flex !important;
align-items: center !important;
gap: 6px !important;
margin-right: 10px !important;
}
#contx-header-social a {
width: 32px !important;
height: 32px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 50% !important;
color: #1a1a2e !important;
text-decoration: none !important;
transition: all 0.3s ease !important;
}
#contx-header-social a:hover {
color: #1565C0 !important;
background: rgba(21, 101, 192, 0.1) !important;
}
#contx-header-social svg {
fill: currentColor !important;
}
/* Hide header social on mobile (replaced by floating mobile social) */
@media (max-width: 768px) {
#contx-header-social {
display: none !important;
}
}
/* ============================================
22b. MOBILE — Floating social icons (bottom-left)
Same size and style as WhatsApp/Phone buttons
============================================ */
#contx-mobile-social {
position: fixed !important;
bottom: 24px !important;
left: 24px !important;
display: flex !important;
flex-direction: column !important;
gap: 12px !important;
z-index: 9999 !important;
}
#contx-mobile-social a {
width: 56px !important;
height: 56px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 50% !important;
text-decoration: none !important;
transition: all 0.3s ease !important;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
color: #FFFFFF !important;
}
#contx-mobile-social a svg {
fill: #FFFFFF !important;
width: 24px !important;
height: 24px !important;
}
/* Facebook — blue */
#contx-mobile-social a:first-child {
background: #1877F2 !important;
}
/* Instagram — gradient */
#contx-mobile-social a:last-child {
background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888) !important;
}
#contx-mobile-social a:active {
transform: scale(0.95) !important;
}
/* Hide on desktop */
@media (min-width: 769px) {
#contx-mobile-social {
display: none !important;
}
}
/* ============================================
23. HIDE FLOATING CART (now in header)
============================================ */
.contx-floating-cart {
display: none !important;
}
/* ============================================
24. FOOTER LINKS — Force visible on dark bg
============================================ */
/* Footer navigation links (Politica, Termeni, ANPC, SOL) */
.site-footer a,
.site-footer .menu-item a,
.ast-footer-copyright a,
.ast-small-footer a,
footer a,
footer .menu-item a,
.site-below-footer-wrap a,
.site-primary-footer-wrap a,
.footer-nav-wrap a,
.astra-footer-vertical-menu a,
.astra-footer-horizontal-menu a {
color: #26C6DA !important;
text-decoration: none !important;
transition: color 0.3s ease !important;
}
.site-footer a:hover,
footer a:hover,
.ast-footer-copyright a:hover {
color: #4DD0E1 !important;
}
/* Footer copyright text — must be visible */
.ast-footer-copyright,
.ast-footer-copyright *,
.site-below-footer-wrap,
.site-below-footer-wrap *,
.ast-small-footer,
.ast-small-footer * {
color: #B0BEC5 !important;
}
/* ============================================
25. DOROLABS CREDIT
============================================ */
.contx-dorolabs-credit {
text-align: center;
padding: 15px 20px;
font-size: 0.85rem;
color: rgba(176, 190, 197, 0.6);
border-top: 1px solid rgba(38, 198, 218, 0.1);
background: var(--contx-darker-bg);
font-family: 'Inter', sans-serif;
}
.contx-dorolabs-credit a {
color: #26C6DA !important;
text-decoration: none !important;
font-weight: 600 !important;
transition: color 0.3s ease !important;
}
.contx-dorolabs-credit a:hover {
color: #4DD0E1 !important;
}
/* ==============================================
SECTION 26: WOOCOMMERCE — HIDE UNCATEGORIZED + BREADCRUMB
============================================== */
.ast-woo-product-category,
.posted_in,
.product_meta .posted_in,
ul.products li.product .ast-woo-product-category,
.ast-woo-shop-product-categories {
display: none !important;
}
.woocommerce-breadcrumb {
color: #B0BEC5 !important;
}
.woocommerce-breadcrumb a {
color: #26C6DA !important;
}
.woocommerce-breadcrumb a:hover {
color: #4DD0E1 !important;
}
/* ==============================================
SECTION 27: HERO CTA BUTTON — WHITE TEXT ON GRADIENT
============================================== */
.wp-block-button__link,
.wp-element-button,
a.wp-block-button__link,
.wp-block-button .wp-block-button__link,
.uagb-buttons-repeater a,
.uagb-buttons-repeater a.uagb-button__link,
.uagb-button__link,
.entry-content .wp-block-button__link,
.entry-content .wp-block-button .wp-block-button__link,
.wp-block-button__link[href*="contact"],
.wp-block-button__link:not(.is-style-outline) {
color: #FFFFFF !important;
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
border: none !important;
border-radius: 10px !important;
font-weight: 600 !important;
}
.wp-block-button__link:hover,
.wp-element-button:hover,
a.wp-block-button__link:hover,
.uagb-buttons-repeater a:hover {
color: #FFFFFF !important;
background: linear-gradient(135deg, #1250A0, #20B0C8) !important;
}
/* ==============================================
SECTION 28: SERVICES PAGE — KILL MIN-HEIGHT ON MOBILE
============================================== */
@media (max-width: 921px) {
.wp-block-uagb-container[class*="uagb-block-"] {
min-height: auto !important;
height: auto !important;
}
.uagb-container-inner-blocks-wrap {
min-height: auto !important;
flex-direction: column !important;
grid-template-columns: 1fr !important;
}
.uagb-container-inner-blocks-wrap > * {
width: 100% !important;
max-width: 100% !important;
flex: 0 0 auto !important;
}
}
/* ==============================================
SECTION 29: CONTACT FORM — REDUCE SPACING
============================================== */
.srfm-block-single {
margin-bottom: 12px !important;
padding-bottom: 0 !important;
}
.srfm-form {
row-gap: 12px !important;
gap: 12px !important;
}
.srfm-block {
margin-bottom: 8px !important;
}
.srfm-form-container,
.srfm-form-wrapper {
padding: 0 !important;
}
.srfm-submit-btn,
.srfm-button,
.srfm-btn {
background: linear-gradient(135deg, #1565C0, #26C6DA) !important;
color: #FFFFFF !important;
border: none !important;
border-radius: 10px !important;
padding: 14px 36px !important;
font-weight: 600 !important;
font-size: 1rem !important;
}
/* ==============================================
SECTION 30: MOBILE — FORCE SINGLE COLUMN LAYOUTS
============================================== */
@media (max-width: 768px) {
.wp-block-uagb-container .uagb-container-inner-blocks-wrap {
flex-direction: column !important;
grid-template-columns: 1fr !important;
}
.wp-block-uagb-container .uagb-container-inner-blocks-wrap > * {
width: 100% !important;
max-width: 100% !important;
flex: 0 0 auto !important;
}
}
/* SECTION 31: REMOVED — Servicii rules consolidated into Section 41 */
/* ==============================================
SECTION 32: CONTACT PAGE — UAGB HEADING LABELS
============================================== */
.page-id-254 .uagb-heading-text {
font-size: 20px !important;
line-height: 1.3 !important;
}
/* ==============================================
SECTION 33: PACHETE PAGE — H1 TITLE CAP
============================================== */
.woocommerce-page h1.page-title,
.woocommerce-page h1.woocommerce-products-header__title,
.page-id-8 h1.entry-title,
.page-id-8 h1.woocommerce-products-header__title {
font-size: 40px !important;
}
/* ==============================================
SECTION 34: GLOBAL — PREVENT HORIZONTAL OVERFLOW
============================================== */
html, body {
overflow-x: hidden !important;
overflow-y: visible !important;
}
/* ==============================================
SECTION 35: CART PAGE — SHOW H1 TITLE
============================================== */
.woocommerce-cart .entry-title,
.woocommerce-cart h1.page-title {
display: block !important;
color: #FFFFFF !important;
font-size: 28px !important;
margin-bottom: 20px !important;
}
/* ==============================================
SECTION 36: HOMEPAGE — STACK "Noi suntem ContX"
AND "SERVICIILE NOASTRE" SECTIONS
Homepage is FLAT HTML (no UAGB containers).
All elements are direct children of .entry-content.
H2 order: 1=15+, 2=200+, 3=2000+, 4=500+,
5=Noi suntem ContX, 6=SERVICIILE NOASTRE,
7=PACHETE, 8=DE CE, 9=Suntem nerabdatori
============================================== */
/* All homepage headings and paragraphs — centered */
.page-id-250 .entry-content > h2,
.page-id-250 .entry-content > h3,
.page-id-250 .entry-content > h4 {
text-align: center !important;
width: 100% !important;
display: block !important;
}
.page-id-250 .entry-content > p {
text-align: center !important;
max-width: 800px !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* "Noi suntem ContX" section — add spacing and visual separation */
.page-id-250 .entry-content > h2:nth-of-type(5) {
margin-top: 60px !important;
margin-bottom: 20px !important;
font-size: 36px !important;
color: #26C6DA !important;
}
/* "SERVICIILE NOASTRE" section heading */
.page-id-250 .entry-content > h2:nth-of-type(6) {
margin-top: 60px !important;
margin-bottom: 10px !important;
font-size: 32px !important;
}
/* Stats grid created by contx-animations.js */
.page-id-250 .contx-stats-grid {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
justify-content: center !important;
gap: 30px !important;
margin: 40px auto !important;
max-width: 900px !important;
}
.page-id-250 .contx-stat-box {
text-align: center !important;
flex: 1 1 180px !important;
max-width: 200px !important;
}
/* Services grid — 2 columns desktop, 1 mobile */
.page-id-250 .contx-services-grid {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 30px !important;
max-width: 900px !important;
margin: 0 auto 40px !important;
}
.page-id-250 .contx-service-card {
text-align: center !important;
padding: 30px 20px !important;
background: rgba(255, 255, 255, 0.03) !important;
border-radius: 12px !important;
border: 1px solid rgba(38, 198, 218, 0.1) !important;
}
/* Why-grid — 3 columns desktop */
.page-id-250 .contx-why-grid {
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
gap: 30px !important;
max-width: 900px !important;
margin: 0 auto 40px !important;
}
.page-id-250 .contx-why-card {
text-align: center !important;
padding: 30px 20px !important;
}
@media (max-width: 768px) {
.page-id-250 .contx-services-grid {
grid-template-columns: 1fr !important;
}
.page-id-250 .contx-why-grid {
grid-template-columns: 1fr !important;
}
.page-id-250 .contx-stats-grid {
gap: 20px !important;
}
.page-id-250 .contx-stat-box {
flex: 1 1 120px !important;
}
.page-id-250 .entry-content > h2:nth-of-type(5) {
font-size: 28px !important;
}
}
/* SECTION 37: REMOVED — Servicii rules consolidated into Section 41 */
/* ==============================================
SECTION 38: CONTACT PAGE — FORM SPACING FIX
SureForms uses CSS custom properties for spacing:
--srfm-row-gap-between-blocks: 18px
Form ID: 271 (.srfm-form-container-271)
============================================== */
/* Override CSS custom properties on the form container */
body.page-id-254 .srfm-form-container-271,
body.page-id-254 .srfm-form-container {
--srfm-row-gap-between-blocks: 8px !important;
--srfm-row-gap-between-fields: 8px !important;
--srfm-instant-form-padding-top: 20px !important;
--srfm-instant-form-padding-bottom: 20px !important;
}
/* Also override computed properties as fallback */
body.page-id-254 .srfm-block-single {
margin-bottom: 8px !important;
padding-bottom: 0 !important;
margin-top: 0 !important;
padding-top: 0 !important;
}
body.page-id-254 .srfm-form {
row-gap: 8px !important;
gap: 8px !important;
}
/* Kill wpautop-injected and
elements inside the form */
body.page-id-254 #srfm-form-271 > p,
body.page-id-254 #srfm-form-271 > br,
body.page-id-254 .srfm-submit-button > p,
body.page-id-254 .srfm-submit-wrap > p {
display: none !important;
margin: 0 !important;
padding: 0 !important;
line-height: 0 !important;
font-size: 0 !important;
height: 0 !important;
}
/* Ensure submit button displays as single element */
body.page-id-254 .srfm-submit-button {
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
body.page-id-254 .srfm-submit-wrap {
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
}
/* UAGB container padding on contact page */
body.page-id-254 .wp-block-uagb-container.uagb-is-root-container {
padding-top: 40px !important;
padding-bottom: 40px !important;
}
/* Fix partially visible image on contact page */
body.page-id-254 .wp-block-uagb-image,
body.page-id-254 .wp-block-image {
overflow: hidden !important;
border-radius: 12px !important;
}
body.page-id-254 .wp-block-uagb-image img,
body.page-id-254 .wp-block-image img {
width: 100% !important;
height: auto !important;
object-fit: cover !important;
object-position: center !important;
}
/* ==============================================
SECTION 39: DESPRE NOI — REMOVE EMPTY SPACE
The gaps are from padding-top:100px; padding-bottom:100px
on UAGB root containers (NOT min-height, NOT spacers).
Root containers: e5972208, 28fa86dc, b73b02d3, 1fa75ccb, 353480fd
============================================== */
/* Reduce 100px padding to 40px on ALL root containers */
body.page-id-251 .wp-block-uagb-container.uagb-is-root-container {
padding-top: 40px !important;
padding-bottom: 40px !important;
}
/* Also kill any min-height just in case */
body.page-id-251 .wp-block-uagb-container {
min-height: auto !important;
}
/* Flex containers — stack properly */
body.page-id-251 .uagb-container-inner-blocks-wrap {
min-height: auto !important;
}
@media (max-width: 768px) {
body.page-id-251 .wp-block-uagb-container.uagb-is-root-container {
padding-top: 25px !important;
padding-bottom: 25px !important;
padding-left: 15px !important;
padding-right: 15px !important;
}
/* Stack flex containers on mobile */
body.page-id-251 .uagb-container-inner-blocks-wrap {
flex-direction: column !important;
}
}
/* ==============================================
SECTION 40: CHECKOUT — SELECT FIELDS FIX
Checkout is page-id-9 (.woocommerce-checkout)
============================================== */
/* Select2 single selection container */
.woocommerce-checkout .select2-container--default .select2-selection--single {
height: 48px !important;
padding: 10px 15px !important;
display: flex !important;
align-items: center !important;
background: rgba(11, 26, 46, 0.6) !important;
border: 1px solid rgba(38, 198, 218, 0.2) !important;
border-radius: 8px !important;
}
/* Rendered text — prevent cut off */
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
color: #FFFFFF !important;
line-height: 28px !important;
padding-left: 0 !important;
padding-top: 0 !important;
font-size: 15px !important;
overflow: visible !important;
text-overflow: unset !important;
white-space: nowrap !important;
}
/* Arrow alignment */
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
height: 48px !important;
top: 0 !important;
}
/* Regular select elements */
.woocommerce-checkout select {
height: 48px !important;
padding: 10px 15px !important;
background: rgba(11, 26, 46, 0.6) !important;
border: 1px solid rgba(38, 198, 218, 0.2) !important;
color: #FFFFFF !important;
border-radius: 8px !important;
font-size: 15px !important;
-webkit-appearance: none !important;
}
/* Select2 full width */
.woocommerce-checkout .select2-container {
width: 100% !important;
}
/* Dropdown panel */
.select2-dropdown {
background: #0B1A2E !important;
border: 1px solid rgba(38, 198, 218, 0.3) !important;
}
.select2-results__option {
color: #FFFFFF !important;
padding: 10px 15px !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
background: rgba(38, 198, 218, 0.2) !important;
color: #FFFFFF !important;
}
/* Search field inside dropdown */
.select2-container--default .select2-search--dropdown .select2-search__field {
background: rgba(11, 26, 46, 0.8) !important;
border: 1px solid rgba(38, 198, 218, 0.3) !important;
color: #FFFFFF !important;
padding: 8px 12px !important;
border-radius: 6px !important;
}
/* Checkout input fields — consistent dark theme styling */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea {
background: rgba(11, 26, 46, 0.6) !important;
border: 1px solid rgba(38, 198, 218, 0.2) !important;
color: #FFFFFF !important;
border-radius: 8px !important;
padding: 10px 15px !important;
font-size: 15px !important;
}
/* ==============================================
SECTION 41: SERVICII PAGE — COMPLETE OVERRIDE
Page ID: 252
Nuclear approach — overrides ALL UAGB containers
============================================== */
/* MOBILE: Force ALL containers to behave */
@media only screen and (max-width: 921px) {
/* Master wrapper — stack children vertically, NO wrap */
.page-id-252 .uagb-container-inner-blocks-wrap {
display: flex !important;
flex-direction: column !important;
flex-wrap: nowrap !important;
align-items: stretch !important;
gap: 30px !important;
}
/* Specific services wrapper — the flex-wrap bug root cause */
.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-edca4a69
> .uagb-container-inner-blocks-wrap {
flex-wrap: nowrap !important;
flex-direction: column !important;
}
/* ALL grid containers — force single column */
.page-id-252 .uagb-layout-grid {
display: grid !important;
grid-template-columns: 1fr !important;
grid-template-rows: auto !important;
grid-auto-rows: auto !important;
gap: 20px !important;
min-height: auto !important;
height: auto !important;
}
/* ALL UAGB containers — kill any fixed height/min-height */
.page-id-252 .wp-block-uagb-container {
min-height: auto !important;
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
/* ALL UAGB inner wrappers */
.page-id-252 .wp-block-uagb-container > .uagb-container-inner-blocks-wrap {
min-height: auto !important;
height: auto !important;
}
/* ALL images — auto height, full width, centered */
.page-id-252 .wp-block-uagb-image {
height: auto !important;
min-height: auto !important;
max-height: none !important;
align-self: stretch !important;
overflow: hidden !important;
border-radius: 12px !important;
margin: 0 auto !important;
width: 100% !important;
}
.page-id-252 .wp-block-uagb-image figure {
margin: 0 !important;
width: 100% !important;
}
.page-id-252 .wp-block-uagb-image img {
width: 100% !important;
height: auto !important;
max-height: none !important;
object-fit: cover !important;
border-radius: 12px !important;
display: block !important;
}
/* ALL info boxes — auto height */
.page-id-252 .wp-block-uagb-info-box {
height: auto !important;
min-height: auto !important;
}
/* Kill place-items stretch that causes expansion */
.page-id-252 [style*="place-items"] {
place-items: start !important;
}
/* Mobile: TEXT always first, IMAGE second (fix alternating DOM order)
Grids b255260d (02) and 98083caf (04) have IMAGE first in DOM.
Use CSS order to swap: image=2, text-container=1 */
.page-id-252 .uagb-block-b255260d > .wp-block-uagb-image,
.page-id-252 .uagb-block-98083caf > .wp-block-uagb-image {
order: 2 !important;
}
.page-id-252 .uagb-block-b255260d > .wp-block-uagb-container,
.page-id-252 .uagb-block-98083caf > .wp-block-uagb-container {
order: 1 !important;
}
/* Service section spacing */
.page-id-252 .uagb-layout-grid {
margin-bottom: 20px !important;
padding: 20px 15px !important;
}
/* Kill ALL spacers */
.page-id-252 .wp-block-spacer {
height: 20px !important;
min-height: 20px !important;
}
}
/* Reduce hero section padding (was 100px top+bottom) */
.page-id-252 .wp-block-uagb-container.uagb-block-e5972208 {
padding-top: 40px !important;
padding-bottom: 30px !important;
}
/* Reduce services wrapper padding */
.page-id-252 .wp-block-uagb-container.uagb-block-edca4a69 {
padding-top: 20px !important;
padding-bottom: 20px !important;
}
/* DESKTOP: Clean up spacing and alignment */
@media only screen and (min-width: 922px) {
.page-id-252 .uagb-layout-grid {
margin-bottom: 40px !important;
place-items: center stretch !important;
}
.page-id-252 .wp-block-uagb-image {
margin-top: 0 !important;
}
}
/* Hero H1 — was reduced to 20px by font-fix.js, override */
.page-id-252 .uagb-block-b371cc12 h1.uagb-heading-text,
.page-id-252 .uagb-block-b371cc12 .uagb-heading-text,
.page-id-252 h1.uagb-heading-text {
font-size: 32px !important;
line-height: 1.2 !important;
}
@media only screen and (max-width: 767px) {
.page-id-252 h1.uagb-heading-text {
font-size: 24px !important;
}
}