/*
 * Header core – the navigation, dropdown and off-canvas rules the header
 * elements rely on. In the Woodmart theme these live in its global stylesheet
 * (css/parts/base.css + base-deferred.css), which every other theme lacks:
 * without them menus stack vertically and the mobile menu panel never slides in.
 *
 * Only header-related rules are taken, so the active theme's own typography,
 * forms and layout are left alone. Icon font renamed to techbolic-icons.
 */

@keyframes wd-fadeIn{from{opacity:0}to{opacity:1}}
@keyframes wd-rotate{100%{transform:rotate(360deg)}}

.wd-fill{position:absolute;inset:0}

/* Colour schemes: "light" = light text on a dark background (dropdowns, mobile panel, social icons) */
[class*=color-scheme-light]{--color-white: #000;--color-gray-100: rgba(255, 255, 255, 0.1);--color-gray-200: rgba(255, 255, 255, 0.2);--color-gray-300: rgba(255, 255, 255, 0.5);--color-gray-400: rgba(255, 255, 255, 0.6);--color-gray-500: rgba(255, 255, 255, 0.7);--color-gray-600: rgba(255, 255, 255, 0.8);--color-gray-700: rgba(255, 255, 255, 0.9);--color-gray-800: #FFF;--color-gray-900: #FFF;--color-black-rgb: 255, 255, 255;--bgcolor-black-rgb: 255, 255, 255;--bgcolor-white-rgb: 0, 0, 0;--bgcolor-white: rgb(6%, 6%, 6%);--bgcolor-gray-100: rgb(4%, 4%, 4%);--bgcolor-gray-200: rgb(7%, 7%, 7%);--bgcolor-gray-300: rgb(8%, 8%, 8%);--brdcolor-gray-200: rgba(255, 255, 255, 0.1);--brdcolor-gray-300: rgba(255, 255, 255, 0.15);--brdcolor-gray-400: rgba(255, 255, 255, 0.25);--brdcolor-gray-500: rgba(255, 255, 255, 0.3);--wd-text-color: rgba(255, 255, 255, 0.8);--wd-title-color: #FFF;--wd-entities-title-color: #FFF;--wd-entities-title-color-hover: rgba(255, 255, 255, 0.8);--wd-link-color: rgba(255, 255, 255, 0.9);--wd-link-color-hover: #FFF;--wd-form-brd-color: rgba(255, 255, 255, 0.2);--wd-form-brd-color-focus: rgba(255, 255, 255, 0.3);--wd-form-placeholder-color: rgba(255, 255, 255, 0.6);--wd-main-bgcolor: #1a1a1a;--wd-navigation-color: 255, 255, 255;color:var(--wd-text-color)}
.color-scheme-dark{--color-white: #FFF;--color-gray-100: #f7f7f7;--color-gray-200: #f1f1f1;--color-gray-300: #bbb;--color-gray-400: #a5a5a5;--color-gray-500: #767676;--color-gray-600: #666;--color-gray-700: #555;--color-gray-800: #333;--color-gray-900: #242424;--color-black-rgb: 0, 0, 0;--bgcolor-white: #FFF;--bgcolor-gray-100: #f7f7f7;--bgcolor-gray-200: #f7f7f7;--bgcolor-gray-300: #f1f1f1;--bgcolor-black-rgb: 0, 0, 0;--bgcolor-white-rgb: 255, 255, 255;--brdcolor-gray-200: rgba(0, 0, 0, 0.075);--brdcolor-gray-300: rgba(0, 0, 0, 0.105);--brdcolor-gray-400: rgba(0, 0, 0, 0.12);--brdcolor-gray-500: rgba(0, 0, 0, 0.2);--wd-text-color: #767676;--wd-title-color: #242424;--wd-entities-title-color: #333;--wd-link-color: #333;--wd-link-color-hover: #242424;--wd-form-brd-color: rgba(0, 0, 0, 0.1);--wd-form-brd-color-focus: rgba(0, 0, 0, 0.15);--wd-form-placeholder-color: #767676;--wd-navigation-color: 51, 51, 51;color:var(--wd-text-color)}

/* Scroll areas */
.wd-scroll-content{overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:var(--wd-scroll-h, 50dvh)}
.wd-scroll{--scrollbar-track-bg: rgba(var(--color-black-rgb), 0.05);--scrollbar-thumb-bg: rgba(var(--color-black-rgb), 0.12)}
.wd-scroll ::-webkit-scrollbar{width:5px}
.wd-scroll ::-webkit-scrollbar-track{background-color:var(--scrollbar-track-bg)}
.wd-scroll ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb-bg)}

