/* A shared material system, in daylight and after dark. */
:root{--panel:#eeece7;--field:#fffdf9;--soft-surface:rgba(255,255,255,.34);--control-frost:246,244,240;--glass-warm:246,244,240;--control-edge:#ffffffb3;--soft-shadow:#211c1410;--photograph-surface:linear-gradient(145deg,#f0eee980,#e5e2da55)}
:root[data-theme=dark]{color-scheme:dark;--paper:#191b1b;--ink:#f2efe8;--muted:#b6b4ad;--line:#424441;--deep:#f19b61;--orange-text:#f3a16d;--panel:#252827;--field:#202322;--soft-surface:rgba(255,255,255,.035);--control-frost:43,47,45;--glass-warm:27,30,29;--control-edge:#ffffff27;--soft-shadow:#0004;--photograph-surface:linear-gradient(145deg,#e0e4d632,#d3d9cf20)}
::view-transition,::view-transition-group(*),::view-transition-image-pair(*),::view-transition-old(*),::view-transition-new(*){pointer-events:none}
html{scrollbar-color:var(--muted) var(--paper)}
:root[data-theme=dark] img[data-theme-logo]{content:url('assets/dohs-supply-cream.svg')}
.site-header .header-actions{gap:12px}
.theme-toggle{width:66px;height:36px;min-height:36px;flex:none;position:relative;display:flex;align-items:center;justify-content:space-around;padding:0 5px;isolation:isolate;border:1px solid var(--control-edge);border-radius:999px;background:rgba(var(--control-frost),.54);box-shadow:inset 0 1px 1px #fff5,0 2px 6px var(--soft-shadow);touch-action:manipulation}
.theme-toggle svg{width:17px;height:17px;stroke-width:1.5;position:relative;z-index:2;pointer-events:none;color:var(--muted);transition:color .2s}
.theme-toggle>.theme-thumb{position:absolute;z-index:1;left:4px;top:4px;width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#ffffffed,#dfddd3b3);box-shadow:inset 0 1px 1px #fff,0 2px 5px #0002;translate:0 0;transition:translate 520ms cubic-bezier(.22,1,.36,1);pointer-events:none}
.theme-toggle[aria-checked=true]>.theme-thumb{translate:30px 0;background:linear-gradient(135deg,#5c625de6,#3b403bd1);box-shadow:inset 0 1px 1px #ffffff7d,0 2px 5px #0005}
.theme-toggle[aria-checked=false] .theme-sun{color:#33382f}.theme-toggle[aria-checked=true] .theme-moon{color:#f6f4ed}
.theme-toggle .glass-frost{background:rgba(var(--control-frost),.6)}
html[data-theme-changing=reveal]::view-transition-old(root),html[data-theme-changing=reveal]::view-transition-new(root){animation:none;mix-blend-mode:normal}
html[data-theme-changing=reveal]::view-transition-new(root){z-index:2}
html[data-theme-changing=reveal]::view-transition-old(root){z-index:1}
html[data-theme-changing="reveal"]::view-transition-group(root) {
  animation: none;
  z-index: 0;
}
html[data-theme-changing="reveal"] .theme-thumb {
  view-transition-name: dohs-theme-thumb;
  transition: none;
}
html[data-theme-changing="reveal"] .theme-sun {
  view-transition-name: dohs-theme-sun;
}
html[data-theme-changing="reveal"] .theme-moon {
  view-transition-name: dohs-theme-moon;
}
html[data-theme-changing="reveal"]::view-transition-group(dohs-theme-thumb) {
  z-index: 1;
  animation-duration: 520ms;
  animation-timing-function: cubic-bezier(.22,1.18,.36,1);
}
html[data-theme-changing="reveal"]::view-transition-group(dohs-theme-sun),
html[data-theme-changing="reveal"]::view-transition-group(dohs-theme-moon) {
  z-index: 2;
  animation-duration: 180ms;
}
html[data-theme-changing="reveal"]::view-transition-old(dohs-theme-thumb) {
  display: none;
}
html[data-theme-changing="reveal"]::view-transition-new(dohs-theme-thumb) {
  animation: none;
}
html[data-theme-changing="reveal"]::view-transition-image-pair(dohs-theme-thumb) {
  transform-origin: center;
  animation: theme-thumb-liquid 520ms cubic-bezier(.22,.65,.3,1) both;
}
@keyframes theme-thumb-liquid {
  0%,100% { scale: 1 1; }
  28% { scale: 1.16 .86; }
  72% { scale: .94 1.05; }
  88% { scale: 1.02 .99; }
}

html[data-page-transition] #main{view-transition-name:supply-page}
html[data-page-transition]::view-transition-group(root){animation:none}
html[data-page-transition]::view-transition-old(root){animation:none;opacity:0}
html[data-page-transition]::view-transition-new(root){animation:none;mix-blend-mode:normal}
html[data-page-transition]::view-transition-group(supply-page){animation-duration:380ms;animation-timing-function:cubic-bezier(.22,1,.36,1)}
html[data-page-transition]::view-transition-old(supply-page){animation:page-leave 180ms ease-out both;mix-blend-mode:normal}
html[data-page-transition]::view-transition-new(supply-page){animation:page-arrive 420ms cubic-bezier(.22,1,.36,1) both;mix-blend-mode:normal}
@keyframes page-leave{to{opacity:0;transform:translateY(-8px)}}
@keyframes page-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

/* Controls share a glass carrier; controls with a single glyph stay circular. */
button[data-glass=action]:not(.btn){isolation:isolate;border:1px solid var(--control-edge);border-radius:999px;background:transparent;box-shadow:inset 0 1px 1px #ffffff47,0 2px 6px var(--soft-shadow);padding:8px 14px;min-height:40px;color:var(--ink);text-decoration:none;transition:box-shadow .2s,transform .22s cubic-bezier(.2,1.3,.4,1)}
button[data-glass=action]:not(.btn) .glass-frost{background:rgba(var(--control-frost),.5);box-shadow:inset 0 1px 1px #ffffff52,inset 0 -1px 1px #0001}
button[data-glass=action]:not(.btn):hover{box-shadow:inset 0 1px 1px #ffffff80,0 4px 10px var(--soft-shadow)}
button[data-glass=action]:not(.btn):active{transform:scale(.94)}
button[data-glass=action]:disabled{opacity:.4;transform:none}
.header-search button[data-glass],.icon-button[data-glass],.quick-add[data-glass],.quantity-actions>button[data-change][data-glass],.image-zoom[data-glass]{width:44px;height:44px;min-width:44px;max-width:44px;min-height:44px;max-height:44px;flex:0 0 44px;aspect-ratio:1;display:inline-grid;place-items:center;padding:0;border-radius:50%;corner-shape:round;line-height:1}
button.icon-button[data-glass=action],button.quick-add[data-glass=action],button.image-zoom[data-glass=action]{padding:0;display:inline-grid;place-items:center}
.image-zoom[data-glass]{position:absolute}
.quantity-actions{gap:10px;flex-wrap:wrap}.quantity-actions>span{min-width:22px;text-align:center;font-variant-numeric:tabular-nums}.quantity-actions .remove-item[data-glass]{margin-left:8px;font-size:13px;padding:8px 16px;min-height:40px}
.bag-item-info{min-width:0}.bag-item-info>p{overflow-wrap:anywhere}
.compare-choice[data-glass]{font-size:12px;margin-top:12px;padding:7px 13px!important;min-height:36px!important}
.compare-choice[data-glass][aria-pressed=true]{color:var(--deep);border-color:var(--deep)}
.gallery-thumbs button[data-glass=frame],.thumbnails button[data-glass=frame]{isolation:isolate;border-color:var(--line);background:var(--soft-surface);box-shadow:inset 0 1px 1px #fff2}
[data-glass=frame] .glass-frost{background:var(--soft-surface)}
[data-glass=frame] .glass-optical-plane{backdrop-filter:none;-webkit-backdrop-filter:none}
[data-glass]>.sr-only{position:absolute}
.site-header[data-glass] .glass-frost{background:rgba(var(--glass-warm),.76)}
.site-header.is-scrolled[data-glass] .glass-frost{background:rgba(var(--glass-warm),.72)}
.btn.secondary[data-glass] .glass-frost,.btn.light[data-glass] .glass-frost{background:rgba(var(--control-frost),.7)}
.btn.secondary[data-glass],.btn.light[data-glass]{color:var(--ink);border-color:var(--control-edge)}
.btn[data-glass] .glass-frost{background:rgba(34,37,34,.83);box-shadow:inset 0 1px 1px #ffffff45,inset 0 -1px 1px #0004}
.btn[data-glass] .glass-edge{opacity:1}
.builder-feature>.btn[data-glass]{color:#20241f}.builder-feature>.btn[data-glass] .glass-frost{background:rgba(246,244,240,.85)}

/* Every packshot sits on the same translucent frame, with real image alpha. */
.product-picture,.vc-card .product-picture,.family-card .product-picture,.family-card .dark-product,.large-product-image,.dark-product.large-product-image,.fixture-main-image,.retail-hero-image,.bag-item>a,.maker-card>div,.maker-card:nth-child(2)>div{background:var(--photograph-surface);border-color:var(--line);box-shadow:inset 0 1px 1px #ffffff18}
.dark-product .badge{color:var(--muted)}
.product-picture img,.large-product-image>img,.fixture-main-image img,.bag-item img,.thumbnails img,.gallery-thumbs img,.retail-hero-image>img,.saved-item img,.setup-part img,.maker-card img,.setup-visual img,.category-image img,.brand-feature-image img,.rgbw-feature>img{mix-blend-mode:normal}
img[src$="assets/diode/20mm-square-corner-channel-8a3fcdf8.webp"],img[src$="assets/diode/a2-channel-7c84275a.webp"],img[src$="assets/diode/a3-channel-0869609b.webp"],img[src$="assets/diode/di-lk-conn-12jpr-1.webp"],img[src$="assets/diode/magnetic-dimmable-drivers-638580fe.webp"],img[src$="assets/diode/reflector-channel-2e360797.webp"],img[src$="assets/diode/slim-recessed-channel-8c77d688.webp"]{background:#f7f7f4;border-radius:8px;padding:8px}
.inline-accessories .component-image{background:var(--soft-surface)}
.large-product-image>img{cursor:zoom-in}

/* Image expansion takes place inside the browser's accessible modal layer. */
dialog.product-lightbox,#fixture-zoom.product-lightbox{position:fixed;inset:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:75px clamp(20px,5vw,80px) 40px;border:0;border-radius:0;overflow:hidden;background:color-mix(in srgb,var(--paper) 76%,transparent);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
dialog.product-lightbox[open]{display:flex;align-items:center;justify-content:center;flex-direction:column}
dialog.product-lightbox::backdrop{background:#0007;backdrop-filter:blur(10px);animation:lightbox-backdrop-in 360ms ease both}
dialog.product-lightbox[data-motion=closing]::backdrop{animation:lightbox-backdrop-out 260ms ease both}
dialog.product-lightbox>img{display:block;width:100%;height:calc(100dvh - 150px);max-width:1200px;max-height:none;object-fit:contain;margin:0;transform-origin:center;mix-blend-mode:normal}
dialog.product-lightbox>.btn{position:absolute;top:20px;right:24px;z-index:3;margin:0;min-height:44px}
dialog.product-lightbox>p{position:absolute;bottom:14px;left:24px;right:24px;text-align:center;max-width:800px;margin:auto;font-size:12px}
@keyframes lightbox-backdrop-in{from{opacity:0}to{opacity:1}}@keyframes lightbox-backdrop-out{to{opacity:0}}
#mobile-menu[open]{animation:menu-arrive 280ms cubic-bezier(.22,1,.36,1)}
@keyframes menu-arrive{from{opacity:0;transform:translateY(-12px) scale(.98)}to{opacity:1;transform:none}}
.cursor.is-image:not(.is-ink)>span{width:32px;height:32px;background:#df6f2acc;box-shadow:inset 0 1px 1px #fff8,0 0 0 5px #df6f2a16;opacity:1;scale:1;rotate:0deg}
.cursor.is-image>span:after{content:'+';position:absolute;inset:0;display:grid;place-items:center;color:#171917;font:22px/1 var(--sans)}

/* Dark mode is a complete palette, including forms, documents and commerce. */
:root[data-theme=dark] .announcement{background:#111414;color:#e9e6df}
:root[data-theme=dark] :is(.header-search,.search-box){background:#ffffff06;border-color:var(--line)}
:root[data-theme=dark] :is(input,select,textarea){color:var(--ink);border-color:var(--line);background-color:var(--field)}
:root[data-theme=dark] :is(.header-search input,.search-box input){background:transparent}
:root[data-theme=dark] option{background:#252827;color:var(--ink)}
:root[data-theme=dark] :is(.accent,.text-link:hover,.document-links a:hover,.checkout-steps .active){color:var(--deep)}
:root[data-theme=dark] :is(.retail-hero p,.retail-hero-image>div>span,.brand-rail .eyebrow,.card-unit,.product-code,.fixture-details>p,.maker-card p,.help-grid p,.help-faq p,.application-source,.retail-price-note,.spec-grid dt,.document-links small,.document-links>a>span:last-child){color:var(--muted)}
:root[data-theme=dark] :is(.order-summary,.quote-panel,.help-grid>a,.presenter-notes pre,.system-note,.immersive-section,.rgbw-feature,.parts-list>div){background:var(--panel);border-color:var(--line)}
:root[data-theme=dark] :is(.inline-note,#catalog-filters,.form-grid input[readonly]){background:var(--soft-surface);border-color:var(--line)}
:root[data-theme=dark] .document-links>a{background:linear-gradient(145deg,#ffffff08,#ffffff02);border-color:var(--line)}
:root[data-theme=dark] .document-links>a:hover{background:#ffffff0d;border-color:#78776d}
:root[data-theme=dark] :is(.brand-rail,.product-subnav,.fixture-information>section,.spec-grid>div,.filter-panel fieldset,.included-columns,.parts-list>div,.selection-heading,.saved-item,.help-faq details,.comparison-page th,.comparison-page td){border-color:var(--line)}
:root[data-theme=dark] #compare-dock{background:linear-gradient(140deg,#343a36f5,#202621f5);border-color:#ffffff25;box-shadow:inset 0 1px 1px #fff3,0 8px 35px #0006}
:root[data-theme=dark] #mobile-menu{background:#242826;color:var(--ink);box-shadow:inset 0 1px 1px #fff3,0 20px 60px #0007}
:root[data-theme=dark] .check-row input:checked{background:#e99458;border-color:#e99458}
:root[data-theme=dark] .check-row input:checked:after{border-color:#141814}
:root[data-theme=dark] #quote-validation{color:#ffa577}
:root[data-theme=dark] .picture-arrow{background:#313831c9;color:var(--ink)}
:root[data-theme=dark] .builder-feature{border:1px solid var(--line);background:#111614}
:root[data-theme=dark] .btn:not(.secondary):not(.light){border-color:#ffffff36}
:root[data-theme=dark] .image-unavailable{background:#292e29;color:var(--muted)}

@media(max-width:1200px) and (min-width:1001px){.site-header{gap:12px;padding-inline:17px}.site-header .wordmark img{width:134px}.site-header nav{gap:12px}.site-header .header-actions{gap:8px}.header-search{max-width:190px}.saved-link{display:none}.theme-toggle{width:62px}.theme-toggle[aria-checked=true]>.theme-thumb{translate:26px 0}}
@media(max-width:700px){.site-header .wordmark img{width:126px}.site-header .header-actions{gap:6px}.site-header .saved-link{display:none}.theme-toggle{width:60px;height:34px;min-height:34px}.theme-toggle>.theme-thumb{width:24px;height:24px}.theme-toggle[aria-checked=true]>.theme-thumb{translate:26px 0}.theme-toggle svg{width:16px;height:16px}.site-header .icon-button[data-glass]{width:36px;height:36px;min-width:36px;min-height:36px;flex-basis:36px}.bag-button{gap:3px;font-size:12px}.product-lightbox>.btn{right:16px!important;top:16px!important}.quantity-actions{gap:8px}.quantity-actions .remove-item[data-glass]{margin-left:0}.compare-choice[data-glass]{font-size:11px;padding:7px 10px!important}}
@media(max-width:370px){.site-header{padding-inline:11px}.site-header .wordmark img{width:106px}.site-header .header-actions{gap:4px}.theme-toggle{width:54px}.theme-toggle[aria-checked=true]>.theme-thumb{translate:20px 0}.bag-button>svg{display:none}.theme-toggle svg{width:14px;height:14px}.quantity-actions .remove-item{flex-basis:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}::view-transition-old(*),::view-transition-new(*),::view-transition-group(*){animation:none!important}.theme-thumb{transition:none!important}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){[data-glass] .glass-frost{background:var(--panel)!important}.btn:not(.secondary):not(.light)[data-glass] .glass-frost{background:#232723!important}dialog.product-lightbox{background:var(--paper)}}
@media(forced-colors:active){.theme-toggle,.theme-thumb,button[data-glass=action],.btn[data-glass]{background:ButtonFace!important;color:ButtonText!important;border:1px solid ButtonText}.theme-toggle svg{color:ButtonText!important}.theme-thumb{background:Highlight!important}.liquid-surface{display:none!important}dialog.product-lightbox{background:Canvas}}