/* ============ DKS - layout utilities ============
   Elementor boxed containers render as  .e-con > .e-con-inner ,
   and .e-con-inner is the real flex parent. All layout rules below
   therefore target  > .e-con-inner , with a plain fallback for
   non-Elementor markup. */

/* wrappers: Elementor's own boxed width handles max-width, so these are hooks only */
.dks-wrap,.dks-wrap-wide,.dks-wrap-narrow{width:100%}
.dks-center,.dks-center .elementor-widget-container{text-align:center}

/* ---------- grids ---------- */
.dks-grid-2>.e-con-inner,.dks-grid-3>.e-con-inner,.dks-grid-4>.e-con-inner,
.dks-split>.e-con-inner,.dks-split-rev>.e-con-inner,.dks-foot-grid>.e-con-inner{
display:grid;gap:var(--dks-gap);align-items:start;width:100%}
.dks-grid-2>.e-con-inner{grid-template-columns:repeat(2,minmax(0,1fr))}
.dks-grid-3>.e-con-inner{grid-template-columns:repeat(3,minmax(0,1fr))}
.dks-grid-4>.e-con-inner{grid-template-columns:repeat(4,minmax(0,1fr))}
.dks-split>.e-con-inner,.dks-split-rev>.e-con-inner{
grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,4vw,64px);align-items:center}
.dks-foot-grid>.e-con-inner{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:52px clamp(32px,7vw,110px);align-items:start}
.dks-foot-newscol{grid-column:1}
.dks-footer .dks-newsletter{max-width:400px}
.dks-foot-brandcol p,.dks-foot-newscol p{max-width:44ch}
.dks-split-rev>.e-con-inner>*:first-child{order:2}

/* ---------- flex rows / stacks ---------- */
.dks-row>.e-con-inner{display:flex;flex-direction:row;align-items:center;gap:14px;flex-wrap:wrap;width:100%}
.dks-row-between>.e-con-inner{display:flex;flex-direction:row;align-items:center;
justify-content:space-between;gap:20px;flex-wrap:wrap;width:100%}
.dks-stack>.e-con-inner{display:flex;flex-direction:column;align-items:flex-start;gap:12px;width:100%}
.dks-stack-center>.e-con-inner{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%}

/* children must size to the grid/flex track, not stretch to 100% */
.dks-grid-2>.e-con-inner>.e-con,.dks-grid-3>.e-con-inner>.e-con,.dks-grid-4>.e-con-inner>.e-con,
.dks-split>.e-con-inner>.e-con,.dks-split-rev>.e-con-inner>.e-con,.dks-foot-grid>.e-con-inner>.e-con,
.dks-row>.e-con-inner>.e-con,.dks-row-between>.e-con-inner>.e-con{--width:auto;max-width:none;min-width:0}
.dks-row>.e-con-inner>.elementor-widget,.dks-row-between>.e-con-inner>.elementor-widget{width:auto;max-width:100%}

/* remove Elementor's default widget spacing where our CSS owns rhythm */
.dks-tight .elementor-widget:not(:last-child){margin-block-end:0}

/* ---------- search form ---------- */
.dks-searchform{display:flex;align-items:center;position:relative;max-width:280px;width:100%}
.dks-searchform input[type=search]{
background:rgba(255,255,255,.07);border:1px solid rgba(243,237,226,.22);color:var(--dks-cream);
border-radius:var(--dks-pill);min-height:42px;padding:10px 44px 10px 18px;font-size:var(--dks-fs-md);width:100%}
.dks-searchform input[type=search]::placeholder{color:rgba(243,237,226,.55)}
.dks-searchform input[type=search]:focus{border-color:var(--dks-gold-deep);box-shadow:none}
.dks-searchform button{position:absolute;right:6px;top:50%;transform:translateY(-50%);
background:transparent;border:0;color:var(--dks-gold);cursor:pointer;padding:8px;display:flex;min-height:0}
.dks-searchform button:hover{color:var(--dks-cream)}

/* ---------- chips ---------- */
a.dks-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(233,185,97,.45);
background:rgba(233,185,97,.1);color:var(--dks-cream);padding:9px 15px;border-radius:var(--dks-pill);
font-size:var(--dks-fs-sm);font-weight:600;letter-spacing:var(--dks-ls-sm);min-height:42px;text-decoration:none;
transition:background var(--dks-dur) ease,color var(--dks-dur) ease}
a.dks-chip:hover{background:rgba(233,185,97,.24);color:var(--dks-gold)}
a.dks-chip .dks-cart-count{color:var(--dks-gold);font-weight:700}
.dks-account-chip span{white-space:nowrap}