/* List resets – themes add margins/padding/bullets to every ul and li */
:is(.wd-nav,.wd-sub-menu,.wd-sub-menu ul){margin:0;padding:0;list-style:none}
:is(.wd-nav,.wd-sub-menu) li{margin:0;padding:0}
:is(.wd-nav,.wd-sub-menu) li:before{content:none}

/* Navigation */
.wd-nav{--list-mb: 0;--li-mb: 0;--li-pl: 0;--nav-gap: 20px;--nav-gap-v: 5px;--nav-pd: 5px 0;--nav-color: rgba(var(--wd-navigation-color), 1);--nav-color-hover: rgba(var(--wd-navigation-color), .7);--nav-color-active: var(--nav-color-hover);--nav-bg: none;--nav-bg-hover: var(--nav-bg);--nav-bg-active: var(--nav-bg-hover);--nav-shadow: none;--nav-shadow-hover: var(--nav-shadow);--nav-shadow-active: var(--nav-shadow-hover);--nav-border: none;--nav-border-hover: var(--nav-border);--nav-border-active: var(--nav-border-hover);--nav-radius: var(--wd-brd-radius);--nav-chevron-color: rgba(var(--wd-navigation-color), .5);display:inline-flex;flex-wrap:wrap;justify-content:var(--text-align, var(--wd-align));text-align:start;gap:var(--nav-gap-v) var(--nav-gap);list-style:none}
.wd-nav>li{position:relative}
.wd-nav>li>a{position:relative;display:flex;align-items:center;min-height:42px;padding:var(--nav-pd);text-transform:uppercase;font-weight:600;font-size:13px;line-height:1.4;text-decoration:none;color:var(--nav-color);background-color:var(--nav-bg);box-shadow:var(--nav-shadow);border:var(--nav-border);border-radius:var(--nav-radius)}
.wd-nav>li>a .wd-nav-icon{margin-inline-end:7px;font-size:var(--nav-icon-size, 1.15em)}
.wd-nav>li>a .menu-label{inset-inline-start:calc(100% - 30px);margin-inline-start:0}
.wd-nav>li:is(.wd-has-children,.menu-item-has-children)>a:after{order:3;margin-inline-start:4px;font-weight:normal;font-style:normal;font-size:clamp(6px,50%,18px);color:var(--nav-chevron-color);content:"\f129";font-family:"techbolic-icons"}
.wd-nav:where(:not(.wd-dis-hover))>li:where(.wd-opened,:hover)>a{color:var(--nav-color-hover);background-color:var(--nav-bg-hover);box-shadow:var(--nav-shadow-hover);border:var(--nav-border-hover)}
.wd-nav:where(:not(.wd-dis-act))>li:where(.current-menu-item,.wd-active,.active)>a{color:var(--nav-color-active);background-color:var(--nav-bg-active);box-shadow:var(--nav-shadow-active);border:var(--nav-border-active)}
.wd-nav:where(.wd-add-pd){--nav-pd: 5px 12px}
.wd-nav.wd-gap-m{--nav-gap: 30px}
.wd-nav.wd-gap-l{--nav-gap: 40px}
.wd-nav.wd-icon-right>li>a :is(.wd-nav-img,.wd-nav-icon){order:1;margin:0;margin-inline-start:7px}
.wd-nav.wd-style-default{--nav-color-hover: var(--wd-primary-color)}
@media(max-width: 1024px){.wd-nav-wrapper.wd-mb-action-swipe{overflow-y:hidden;-webkit-overflow-scrolling:touch;white-space:nowrap;-webkit-mask-image:linear-gradient(to left, transparent, #000 70px);mask-image:linear-gradient(to left, transparent, #000 70px)}.wd-nav-wrapper.wd-mb-action-swipe .wd-nav{flex-wrap:nowrap}}

.wd-nav-img{flex:0 0 auto;display:inline-block;width:var(--nav-img-width, auto) !important;height:var(--nav-img-height, auto) !important;max-height:var(--nav-img-height, 18px);margin-inline-end:7px;object-fit:contain;object-position:50% 50%;line-height:0}
picture.wd-nav-img img{width:inherit;height:inherit;max-height:inherit;object-fit:contain;object-position:50% 50%}

/* Sub menus */
.wd-sub-menu{--sub-menu-color: rgb(51.27%, 51.27%, 51.27%);--sub-menu-color-hover: var(--wd-primary-color);--li-pl: 0;--list-mb: 0;--li-mb: 0;list-style:none}
.wd-sub-menu ul{--list-mb: 0;--li-mb: 0;--li-pl: 0;list-style:none}
.wd-sub-menu li{position:relative}
.wd-sub-menu li>a{position:relative;display:flex;align-items:center;padding-top:8px;padding-bottom:8px;color:var(--sub-menu-color);font-size:14px;line-height:1.3;text-decoration:none}
.wd-sub-menu li>a img{flex:0 0 auto;display:inline-block;width:var(--nav-img-width, auto) !important;height:var(--nav-img-height, auto) !important;max-height:var(--nav-img-height, 18px);margin-inline-end:7px;object-fit:contain;object-position:50% 50%;line-height:0}
.wd-sub-menu li>a .wd-nav-icon{margin-inline-end:7px;font-size:115%}
.wd-sub-menu li>a .menu-label{position:relative;margin-top:-20px;align-self:flex-start}
.wd-sub-menu li>a:hover{color:var(--sub-menu-color-hover)}
[class*=color-scheme-light] .wd-sub-menu{--sub-menu-color: rgba(255, 255, 255, 0.6);--sub-menu-color-hover: #FFF}

/* Dropdowns */
.wd-dropdown{--wd-dropdown-bg-color: var(--bgcolor-white);--wd-dropdown-shadow: 0 0 3px rgba(0, 0, 0, 0.15);--wd-align: var(--wd-start);position:absolute;top:100%;left:0;z-index:380;margin-top:15px;margin-right:0;margin-left:calc(var(--nav-gap, 0.001px)/2*-1);background-color:var(--wd-dropdown-bg-color);background-position:bottom right;background-clip:border-box;background-repeat:no-repeat;box-shadow:var(--wd-dropdown-shadow);text-align:var(--wd-align);border-radius:var(--wd-brd-radius);visibility:hidden;opacity:0;transition:opacity .4s cubic-bezier(0.19, 1, 0.22, 1),visibility .4s cubic-bezier(0.19, 1, 0.22, 1),transform .4s cubic-bezier(0.19, 1, 0.22, 1);transform:translateY(15px) translateZ(0);pointer-events:none}
.wd-dropdown:after{content:"";position:absolute;inset-inline:0;bottom:100%;height:15px}
.wd-event-hover:hover>.wd-dropdown,.wd-event-click.wd-opened>.wd-dropdown,.wd-event-hover.wd-opened>.wd-dropdown,.wd-dropdown.wd-opened{visibility:visible;opacity:1;transform:none !important;pointer-events:visible;pointer-events:unset}
.wd-dropdown-menu{min-height:min(var(--wd-dropdown-height, unset),var(--wd-content-h, var(--wd-dropdown-height, unset)));width:var(--wd-dropdown-width);background-image:var(--wd-dropdown-bg-img)}
.wd-dropdown-menu .wd-dropdown-inner{overflow:inherit;height:min(var(--wd-dropdown-height, unset),var(--wd-content-h))}
.wd-dropdown-menu.wd-scroll>.wd-scroll-content{max-height:none;border-radius:inherit}
.wd-dropdown-menu.wd-design-default{padding:var(--wd-dropdown-padding, 12px 20px);--wd-dropdown-width: 220px}
.wd-dropdown-menu.wd-design-default>.container{padding:0;width:auto}
.wd-dropdown-menu.wd-design-default .wd-dropdown{top:0;left:100%;padding:var(--wd-dropdown-padding, 12px 20px);width:var(--wd-dropdown-width);margin:0 0 0 var(--wd-dropdown-padding, 20px)}
.wd-dropdown-menu.wd-design-default .wd-dropdown:after{top:0;right:100%;bottom:0;left:auto;width:var(--wd-dropdown-padding, 20px);height:auto}
.wd-dropdown-menu.wd-design-default .menu-item-has-children>a:after{margin-left:auto;color:rgba(82,82,82,.45);font-weight:600;font-size:55%;line-height:1;font-family:"techbolic-icons";content:"\f113"}
.wd-dropdown-menu.wd-design-default.color-scheme-light .menu-item-has-children>a:after{color:rgba(255,255,255,.6)}
.whb-col-right .wd-dropdown-menu.wd-design-default{right:0;left:auto;margin-left:0;margin-right:calc(var(--nav-gap, 0.001px)/2*-1)}

/* Off-canvas panels (mobile menu, side cart) */
.wd-side-hidden{--wd-side-hidden-w: 340px;position:fixed;inset-block:var(--wd-admin-bar-h) 0;z-index:500;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;width:min(var(--wd-side-hidden-w),100vw);background-color:var(--bgcolor-white);transition:transform .5s cubic-bezier(0.19, 1, 0.22, 1);outline:none !important}
.wd-side-hidden.wd-left{left:0;transform:translate3d(-100%, 0, 0)}
.wd-side-hidden.wd-right{right:0;transform:translate3d(100%, 0, 0)}
.wd-side-hidden.wd-opened{transform:none}
@media(max-width: 1024px){.wd-side-hidden{--wd-side-hidden-w: min(300px, 80vw)}html:has(.wd-side-hidden.wd-opened){overflow:hidden}}

/* Backdrop behind open panels */
.wd-close-side{position:fixed;inset:0;display:block;background-color:rgba(0,0,0,.7);opacity:0;pointer-events:none;transition:opacity .5s cubic-bezier(0.19, 1, 0.22, 1),z-index 0s cubic-bezier(0.19, 1, 0.22, 1) .5s,top 0s cubic-bezier(0.19, 1, 0.22, 1) .5s;z-index:400}
.wd-close-side[class*=wd-location-header]{z-index:389;top:var(--wd-admin-bar-h)}
.wd-close-side.wd-location-sticky-nav{z-index:392}
.wd-close-side.wd-close-side-opened{opacity:1;pointer-events:unset;transition-delay:0s}
@media(max-width: 1024px){.wd-close-side{top:-150px}}

/* Panel heading + close button */
.wd-heading{display:flex;flex:0 0 auto;align-items:center;justify-content:flex-end;gap:10px;padding:20px 15px;border-bottom:1px solid var(--brdcolor-gray-300)}
.wd-heading>a{--wd-link-color: var(--wd-primary-color);--wd-link-color-hover: var(--wd-primary-color)}
.wd-heading>a:hover{opacity:.7}
.wd-heading .title{flex:1 1 auto;margin-bottom:0;font-size:130%}
.wd-heading .wd-action-btn{flex:0 0 auto}
.wd-heading .wd-action-btn.wd-style-text>a{height:25px}

.wd-action-btn{--wd-action-icon-size: 1.1em;--wd-action-color: var(--color-gray-800);--wd-action-color-hover: var(--color-gray-500);--wd-link-decor: none;--wd-link-decor-hover: none;display:inline-flex;vertical-align:middle}
.wd-action-btn>a{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--wd-action-w, unset);height:var(--wd-action-h, unset);gap:.3em;cursor:pointer;line-height:1;transition:none;text-decoration:none}
.wd-action-btn:empty{display:none}
.wd-action-btn.wd-style-icon{--wd-action-icon-size: 20px;--wd-action-w: 50px;--wd-action-h: 50px}
.wd-action-btn.wd-style-icon .wd-action-text{display:none}
.wd-action-icon{position:relative;display:flex;align-items:center;justify-content:center}
.wd-action-icon:before{content:var(--wd-btn-icon, unset);font-size:var(--wd-action-icon-size);color:var(--wd-action-icon-color, var(--wd-action-color));font-weight:400;transition:all .25s ease,opacity .15s ease;font-family:"techbolic-icons"}
.wd-action-text{color:var(--wd-action-text-color, var(--wd-action-color));transition:all .25s ease;font-weight:600}
.wd-action-btn>a:hover .wd-action-icon:before{color:var(--wd-action-icon-color-hover, var(--wd-action-color-hover))}
.wd-action-btn>a:hover .wd-action-text{color:var(--wd-action-text-color-hover, var(--wd-action-color-hover))}
.wd-cross-icon{--wd-btn-icon: "\f112"}
.wd-burger-icon{--wd-btn-icon: "\f15a"}

/*
 * Everything below is scoped to the header, its off-canvas panels and the
 * search overlay: these are generic class names (.text-center, .btn, inputs)
 * and must not restyle the rest of the site.
 */

/* Element alignment options (Left / Center / Right in the builder) */
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) :is(.text-left,.text-center,.text-right),
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]):is(.text-left,.text-center,.text-right){text-align:var(--text-align)}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) .text-center,
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]).text-center{--content-align: center;--wd-align: center;--text-align: center}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) .text-right,
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]).text-right{--content-align: flex-end;--wd-align: flex-end;--text-align: right}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) .text-left,
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]).text-left{--content-align: flex-start;--wd-align: flex-start;--text-align: left}

