html body .whb-top-bar {
background: #0d0c09 !important;
border-bottom-color: rgba(216,174,94,.35) !important;
}
html body .whb-top-bar .whb-col-right,
html body .whb-header {
opacity: 1 !important;
visibility: visible !important;
}
html body .whb-header {
position: relative !important;
}
@media (min-width: 1025px) {
/*
* FIRST-PAINT DETACHED SERVICE KILL SWITCH v14
* The wanted Service button lives inside .srh-actions on the left.
* Any Service control inside the separate desktop center/right columns is the detached copy and must never paint.
*/
html body .whb-header-bottom .whb-col-center .srh-service,
html body .whb-header-bottom .whb-col-right .srh-service,
html body .whb-header-bottom .whb-col-center [data-srh="service"],
html body .whb-header-bottom .whb-col-right [data-srh="service"],
html body .whb-header-bottom .whb-col-center a[href*="/service"],
html body .whb-header-bottom .whb-col-right a[href*="/service"],
html body .whb-header-bottom .whb-col-center a[href*="/servis"],
html body .whb-header-bottom .whb-col-right a[href*="/servis"],
html body .whb-header-bottom .whb-col-center a[href*="/repair"],
html body .whb-header-bottom .whb-col-right a[href*="/repair"] {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
width: 0 !important;
min-width: 0 !important;
max-width: 0 !important;
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
overflow: hidden !important;
pointer-events: none !important;
}
/*
* FIRST-PAINT LEGACY SERVICE KILL SWITCH — FALLBACK ROUTES
* Hide WoodMart/original Service entries before JavaScript classifies the menu.
* The real Srobota Service action inside .srh-actions remains untouched.
*/
html body .whb-header-bottom li:has(> a[href*="/service"]),
html body .whb-header-bottom li:has(> a[href*="/servis"]),
html body .whb-header-bottom li:has(> a[href*="/repair"]),
html body .whb-header-bottom .wd-tools-element:has(> a[href*="/service"]),
html body .whb-header-bottom .wd-tools-element:has(> a[href*="/servis"]),
html body .whb-header-bottom .wd-tools-element:has(> a[href*="/repair"]) {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
width: 0 !important;
min-width: 0 !important;
max-width: 0 !important;
height: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
pointer-events: none !important;
}
html body .whb-header-bottom a[href*="/service"]:not(.srh-action),
html body .whb-header-bottom a[href*="/servis"]:not(.srh-action),
html body .whb-header-bottom a[href*="/repair"]:not(.srh-action) {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
pointer-events: none !important;
}
html.srh-ready body .whb-header-bottom .whb-flex-row {
position: relative !important;
overflow: visible !important;
}
html.srh-ready body .whb-header-bottom .whb-col-left {
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
flex: 0 0 auto !important;
width: auto !important;
max-width: none !important;
min-width: 0 !important;
gap: 12px !important;
overflow: visible !important;
}
html.srh-ready body .whb-header-bottom .whb-col-center {
flex: 1 1 auto !important;
width: auto !important;
max-width: none !important;
min-width: 0 !important;
padding-left: 12px !important;
padding-right: 0 !important;
}
html.srh-ready body
.whb-header-bottom
.whb-col-center
.wd-nav {
position: relative !important;
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
justify-content: flex-end !important;
}
html.srh-ready body
.whb-header-bottom
.srh-legacy-service,
html.srh-ready body
.whb-header-bottom
.srh-service-sentinel,
html.srh-has-top-menu body
.whb-header-bottom
.srh-bottom-source-item {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
width: 0 !important;
min-width: 0 !important;
height: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
pointer-events: none !important;
overflow: hidden !important;
}
html.srh-ready body .srh-actions {
position: relative !important;
inset: auto !important;
display: flex !important;
flex: 0 0 auto !important;
align-items: center !important;
justify-content: flex-start !important;
gap: 12px !important;
width: auto !important;
height: 46px !important;
min-height: 46px !important;
margin: 0 !important;
padding: 0 !important;
transform: none !important;
visibility: visible !important;
opacity: 1 !important;
z-index: 30 !important;
white-space: nowrap !important;
}
html.srh-ready body .srh-action {
position: relative !important;
isolation: isolate !important;
display: inline-flex !important;
flex: 0 0 auto !important;
align-items: center !important;
justify-content: flex-start !important;
gap: 9px !important;
height: 46px !important;
min-height: 46px !important;
margin: 0 !important;
padding: 0 14px 0 8px !important;
overflow: hidden !important;
border: 1px solid rgba(214,178,108,.52) !important;
border-radius: 14px !important;
color: #fff !important;
-webkit-text-fill-color: #fff !important;
background:
radial-gradient(
circle at 92% -35%,
rgba(218,184,123,.20),
transparent 45%
),
linear-gradient(
135deg,
#181613,
#302a22
) !important;
box-shadow:
0 9px 23px rgba(18,16,13,.18),
inset 0 1px 0 rgba(255,255,255,.06) !important;
font-family:
"Noto Sans Georgian",
"FiraGO",
Arial,
sans-serif !important;
line-height: 1 !important;
text-decoration: none !important;
white-space: nowrap !important;
transform: translateY(0) !important;
transition:
transform .25s cubic-bezier(.2,.75,.2,1),
border-color .25s ease,
background .25s ease,
box-shadow .25s ease,
filter .25s ease !important;
}
html.srh-ready body .srh-action::before,
html.srh-ready body .srh-action::after {
content: none !important;
display: none !important;
}
html.srh-ready body .srh-action:hover {
transform: translateY(-3px) !important;
border-color: rgba(235,199,132,.76) !important;
background:
radial-gradient(
circle at 92% -35%,
rgba(224,190,128,.30),
transparent 45%
),
linear-gradient(
135deg,
#211d18,
#3a3025
) !important;
box-shadow:
0 14px 31px rgba(18,16,13,.24),
inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html.srh-ready body .srh-action:focus-visible {
outline: 2px solid #efd08e !important;
outline-offset: 3px !important;
}
html.srh-ready body .srh-action-label {
position: relative !important;
z-index: 2 !important;
display: inline-flex !important;
align-items: center !important;
margin: 0 !important;
padding: 0 !important;
color: #fff !important;
-webkit-text-fill-color: #fff !important;
font-family: inherit !important;
font-size: 12px !important;
line-height: 1 !important;
font-weight: 800 !important;
letter-spacing: 0 !important;
white-space: nowrap !important;
}
html.srh-ready body .srh-icon-box {
position: relative !important;
z-index: 2 !important;
display: inline-flex !important;
flex: 0 0 30px !important;
align-items: center !important;
justify-content: center !important;
width: 30px !important;
min-width: 30px !important;
height: 30px !important;
margin: 0 !important;
padding: 0 !important;
border: 1px solid rgba(235,199,132,.30) !important;
border-radius: 9px !important;
color: #efd08e !important;
background: rgba(229,196,135,.10) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.07),
0 4px 10px rgba(0,0,0,.11) !important;
transition:
transform .25s ease,
border-color .25s ease,
background .25s ease !important;
}
html.srh-ready body
.srh-action:hover
.srh-icon-box {
transform: scale(1.07) rotate(-4deg) !important;
border-color: rgba(239,207,145,.48) !important;
background: rgba(229,196,135,.15) !important;
}
html.srh-ready body .srh-icon-box svg {
display: block !important;
width: 19px !important;
height: 19px !important;
fill: none !important;
stroke: currentColor !important;
stroke-width: 1.8 !important;
stroke-linecap: round !important;
stroke-linejoin: round !important;
}
html.srh-ready body .srh-service {
min-width: 119px !important;
}
html.srh-ready body .srh-trade {
min-width: 151px !important;
border-color: rgba(222,183,108,.64) !important;
background:
radial-gradient(
circle at 13% -15%,
rgba(244,211,139,.24),
transparent 43%
),
radial-gradient(
circle at 92% 120%,
rgba(83,184,150,.13),
transparent 42%
),
linear-gradient(
135deg,
#1c1813 0%,
#33291e 54%,
#18231f 100%
) !important;
}
html.srh-ready body .srh-trade:hover {
background:
radial-gradient(
circle at 13% -15%,
rgba(247,216,151,.33),
transparent 43%
),
radial-gradient(
circle at 92% 120%,
rgba(92,213,166,.20),
transparent 43%
),
linear-gradient(
135deg,
#251e16 0%,
#453422 54%,
#1c3029 100%
) !important;
box-shadow:
0 15px 33px rgba(18,16,13,.25),
0 0 19px rgba(94,203,163,.10),
inset 0 1px 0 rgba(255,255,255,.09) !important;
}
html.srh-ready body .srh-trade-sheen {
position: absolute !important;
z-index: 1 !important;
top: -80% !important;
left: -44% !important;
display: block !important;
width: 31% !important;
height: 260% !important;
background:
linear-gradient(
90deg,
transparent,
rgba(255,239,199,.32),
transparent
) !important;
pointer-events: none !important;
transform: rotate(18deg) !important;
animation:
srhTradeSheen 4.6s ease-in-out infinite !important;
}
html.srh-ready body .srh-robot svg {
width: 25px !important;
height: 25px !important;
stroke-width: 1.55 !important;
}
html.srh-ready body .srh-robot-disc {
transform-origin: 18px 18px !important;
animation:
srhRobotFloat 3.2s ease-in-out infinite !important;
}
html.srh-ready body .srh-robot-brush {
transform-origin: 29px 26px !important;
animation:
srhBrushSpin 1.8s linear infinite !important;
}
html.srh-ready body .srh-tech {
min-width: 286px !important;
padding-left: 8px !important;
gap: 10px !important;
}
html.srh-ready body .srh-book-icon {
flex-basis: 32px !important;
width: 32px !important;
min-width: 32px !important;
height: 32px !important;
color: #f1cf88 !important;
background:
radial-gradient(
circle at 50% 15%,
rgba(242,205,132,.17),
transparent 56%
),
rgba(229,196,135,.09) !important;
}
html.srh-ready body .srh-book-icon svg {
width: 21px !important;
height: 21px !important;
transition:
transform .26s cubic-bezier(.2,.75,.2,1),
filter .26s ease !important;
}
html.srh-ready body
.srh-tech:hover
.srh-book-icon svg {
transform:
translateY(-1px)
scale(1.08)
rotate(-2deg) !important;
filter:
drop-shadow(
0 0 5px rgba(239,203,133,.24)
) !important;
}
html.srh-ready body .srh-book-spark {
animation:
srhBookSpark 3.4s ease-in-out infinite !important;
}
html.srh-ready body
.srh-tech
.srh-action-label {
font-size: 11.5px !important;
font-weight: 760 !important;
}
html.srh-ready body .whb-top-bar {
min-height: 50px !important;
background:
radial-gradient(
circle at 50% -130%,
rgba(210,169,94,.12),
transparent 58%
),
linear-gradient(
180deg,
#171511 0%,
#0c0b09 100%
) !important;
border: 0 !important;
border-bottom:
1px solid rgba(207,164,86,.48) !important;
box-shadow:
0 4px 15px rgba(0,0,0,.24),
inset 0 -1px 0 rgba(255,255,255,.025) !important;
--wd-header-el-color: #e7c477 !important;
--wd-header-el-color-hover: #ffe0a0 !important;
}
html.srh-ready body
.whb-top-bar
.whb-flex-row {
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
min-height: 50px !important;
height: 50px !important;
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
overflow: visible !important;
}
html.srh-ready body
.whb-top-bar
.whb-col-right {
display: flex !important;
flex: 1 1 100% !important;
align-items: center !important;
justify-content: flex-start !important;
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
gap: 7px !important;
overflow: visible !important;
white-space: nowrap !important;
flex-wrap: nowrap !important;
}
/*
* Relocated menu wrapper:
* no outer border, background or shadow.
* Individual menu buttons are preserved.
*/
html.srh-ready body .srh-top-relocated {
position: relative !important;
display: flex !important;
flex: 1 1 auto !important;
order: 0 !important;
align-items: center !important;
justify-content: flex-start !important;
width: auto !important;
max-width: none !important;
min-width: 0 !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
overflow: visible !important;
visibility: visible !important;
opacity: 1 !important;
}
html.srh-ready body .srh-top-menu {
display: grid !important;
grid-template-columns:
repeat(8, minmax(0,1fr)) !important;
align-items: center !important;
gap: 6px !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
visibility: visible !important;
opacity: 1 !important;
background: transparent !important;
}
html.srh-ready body .srh-top-item {
position: relative !important;
display: flex !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
visibility: visible !important;
opacity: 1 !important;
animation:
srhTopItemIn
.42s
cubic-bezier(.2,.78,.2,1)
both !important;
}
html.srh-ready body
.srh-top-item:nth-child(2) {
animation-delay: .035s !important;
}
html.srh-ready body
.srh-top-item:nth-child(3) {
animation-delay: .07s !important;
}
html.srh-ready body
.srh-top-item:nth-child(4) {
animation-delay: .105s !important;
}
html.srh-ready body
.srh-top-item:nth-child(5) {
animation-delay: .14s !important;
}
html.srh-ready body
.srh-top-item:nth-child(6) {
animation-delay: .175s !important;
}
html.srh-ready body
.srh-top-item:nth-child(7) {
animation-delay: .21s !important;
}
html.srh-ready body
.srh-top-item:nth-child(8) {
animation-delay: .245s !important;
}
html.srh-ready body .srh-top-link {
position: relative !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 5px !important;
min-height: 34px !important;
margin: 0 !important;
width: 100% !important;
padding: 0 8px 0 6px !important;
border:
1px solid rgba(214,171,91,.38) !important;
border-radius: 10px !important;
color: #f0cf86 !important;
-webkit-text-fill-color: #f0cf86 !important;
background:
linear-gradient(
145deg,
rgba(204,161,83,.14),
rgba(204,161,83,.035)
) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.04),
0 3px 8px rgba(0,0,0,.18) !important;
font-family:
"Noto Sans Georgian",
"FiraGO",
Arial,
sans-serif !important;
font-size: 10.6px !important;
line-height: 1.1 !important;
font-weight: 750 !important;
text-shadow:
0 1px 3px rgba(0,0,0,.52) !important;
text-decoration: none !important;
white-space: nowrap !important;
visibility: visible !important;
opacity: 1 !important;
transition:
transform .2s ease,
border-color .2s ease,
background .2s ease,
box-shadow .2s ease !important;
}
html.srh-ready body .srh-top-link,
html.srh-ready body
.srh-top-link > span:not(.srh-top-icon),
html.srh-ready body
.srh-top-link
.nav-link-text {
color: #f0cf86 !important;
-webkit-text-fill-color: #f0cf86 !important;
opacity: 1 !important;
visibility: visible !important;
}
html.srh-ready body .srh-top-link::before,
html.srh-ready body .srh-top-link::after {
content: none !important;
display: none !important;
}
html.srh-ready body .srh-top-link:hover {
transform: translateY(-2px) !important;
border-color: rgba(240,199,120,.76) !important;
background:
linear-gradient(
145deg,
rgba(221,177,96,.22),
rgba(221,177,96,.08)
) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.07),
0 5px 13px rgba(0,0,0,.23),
0 0 12px rgba(211,166,78,.08) !important;
}
html.srh-ready body .srh-top-icon {
display: inline-flex !important;
flex: 0 0 20px !important;
align-items: center !important;
justify-content: center !important;
width: 20px !important;
min-width: 20px !important;
height: 20px !important;
margin: 0 !important;
padding: 0 !important;
border:
1px solid rgba(226,187,108,.42) !important;
border-radius: 8px !important;
color: #e7c477 !important;
background: rgba(222,181,101,.10) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.05) !important;
}
html.srh-ready body .srh-top-icon svg {
display: block !important;
width: 12px !important;
height: 12px !important;
fill: none !important;
stroke: currentColor !important;
stroke-width: 1.8 !important;
stroke-linecap: round !important;
stroke-linejoin: round !important;
}
html.srh-ready body
.whb-top-bar
.whb-col-right::before {
order: 1 !important;
flex: 0 0 auto !important;
min-height: 34px !important;
padding: 0 13px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 999px !important;
font-size: 10.8px !important;
line-height: 1 !important;
font-weight: 800 !important;
white-space: nowrap !important;
color: #ebca82 !important;
-webkit-text-fill-color: #ebca82 !important;
background:
linear-gradient(
145deg,
rgba(214,170,91,.16),
rgba(214,170,91,.055)
) !important;
border:
1px solid rgba(229,187,106,.48) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.055),
0 5px 15px rgba(0,0,0,.19),
0 0 14px rgba(218,173,87,.055) !important;
animation:
srhPhoneGlow 3.6s ease-in-out infinite !important;
}
html.srh-ready body
.whb-top-bar
.whb-col-right
> *:not(.srh-top-relocated) {
order: 2 !important;
flex-shrink: 0 !important;
}
html.srh-ready body
.whb-top-bar
.wd-social-icons {
display: flex !important;
flex: 0 0 auto !important;
flex-wrap: nowrap !important;
align-items: center !important;
gap: 5px !important;
margin: 0 !important;
}
html.srh-ready body
.whb-top-bar
.wd-social-icon {
flex: 0 0 27px !important;
width: 27px !important;
min-width: 27px !important;
height: 27px !important;
margin: 0 !important;
}
html.srh-ready body
.whb-top-bar
.wd-social-icons.srh-social-set.sr-brand-social-set {
display: flex !important;
flex: 0 0 auto !important;
align-items: center !important;
justify-content: flex-end !important;
flex-wrap: nowrap !important;
gap: 8px !important;
margin: 0 !important;
padding: 0 !important;
overflow: visible !important;
}
html.srh-ready body
.whb-top-bar
.sr-brand-social-set
> a.srh-social.sr-brand-social {
position: relative !important;
isolation: isolate !important;
display: inline-flex !important;
flex: 0 0 32px !important;
align-items: center !important;
justify-content: center !important;
width: 32px !important;
min-width: 32px !important;
height: 32px !important;
min-height: 32px !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
border: 1px solid rgba(255,218,145,.58) !important;
border-radius: 10px !important;
color: #fff !important;
-webkit-text-fill-color: #fff !important;
text-decoration: none !important;
opacity: 1 !important;
visibility: visible !important;
transform: translateY(0) scale(1) !important;
animation: srBrandSocialReveal .42s cubic-bezier(.2,.8,.2,1) both !important;
transition: transform .24s cubic-bezier(.2,.8,.2,1), border-color .24s ease, box-shadow .24s ease, filter .24s ease !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-social:nth-child(2) {
animation-delay: .05s !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-social:nth-child(3) {
animation-delay: .10s !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-social::before {
content: "" !important;
position: absolute !important;
z-index: 1 !important;
top: -75% !important;
left: 0 !important;
display: block !important;
width: 42% !important;
height: 250% !important;
border: 0 !important;
background: linear-gradient(90deg, transparent, rgba(255,255,255,.48), transparent) !important;
pointer-events: none !important;
opacity: 0 !important;
transform: translateX(-260%) rotate(22deg) !important;
transition: transform .52s ease, opacity .18s ease !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-social:hover::before {
opacity: .82 !important;
transform: translateX(560%) rotate(22deg) !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-social::after {
content: "" !important;
position: absolute !important;
z-index: 1 !important;
inset: 2px !important;
display: block !important;
border: 1px solid rgba(255,255,255,.18) !important;
border-radius: 7px !important;
pointer-events: none !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-social svg {
position: relative !important;
z-index: 3 !important;
display: block !important;
width: 17px !important;
height: 17px !important;
margin: 0 !important;
fill: none !important;
stroke: currentColor !important;
stroke-width: 1.9 !important;
stroke-linecap: round !important;
stroke-linejoin: round !important;
filter: drop-shadow(0 2px 3px rgba(0,0,0,.28)) !important;
transition: transform .24s cubic-bezier(.2,.8,.2,1), filter .24s ease !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-facebook {
background: linear-gradient(145deg,#2f91ff 0%,#1877f2 48%,#0c55c1 100%) !important;
box-shadow: 0 7px 18px rgba(24,119,242,.34),0 0 0 1px rgba(24,119,242,.12),inset 0 1px 0 rgba(255,255,255,.30) !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-facebook svg {
fill: currentColor !important;
stroke: none !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-whatsapp {
background: linear-gradient(145deg,#43e981 0%,#25d366 48%,#119447 100%) !important;
box-shadow: 0 7px 18px rgba(37,211,102,.32),0 0 0 1px rgba(37,211,102,.12),inset 0 1px 0 rgba(255,255,255,.30) !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-youtube {
background: linear-gradient(145deg,#ff5252 0%,#ff0000 48%,#b90000 100%) !important;
box-shadow: 0 7px 18px rgba(255,0,0,.32),0 0 0 1px rgba(255,0,0,.12),inset 0 1px 0 rgba(255,255,255,.30) !important;
animation-delay: .15s !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-youtube svg {
fill: currentColor !important;
stroke: none !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-instagram {
background: linear-gradient(135deg,#6544dc 0%,#a535bd 27%,#e1306c 57%,#f77737 79%,#fcb045 100%) !important;
box-shadow: 0 7px 18px rgba(225,48,108,.32),0 0 0 1px rgba(225,48,108,.12),inset 0 1px 0 rgba(255,255,255,.30) !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-social:hover {
transform: translateY(-4px) scale(1.10) !important;
border-color: rgba(255,231,181,.95) !important;
filter: brightness(1.08) saturate(1.10) !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-social:hover svg {
transform: scale(1.10) rotate(-3deg) !important;
filter: drop-shadow(0 3px 5px rgba(0,0,0,.34)) !important;
}
html.srh-ready body .sr-brand-social-set > a.sr-brand-social:focus-visible {
outline: 2px solid #ffe1a2 !important;
outline-offset: 3px !important;
}
@keyframes srBrandSocialReveal {
from { opacity: 0; transform: translateY(-7px) scale(.84); }
to { opacity: 1; transform: translateY(0) scale(1); }
}
/*
* v18: NEVER render our desktop action group inside WoodMart sticky/clone headers.
* mainRow() explicitly excludes these wrappers, so the wanted action group is untouched.
* This is the source of the one-frame standalone Service flash on initial load.
*/
html body .whb-clone .srh-actions,
html body .whb-clone.srh-actions,
html body .wd-header-sticky .srh-actions,
html body .wd-header-sticky.srh-actions,
html body .whb-sticky-header .srh-actions,
html body .whb-sticky-header.srh-actions,
html body .whb-sticky-row .srh-actions,
html body .whb-sticky-row.srh-actions,
html.srh-scrolled body
.whb-clone
.srh-top-menu,
html.srh-scrolled body
.wd-header-sticky
.srh-top-menu,
html.srh-scrolled body
.whb-sticky-header
.srh-top-menu,
html body .whb-clone .srh-top-relocated,
html body
.wd-header-sticky
.srh-top-relocated,
html body
.whb-sticky-header
.srh-top-relocated {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
pointer-events: none !important;
}
html body .whb-clone .whb-top-bar,
html body .whb-clone.whb-top-bar,
html body .wd-header-sticky .whb-top-bar,
html body .whb-sticky-header .whb-top-bar,
html body .whb-clone .whb-header-bottom,
html body .whb-clone.whb-header-bottom,
html body
.wd-header-sticky
.whb-header-bottom,
html body
.whb-sticky-header
.whb-header-bottom,
html.srh-scrolled body
.whb-sticked
.whb-top-bar,
html.srh-scrolled body
.whb-sticked
.whb-header-bottom {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
overflow: hidden !important;
pointer-events: none !important;
}
html.srh-scrolled body
.whb-clone
.whb-general-header,
html.srh-scrolled body
.whb-clone.whb-general-header,
html.srh-scrolled body
.wd-header-sticky
.whb-general-header,
html.srh-scrolled body
.whb-sticky-header
.whb-general-header,
html.srh-scrolled body
.whb-sticked
.whb-general-header {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
min-height: 62px !important;
background:
linear-gradient(
180deg,
rgba(15,13,10,.985),
rgba(8,7,6,.985)
) !important;
border-bottom:
1px solid rgba(221,178,96,.34) !important;
box-shadow:
0 12px 30px rgba(0,0,0,.30),
inset 0 -1px 0 rgba(255,255,255,.018) !important;
backdrop-filter:
blur(16px)
saturate(120%) !important;
-webkit-backdrop-filter:
blur(16px)
saturate(120%) !important;
}
html.srh-scrolled body
.whb-general-header
.whb-flex-row {
display: flex !important;
align-items: center !important;
min-height: 70px !important;
height: 70px !important;
gap: 18px !important;
}
html.srh-scrolled body
.whb-general-header
.whb-col-left,
html.srh-scrolled body
.whb-general-header
.whb-col-right {
display: flex !important;
flex: 0 0 auto !important;
align-items: center !important;
visibility: visible !important;
opacity: 1 !important;
}
html.srh-scrolled body
.whb-general-header
.whb-col-center {
display: flex !important;
flex: 1 1 auto !important;
align-items: center !important;
width: auto !important;
max-width: none !important;
min-width: 220px !important;
visibility: visible !important;
opacity: 1 !important;
}
html.srh-scrolled body
.whb-general-header
.wd-header-nav,
html.srh-scrolled body
.whb-general-header
.wd-header-menu,
html.srh-scrolled body
.whb-general-header
.wd-nav,
html.srh-scrolled body
.whb-general-header
ul.menu,
html.srh-scrolled body
.whb-general-header
.srh-top-menu,
html.srh-scrolled body
.whb-general-header
.srh-top-relocated {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
pointer-events: none !important;
}
html.srh-scrolled body
.whb-general-header
.wd-search-form,
html.srh-scrolled body
.whb-general-header
.searchform,
html.srh-scrolled body
.whb-general-header
form[role="search"],
html.srh-scrolled body
.whb-general-header
.wd-header-search-form {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;
width: 100% !important;
max-width: none !important;
animation:
srhStickySearchIn
.36s
cubic-bezier(.2,.75,.2,1)
both !important;
}
html.srh-scrolled body
.whb-general-header
.srh-sticky-search-copy,
html.srh-scrolled body
.whb-general-header
.srh-sticky-search-native {
display: flex !important;
flex: 1 1 auto !important;
align-items: center !important;
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
margin: 0 !important;
visibility: visible !important;
opacity: 1 !important;
}
html.srh-scrolled body
.whb-general-header
input[type="search"],
html.srh-scrolled body
.whb-general-header
input[type="text"],
html.srh-scrolled body
.whb-general-header
.search-field {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
width: 100% !important;
height: 46px !important;
min-height: 46px !important;
padding-left: 18px !important;
padding-right: 58px !important;
border:
1px solid rgba(222,182,106,.46) !important;
border-radius: 14px !important;
color: #2b241b !important;
-webkit-text-fill-color: #2b241b !important;
background:
linear-gradient(
180deg,
#fff,
#f8f5ef
) !important;
box-shadow:
0 9px 24px rgba(0,0,0,.22),
inset 0 1px 0 #fff,
0 0 0 1px rgba(214,169,82,.035) !important;
font-size: 13px !important;
font-weight: 600 !important;
}
html.srh-scrolled body
.whb-general-header
input[type="search"]::placeholder,
html.srh-scrolled body
.whb-general-header
input[type="text"]::placeholder,
html.srh-scrolled body
.whb-general-header
.search-field::placeholder {
color: #827667 !important;
-webkit-text-fill-color: #827667 !important;
opacity: 1 !important;
}
html.srh-scrolled body
.whb-general-header
.searchsubmit,
html.srh-scrolled body
.whb-general-header
.wd-searchsubmit,
html.srh-scrolled body
.whb-general-header
button[type="submit"] {
color: #e8c477 !important;
-webkit-text-fill-color: #e8c477 !important;
background:
linear-gradient(
145deg,
#17130e,
#2d251a
) !important;
border:
1px solid rgba(224,185,108,.46) !important;
border-radius: 11px !important;
box-shadow:
0 6px 15px rgba(0,0,0,.24),
inset 0 1px 0 rgba(255,255,255,.055) !important;
}
/*
* Account dropdown hover bridge.
* The transparent area connects the account button and dropdown.
*/
html body .wd-header-my-account {
position: relative !important;
}
html body .wd-header-my-account::after {
content: "" !important;
position: absolute !important;
top: 100% !important;
right: -8px !important;
display: block !important;
width: 278px !important;
height: 22px !important;
background: transparent !important;
pointer-events: auto !important;
z-index: 999990 !important;
}
html body
.wd-header-my-account
.wd-dropdown,
html body
.wd-header-my-account
.wd-dropdown-menu,
html body .wd-dropdown-my-account {
min-width: 252px !important;
padding: 10px !important;
overflow: hidden !important;
border:
1px solid rgba(224,184,106,.38) !important;
border-radius: 18px !important;
color: #eee2ce !important;
background:
radial-gradient(
circle at 12% -15%,
rgba(220,174,86,.17),
transparent 40%
),
linear-gradient(
155deg,
#1a1712,
#0c0b09
) !important;
box-shadow:
0 22px 48px rgba(0,0,0,.36),
inset 0 1px 0 rgba(255,255,255,.045) !important;
backdrop-filter:
blur(16px)
saturate(120%) !important;
-webkit-backdrop-filter:
blur(16px)
saturate(120%) !important;
}
html body
.wd-header-my-account:hover
.wd-dropdown,
html body
.wd-header-my-account:hover
.wd-dropdown-menu,
html body
.wd-header-my-account:hover
.wd-dropdown-my-account,
html body
.wd-header-my-account.srh-account-open
.wd-dropdown,
html body
.wd-header-my-account.srh-account-open
.wd-dropdown-menu,
html body
.wd-header-my-account.srh-account-open
.wd-dropdown-my-account,
html body
.wd-header-my-account
.wd-dropdown:hover,
html body
.wd-header-my-account
.wd-dropdown-menu:hover,
html body
.wd-header-my-account
.wd-dropdown-my-account:hover {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
pointer-events: auto !important;
transform: translateY(0) !important;
}
html body
.wd-header-my-account
.wd-dropdown ul,
html body
.wd-dropdown-my-account ul {
margin: 0 !important;
padding: 0 !important;
}
html body
.wd-header-my-account
.wd-dropdown li,
html body
.wd-dropdown-my-account li {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
}
html body
.wd-header-my-account
.wd-dropdown
a.srh-account-link,
html body
.wd-dropdown-my-account
a.srh-account-link {
display: flex !important;
align-items: center !important;
gap: 10px !important;
min-height: 42px !important;
margin: 2px 0 !important;
padding: 0 12px !important;
border: 1px solid transparent !important;
border-radius: 11px !important;
color: #eadfcf !important;
-webkit-text-fill-color: #eadfcf !important;
background: transparent !important;
font-family:
"Noto Sans Georgian",
"FiraGO",
Arial,
sans-serif !important;
font-size: 12.5px !important;
line-height: 1.2 !important;
font-weight: 700 !important;
text-decoration: none !important;
transition:
transform .2s ease,
color .2s ease,
border-color .2s ease,
background .2s ease !important;
}
html body
.wd-header-my-account
.wd-dropdown
a.srh-account-link:hover,
html body
.wd-dropdown-my-account
a.srh-account-link:hover {
transform: translateX(3px) !important;
border-color:
rgba(229,190,113,.34) !important;
color: #f4d694 !important;
-webkit-text-fill-color: #f4d694 !important;
background:
linear-gradient(
135deg,
rgba(225,180,96,.15),
rgba(225,180,96,.045)
) !important;
}
html body .srh-account-icon {
display: inline-flex !important;
flex: 0 0 25px !important;
align-items: center !important;
justify-content: center !important;
width: 25px !important;
min-width: 25px !important;
height: 25px !important;
border:
1px solid rgba(227,187,108,.27) !important;
border-radius: 8px !important;
color: #e7c477 !important;
background: rgba(226,183,100,.075) !important;
}
html body .srh-account-icon svg {
display: block !important;
width: 14px !important;
height: 14px !important;
fill: none !important;
stroke: currentColor !important;
stroke-width: 1.8 !important;
stroke-linecap: round !important;
stroke-linejoin: round !important;
}
@keyframes srhTradeSheen {
0%,
58% {
left: -44%;
opacity: 0;
}
66% {
opacity: 1;
}
84% {
left: 118%;
opacity: .78;
}
100% {
left: 118%;
opacity: 0;
}
}
@keyframes srhRobotFloat {
0%,
100% {
transform: translateY(0) rotate(0deg);
}
50% {
transform: translateY(-.8px) rotate(-1.4deg);
}
}
@keyframes srhBrushSpin {
to {
transform: rotate(360deg);
}
}
@keyframes srhTopItemIn {
from {
opacity: 0;
transform: translateY(-5px) scale(.975);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
@keyframes srhPhoneGlow {
0%,
100% {
filter: brightness(1);
}
50% {
filter: brightness(1.10);
}
}
@keyframes srhStickySearchIn {
from {
opacity: 0;
transform: translateY(-7px) scale(.992);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
@keyframes srhBookSpark {
0%,
100% {
opacity: .52;
}
50% {
opacity: 1;
}
}
@keyframes srhSocialIn {
from {
opacity: 0;
transform: translateY(-5px) scale(.92);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
}
@media (min-width: 1025px) and (max-width: 1450px) {
html.srh-ready body
.whb-header-bottom
.whb-col-left,
html.srh-ready body .srh-actions {
gap: 8px !important;
}
html.srh-ready body .srh-service {
min-width: 108px !important;
}
html.srh-ready body .srh-trade {
min-width: 140px !important;
}
html.srh-ready body .srh-tech {
min-width: 252px !important;
padding-right: 11px !important;
}
html.srh-ready body .srh-action-label {
font-size: 10.8px !important;
}
html.srh-ready body
.srh-tech
.srh-action-label {
font-size: 10.2px !important;
}
html.srh-ready body .srh-icon-box {
width: 27px !important;
min-width: 27px !important;
height: 27px !important;
flex-basis: 27px !important;
}
html.srh-ready body .srh-book-icon {
width: 28px !important;
min-width: 28px !important;
height: 28px !important;
flex-basis: 28px !important;
}
html.srh-ready body .srh-top-menu {
gap: 4px !important;
}
html.srh-ready body .srh-top-link {
padding-right: 8px !important;
font-size: 10.5px !important;
gap: 4px !important;
}
html.srh-ready body .srh-top-icon {
width: 22px !important;
min-width: 22px !important;
height: 22px !important;
flex-basis: 22px !important;
}
html.srh-ready body
.whb-top-bar
.whb-col-right {
gap: 5px !important;
}
html.srh-ready body .srh-top-icon {
display: none !important;
}
html.srh-ready body
.whb-top-bar
.whb-col-right::before {
padding: 0 9px !important;
font-size: 9.8px !important;
}
html.srh-ready body
.whb-top-bar
.wd-social-icon {
width: 24px !important;
min-width: 24px !important;
height: 24px !important;
flex-basis: 24px !important;
}
}
@media (min-width: 1025px) and (max-width: 1200px) {
html.srh-ready body .srh-top-menu {
gap: 2px !important;
}
html.srh-ready body .srh-top-link {
min-height: 30px !important;
padding: 0 6px !important;
gap: 0 !important;
font-size: 10px !important;
}
html.srh-ready body .srh-top-icon {
display: none !important;
}
html.srh-ready body
.whb-header-bottom
.whb-col-left,
html.srh-ready body .srh-actions {
gap: 6px !important;
}
html.srh-ready body .srh-action {
height: 42px !important;
min-height: 42px !important;
padding-left: 6px !important;
padding-right: 9px !important;
gap: 6px !important;
}
html.srh-ready body .srh-actions {
height: 42px !important;
min-height: 42px !important;
}
html.srh-ready body .srh-service {
min-width: 99px !important;
}
html.srh-ready body .srh-trade {
min-width: 128px !important;
}
html.srh-ready body .srh-tech {
min-width: 225px !important;
}
html.srh-ready body .srh-book-icon {
width: 26px !important;
min-width: 26px !important;
height: 26px !important;
flex-basis: 26px !important;
}
html.srh-ready body
.srh-tech
.srh-action-label {
font-size: 9.5px !important;
}
}
@media (max-width: 1024px) {
html body .srh-actions,
html body .srh-top-menu,
html body .srh-top-item,
html body .srh-top-icon,
html body .srh-top-relocated,
html body .srh-service-sentinel,
html body .whb-top-bar,
html body
.whb-header-bottom
.whb-col-center {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
pointer-events: none !important;
overflow: hidden !important;
}
html body
.whb-header-bottom
.whb-col-left {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;
}
}
@media (prefers-reduced-motion: reduce) {
html body .srh-trade-sheen,
html body .srh-robot-disc,
html body .srh-robot-brush,
html body .srh-book-spark,
html body .srh-social,
html body .srh-top-item,
html body
.whb-top-bar
.whb-col-right::before,
html.srh-scrolled body
.whb-general-header
.wd-search-form,
html.srh-scrolled body
.whb-general-header
.searchform {
animation: none !important;
}
}
@media (min-width: 1025px) {
html body .whb-header-bottom .srh-bottom-source-item,
html body .whb-header-bottom .srh-legacy-service,
html body .whb-header-bottom .srh-service-sentinel,
html body .whb-header-bottom #menu-item-1960,
html body .whb-header-bottom #menu-item-1856,
html body .whb-header-bottom #menu-item-1855,
html body .whb-header-bottom #menu-item-1857,
html body .whb-header-bottom #menu-item-1858,
html body .whb-header-bottom #menu-item-1859,
html body .whb-header-bottom #sr-tradein-item,
html body .whb-header-bottom #sr-technology-news-item {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
width: 0 !important;
min-width: 0 !important;
max-width: 0 !important;
height: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
pointer-events: none !important;
}
html.srh-ready body .srh-action.srh-tech {
min-width: 0 !important;
width: auto !important;
}
/* Blog uses the exact same premium surface as the other Srobota action buttons. */
html.srh-ready body .srh-action.srh-blog {
display: inline-flex !important;
flex: 0 0 auto !important;
min-width: 104px !important;
width: auto !important;
padding-right: 13px !important;
visibility: visible !important;
opacity: 1 !important;
pointer-events: auto !important;
}
html.srh-ready body .srh-blog-icon {
flex-basis: 30px !important;
width: 30px !important;
min-width: 30px !important;
height: 30px !important;
}
html.srh-ready body .srh-top-menu {
gap: 7px !important;
}
html.srh-ready body .srh-top-item {
min-width: 0 !important;
}
html.srh-ready body .srh-top-link {
min-height: 36px !important;
height: 36px !important;
gap: 7px !important;
padding: 0 9px 0 6px !important;
color: #f4ead8 !important;
-webkit-text-fill-color: #f4ead8 !important;
background: linear-gradient(145deg,#1b1813,#0b0a08) !important;
border: 1px solid rgba(193,148,73,.48) !important;
border-radius: 10px !important;
box-shadow: inset 0 1px 0 rgba(255,255,255,.035),0 4px 11px rgba(0,0,0,.22) !important;
font-size: 10.4px !important;
font-weight: 780 !important;
text-shadow: 0 1px 3px rgba(0,0,0,.58) !important;
}
html.srh-ready body .srh-top-link,
html.srh-ready body .srh-top-link > span:not(.srh-top-icon),
html.srh-ready body .srh-top-link .nav-link-text {
color: #f4ead8 !important;
-webkit-text-fill-color: #f4ead8 !important;
}
html.srh-ready body .srh-top-link:hover {
color: #fff !important;
-webkit-text-fill-color: #fff !important;
background: linear-gradient(145deg,#2c2318,#110e0a) !important;
border-color: rgba(221,173,84,.84) !important;
box-shadow: inset 0 1px 0 rgba(255,255,255,.05),0 7px 16px rgba(0,0,0,.28),0 0 12px rgba(193,148,73,.08) !important;
transform: translateY(-1px) !important;
}
html.srh-ready body .srh-top-icon {
display: inline-flex !important;
flex: 0 0 24px !important;
align-items: center !important;
justify-content: center !important;
width: 24px !important;
min-width: 24px !important;
height: 24px !important;
color: #d9ad5d !important;
background: rgba(193,148,73,.08) !important;
border: 1px solid rgba(193,148,73,.42) !important;
border-radius: 8px !important;
}
html.srh-ready body .srh-top-icon svg {
width: 14px !important;
height: 14px !important;
}
}
@media (min-width: 1025px) and (max-width: 1200px) {
html.srh-ready body .srh-top-menu {
gap: 3px !important;
}
html.srh-ready body .srh-top-link {
min-height: 32px !important;
height: 32px !important;
gap: 0 !important;
padding: 0 5px !important;
font-size: 9.3px !important;
}
html.srh-ready body .srh-top-icon {
display: none !important;
}
html.srh-ready body .srh-action.srh-blog {
min-width: 88px !important;
}
html.srh-ready body .srh-blog-icon {
width: 26px !important;
min-width: 26px !important;
height: 26px !important;
flex-basis: 26px !important;
}
}