/* ---------- Elementor renders icons as inline SVG: follow text colour ---------- */
.elementor-icon svg,.elementor-icon-list-icon svg,.elementor-button-icon svg,.dks-cat-tile svg{fill:currentColor}
.dks-cat-tile .elementor-icon{font-size:40px;color:var(--dks-gold-large)}
.dks-cat-tile .elementor-icon svg{width:1em;height:1em}
.dks-cat-tile:hover .elementor-icon{color:var(--dks-ink)}

/* ---------- page head extras ---------- */
.dks-pagehead-crumb{font-size:var(--dks-fs-xs);letter-spacing:var(--dks-ls-lg);text-transform:uppercase;color:rgba(243,237,226,.55)}

/* ---------- cart shipping nudge ---------- */
.dks-ship-note{background:var(--dks-cream);border:1px dashed var(--dks-gold-deep);border-radius:var(--dks-radius);
padding:13px 18px;margin-bottom:18px;font-size:var(--dks-fs-md);color:var(--dks-text)}
.dks-ship-note--ok{border-style:solid;background:rgba(46,83,68,.08);border-color:var(--dks-green-1)}
.dks-ship-note .amount{font-weight:700}

/* ---------- 404 ---------- */
body.error404 .site-content,body.error404 #primary,body.error404 .content-area{
background:var(--dks-hero);min-height:60vh;display:flex;align-items:center;justify-content:center;
text-align:center;padding:clamp(50px,8vw,110px) var(--dks-pad)}
body.error404 .page-title,body.error404 h1{color:var(--dks-gold);font-weight:800;letter-spacing:var(--dks-ls-0);
text-transform:uppercase;font-size:var(--dks-fs-h1);line-height:1.06}
body.error404 p,body.error404 .page-content{color:rgba(243,237,226,.72)}
body.error404 .search-form input[type=search]{background:rgba(255,255,255,.08);border-color:rgba(243,237,226,.22);color:var(--dks-cream)}
body.error404 a{color:var(--dks-gold)}

/* ---------- REA nav menu ---------- */
.dks-nav .wpr-nav-menu>li>a.wpr-menu-item,.dks-nav .wpr-nav-menu li a{
font-family:var(--dks-font);font-size:var(--dks-fs-md);font-weight:500;color:var(--dks-cream);
padding:10px 0;text-transform:none;letter-spacing:var(--dks-ls-0);background:transparent}
.dks-nav .wpr-nav-menu>li{margin-inline:16px}
.dks-nav .wpr-nav-menu>li>a.wpr-menu-item:hover,
.dks-nav .wpr-nav-menu>li.current-menu-item>a.wpr-menu-item{color:var(--dks-gold)}
.dks-nav .wpr-sub-menu{background:var(--dks-ink-2);border:1px solid rgba(233,185,97,.22)}
.dks-nav .wpr-sub-menu li a{color:rgba(243,237,226,.82);font-size:var(--dks-fs-md);padding:12px 16px}
.dks-nav .wpr-sub-menu li a:hover{color:var(--dks-gold);background:rgba(233,185,97,.1)}
.dks-nav .wpr-mobile-toggle span,.dks-nav .wpr-mobile-toggle-wrap .wpr-mobile-toggle span{background:var(--dks-gold)}
.dks-nav .wpr-mobile-menu{background:var(--dks-ink-2)}
.dks-nav .wpr-mobile-menu li a{color:var(--dks-cream);font-size:var(--dks-fs-lg);padding:15px 20px;min-height:48px;
border-bottom:1px solid rgba(255,255,255,.08)}
.dks-nav .wpr-mobile-menu li a:hover{color:var(--dks-gold)}

/* ---------- responsive ---------- */
@media (max-width:1024px){
.dks-foot-grid>.e-con-inner{grid-template-columns:1fr 1fr;gap:32px}
.dks-grid-4>.e-con-inner{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1024px){
.dks-split>.e-con-inner,.dks-split-rev>.e-con-inner{grid-template-columns:minmax(0,1fr)}
.dks-split-rev>.e-con-inner>*:first-child{order:0}
.dks-grid-3>.e-con-inner{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
.dks-grid-2>.e-con-inner,.dks-grid-3>.e-con-inner,.dks-grid-4>.e-con-inner{grid-template-columns:minmax(0,1fr)}
.dks-foot-grid>.e-con-inner{grid-template-columns:minmax(0,1fr);gap:30px}
.dks-searchform{max-width:100%}
}