/* Buttons – the base rule the builder's size / style / colour options feed */
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) :is(.btn,.button,button,[type=submit],[type=button]){position:relative;display:inline-flex;align-items:center;justify-content:center;gap:5px;outline:none;border-radius:var(--btn-brd-radius, 0px);vertical-align:middle;text-align:center;text-decoration:none !important;text-shadow:none;line-height:1.2;cursor:pointer;transition:all .25s ease;color:var(--btn-color, #3E3E3E);border:var(--btn-brd-width, 0px) var(--btn-brd-style, solid) var(--btn-brd-color, #E9E9E9);background-color:var(--btn-bgcolor, #F3F3F3);box-shadow:var(--btn-box-shadow, unset);text-transform:var(--btn-transform, uppercase);font-weight:var(--btn-font-weight, 600);font-family:var(--btn-font-family, inherit);font-style:var(--btn-font-style, unset);padding:var(--btn-padding, 5px 20px);min-height:var(--btn-height, 42px);font-size:var(--btn-font-size, 13px)}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) :is(.btn,.button,button,[type=submit],[type=button]):hover{color:var(--btn-color-hover, var(--btn-color, #3E3E3E));border-color:var(--btn-brd-color-hover, var(--btn-brd-color, #e0e0e0));background-color:var(--btn-bgcolor-hover, var(--btn-bgcolor, #e0e0e0));box-shadow:var(--btn-box-shadow-hover, var(--btn-box-shadow, unset))}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) .btn.btn-default{padding:var(--btn-default-padding, var(--btn-padding, 5px 20px));min-height:var(--btn-default-height, var(--btn-height, 42px));font-size:var(--btn-default-font-size, var(--btn-font-size, 13px));border-radius:var(--btn-default-brd-radius);color:var(--btn-default-color);box-shadow:var(--btn-default-box-shadow);background-color:var(--btn-default-bgcolor);text-transform:var(--btn-default-transform, var(--btn-transform, uppercase));font-weight:var(--btn-default-font-weight, var(--btn-font-weight, 600))}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) .btn.btn-default:hover{color:var(--btn-default-color-hover);box-shadow:var(--btn-default-box-shadow-hover);background-color:var(--btn-default-bgcolor-hover)}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) .btn.btn-accent{padding:var(--btn-accented-padding, var(--btn-padding, 5px 20px));min-height:var(--btn-accented-height, var(--btn-height, 42px));font-size:var(--btn-accented-font-size, var(--btn-font-size, 13px));border-radius:var(--btn-accented-brd-radius);color:var(--btn-accented-color);box-shadow:var(--btn-accented-box-shadow);background-color:var(--btn-accented-bgcolor);text-transform:var(--btn-accented-transform, var(--btn-transform, uppercase));font-weight:var(--btn-accented-font-weight, var(--btn-font-weight, 600))}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) .btn.btn-accent:hover{color:var(--btn-accented-color-hover);box-shadow:var(--btn-accented-box-shadow-hover);background-color:var(--btn-accented-bgcolor-hover)}

/* Search / panel form fields */
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) :is(input[type=text],input[type=search],input[type=email],input[type=number],input[type=tel],input[type=url]){-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 15px;max-width:100%;width:100%;height:var(--wd-form-height, 42px);border:var(--wd-form-brd-width, 1px) solid var(--wd-form-brd-color);border-radius:var(--wd-form-brd-radius, 0);background-color:var(--wd-form-bg);box-shadow:none;color:var(--wd-form-color);vertical-align:middle;font-size:14px;transition:border-color .5s ease}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) :is(input[type=text],input[type=search]):focus{outline:none;border-color:var(--wd-form-brd-color-focus);transition:border-color .4s ease}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) ::placeholder{color:var(--wd-form-placeholder-color)}
:is(.whb-header,.wd-side-hidden,[class*=wd-search-full-screen]) select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 30px 0 15px;height:var(--wd-form-height, 42px);max-width:100%;border:var(--wd-form-brd-width, 1px) solid var(--wd-form-brd-color);background-color:var(--wd-form-bg);background-image:var(--wd-form-chevron);background-position:right 10px top 50%;background-size:auto 18px;background-repeat:no-repeat;color:var(--wd-form-color);font-size:14px}
.wd-clear-search.wd-hide{display:none}
