/* ===========================================================================
SmileMAX — light "medical" theme for /clinique/ (and /, the same page).
Generated by scripts/build-light-theme.mjs from the mirrored stylesheets.
Applied only where carries .smx-light (added in generate.mjs), so the
rest of the site keeps the original dark design.
=========================================================================== */
/* .wd-page-content.main-page-wrapper is the single element that paints the whole
page dark (one 6600px-tall #1a1a1a block). Making sections transparent without
this just exposes it, which is exactly what happened on the first attempt. */
body.smx-light,
body.smx-light .wd-page-wrapper,
body.smx-light .website-wrapper,
body.smx-light .wd-page-content,
body.smx-light .main-page-wrapper,
body.smx-light .wd-content-layout,
body.smx-light .site-content {
background-color: #eef3f5 !important;
color: #1d2b32 !important;
}
/* ---------------------------------------------------------------------------
Neutralise section backgrounds.
Parsing the stylesheets only catches rules that literally declare a dark
`background-color`. Several sections here are painted by gradients, by the
`background` shorthand, or by Elementor container properties, and those
survived the first pass as black bands with invisible text. Rather than chase
each one, every Elementor surface goes transparent (the page under it is
white) and the pieces that SHOULD stay coloured are re-asserted below.
NOTE: only background-COLOR is cleared. An earlier version also forced
`background-image: none`, which blanked a real photo in the "Ce înseamnă
DIGITAL" section — several content images are painted as CSS backgrounds, so
that rule destroyed content rather than theming it. */
body.smx-light .elementor-element,
body.smx-light .elementor-section,
body.smx-light .elementor-column,
body.smx-light .elementor-widget-wrap,
body.smx-light .e-con,
body.smx-light .e-con-inner,
body.smx-light .elementor-widget-container {
background-color: transparent !important;
}
/* Text: dark by default. :where() keeps specificity at zero so the brand-button
rules further down win without needing an arms race of selectors. */
body.smx-light :where(p, li, span, div, td, th, label, strong, em, small, figcaption) {
color: #1d2b32 !important;
}
body.smx-light :where(h1, h2, h3, h4, h5, h6) { color: #0e2029 !important; }
/* Elementor "child" containers carry their own translucent dark fill
(rgba(17,17,17,.95)) which survives the rule above on some nesting levels. */
body.smx-light .e-con.e-child,
body.smx-light .e-con-full,
body.smx-light [class*="elementor-element-"] {
background-color: transparent !important;
}
/* Off-canvas drawers (mobile menu, cart, login) are hidden in the flow but are
pure black when opened — they need the light treatment too. */
body.smx-light .mobile-nav,
body.smx-light .cart-widget-side,
body.smx-light .login-form-side,
body.smx-light .wd-side-hidden {
background-color: #eef3f5 !important;
color: #1d2b32 !important;
}
body.smx-light .mobile-nav a,
body.smx-light .cart-widget-side a,
body.smx-light .login-form-side a { color: #1d2b32 !important; }
body.smx-light .mobile-nav li,
body.smx-light .mobile-nav .wd-nav-mobile > li { border-color: rgba(14,32,41,0.14) !important; }
/* Cards/panels keep a hint of surface so the layout does not read as one flat sheet. */
/* Accordion/toggle panels only. Icon-box and image-box wrappers are NOT styled
as cards: Elementor already wraps them in a rounded container, so giving the
inner wrapper its own background+border produced boxes inside boxes. */
body.smx-light .elementor-accordion-item,
body.smx-light .elementor-tab-content,
body.smx-light .elementor-toggle-item,
body.smx-light .wd-accordion-item {
background-color: #ffffff !important;
border: 1px solid rgba(14,32,41,0.08) !important;
border-radius: 10px;
/* no drop shadow: stacked FAQ rows with shadows read as floating slabs */
box-shadow: none !important;
}
body.smx-light .elementor-accordion-item + .elementor-accordion-item,
body.smx-light .elementor-toggle-item + .elementor-toggle-item { margin-top: 8px; }
/* Elementor's rounded containers keep a translucent WHITE hairline, which is
invisible on a light page — and that is correct. Restating it in ink turned
ordinary sections into outlined rectangles (the "Ai o întrebare?" panel drew
a hard box around itself). Left invisible on purpose. */
body.smx-light .e-con-full[class*="elementor-element-"],
body.smx-light .e-con[class*="elementor-element-"] {
border-color: transparent !important;
}
/* ---------------------------------------------------------------------------
Booking calendar (/programare/).
The widget ships its own dark styling from the WordPress shortcode, including
an inline rule that greys unavailable days with rgba(255,255,255,.22) — which
on a light page renders them invisible rather than muted.
The widget styles itself through #smx-cal, so every override here is prefixed
with the id too — a class-only selector loses the specificity contest against
the widget's own "#smx-cal .smx-day.smx-noavail{...!important}". */
body.smx-light #smx-cal {
background-color: #ffffff !important;
color: #1d2b32 !important;
border: 1px solid rgba(14,32,41,0.14) !important;
border-radius: 12px;
box-shadow: 0 1px 2px rgba(14,32,41,0.04), 0 8px 24px rgba(14,32,41,0.05);
}
body.smx-light #smx-cal .smx-head,
body.smx-light #smx-cal .smx-grid,
body.smx-light #smx-cal .smx-foot { background-color: transparent !important; }
body.smx-light #smx-cal .smx-title { color: #0e2029 !important; }
body.smx-light #smx-cal .smx-dow span { color: rgba(29,43,50,0.70) !important; }
body.smx-light #smx-cal .smx-nav button {
background-color: #f7fafb !important;
color: #1d2b32 !important;
}
body.smx-light #smx-cal .smx-nav button:hover {
background-color: #1E6B5A !important;
color: #fff !important;
}
body.smx-light #smx-cal .smx-day {
background-color: transparent !important;
color: #1d2b32 !important;
}
body.smx-light #smx-cal .smx-day:hover:not(:disabled) {
background-color: #f7fafb !important;
}
/* muted = other month, past = before today, noavail = no free slots.
The shipped rule greys these with white at 22% opacity, invisible on light. */
body.smx-light #smx-cal .smx-day.smx-muted,
body.smx-light #smx-cal .smx-day.smx-past,
body.smx-light #smx-cal .smx-day.smx-noavail {
color: rgba(29,43,50,0.32) !important;
}
body.smx-light #smx-cal .smx-day.smx-today { box-shadow: inset 0 0 0 1px #1E6B5A !important; }
body.smx-light #smx-cal .smx-day.smx-sel {
background-color: #1E6B5A !important;
color: #fff !important;
}
body.smx-light #smx-cal .smx-foot,
body.smx-light #smx-cal .smx-foot * { color: #1E6B5A !important; }
/* time-slot buttons rendered under the calendar */
body.smx-light #ab-slots button {
background-color: #ffffff !important;
color: #1d2b32 !important;
border: 1px solid rgba(14,32,41,0.14) !important;
border-radius: 8px;
padding: 8px 12px;
}
body.smx-light #ab-slots button:hover { border-color: #1E6B5A !important; }
body.smx-light #ab-msg { color: #b3261e !important; }
/* Form fields need a visible edge on a tinted page, otherwise they disappear. */
body.smx-light input[type="text"],
body.smx-light input[type="email"],
body.smx-light input[type="tel"],
body.smx-light input[type="date"],
body.smx-light input[type="number"],
body.smx-light select,
body.smx-light textarea {
background-color: #ffffff !important;
color: #1d2b32 !important;
border: 1px solid rgba(14,32,41,0.14) !important;
border-radius: 8px;
}
body.smx-light input::placeholder,
body.smx-light textarea::placeholder { color: rgba(29,43,50,0.70) !important; }
/* The white wordmark is invisible on white — use the colour logo that ships
alongside it. Swapped via background-image so the ![]()
keeps its layout box
and the srcset (which has no colour variants) is not left pointing at 404s. */
body.smx-light .site-logo img,
body.smx-light .wd-logo img { visibility: hidden !important; }
body.smx-light .site-logo a,
body.smx-light .wd-logo {
display: inline-block;
background-image: url("/wp-content/uploads/2025/08/logo-color.png");
background-repeat: no-repeat;
background-position: left center;
background-size: contain;
}
/* Text: the dark theme leans on translucent white, which is invisible on white. */
body.smx-light,
body.smx-light p,
body.smx-light li,
body.smx-light span,
body.smx-light div,
body.smx-light .elementor-widget-text-editor,
body.smx-light .elementor-widget-container {
color: #1d2b32;
}
body.smx-light h1, body.smx-light h2, body.smx-light h3,
body.smx-light h4, body.smx-light h5, body.smx-light h6 {
color: #0e2029 !important;
}
body.smx-light a { color: #1E6B5A; }
body.smx-light a:hover { color: #164F42; }
/* Anything still painting translucent white text would vanish on white. */
body.smx-light [style*="color:#fff"],
body.smx-light [style*="color: #fff"],
body.smx-light [style*="color:rgba(255,255,255"],
body.smx-light [style*="color: rgba(255, 255, 255"] {
color: #1d2b32 !important;
}
/* Header/footer: keep them readable without redesigning the builder layout. */
body.smx-light .whb-header,
body.smx-light .whb-main-header,
body.smx-light .whb-row,
body.smx-light .wd-header-wrapper,
body.smx-light footer,
body.smx-light .footer-container {
background-color: #ffffff !important;
color: #1d2b32 !important;
border-color: rgba(14,32,41,0.14) !important;
}
body.smx-light .whb-header a,
body.smx-light footer a { color: #1d2b32 !important; }
body.smx-light .whb-header a:hover,
body.smx-light footer a:hover { color: #1E6B5A !important; }
/* Brand-green buttons stay green with white text — the one dark surface we keep. */
body.smx-light .btn,
body.smx-light .button,
body.smx-light .elementor-button,
body.smx-light button[type="submit"] {
background-color: #1E6B5A !important;
color: #fff !important;
border-color: #1E6B5A !important;
}
body.smx-light .btn:hover,
body.smx-light .button:hover,
body.smx-light .elementor-button:hover,
body.smx-light button[type="submit"]:hover {
background-color: #164F42 !important;
color: #fff !important;
}
body.smx-light .elementor-button *,
body.smx-light .btn * { color: #fff !important; }
/* Elementor's own background overlay. The original design used it as a dark
scrim over the video; an early version of this theme flipped it to 55% WHITE,
which is what kept fogging the hero and footer photographs long after the
::after scrims were removed. No overlay at all — the images show as-is. */
body.smx-light .elementor-background-overlay {
background-color: transparent !important;
background-image: none !important;
opacity: 0 !important;
}
/* Separators/cards */
body.smx-light hr,
body.smx-light .elementor-divider-separator { border-color: rgba(14,32,41,0.14) !important; }
/* ---------------------------------------------------------------------------
HERO: the mirrored background video is the LABORATORY clip, which does not
belong on the clinic page. Hide it and use the clinic still, blurred.
The blur lives on a ::before pseudo-element rather than the section itself,
because filter: blur() on the section would blur its text children too.
--------------------------------------------------------------------------- */
body.smx-light .elementor-background-video-container,
body.smx-light video.elementor-background-video-hosted { display: none !important; }
body.smx-light .elementor-element-22eb47e { position: relative; isolation: isolate; }
body.smx-light .elementor-element-22eb47e::before {
content: "";
position: absolute;
inset: -40px; /* overscan so blurred edges never show */
/* v2 art. Shipped as an optimised JPEG, not the 5.7 MB source PNG: as a
full-bleed hero background that payload would dominate mobile load time
(1920px wide, q82 mozjpeg -> ~115 KB). Regenerate with qa/optimise-hero.mjs
if the source art changes. */
background-image: url("/brand/clinique-hero-v2.jpg");
background-size: cover;
background-position: center;
/* CRITICAL: Elementor already uses ::before on this section as its background
overlay and sets opacity 0.2 on it. Painting our image into the same
pseudo-element inherited that 0.2, so the photo rendered at one fifth
strength over a light page — measured +60 luminance vs the source. That is
what read as "fog", and it survived every scrim reduction because it was
never a scrim. Both opacity and background-color must be reset here. */
opacity: 1 !important;
background-color: transparent !important;
filter: blur(0.5px) saturate(1.02);
transform: scale(1.01);
z-index: 0;
pointer-events: none;
}
/* Mobile crop. The art is landscape (1920x1279) inside a tall phone viewport,
so a centred cover-crop throws away most of the frame and cuts the subject.
Bias the crop right-of-centre, where the clinician and screen sit. */
@media (max-width: 767px) {
body.smx-light .elementor-element-22eb47e::before {
/* 88%, not 68%: on a phone the copy fills the width, so whatever sits
behind it decides legibility. At 68% the busy X-ray screen sat directly
under the paragraph. Shifting right puts the clinician's scrubs — a large
calm area — behind the text, which buys readability without adding any
more tint or blur over the picture. */
background-position: 88% center;
inset: -12px;
transform: none;
}
}
/* Low scrim, weighted to the left column where the headline sits, clearing
completely by mid-frame. Deliberately gentle: the earlier "fog" was never
this layer — it was Elementor's ::before opacity (reset above) — so a light
wash here costs almost nothing and buys back contrast under the type. */
body.smx-light .elementor-element-22eb47e::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(
95deg,
rgba(238,243,245,0.30) 0%,
rgba(238,243,245,0.18) 30%,
rgba(238,243,245,0.04) 52%,
rgba(238,243,245,0.00) 68%
);
z-index: 1;
pointer-events: none;
}
/* With the scrim this light the headline sits almost directly on the photo, so
legibility comes from a soft halo on the type instead of fogging the image. */
/* ---------------------------------------------------------------------------
Headline legibility.
A halo alone was not enough and a different text colour would not have helped
either: the headline crosses a bright wall AND dark hair/upholstery, so any
single colour reads well over part of the line and weakly over the rest. The
fix is a consistent backdrop for the copy column only — the photograph is
left exactly as it is everywhere else.
Frosted rather than solid so the image still reads through it.
--------------------------------------------------------------------------- */
body.smx-light .elementor-element-22eb47e h1,
body.smx-light .elementor-element-22eb47e h2,
body.smx-light .elementor-element-22eb47e p,
body.smx-light .elementor-element-22eb47e :where(span, div) {
/* Halo comes back up a little: at 50% panel opacity the type needs some help
again, but far less than it did with no panel at all. */
text-shadow: 0 1px 2px rgba(255,255,255,0.9), 0 0 12px rgba(255,255,255,0.65);
}
/* Buttons carry their own solid fill — a halo around them just looks smudged. */
body.smx-light .elementor-element-22eb47e .elementor-button,
body.smx-light .elementor-element-22eb47e .elementor-button * { text-shadow: none !important; }
body.smx-light .elementor-element-22eb47e > * { position: relative; z-index: 2; }
/* ---- derived from mirrored stylesheets ---- */
body.smx-light .theme-twentynineteen .editor-styles-wrapper .wp-block-button .wp-block-button__link:not(.has-text-color){color:#1d2b32!important}
body.smx-light .theme-twentytwenty .wc-block-components-product-sale-badge,body.smx-light .theme-twentytwenty .wc-block-grid__products .wc-block-grid__product-onsale{color:#1d2b32!important}
body.smx-light .wc-block-components-notice-banner>svg{background-color:#ffffff!important}
body.smx-light .wc-block-components-notice-banner.is-error>svg{background-color:#ffffff!important}
body.smx-light .oceanwp-theme .wps_sfw_subscription_inner_wrapper .amount{color:#1d2b32!important}
body.smx-light .wps_sfw_subs_box-overlay{background-color:#eef3f5!important}
body.smx-light #wps_sfw_subs_box-form .wps_sfw_sub_box_prod_item .wps_sfw_sub_box_prod_qty button{color:#1d2b32!important}
body.smx-light #wps_sfw_subs_box-form .wps_sfw-sb-cta button{color:#1d2b32!important}
body.smx-light .elementor-custom-embed-play i{color:#1d2b32!important}
body.smx-light .elementor-button{color:#1d2b32!important}
body.smx-light .elementor-button:focus,body.smx-light .elementor-button:hover,body.smx-light .elementor-button:visited{color:#1d2b32!important}
body.smx-light .elementor-view-stacked .elementor-icon{color:#1d2b32!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-22eb47e::before,body.smx-light .elementor-1686 .elementor-element.elementor-element-22eb47e>.elementor-background-video-container::before,body.smx-light .elementor-1686 .elementor-element.elementor-element-22eb47e>.e-con-inner>.elementor-background-video-container::before,body.smx-light .elementor-1686 .elementor-element.elementor-element-22eb47e>.elementor-background-slideshow::before,body.smx-light .elementor-1686 .elementor-element.elementor-element-22eb47e>.e-con-inner>.elementor-background-slideshow::before,body.smx-light .elementor-1686 .elementor-element.elementor-element-22eb47e>.elementor-motion-effects-container>.elementor-motion-effects-layer::before{background-color:#eef3f5!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-1774f9d .elementor-heading-title{color:#1d2b32!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-373e902 .elementor-heading-title{color:#1d2b32!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-4f76e0d{color:#1d2b32!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-8d64ee7 .elementor-button{color:#1d2b32!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-78daf9c:not(.elementor-motion-effects-element-type-background),body.smx-light .elementor-1686 .elementor-element.elementor-element-78daf9c>.elementor-motion-effects-container>.elementor-motion-effects-layer{background-color:#eef3f5!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-3520e25:not(.elementor-motion-effects-element-type-background),body.smx-light .elementor-1686 .elementor-element.elementor-element-3520e25>.elementor-motion-effects-container>.elementor-motion-effects-layer{background-color:#ffffff!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-dc4db94:not(.elementor-motion-effects-element-type-background),body.smx-light .elementor-1686 .elementor-element.elementor-element-dc4db94>.elementor-motion-effects-container>.elementor-motion-effects-layer{background-color:#ffffff!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-492ab0c:not(.elementor-motion-effects-element-type-background),body.smx-light .elementor-1686 .elementor-element.elementor-element-492ab0c>.elementor-motion-effects-container>.elementor-motion-effects-layer{background-color:#ffffff!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-00ad779:not(.elementor-motion-effects-element-type-background),body.smx-light .elementor-1686 .elementor-element.elementor-element-00ad779>.elementor-motion-effects-container>.elementor-motion-effects-layer{background-color:#ffffff!important}
body.smx-light .elementor-1686 .elementor-element.elementor-element-c04b5f0:not(.elementor-motion-effects-element-type-background),body.smx-light .elementor-1686 .elementor-element.elementor-element-c04b5f0>.elementor-motion-effects-container>.elementor-motion-effects-layer{background-color:#eef3f5!important}
body.smx-light .wd-dropdown-menu.wd-design-default.color-scheme-light .menu-item-has-children>a:after{color:#1d2b32!important}
body.smx-light .wd-notice .amount,body.smx-light div.wpcf7-response-output .amount,body.smx-light .mc4wp-alert .amount,body.smx-light :is(.woocommerce-error,body.smx-light .woocommerce-message,body.smx-light .woocommerce-info) .amount{color:#1d2b32!important}
body.smx-light .wd-notice.wd-info{color:#1d2b32!important}
body.smx-light .wd-close-side{background-color:#eef3f5!important}
body.smx-light nav[class*="-pagination"] li .current{color:#1d2b32!important}
body.smx-light .wd-added-icon:before{color:#1d2b32!important}
body.smx-light .wd-video-theme-style .elementor-custom-embed-image-overlay:after{background-color:#eef3f5!important}
body.smx-light .global-color-scheme-light .blockOverlay{background-color:#eef3f5!important}
body.smx-light div.wc-block-components-notice-banner .amount{color:#1d2b32!important}
body.smx-light div.wc-block-components-notice-banner>div .button.wc-forward{color:#1d2b32!important}
body.smx-light :is(.wc-block-product-template,body.smx-light .wc-block-grid__products,body.smx-light .wp-block-query,body.smx-light .wp-block-button) .wp-block-button__link{background-color:#ffffff!important}
body.smx-light .whb-color-light:not(.whb-with-bg){background-color:#ffffff!important}
body.smx-light .whb-color-light .wd-header-nav>span{color:#1d2b32!important}
body.smx-light .wd-tools-element:is(.wd-design-2,body.smx-light .wd-design-5) .wd-tools-count{color:#1d2b32!important}
body.smx-light .wd-tools-element.wd-design-4 .wd-tools-count{color:#1d2b32!important}
body.smx-light .wd-tools-element.wd-design-7>a>:is(.wd-tools-inner,body.smx-light .wd-tools-icon){color:#1d2b32!important}
body.smx-light .wd-tools-element.wd-design-7:hover>a>:is(.wd-tools-inner,body.smx-light .wd-tools-icon){color:#1d2b32!important}
body.smx-light .wd-header-cart.wd-design-4 .wd-cart-number{color:#1d2b32!important}
body.smx-light .wd-header-cart.wd-design-2 .wd-cart-number,body.smx-light .wd-header-cart.wd-design-5 .wd-cart-number{color:#1d2b32!important}
body.smx-light .mobile-nav .wd-nav-opener.wd-active{color:#1d2b32!important}
body.smx-light .wd-popup.wd-promo-popup{background-color:#eef3f5!important}
body.smx-light .wd-page-title{background-color:#eef3f5!important}
body.smx-light .wps_sfw_account_additional_wrap table th{color:#1d2b32!important}
body.smx-light .btn:hover,body.smx-light .button:hover,body.smx-light .single_add_to_cart_button:hover,body.smx-light .elementor-button:hover{background-color:#ffffff!important}
body.smx-light .wc-stripe-payment-button-preview{background-color:#eef3f5!important}
body.smx-light .elementor-social-icon:hover{color:#1d2b32!important}
body.smx-light .elementor-social-icon-codepen{background-color:#eef3f5!important}
body.smx-light .elementor-social-icon-elementor{background-color:#ffffff!important}
body.smx-light .elementor-social-icon-github{background-color:#ffffff!important}
body.smx-light .elementor-social-icon-instagram{background-color:#ffffff!important}
body.smx-light .elementor-social-icon-mixcloud{background-color:#ffffff!important}
body.smx-light .elementor-social-icon-pinterest{background-color:#ffffff!important}
body.smx-light .elementor-social-icon-threads{background-color:#eef3f5!important}
body.smx-light .elementor-social-icon-tumblr{background-color:#ffffff!important}
body.smx-light .elementor-social-icon-x-twitter{background-color:#eef3f5!important}
body.smx-light .elementor-social-icon-yelp{background-color:#ffffff!important}
body.smx-light .elementor-social-icon-youtube{background-color:#ffffff!important}
body.smx-light body.smx-light .btn:hover,body.smx-light body.smx-light .button:hover,body.smx-light body.smx-light .elementor-button:hover,body.smx-light body.smx-light button[type="submit"]:hover{background-color:#ffffff!important}
body.smx-light body.smx-light .elementor-button *,body.smx-light body.smx-light .btn *{color:#1d2b32!important}
body.smx-light body.smx-light .btn *,body.smx-light body.smx-light .button *,body.smx-light body.smx-light .elementor-button *,body.smx-light body.smx-light #ab-submit *{color:#1d2b32!important}
body.smx-light body.smx-light .btn:hover,body.smx-light body.smx-light .button:hover,body.smx-light body.smx-light .elementor-button:hover,body.smx-light body.smx-light a.elementor-button:hover,body.smx-light body.smx-light .wd-buy-now-btn:hover,body.smx-light body.smx-light button[type="submit"]:hover,body.smx-light body.smx-light #ab-submit:hover{background-color:#ffffff!important}
body.smx-light body.smx-light .btn:hover *,body.smx-light body.smx-light .button:hover *,body.smx-light body.smx-light .elementor-button:hover *,body.smx-light body.smx-light #ab-submit:hover *{color:#1d2b32!important}
body.smx-light /* The footer wordmark,body.smx-light tagline and links are all WHITE artwork from the
original dark design. Rather than swap every one of them,body.smx-light this band keeps a
dark scrim over the photo — which is what the footer looked like before,body.smx-light and
gives the light page a deliberate closing edge instead of fading out. */
body.smx-light .elementor-element-990ebf1,body.smx-light body.smx-light .elementor-element-990ebf1 :where(p,body.smx-light li,body.smx-light span,body.smx-light div,body.smx-light a,body.smx-light h1,body.smx-light h2,body.smx-light h3,body.smx-light h4,body.smx-light h5,body.smx-light h6){color:#1d2b32!important}
body.smx-light body.smx-light .elementor-element-990ebf1 a:hover{color:#1d2b32!important}
/* ---- brand surfaces, restated after the derived rules ---- */
body.smx-light .btn,
body.smx-light .button,
body.smx-light .elementor-button,
body.smx-light a.elementor-button,
body.smx-light .wd-buy-now-btn,
body.smx-light button[type="submit"],
body.smx-light #ab-submit {
background-color: #1E6B5A !important;
border-color: #1E6B5A !important;
color: #ffffff !important;
}
body.smx-light .btn *,
body.smx-light .button *,
body.smx-light .elementor-button *,
body.smx-light #ab-submit * { color: #ffffff !important; }
body.smx-light .btn:hover,
body.smx-light .button:hover,
body.smx-light .elementor-button:hover,
body.smx-light a.elementor-button:hover,
body.smx-light .wd-buy-now-btn:hover,
body.smx-light button[type="submit"]:hover,
body.smx-light #ab-submit:hover {
background-color: #164F42 !important;
border-color: #164F42 !important;
color: #ffffff !important;
}
body.smx-light .btn:hover *,
body.smx-light .button:hover *,
body.smx-light .elementor-button:hover *,
body.smx-light #ab-submit:hover * { color: #ffffff !important; }
/* Hovering a section must NOT light up the whole container — an earlier version
put a glow on .e-con-full:hover, so moving the mouse near a button lit a big
rectangle around it. Only the control itself reacts. */
body.smx-light .e-con-full[class*="elementor-element-"]:hover,
body.smx-light .e-con[class*="elementor-element-"]:hover,
body.smx-light .elementor-element:hover {
box-shadow: none !important;
}
/* The amber/yellow hover edge is the theme's secondary brand colour; on a
clinical page it reads as a warning state. Neutralised to the hairline. */
body.smx-light .e-con-full[class*="elementor-element-"]:hover,
body.smx-light .e-con[class*="elementor-element-"]:hover {
border-color: rgba(14,32,41,0.14) !important;
}
body.smx-light [style*="border-color:#f5ce0a"],
body.smx-light [style*="border-color: #f5ce0a"] { border-color: rgba(14,32,41,0.14) !important; }
/* ---------------------------------------------------------------------------
Closing section: the clinic photo, blurred, as a footer band.
NOTE the theme's own