/* dl-r801-popup */
.dl-r801{position:fixed;inset:0;z-index:99998;display:flex;align-items:center;justify-content:center;padding:16px}
.dl-r801[hidden]{display:none}
.dl-r801__fondo{position:absolute;inset:0;background:rgba(0,0,0,.62)}
.dl-r801__box{position:relative;width:100%;max-width:460px;background:#000;color:#fff;padding:44px 32px 28px;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.5);font-family:'Archivo',sans-serif}
.dl-r801__x{position:absolute;top:8px;right:10px;background:none;border:0;color:#fff;font-size:30px;line-height:1;cursor:pointer;padding:6px 10px}
.dl-r801__occhiello{display:block;font-size:11px;letter-spacing:.18em;color:#888;text-transform:uppercase}
html body[class] .dl-r801 h2.dl-r801__titolo, html body .dl-r801__titolo{font-family:'Archivo Narrow',sans-serif !important;font-weight:700 !important;font-size:30px !important;letter-spacing:-.01em !important;margin:10px 0 8px !important;color:#fff !important;text-transform:none !important;line-height:1.15 !important}
html body[class] .dl-r801 p.dl-r801__sotto{font-size:14px !important;color:#bbb !important;margin:0 0 22px !important;line-height:1.5 !important}
.dl-r801__sotto strong{color:#fff}
.dl-r801__form{display:flex;flex-direction:column;align-items:center;gap:12px}
html body .dl-r801__input{width:100% !important;padding:14px 18px !important;background:#111 !important;border:1px solid #555 !important;color:#fff !important;font-size:14px !important;border-radius:0 !important;height:auto !important}
html body .dl-r801__input::placeholder{color:#888 !important;opacity:1 !important}
html body .dl-r801__input:focus{border-color:#fff !important;outline:none !important}
.dl-r801__gdpr{display:flex;align-items:center;gap:8px;font-size:12px;color:#bbb}
.dl-r801__gdpr a{color:#fff;text-decoration:underline}
html body .dl-r801__btn{width:100% !important;color:#000 !important;background:#fff !important;padding:14px 32px;background:#fff;color:#000;border:0;font-family:'Archivo Narrow',sans-serif;font-weight:700;font-size:13px;letter-spacing:.16em;cursor:pointer}
.dl-r801__btn:hover{background:#e5e5e5}
.dl-r801__msg{font-size:13px;color:#C8A64B;min-height:18px}
.dl-r801__msg.error{color:#E50914}
.dl-r801__no{margin-top:14px;background:none;border:0;color:#777;font-size:12px;text-decoration:underline;cursor:pointer}
@media (max-width:600px){.dl-r801__box{padding:40px 20px 22px}.dl-r801__titolo{font-size:26px}}
/* dl-r383-newsletter */
.dl-newsletter { background: #000000; color: #FFFFFF; padding: 60px 20px; margin: 0; }
.dl-newsletter__inner { max-width: 720px; margin: 0 auto; text-align: center; }
.dl-newsletter__eyebrow { font-family: 'Archivo', sans-serif; font-size: 11px; letter-spacing: 0.18em; color: #888; text-transform: uppercase; }
.dl-newsletter__title { font-family: 'Archivo Narrow', sans-serif; font-weight: 700; font-size: 32px; letter-spacing: -0.01em; margin: 12px 0 8px; color: #FFFFFF; }
.dl-newsletter__sub { font-family: 'Archivo', sans-serif; font-size: 14px; color: #BBBBBB; margin: 0 0 28px; }
.dl-newsletter__form { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.dl-newsletter__input { width: 100%; max-width: 420px; padding: 14px 18px; background: transparent; border: 1px solid #444; color: #FFFFFF; font-family: 'Archivo', sans-serif; font-size: 14px; }
.dl-newsletter__input:focus { border-color: #FFFFFF; outline: none; }
.dl-newsletter__gdpr { display: flex; align-items: center; gap: 8px; font-family: 'Archivo', sans-serif; font-size: 12px; color: #BBBBBB; }
.dl-newsletter__gdpr a { color: #FFFFFF; text-decoration: underline; }
.dl-newsletter__btn { padding: 14px 32px; background: #FFFFFF; color: #000000; border: 0; font-family: 'Archivo Narrow', sans-serif; font-weight: 700; font-size: 13px; letter-spacing: 0.16em; cursor: pointer; transition: background 0.2s; }
.dl-newsletter__btn:hover { background: #E5E5E5; }
.dl-newsletter__msg { font-size: 13px; color: #C8A64B; min-height: 18px; }
.dl-newsletter__msg.error { color: #E50914; }
/* senza-id */
#dl-r475 {
position: fixed;
bottom: 16px;
left: 16px;
z-index: 9999;
font-family: system-ui, -apple-system, sans-serif;
}
#dl-r475-btn {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 12px;
background: #fff;
color: #222;
border: 1px solid rgba(0,0,0,.1);
border-radius: 20px;
font-size: 12px;
font-weight: 500;
line-height: 1;
cursor: pointer;
box-shadow: 0 2px 10px rgba(0,0,0,.08);
transition: all .15s ease;
}
#dl-r475-btn:hover, #dl-r475[data-open] #dl-r475-btn {
background: #222;
color: #fff;
border-color: #222;
transform: translateY(-1px);
}
#dl-r475-menu {
position: absolute;
bottom: calc(100% + 8px);
left: 0;
min-width: 180px;
background: #fff;
border: 1px solid rgba(0,0,0,.08);
border-radius: 12px;
box-shadow: 0 8px 24px rgba(0,0,0,.12);
padding: 6px;
display: none;
flex-direction: column;
gap: 2px;
}
#dl-r475[data-open] #dl-r475-menu {
display: flex;
animation: dlr475 .15s ease;
}
@keyframes dlr475 {
from { opacity: 0; transform: translateY(4px); }
to { opacity: 1; transform: translateY(0); }
}
#dl-r475-menu a, #dl-r475-menu button {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 12px;
background: transparent;
color: #222;
border: none;
border-radius: 8px;
font-size: 13px;
font-weight: 500;
line-height: 1.2;
text-align: left;
text-decoration: none;
cursor: pointer;
transition: background .12s;
width: 100%;
}
#dl-r475-menu a:hover, #dl-r475-menu button:hover {
background: #f4f4f4;
}
@media (prefers-color-scheme: dark) {
#dl-r475-btn, #dl-r475-menu { background: #1a1a1a; color: #eee; border-color: rgba(255,255,255,.1); }
#dl-r475-menu a, #dl-r475-menu button { color: #eee; }
#dl-r475-menu a:hover, #dl-r475-menu button:hover { background: #2a2a2a; }
}
@media (max-width: 480px) {
#dl-r475 { bottom: 10px; left: 10px; }
#dl-r475-btn { padding: 7px 10px; font-size: 11px; }
}
/* dl-r510-css */
.dl-r510-suggest{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #000000;border-top:0;max-height:480px;overflow-y:auto;z-index:99999;box-shadow:0 12px 32px rgba(0,0,0,0.15);display:none;font-family:Archivo,sans-serif}
.dl-r510-suggest.is-open{display:block}
.dl-r510-item{display:flex;align-items:center;gap:14px;padding:12px 16px;border-bottom:1px solid #f0f0f0;text-decoration:none;color:#000000;cursor:pointer;transition:background 0.15s}
.dl-r510-item:hover{background:#f8f8f8}
.dl-r510-item img,.dl-r510-suggest .dl-r510-item img{width:50px !important;height:50px !important;min-width:50px !important;max-width:50px !important;max-height:50px !important;object-fit:contain !important;background:#fafafa !important;border-radius:8px !important;flex:0 0 50px !important}
.dl-r510-info{flex:1;min-width:0}
.dl-r510-name{font-size:13px;font-weight:500;color:#000000;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.dl-r510-price{font-size:12px;font-weight:700;color:#000000;margin-top:2px}
.dl-r510-loading,.dl-r510-empty{padding:24px 16px;text-align:center;color:#888;font-size:12px;letter-spacing:0.1em;text-transform:uppercase}
.dl-r510-more{display:block;padding:14px 16px;text-align:center;font-size:11px;letter-spacing:0.16em;text-transform:uppercase;font-weight:700;background:#000000;color:#fff;text-decoration:none}
.dl-r510-more:hover{background:#333}
/* dl-r319-footer-social */
.dl-extra-social {
display: inline-flex;
gap: 12px;
margin-left: 12px;
vertical-align: middle;
}
.dl-extra-social a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
background: transparent;
color: inherit;
border: 1px solid currentColor;
opacity: 0.7;
transition: all 0.2s ease;
}
.dl-extra-social a:hover {
opacity: 1;
background: #c8a64b;
border-color: #c8a64b;
color: #ffffff;
}
.dl-extra-social svg {
width: 18px;
height: 18px;
}
/* dl-r319-wa-tooltip */
[class*="whatsapp"][class*="fab"], .wa-float, [id*="whatsapp"][class*="float"] {
position: relative;
}
[class*="whatsapp"][class*="fab"]:hover::after,
.wa-float:hover::after {
content: 'Scrivici su WhatsApp';
position: absolute;
right: calc(100% + 12px);
top: 50%;
transform: translateY(-50%);
background: #000000;
color: #ffffff;
font-family: inherit;
font-size: 12px;
font-weight: 500;
padding: 6px 12px;
white-space: nowrap;
border-radius: 4px;
pointer-events: none;
z-index: 10000;
}
[class*="whatsapp"][class*="fab"]:hover::before,
.wa-float:hover::before {
content: '';
position: absolute;
right: calc(100% + 6px);
top: 50%;
transform: translateY(-50%);
border: 6px solid transparent;
border-left-color: #000000;
pointer-events: none;
z-index: 10000;
}
@media (max-width: 599px) {
[class*="whatsapp"][class*="fab"]:hover::after,
[class*="whatsapp"][class*="fab"]:hover::before {
display: none;
}
}
/* dl-r511-css */
.dl-r511-modal{position:fixed;inset:0;background:rgba(10,10,10,0.85);z-index:999999;display:none;align-items:flex-start;justify-content:center;padding:80px 16px 16px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.dl-r511-modal.is-open{display:flex}
.dl-r511-modal-inner{background:#fff;width:100%;max-width:760px;border-radius:8px;overflow:hidden;animation:dl-r511-in 0.2s ease;position:relative}
@keyframes dl-r511-in{from{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}
.dl-r511-form{display:flex;align-items:center;border-bottom:2px solid #000000;position:relative}
.dl-r511-form input{flex:1;border:0;padding:22px 24px;font-family:Archivo,sans-serif;font-size:18px;letter-spacing:0.02em;outline:none;background:transparent;color:#000000}
.dl-r511-form input::placeholder{color:#888;text-transform:uppercase;font-size:14px;letter-spacing:0.18em}
.dl-r511-close{background:transparent;border:0;font-size:32px;padding:0 24px;cursor:pointer;color:#000000;line-height:1}
.dl-r511-close:hover{color:#888}
.dl-r511-results{max-height:60vh;overflow-y:auto}
.dl-r511-item{display:flex;align-items:center;gap:14px;padding:14px 24px;border-bottom:1px solid #f0f0f0;text-decoration:none;color:#000000;transition:background 0.15s}
.dl-r511-item:hover{background:#f8f8f8}
.dl-r511-item img{width:56px;height:56px;object-fit:contain;background:#fafafa;flex:0 0 56px}
.dl-r511-info{flex:1;min-width:0}
.dl-r511-name{font-family:Archivo,sans-serif;font-size:14px;font-weight:500;color:#000000;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.dl-r511-price{font-family:Archivo,sans-serif;font-size:13px;font-weight:700;color:#000000;margin-top:4px}
.dl-r511-empty{padding:32px 24px;text-align:center;color:#888;font-size:13px;letter-spacing:0.12em;text-transform:uppercase}
.dl-r511-all{display:block;padding:18px 24px;text-align:center;font-family:Archivo,sans-serif;font-size:12px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;background:#000000;color:#fff;text-decoration:none}
.dl-r511-all:hover{background:#222}
body.dl-r511-open{overflow:hidden}
/* dl-r690-search-fix */
.dl-r510-suggest .dl-r510-more{position:sticky;bottom:0;z-index:3;}
.dl-r690-detached{box-shadow:0 14px 44px rgba(0,0,0,.20);}
/* dl-r637-css */
body.archive.tax-product_cat aside.dl-subcat-filter{display:none !important;}
body.archive.tax-product_cat aside.dl-subcat-filter[data-dl-r50]{display:none !important;}
body.archive.tax-product_cat.term-1375 aside.dl-subcat-filter[data-dl-r627],
body.archive.tax-product_cat.term-1423 aside.dl-subcat-filter[data-dl-r627],
body.archive.tax-product_cat.term-1424 aside.dl-subcat-filter[data-dl-r627]{display:block !important;}
/* dl-r643-search-fix */
.dl-r511-modal.is-open{ background:rgba(8,8,8,0.94) !important; }
.dl-r511-modal-inner{ max-height:80vh !important; overflow-y:auto !important; -webkit-overflow-scrolling:touch; }
body.dl-r511-lock .dl-brand-strip{ visibility:hidden !important; }
/* dl-logo-final */
body .dl-logo-h .dl-logo-bg, html body .site-header .dl-logo-h .dl-logo-bg {
display: inline-block !important;
width: 78px !important;
height: 78px !important;
background-image: url("https://i0.wp.com/designerlondon.store/wp-content/uploads/2026/04/DL_LOGO-e1777491952847.png?resize=220,220&strip=all&quality=85") !important;
background-repeat: no-repeat !important;
background-size: contain !important;
background-position: center center !important;
}
body .dl-logo-h, html body .site-header .dl-logo-h {
display: inline-flex !important;
align-items: center !important;
text-decoration: none !important;
line-height: 1 !important;
}
body .dl-logo-h img { display: none !important; }
@media (max-width: 900px) {
body .dl-logo-h .dl-logo-bg, html body .site-header .dl-logo-h .dl-logo-bg { width: 64px !important; height: 64px !important; }
}
@media (max-width: 480px) {
body .dl-logo-h .dl-logo-bg, html body .site-header .dl-logo-h .dl-logo-bg { width: 54px !important; height: 54px !important; }
}
body footer .dl-logo-f img, html body .site-footer .dl-logo-f img { display: none !important; }
body footer .dl-logo-f, html body .site-footer .dl-logo-f {
display: inline-block !important;
width: 110px !important;
height: 110px !important;
background-image: url("https://i0.wp.com/designerlondon.store/wp-content/uploads/2026/04/DL_LOGO-e1777491952847.png?resize=220,220&strip=all&quality=85") !important;
background-repeat: no-repeat !important;
background-size: contain !important;
background-position: center center !important;
background-color: transparent !important;
max-width: 200px !important;
max-height: 110px !important;
}
/* dl-r10-master */
html, body { overflow-x: hidden !important; max-width: 100vw !important; }
body .dl-hero-fullbleed, body .dl-hero-fullbleed__link, body .dl-hero-fullbleed picture, body .dl-hero-fullbleed img { width: 100% !important; max-width: 100vw !important; height: auto !important; }
body .dl-brand-strip, body .dl-brand-marquee { overflow: hidden !important; max-width: 100vw !important; }
body .dl-brand-track { animation-duration: 30s !important; }
body .dl-marquee, body .dl-topbar { display: flex !important; overflow: hidden !important; align-items: center !important; }
body .dl-marquee > div, body .dl-topbar > div, body .dl-marquee > * { display: inline-flex !important; flex-shrink: 0 !important; white-space: nowrap !important; padding-right: 2em !important; animation: dl-marquee-loop 35s linear infinite !important; }
@keyframes dl-marquee-loop { from { transform: translateX(0); } to { transform: translateX(-100%); } }
body .onsale, body span.onsale, body .product .onsale { background: #E50914 !important; color: #ffffff !important; padding: 4px 10px !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 1px !important; border-radius: 0 !important; display: inline-block !important; }
body.archive .woocommerce-products-header, body.post-type-archive-product .woocommerce-products-header { display: block !important; visibility: visible !important; padding: 24px 0 !important; margin: 0 0 16px !important; }
body.archive h1, body.archive h1.page-title { display: block !important; visibility: visible !important; font-size: 32px !important; font-weight: 800 !important; margin: 0 0 8px !important; }
body > footer.site-footer:not(.dl-footer), body footer.site-footer.ct-footer:not(.dl-footer) { display: none !important; }
body ul.products li.product .price, body .products .product .price { display: block !important; margin: 8px 0 12px !important; position: relative !important; z-index: 1 !important; clear: both !important; }
body ul.products li.product .button, body .products .product .button { margin-top: 8px !important; position: relative !important; z-index: 1 !important; clear: both !important; }
/* dl-r11-final */
@media (min-width: 768px) { body .site-header .dl-nav { display: flex !important; } body .site-header .dl-mobile-nav { display: none !important; } }
@media (max-width: 767.98px) { body .site-header .dl-nav { display: none !important; } body .site-header .dl-mobile-nav { display: inline-block !important; } }
@media (min-width: 768px) and (max-width: 991px) {
body .site-header .dl-nav { gap: 18px !important; }
body .site-header .dl-nav .dl-nav-item .dl-nav-trigger, body .site-header .dl-nav > a { font-size: 12px !important; letter-spacing: 1px !important; padding: 0 4px !important; }
}
body .woocommerce-tabs ul.tabs { display: flex !important; gap: 24px !important; list-style: none !important; padding: 0 !important; border-bottom: 1px solid #e5e5e5 !important; margin: 0 0 24px !important; }
body .woocommerce-tabs ul.tabs li { list-style: none !important; background: none !important; border: none !important; padding: 12px 0 !important; margin: 0 !important; }
body .woocommerce-tabs ul.tabs li::before { content: none !important; }
body .woocommerce-tabs ul.tabs li.active { border-bottom: 2px solid #E50914 !important; }
body .woocommerce-tabs ul.tabs li a { color: inherit !important; text-decoration: none !important; font-family: "Archivo Narrow", sans-serif !important; font-weight: 600 !important; font-size: 13px !important; text-transform: uppercase !important; letter-spacing: 1px !important; }
body .summary .variations a:not(.reset_variations) { display: none !important; }
body .summary .variations select { display: block !important; width: 100% !important; max-width: 320px !important; padding: 10px 12px !important; border: 1px solid #ccc !important; background: #fff !important; }
html body .site-header .dl-nav { gap: 56px !important; justify-content: center !important; }
@media (max-width: 1200px) { html body .site-header .dl-nav { gap: 36px !important; } }
@media (max-width: 1000px) { html body .site-header .dl-nav { gap: 24px !important; } }
body:not(.home) .hero-section { display: block !important; min-height: 0 !important; height: auto !important; padding: 0 !important; margin: 0 !important; background: transparent !important; }
body:not(.home) .hero-section .entry-header.ct-container-narrow { display: block !important; padding: 32px 24px 16px !important; max-width: 1280px !important; margin: 0 auto !important; }
body:not(.home) .hero-section .entry-header h1, body:not(.home) .hero-section h1.page-title { display: block !important; font-size: 32px !important; font-weight: 800 !important; margin: 0 !important; padding: 0 !important; visibility: visible !important; line-height: 1.2 !important; }
body.woocommerce-cart .hero-section, body.woocommerce-checkout .hero-section, body.woocommerce-account .hero-section, body.single-product .hero-section { display: none !important; }
/* dl-r645-vt */
.dl-mega a.dl-vt-link, .dl-mega a.dl-vt-link strong{ font-weight:700 !important; }
/* dl-r12-bulletproof */
html body section.dl-newsletter, html body section.dl-newsletter--minimal, html body .dl-newsletter, html body .dl-newsletter--minimal {
background: #000000 !important; color: #ffffff !important; padding: 80px 24px !important; text-align: center !important;
width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important;
box-sizing: border-box !important;
}
html body .dl-newsletter--minimal .dl-nl-min__inner, html body .dl-newsletter--minimal > div { max-width: 560px !important; margin: 0 auto !important; text-align: center !important; }
html body .dl-newsletter--minimal h2, html body .dl-newsletter--minimal h3, html body .dl-newsletter--minimal .dl-nl-min__title { color: #ffffff !important; font-size: 32px !important; font-weight: 600 !important; margin: 0 0 12px !important; }
html body .dl-newsletter--minimal p, html body .dl-newsletter--minimal .dl-nl-min__sub { color: #888 !important; font-size: 14px !important; margin: 0 0 24px !important; }
html body .dl-newsletter--minimal form { display: flex !important; max-width: 480px !important; margin: 0 auto !important; border: 1px solid rgba(255,255,255,0.2) !important; }
html body .dl-newsletter--minimal input[type="email"] { flex: 1 !important; background: transparent !important; color: #ffffff !important; border: 0 !important; padding: 14px 16px !important; }
html body .dl-newsletter--minimal input[type="email"]::placeholder { color: #555 !important; }
html body .dl-newsletter--minimal button { background: transparent !important; color: #ffffff !important; border: 0 !important; padding: 0 18px !important; font-size: 18px !important; cursor: pointer !important; }
html body .dl-social-bar { display: flex !important; justify-content: center !important; align-items: center !important; flex-wrap: wrap !important; gap: 12px !important; padding: 32px 16px !important; background: #000000 !important; border-top: 1px solid rgba(255,255,255,0.08) !important; border-bottom: 1px solid rgba(255,255,255,0.08) !important; }
html body .dl-social-bar a, html body .dl-social-btn { display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 10px 16px !important; border: 1px solid rgba(255,255,255,0.18) !important; border-radius: 999px !important; color: #ffffff !important; text-decoration: none !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; white-space: nowrap !important; }
html body .dl-social-btn svg { width: 18px !important; height: 18px !important; flex-shrink: 0 !important; }
html body footer.dl-footer, html body .site-footer.dl-footer { background: #000000 !important; color: #f5f5f2 !important; padding: 0 !important; }
html body .dl-footer-cols { display: grid !important; grid-template-columns: 1fr 1fr 1fr auto !important; gap: 48px !important; max-width: 1400px !important; margin: 0 auto !important; padding: 56px 24px 32px !important; }
html body .dl-footer-cols ul, html body .dl-footer-cols ol { list-style: none !important; padding: 0 !important; margin: 0 !important; }
html body .dl-footer-cols li { list-style: none !important; padding: 5px 0 !important; margin: 0 !important; }
html body .dl-footer-cols li::marker, html body .dl-footer-cols li::before { content: none !important; display: none !important; }
html body .dl-footer-cols a { color: #f5f5f2 !important; text-decoration: none !important; font-size: 14px !important; line-height: 1.8 !important; }
html body .dl-footer-cols a:hover { color: #E50914 !important; }
@media (max-width: 991px) {
html body .dl-footer-cols { grid-template-columns: 1fr 1fr !important; gap: 32px 24px !important; padding: 40px 20px 24px !important; }
html body .dl-newsletter--minimal { padding: 56px 20px !important; }
html body .dl-newsletter--minimal h2, html body .dl-newsletter--minimal .dl-nl-min__title { font-size: 26px !important; }
}
@media (max-width: 480px) {
html body .dl-footer-cols { grid-template-columns: 1fr 1fr !important; gap: 24px 16px !important; padding: 32px 16px !important; }
html body .dl-social-bar { gap: 8px !important; padding: 24px 12px !important; }
html body .dl-social-btn { padding: 8px 12px !important; font-size: 10px !important; gap: 6px !important; }
html body .dl-newsletter--minimal { padding: 48px 16px !important; }
}
/* dl-r12-onsale-red */
html body .onsale,
html body span.onsale,
html body .product .onsale,
html body ul.products li.product .onsale,
html body .woocommerce span.onsale,
html body .woocommerce ul.products li.product .onsale {
background: #E50914 !important;
background-color: #E50914 !important;
color: #ffffff !important;
border: none !important;
border-color: #E50914 !important;
padding: 4px 12px !important;
font-size: 11px !important;
font-weight: 700 !important;
letter-spacing: 1.2px !important;
text-transform: uppercase !important;
border-radius: 0 !important;
display: inline-block !important;
line-height: 1.4 !important;
font-family: "Archivo Narrow", sans-serif !important;
box-shadow: none !important;
min-height: auto !important;
min-width: auto !important;
}
@media (max-width: 600px) {
html body ul.products li.product .onsale, html body .products .product .onsale { top: 8px !important; left: 8px !important; right: auto !important; }
}
/* dl-r14-close */
html body .elementor-product .onsale,
html body .elementor-products-grid .onsale,
html body .elementor-widget-woocommerce-products .onsale,
html body .elementor-widget-container .onsale,
html body .dl-best .onsale,
html body div .products .product .onsale,
html body div ul.products li.product .onsale,
html body .woocommerce ul.products li.product .onsale {
background: #D90712 !important;
background-color: #D90712 !important;
color: #ffffff !important;
border: 0 !important;
font-size: 14px !important;
padding: 5px 12px !important;
font-weight: 700 !important;
letter-spacing: 1px !important;
line-height: 1.3 !important;
}
html body .onsale, html body span.onsale, html body .product .onsale {
background: #D90712 !important;
font-size: 14px !important;
padding: 5px 12px !important;
}
@media (min-width: 1024px) {
html body .dl-mobile-nav,
html body details.dl-mobile-nav,
html body .site-header .dl-mobile-nav,
html body .site-header.dl-header--dark .dl-mobile-nav { display: none !important; }
}
html body .dl-mobile-nav ul,
html body .dl-mobile-nav ul ul,
html body details.dl-mobile-nav ul {
list-style: none !important;
padding-left: 0 !important;
margin: 0 !important;
}
html body .dl-mobile-nav ul ul { padding-left: 16px !important; border-left: 1px solid #333 !important; }
html body .dl-mobile-nav li { list-style: none !important; padding: 12px 0 !important; border-bottom: 1px solid #222 !important; }
html body .dl-mobile-nav li::before, html body .dl-mobile-nav li::marker { content: none !important; display: none !important; }
html body .jetpack-instant-search:not(.is-open) h1,
html body .jetpack-instant-search[aria-hidden="true"] h1,
html body .jetpack-instant-search__overlay:not(.is-open) h1 { display: none !important; }
/* dl-r15-hamburger-dom */
@media (min-width: 1024px) {
html body details.dl-mobile-nav,
html body details.dl-mobile-nav[open],
html body .dl-mobile-nav,
html body summary[aria-label*="menu" i],
html body summary[aria-label*="menu" i]:focus,
html body .site-header details.dl-mobile-nav,
html body .site-header summary[aria-label*="menu" i] {
display: none !important;
visibility: hidden !important;
pointer-events: none !important;
}
/* removed: was hiding drawer content on mobile too */
}
/* dl-r655-a11y */
.woocommerce-widget-layered-nav-list,
.woocommerce-widget-layered-nav-list * { color:#595959 !important; -webkit-text-fill-color:#595959 !important; }
#dl-r483-bizinfo, #dl-r483-bizinfo a { color:#595959 !important; -webkit-text-fill-color:#595959 !important; }
#dl-r483-bizinfo a { text-decoration:underline !important; }
.woocommerce-pagination.woocommerce-pagination a.page-numbers.page-numbers:not(.current):not(.dots),
html body nav.woocommerce-pagination ul li a.page-numbers:not(.current) { color:#1452cc !important; -webkit-text-fill-color:#1452cc !important; }
/* dl-r740-input16 */
@media (pointer: coarse){
html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
html body select,
html body textarea,
html body .woocommerce-ordering select.orderby,
html body .woocommerce-ordering select,
html body .dl-filter-bar__sort select,
html body .dl-hero-search__input,
html body .dl-r511-form input,
html body form.woocommerce-cart-form input,
html body .woocommerce-checkout input,
html body .woocommerce-checkout select,
html body .woocommerce-checkout textarea{
font-size: 16px !important;
}
}
/* dl-r741-tap */
/* Solo puntatore grossolano: la resa desktop non cambia di un pixel.
web.dev: ingrandire per il dito, mai rimpicciolire per il mouse. */
@media (pointer: coarse){
/* ---- 1. bersagli: nessuno sotto i 44px ---- */
html body a.button,
html body .woocommerce a.button,
html body .add_to_cart_button,
html body a.button.product_type_variable{
min-height: 48px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
html body button.ct-button,
html body .ct-button{
min-height: 48px !important;
}
html body a.dl-subcat-filter__item{
min-height: 44px !important;
}
/* NIENTE regola su a.woocommerce-LoopProduct-link.
Misurato il 22/08: uno script scrive INLINE su quell'elemento
min-height:0px !important; max-height:54px !important;
font-size:13px !important; display:block !important
e una dichiarazione inline !important batte qualunque foglio di stile.
Una regola qui sarebbe CSS morto — come lo snippet #71, 6,9 KB di
JavaScript su ogni pagina agganciati a selettori che non esistevano piu'.
Resta a 40-42px: passa WCAG 2.2 AA (24px), non arriva ai 44 di Apple.
Per chiuderlo davvero bisogna toccare lo script che scrive quegli inline
(R411 / DL_JS_BUNDLE_P3), ed e' un lavoro a parte. */
/* Icone piccole: area cliccabile 44px senza cambiare la dimensione VISIVA.
Solo dove l'icona non e' gia' dentro un bersaglio abbastanza grande. */
html body .dl-filter-bar__btn,
html body .dl-hero-search__btn,
html body .dl-extra-social a{
position: relative;
min-height: 44px !important;
min-width: 44px !important;
}
/* ---- 2. pavimento tipografico sul testo FUNZIONALE ---- */
html body a.button,
html body .woocommerce a.button,
html body a.button.product_type_variable{
font-size: 12px !important; /* era 11px: e' l'etichetta di una CTA */
letter-spacing: .04em !important;
}
html body small.woocommerce-price-suffix,
html body .woocommerce-price-suffix{
font-size: 12px !important; /* era 11,2px: "IVA inclusa" */
}
/* I conteggi dei filtri. La regola del tema e' piu' specifica di
`span.count`, quindi qui si passa dal contenitore: 98 elementi su
/sneakers/ restavano a 11px con il selettore generico. */
html body span.dl-subcat-filter__count,
html body .dl-subcat-filter__item .count,
html body .woocommerce-widget-layered-nav-list__item .count,
html body .woocommerce-widget-layered-nav-list .count,
html body .wc-layered-nav-term .count,
html body .widget_product_categories .count,
html body .product-categories .count,
html body span.count{
font-size: 12px !important; /* era 11px */
}
html body .dl-filter-bar__count{
font-size: 12px !important; /* "Visualizzazione di 1-48 di ..." */
}
}
/* dl-r745-contrasto */
/* ============ 1. I DUE PEZZI INVISIBILI ============ */
/* Footer: i titoli di colonna erano nero su nero. Stesso colore dei link. */
html body footer.dl-footer .dl-footer-col h4,
html body .site-footer .dl-footer-col h4,
html body .dl-footer-cols h4{
color: #f5f5f2 !important;
font-size: 12px !important;
letter-spacing: .14em !important;
text-transform: uppercase !important;
margin: 0 0 10px !important;
opacity: .72; /* titolo di servizio: presente, non urlato */
}
/* Newsletter: il titolo a 32px era nero su nero e lasciava 96px di buco.
La regola del tema esiste ma cerca `.dl-newsletter--minimal`, che in pagina
non c'e': qui si copre la sezione senza modificatore. */
html body .dl-newsletter h2,
html body .dl-newsletter h3,
html body .dl-newsletter .dl-newsletter__title,
html body .dl-newsletter .dl-nl-min__title{
color: #ffffff !important;
}
html body .dl-newsletter p,
html body .dl-newsletter .dl-newsletter__sub{ color: #b9b9b2 !important; }
/* Il placeholder era quasi invisibile sul fondo nero */
html body .dl-newsletter input[type="email"]{ color:#ffffff !important; }
html body .dl-newsletter input[type="email"]::placeholder{ color:#8f8f88 !important; opacity:1 !important; }
/* ============ 2. CONTRASTO SOTTO SOGLIA ============ */
/* «(20)» accanto ai filtri: 3,54:1 a 11px, x98 su /sneakers/.
#767670 su bianco = 4,6:1, e 12px. Chiude contrasto e leggibilita' insieme. */
/* Chi vinceva: #410 con `.dl-filter-drawer .ct-widget li .count` — TRE classi,
la mia prima versione ne aveva due e perdeva. Qui si ricalca il suo selettore
e si aggiungono elementi: a parita' di classi vince la specificita' piu' alta. */
html body .dl-filter-drawer .ct-widget li .count,
html body .dl-filter-drawer .ct-widget li span.count,
html body aside .ct-widget li .count,
html body .woocommerce-widget-layered-nav-list__item .count,
html body .woocommerce-widget-layered-nav-list .count,
html body .wc-layered-nav-term .count,
html body .widget_product_categories .count,
html body .product-categories .count,
html body span.count{
color: #6b6b66 !important;
font-size: 12px !important;
}
/* Bottone «Accetto» del consenso cookie: 4,31:1, appena sotto la soglia. */
html body button.ct-cookies-accept-button,
html body .ct-cookies-accept-button{ background: #1a56c4 !important; color: #ffffff !important; }
/* Breadcrumb: 4,31:1, appena sotto. */
html body .woocommerce-breadcrumb a,
html body nav[aria-label*="readcrumb"] a,
html body [class*="breadcrumb"] a{ color: #1a56c4 !important; }
/* «Ritorna al negozio» nel carrello.
ERRORE MIO, corretto: la prima versione metteva `color:#000000` senza sapere
che lo sfondo del bottone e' scuro — misurato dopo: da 4,38:1 a 1:1, cioe'
invisibile. Ora sfondo e testo si dichiarano entrambi: 21:1, niente da indovinare. */
html body a.button.wc-backward{
background: #000000 !important;
color: #ffffff !important;
border: 1px solid #000000 !important;
font-size: 14px !important;
}
/* ============ 3. BORDI DEI CONTROLLI (WCAG 1.4.11, min 3:1) ============
Il selettore taglia e' il controllo piu' importante della scheda e aveva
un bordo a 1,36:1: non si capiva che fosse un campo. */
html body select#dl_size,
html body .summary .variations select,
html body form.cart select{
border: 1px solid #000000 !important;
}
html body input.qty,
html body input[type="number"].qty,
html body .quantity input,
html body form.cart input[type="number"],
html body input[id^="quantity_"],
html body .woocommerce div.product form.cart .quantity input{
border: 1px solid #767670 !important;
}
/* ============ 4. BERSAGLI ============ */
@media (pointer: coarse){
/* il bottone del menu stava a 40px */
html body label#dl76-hamburger,
html body .dl-mobile-nav summary,
html body #dl76-hamburger{
min-width: 44px !important;
min-height: 44px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
/* checkbox a 13px: sotto i 24px di WCAG 2.5.8 */
html body input[type="checkbox"],
html body input[type="radio"]{
width: 22px !important;
height: 22px !important;
min-width: 22px !important;
accent-color: #000000;
}
html body .dl-newsletter label,
html body .dl-newsletter .dl-newsletter__privacy{
display: inline-flex !important;
align-items: center !important;
gap: 10px !important;
min-height: 44px !important;
}
}
/* ============ 5. FOOTER: 880px per 14 link ============
L'interlinea a 1.8 piu' il padding faceva ~108px fra una voce e l'altra.
I bersagli restano sopra i 44px, ma senza sprecare mezzo schermo. */
@media (max-width: 767px){
html body .dl-footer-cols{ gap: 20px 16px !important; padding: 28px 16px 20px !important; }
html body .dl-footer-cols li{ padding: 0 !important; }
html body .dl-footer-cols a{
line-height: 1.4 !important;
display: flex !important;
align-items: center !important;
min-height: 44px !important; /* bersaglio pieno, altezza onesta */
}
}
/* ============ 6. MOVIMENTO ============
Due animazioni infinite (pulse WhatsApp, marquee dei brand) giravano
sempre, anche per chi ha chiesto meno movimento nelle impostazioni. */
@media (prefers-reduced-motion: reduce){
html body *,
html body *::before,
html body *::after{
animation-duration: .001ms !important;
animation-iteration-count: 1 !important;
transition-duration: .001ms !important;
scroll-behavior: auto !important;
}
}
/* dl-r661-size */
/* PDP: nascondi il selettore taglia NATIVO duplicato; tieni il custom dl-r309-size */
body.single-product table.variations { display:none !important; }
body.single-product .woocommerce-variation-add-to-cart .reset_variations { display:none !important; }
/* dl-r746 */
/* ---- 2. bordo del campo quantita': era 1,26:1 (WCAG 1.4.11 chiede 3) ---- */
html body .woocommerce div.product form.cart div.quantity input.qty,
html body .woocommerce div.quantity input.input-text.qty,
html body div.quantity input.input-text.qty,
html body input.input-text.qty.text,
html body form.cart .quantity input[type="number"]{
border: 1px solid #767670 !important;
}
/* dl-r16-404-h1 */
html body.error404 h1, html body.error-404 h1, html body .error-404 h1, html body .not-found h1 { color: #ffffff !important; }
/* dl-r663-home-header */
/* Home: blocco titolo sezione (BEST OF + Vedi tutti + titolo) compatto e allineato */
body.home .dl-best__eyebrow{ display:inline-block !important; margin:0 0 2px !important; letter-spacing:2px !important; }
body.home .dl-best__title{ margin:4px 0 16px !important; line-height:1.04 !important; }
/* riga eyebrow + vedi-tutti: allineate alla stessa baseline, vedi-tutti a destra */
body.home .dl-best__title + *, body.home .dl-home-dyn{ margin-top:0 !important; }
/* dl-brand-strip-white */
html body .dl-brand-strip,
html body section.dl-brand-strip,
html body div.dl-brand-strip { background: #ffffff !important; padding: 36px 0 !important; }
html body .dl-brand-strip__label { color: #666 !important; }
html body .dl-brand-marquee { background: transparent !important; }
html body .dl-brand-track { background: transparent !important; }
/* dl-hero-fullbleed-v2 */
html body .dl-hero-fullbleed,
html body section.dl-hero-fullbleed,
html body .dl-hero-fullbleed__link,
html body .dl-hero-fullbleed picture {
display: block !important;
width: 100vw !important;
max-width: 100vw !important;
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
padding: 0 !important;
box-sizing: border-box !important;
background: transparent !important;
}
html body .dl-hero-fullbleed img,
html body .dl-hero-fullbleed__link img,
html body .dl-hero-fullbleed picture img {
display: block !important;
width: 100% !important;
max-width: 100vw !important;
height: auto !important;
object-fit: cover !important;
margin: 0 !important;
}
html body .dl-brand-strip__label {
text-align: center !important;
color: #666 !important;
display: block !important;
width: 100% !important;
margin: 0 0 24px !important;
font-size: 11px !important;
letter-spacing: 3px !important;
text-transform: uppercase !important;
}
html body .dl-brand-strip {
background: #ffffff !important;
padding: 36px 0 !important;
text-align: center !important;
width: 100vw !important;
max-width: 100vw !important;
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
}
@media (max-width: 600px) {
html body .dl-brand-strip { padding: 24px 0 !important; }
html body .dl-brand-strip__label { font-size: 10px !important; letter-spacing: 2px !important; margin-bottom: 16px !important; }
}
/* dl-r20-drawer-close */
@media (max-width: 1023.98px) {
/* X close button visible only when drawer open */
.dl-drawer-close {
position: fixed !important;
top: 14px !important;
right: 16px !important;
width: 44px !important;
height: 44px !important;
background: transparent !important;
border: 1px solid rgba(255,255,255,0.2) !important;
border-radius: 50% !important;
color: #ffffff !important;
font-size: 22px !important;
line-height: 1 !important;
cursor: pointer !important;
z-index: 100000 !important;
display: none !important;
align-items: center !important;
justify-content: center !important;
padding: 0 !important;
font-family: inherit !important;
transition: background .2s ease, transform .2s ease !important;
}
details.dl-mobile-nav[open] ~ .dl-drawer-close,
body.dl-drawer-open .dl-drawer-close {
display: inline-flex !important;
}
.dl-drawer-close:hover, .dl-drawer-close:focus {
background: #E50914 !important;
border-color: #E50914 !important;
transform: scale(1.05) !important;
}
/* Body lock when drawer open */
body.dl-drawer-open { overflow: hidden !important; }
/* Backdrop click area (transparent overlay) */
.dl-drawer-backdrop {
position: fixed; inset: 60px 0 0 0;
background: rgba(0,0,0,0); pointer-events: none;
z-index: 9998;
}
body.dl-drawer-open .dl-drawer-backdrop { pointer-events: auto; }
}
/* r69css */
.dl-nav-mega--brands a{text-transform:none!important;}
/* dl-r763-footer-meta */
/* DL_R763_FOOTER_META — 02/09/2026. La riga «© 2026 · Tutti i diritti riservati / VISA · MASTERCARD · AMEX · KLARNA»
(.dl-footer-meta) aveva padding 0: testo attaccato al bordo sinistro e al fondo della pagina (misurato: x=0 su
desktop e mobile, mentre le colonne del footer partono a x=44 / 16). Ora è allineata alle colonne, con un filo
di separazione sopra e le due voci sulla stessa riga (a capo su mobile). Tutte le pagine. */
html body .dl-footer-meta {
display: flex !important; flex-wrap: wrap !important; justify-content: space-between !important; align-items: center !important;
gap: 6px 24px !important; padding: 18px 120px 28px 44px !important; /* a destra spazio per il bottone WhatsApp fisso */ box-sizing: border-box !important;
border-top: 1px solid rgba(255, 255, 255, 0.08) !important; font-size: 13px !important; letter-spacing: 0.02em !important;
}
html body .dl-footer-meta > * { margin: 0 !important; }
@media (max-width: 767px) {
html body .dl-footer-meta { padding: 16px 16px 24px !important; font-size: 12px !important; }
}
/* dl-r765-oro-menu */
/* DL_R765_ORO_E_MENU — 03/09/2026. Un solo oro per il passaggio del mouse (scelto da Daniele: C, #B08A2E), scritta bianca
ovunque il riquadro diventa oro (prima: menu account e altri con scritta oro scuro su oro), e la voce «Pronta consegna»
nel menu principale e nel menu mobile. */
:root {
--dl-oro: #B08A2E !important;
--dl-oro-ombra: #8F6E22 !important;
/* NON tocco --dl-red / --theme-link-initial-color (#826C34): sono il colore dei link di testo e dei bottoni a riposo,
e a 5,07:1 restano leggibili; l'oro nuovo (3,2:1) va bene solo sui riquadri con scritta bianca in grassetto. */
--theme-palette-color-2: #B08A2E !important;
--theme-button-background-hover-color: #B08A2E !important;
--theme-button-text-hover-color: #ffffff !important;
}
/* riquadri che diventano oro al passaggio: scritta bianca, sempre */
html body .button:hover, html body a.button:hover, html body button.button:hover,
html body .woocommerce a.button:hover, html body ul.products li.product a.button:hover, html body ul.products li.product .button:hover,
html body .single_add_to_cart_button:hover, html body button.single_add_to_cart_button.button:hover, html body .checkout-button:hover, html body .wc-block-components-button:hover,
html body .dl-page-btn:hover, html body .dl-btn--primary:hover, html body .dl-hero-search__btn:hover,
html body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover,
html body.woocommerce-account .woocommerce-MyAccount-navigation li a:focus-visible {
background-color: #B08A2E !important; border-color: #B08A2E !important;
color: #ffffff !important; -webkit-text-fill-color: #ffffff !important;
}
html body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { background: #000000 !important; color: #f5f5f2 !important; -webkit-text-fill-color: #f5f5f2 !important; }
/* link di testo (non riquadri): passaggio in oro pieno, non oro scuro */
html body .dl-pc a:hover, html body .wc-pao-addon-container .wc-pao-addon-description a:hover,
html body.woocommerce-account .woocommerce-LostPassword a:hover { color: #B08A2E !important; -webkit-text-fill-color: #B08A2E !important; }
/* menu: cinque voci su una riga sola (a 1092 px «Pronta consegna» e «Traccia ordine» andavano a capo) */
html body .site-header .dl-nav { gap: clamp(14px, 2.2vw, 32px) !important; }
html body .site-header .dl-nav > a, html body .site-header .dl-nav .dl-nav-item > a, html body .site-header .dl-nav .dl-nav-trigger { white-space: nowrap !important; }
/* voce «Pronta consegna» nel menu (inserita dal JS qui sotto) */
html body .site-header .dl-nav > a.dl-nav-pc { color: #B08A2E; }
html body .site-header .dl-nav > a.dl-nav-pc:hover { color: #ffffff; }
/* dl-r780-oro-metallico */
:root{
--dl-oro:#B08A2E;
--dl-oro-a:#b8963f; --dl-oro-scuro:#8f7326; --dl-oro-chiaro:#ecd9a3; --dl-oro-bordo:#6f5718; --dl-oro-tinta:#fbf8f1;
--dl-oro-metallo:linear-gradient(180deg,rgba(255,255,255,.30) 0%,rgba(255,255,255,.06) 46%,rgba(0,0,0,.08) 54%,rgba(0,0,0,.26) 100%),linear-gradient(90deg,#8f7326 0%,#b8963f 18%,#d4b96c 42%,#e3cf93 50%,#d4b96c 58%,#b8963f 82%,#8f7326 100%);
--dl-oro-metallo-hover:linear-gradient(180deg,rgba(255,255,255,.36) 0%,rgba(255,255,255,.08) 46%,rgba(0,0,0,.06) 54%,rgba(0,0,0,.24) 100%),linear-gradient(90deg,#8f7326 0%,#c2a04a 18%,#e2ca85 42%,#f3e3b2 50%,#e2ca85 58%,#c2a04a 82%,#8f7326 100%);
--dl-oro-testo:linear-gradient(180deg,#f0dfae 0%,#d3b566 38%,#a8862f 62%,#c9a955 100%);
--dl-oro-filetto:linear-gradient(90deg,transparent,#b8963f 15%,#f0dfae 50%,#b8963f 85%,transparent);
--dl-oro-rilievo:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(0,0,0,.35);
--dl-oro-ombra:0 4px 12px rgba(184,150,63,.38);
--dl-ombra-card:0 14px 34px rgba(20,16,8,.08);
--dl-bordo:#e9e4da;
}
/* ---------- 1. bottoni: un solo carattere, un solo hover ---------- */
html body .button, html body a.button, html body button.button, html body .single_add_to_cart_button, html body .checkout-button,
html body #place_order, html body .dl-page-btn, html body .dl-btn--primary, html body .dl-newsletter__btn, html body .dl-hero-search__btn,
html body .dl-filter-bar__btn, html body .dl-wishlist-btn, html body .dl-share-btn, html body .woocommerce button.button, html body .woocommerce input.button,
html body .woocommerce-form-login .button, html body .woocommerce-form-register .button, html body .dl-cassa-barra a.button{
font-family:inherit; font-weight:600 !important; letter-spacing:.16em !important; text-transform:uppercase !important; font-size:12px !important;
border-radius:2px !important; transition:background .25s ease,color .25s ease,border-color .25s ease,box-shadow .25s ease,transform .2s ease !important;
}
html body .button:hover, html body a.button:hover, html body button.button:hover, html body .woocommerce a.button:hover, html body ul.products li.product a.button:hover,
html body ul.products li.product .button:hover, html body .single_add_to_cart_button:hover, html body button.single_add_to_cart_button.button:hover,
html body .checkout-button:hover, html body #place_order:hover, html body .wc-block-components-button:hover, html body .dl-page-btn:hover, html body .dl-btn--primary:hover,
html body .dl-hero-search__btn:hover, html body .dl-newsletter__btn:hover, html body .dl-filter-bar__btn:hover, html body .dl-wishlist-btn:hover, html body .dl-share-btn:hover,
html body .woocommerce button.button:hover, html body .woocommerce input.button:hover, html body .dl-social-btn:hover, html body .dl-cassa-barra a.button:hover,
html body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover, html body .dl-subcat-filter__item:hover, html body .dl-subcat-filter__item.is-current,
html body .button:focus-visible, html body .single_add_to_cart_button:focus-visible, html body #place_order:focus-visible{
background:var(--dl-oro-metallo) !important; background-color:#b8963f !important; border-color:var(--dl-oro-bordo) !important;
color:#fff !important; -webkit-text-fill-color:#fff !important; text-shadow:0 1px 2px rgba(0,0,0,.65),0 0 1px rgba(0,0,0,.4) !important;
box-shadow:var(--dl-oro-rilievo),var(--dl-oro-ombra) !important; transform:translateY(-1px); outline:none !important;
}
html body .button:hover *, html body .dl-social-btn:hover *, html body .dl-subcat-filter__item.is-current *, html body .dl-subcat-filter__item:hover *{ color:#fff !important; -webkit-text-fill-color:#fff !important; }
html body .button:active, html body .single_add_to_cart_button:active, html body #place_order:active{ transform:translateY(0); box-shadow:var(--dl-oro-rilievo) !important; }
html body .dl-wishlist-btn, html body .dl-share-btn{ min-height:44px !important; padding:0 18px !important; display:inline-flex !important; align-items:center !important; border-radius:2px !important; border:1px solid #111 !important; background:#fff !important; color:#111 !important; }
/* ---------- 2. card prodotto ---------- */
html body ul.products li.product{ border:1px solid var(--dl-bordo) !important; border-radius:4px !important; background:#fff !important; transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease !important; }
html body ul.products li.product:hover{ transform:translateY(-4px); box-shadow:var(--dl-ombra-card) !important; border-color:var(--dl-oro-a) !important; }
html body ul.products li.product .ct-media-container{ overflow:hidden !important; }
html body ul.products li.product .ct-media-container img{ transition:transform .5s cubic-bezier(.2,.7,.2,1) !important; }
html body ul.products li.product:hover .ct-media-container img{ transform:scale(1.045); }
html body ul.products li.product .woocommerce-loop-product__title, html body ul.products li.product .woocommerce-loop-product__title a, html body ul.products li.product .dl-clamp3{ color:#141414 !important; font-weight:500 !important; transition:color .2s; }
html body ul.products li.product:hover .woocommerce-loop-product__title a, html body ul.products li.product:hover .dl-clamp3{ color:var(--dl-oro-scuro) !important; }
html body .dl-pc-mini, html body .dl-pc-mini.dl-pc--fast{ display:inline-flex !important; width:auto !important; align-items:center; justify-content:center; margin:8px auto 0 !important; background:var(--dl-oro-metallo) !important; color:#fff !important; border:1px solid var(--dl-oro-bordo) !important; border-radius:999px !important; text-shadow:0 1px 1px rgba(0,0,0,.45); box-shadow:var(--dl-oro-rilievo); font-weight:700 !important; font-size:10px !important; letter-spacing:.1em !important; padding:4px 12px !important; line-height:1 !important; }
html body ul.products li.product{ text-align:center; }
html body .dl-pc-mini.dl-pc--slow{ background:#f4f1ea !important; color:#6b6155 !important; border-color:#ddd5c4 !important; text-shadow:none; box-shadow:none; }
html body .dl-mini-chips .t{ background:var(--dl-oro-tinta) !important; color:#5a4a1a !important; border:1px solid #d9c98f !important; border-radius:4px !important; font-weight:600 !important; }
html body .dl-pc.dl-pc--fast{ color:#5a4a1a !important; background:var(--dl-oro-tinta) !important; border-color:#d9c98f !important; }
html body .dl-box-taglie .righe .t::after{ color:var(--dl-oro-scuro); }
/* ---------- 3. sezioni della home: occhiello, filetto, "vedi tutti" ---------- */
html body .dl-best__eyebrow{ color:var(--dl-oro-scuro) !important; letter-spacing:.18em !important; font-weight:600 !important; }
html body .dl-best__title{ position:relative; padding-bottom:14px !important; }
html body .dl-best__title::after{ content:""; position:absolute; left:0; bottom:0; width:72px; height:3px; border-radius:2px; background:var(--dl-oro-filetto); }
html body .dl-home-dyn a[href$="/"]:not(.button):not(.woocommerce-LoopProduct-link):not(.ct-media-container){ color:var(--dl-oro-scuro) !important; }
html body .dl-faq__title{ position:relative; padding-bottom:16px; }
html body .dl-faq__title::after{ content:""; position:absolute; left:50%; bottom:0; width:72px; height:3px; margin-left:-36px; border-radius:2px; background:var(--dl-oro-filetto); }
html body .dl-faq__item{ border-left:3px solid transparent !important; transition:border-color .25s, box-shadow .25s; }
html body .dl-faq__item[open]{ border-left-color:var(--dl-oro-a) !important; box-shadow:0 8px 24px rgba(20,16,8,.06); }
html body .dl-faq__item summary:hover{ color:var(--dl-oro-scuro) !important; }
/* ---------- 4. newsletter e footer ---------- */
html body .dl-newsletter__input{ background:rgba(255,255,255,.04) !important; border:1px solid rgba(255,255,255,.28) !important; border-radius:2px !important; color:#fff !important; padding:0 16px !important; min-height:48px !important; transition:border-color .25s, box-shadow .25s; }
html body .dl-newsletter__input:focus{ border-color:var(--dl-oro-a) !important; box-shadow:0 0 0 3px rgba(184,150,63,.22) !important; outline:none !important; }
html body .dl-newsletter__gdpr a{ color:var(--dl-oro-chiaro) !important; }
html body .dl-newsletter__btn{ background:#fff !important; color:#111 !important; border:1px solid #fff !important; min-height:48px !important; padding:0 28px !important; }
html body footer.dl-footer h4, html body footer.dl-footer .dl-footer__title, html body footer.dl-footer .widget-title, html body footer.dl-footer h3{ color:var(--dl-oro-a) !important; letter-spacing:.18em !important; }
html body footer.dl-footer a:hover{ color:var(--dl-oro-chiaro) !important; }
html body .dl-social-btn{ transition:all .25s ease !important; }
/* ---------- 5. testata e menu ---------- */
html body .site-header .dl-nav > .dl-nav-item > a, html body .site-header .dl-nav > a:not(.dl-nav-pc){ background-image:var(--dl-oro-filetto); background-repeat:no-repeat; background-position:center calc(100% + 4px); background-size:0 2px; transition:background-size .25s ease, color .2s ease; padding-bottom:6px; }
html body .site-header .dl-nav > .dl-nav-item:hover > a, html body .site-header .dl-nav > a:not(.dl-nav-pc):hover{ background-size:100% 2px; }
html body .site-header .dl-nav > a.dl-nav-pc{ background:var(--dl-oro-testo); -webkit-background-clip:text; background-clip:text; color:transparent !important; -webkit-text-fill-color:transparent; font-weight:700 !important; }
html body .site-header .dl-nav > a.dl-nav-pc:hover{ -webkit-text-fill-color:#fff; color:#fff !important; }
/* ---------- 6. categoria: box filtri, chip, briciole, barra ---------- */
html body .dl-subcat-filter{ border-width:0 !important; border-radius:6px !important; box-shadow:0 0 0 1px var(--dl-bordo),0 6px 20px rgba(20,16,8,.05) !important; background:#fff !important; }
html body .dl-subcat-filter__label{ color:var(--dl-oro-scuro) !important; letter-spacing:.16em !important; font-weight:600 !important; }
html body .dl-subcat-filter__item{ border-radius:999px !important; border:1px solid var(--dl-bordo) !important; transition:all .2s ease !important; }
html body .dl-subcat-filter__item .dl-subcat-filter__count{ opacity:.7; }
html body .dl-subcat-filter__item.is-current, html body .dl-subcat-filter__item:hover{ transform:none; box-shadow:var(--dl-oro-rilievo) !important; }
html body .woocommerce-breadcrumb a{ color:var(--dl-oro-scuro) !important; }
html body .woocommerce-breadcrumb a:hover{ color:var(--dl-oro-a) !important; }
html body .woocommerce-ordering select.orderby{ border-radius:2px !important; border:1px solid #111 !important; min-height:48px !important; letter-spacing:.12em !important; text-transform:uppercase !important; font-size:12px !important; font-weight:600 !important; }
html body .dl-filter-bar__btn{ border:1px solid #111 !important; background:#fff !important; color:#111 !important; min-height:48px !important; }
/* ---------- 7. moduli: campi coerenti, focus oro ---------- */
html body .woocommerce form .form-row input.input-text, html body .woocommerce form .form-row textarea, html body .woocommerce form .form-row select, html body .woocommerce form .form-row .select2-selection,
html body #coupon_code, html body .woocommerce-cart-form input.qty, html body .woocommerce-form-login input.input-text, html body .woocommerce-form-register input.input-text, html body .woocommerce-EditAccountForm input.input-text{
border:1px solid #cfc8ba !important; border-radius:3px !important; background:#fff !important; transition:border-color .2s, box-shadow .2s !important; box-shadow:none !important;
}
html body .woocommerce form .form-row input.input-text:focus, html body .woocommerce form .form-row textarea:focus, html body .woocommerce form .form-row select:focus, html body #coupon_code:focus, html body .woocommerce-form-login input.input-text:focus, html body .woocommerce-form-register input.input-text:focus{
border-color:var(--dl-oro-a) !important; box-shadow:0 0 0 3px rgba(184,150,63,.18) !important; outline:none !important;
}
html body .woocommerce form .form-row.woocommerce-invalid input.input-text{ border-color:#b3261e !important; }
html body .woocommerce form .form-row label{ font-size:12px !important; letter-spacing:.06em !important; text-transform:uppercase !important; color:#333 !important; font-weight:600 !important; }
html body .woocommerce form .form-row .required{ color:var(--dl-oro-scuro) !important; }
html body .woocommerce-checkout #payment ul.payment_methods li{ border-radius:4px !important; transition:border-color .2s, box-shadow .2s; }
html body .woocommerce-checkout #payment ul.payment_methods li:has(input:checked){ border-color:var(--dl-oro-a) !important; box-shadow:inset 0 0 0 1px var(--dl-oro-a) !important; }
html body .woocommerce-checkout #payment input[type=radio]:checked{ accent-color:var(--dl-oro-scuro); }
html body .woocommerce-info, html body .woocommerce-message{ border-top-color:var(--dl-oro-a) !important; }
/* errori della cassa leggibili (misurato: testo scuro su rosso acceso, contrasto < 2:1) */
html body .woocommerce-error, html body .woocommerce-NoticeGroup .woocommerce-error{ background:#fdf3f2 !important; color:#7a1f1f !important; border:1px solid #f1c7c2 !important; border-left:4px solid #b3261e !important; border-radius:4px !important; }
html body .woocommerce-error li, html body .woocommerce-error a, html body .woocommerce-error strong{ color:#7a1f1f !important; }
html body .woocommerce-error::before{ color:#b3261e !important; }
html body .woocommerce-NoticeGroup, html body .woocommerce-error{ scroll-margin-top:130px; }
html body .woocommerce-info::before, html body .woocommerce-message::before{ color:var(--dl-oro-scuro) !important; }
/* ---------- 8. scheda prodotto ---------- */
html body .wc-pao-addon-wrap .wc-pao-addon-radio + label{ transition:border-color .2s, box-shadow .2s, background .2s !important; border-radius:3px !important; }
html body .wc-pao-addon-wrap .wc-pao-addon-radio:checked + label{ border-color:var(--dl-oro-a) !important; box-shadow:inset 0 0 0 1px var(--dl-oro-a) !important; background:var(--dl-oro-tinta) !important; font-weight:700 !important; }
html body .wc-pao-addon-wrap .wc-pao-addon-radio + label:hover{ border-color:var(--dl-oro-a) !important; }
html body .dl-prezzo-vero .woocommerce-Price-amount{ font-weight:700 !important; }
html body .dl-r467-trust-badges{ grid-template-columns:repeat(3,1fr) !important; background:var(--dl-oro-tinta) !important; border:1px solid #efe6d1 !important; border-radius:6px !important; }
html body .dl-r467-trust-badges > a > span:first-child{ color:var(--dl-oro-scuro) !important; }
html body .woocommerce-tabs ul.tabs li.active a{ color:#111 !important; }
html body .woocommerce-tabs ul.tabs li.active::after, html body .woocommerce-tabs ul.tabs li.active a::after{ background:var(--dl-oro-filetto) !important; }
html body .related.products > h2, html body section.related h2{ font-size:22px !important; letter-spacing:.12em !important; text-transform:uppercase !important; font-weight:700 !important; position:relative; padding-bottom:14px !important; text-align:center; }
html body .related.products > h2::after, html body section.related h2::after{ content:""; position:absolute; left:50%; bottom:0; width:72px; height:3px; margin-left:-36px; border-radius:2px; background:var(--dl-oro-filetto); }
/* ---------- 9. carrello e cassa: riquadri, totale, blocco express vuoto ---------- */
html body .cart_totals, html body .woocommerce-checkout-review-order{ border-radius:6px !important; }
html body .woocommerce-cart-form button[name="update_cart"]{ display:none !important; }
html body .woocommerce-cart-form .coupon .button{ background:#fff !important; color:#111 !important; border:1px solid #111 !important; }
html body .cart_totals .order-total .amount, html body .woocommerce-checkout-review-order .order-total .amount{ color:var(--dl-oro-scuro) !important; font-weight:700 !important; }
html body .dl-express-vuoto, html body .dl-r748-oppure.dl-orfano, html body .wcpay-express-checkout-button-separator.dl-orfano{ display:none !important; height:0 !important; min-height:0 !important; margin:0 !important; padding:0 !important; }
/* ---------- 10. dettagli comuni ---------- */
html body #dl-r475{ border-radius:999px !important; box-shadow:0 4px 14px rgba(0,0,0,.14) !important; font-size:12px !important; }
html body .dl-hero-search__btn, html body #dl-r412-real-search button{ border-radius:999px !important; }
html body ::selection{ background:rgba(184,150,63,.28); }
/* Il cestino del carrello su telefono era 22 x 44 px: largo la meta del bersaglio di casa (44).
Misurato il 16/09 a 501 px. Solo sotto i 600 px: sopra c e il tondo da 34 px della colonna Rimuovi. */
@media (max-width:600px){
html body .woocommerce-cart-form a.remove{
display:inline-flex !important; align-items:center !important; justify-content:center !important;
width:44px !important; min-width:44px !important; height:44px !important;
}
}
/* Carrello, colonna "Rimuovi": era un "x" di 9x18 px sul bordo della tabella (misurato 16/09).
Diventa un bersaglio rotondo di 34 px, centrato. Su telefono il comando e' un altro
(.product-mobile-actions, il cestino) e resta com era. */
html body .woocommerce-cart-form td.product-remove,
html body .woocommerce-cart-form th.product-remove{ width:58px !important; text-align:center !important; padding-right:10px !important; }
html body .woocommerce-cart-form td.product-remove a.remove{
display:inline-flex !important; align-items:center !important; justify-content:center !important;
width:34px !important; height:34px !important; min-width:34px !important;
font-size:19px !important; line-height:1 !important; border-radius:50% !important;
background:#fff !important; color:#8a1f1f !important; border:1px solid #e6dfd2 !important;
text-decoration:none !important;
}
html body .woocommerce-cart-form td.product-remove a.remove:hover,
html body .woocommerce-cart-form td.product-remove a.remove:focus-visible{
background:#faf6ee !important; border-color:#b8963f !important; color:#8a1f1f !important;
}
/* ---------- 11. rifiniture del 16/09/2026 (registro par.105 e 106) ---------- */
/* Il separatore "oppure" della cassa aveva line-height:0 e nessun margine: finiva esattamente dove
comincia "Dettagli di fatturazione" (misurato: 449 px contro 449 px). Qui prende aria. */
html body .wcpay-express-checkout-wrapper{ margin-bottom:26px !important; }
html body #wcpay-express-checkout-button-separator,
html body .wcpay-express-checkout-button-separator,
html body .dl-r748-oppure{ line-height:1.25 !important; margin-top:16px !important; }
@media (max-width:600px){
html body .wcpay-express-checkout-wrapper{ margin-bottom:20px !important; }
html body #wcpay-express-checkout-button-separator,
html body .wcpay-express-checkout-button-separator,
html body .dl-r748-oppure{ margin-top:12px !important; }
/* La pastiglia "Legale" (#dl-r475) e' fissa in basso a sinistra e su telefono passava sopra la riga
"CODICE: DL-..." in fondo alla scheda. Si rimpicciolisce e si accosta all angolo: resta leggibile e
cliccabile, perche' e' la scorciatoia alle pagine legali e non si nasconde. */
html body #dl-r475{ font-size:10.5px !important; padding:4px 8px !important; left:10px !important; bottom:10px !important; }
}
/* dl-r750-oro */
:root{
/* ---- LE TRE VARIABILI CHE ESISTEVANO GIA' ----
Trovate misurando, non leggendo il codice: `a.dl-best__link` restava rosso e
NESSUNA regola lo toccava. Il rosso arrivava da una variabile, e il censimento
cercava il codice esadecimale — che dentro `var(--qualcosa)` non c'e'.
`--dl-gold` si chiama «gold» ma conteneva #E50914: qualcuno aveva l'oro e l'ha
ridipinto di rosso senza rinominare la variabile. Adesso torna a mantenere cio'
che il suo nome promette.
Sono definite in `wp-custom-css` (il Customizer, che non si tocca) e in
`dl-css-bundle`. Qui vengono ridefinite: stessa specificita' di `:root`, ma
stampate dopo, quindi vincono. Cosi' **14 regole cambiano colore da sole**,
comprese quelle che non ho enumerato. */
--dl-gold: #826C34;
--dl-red: #826C34;
--dl-red-deep: #6E5A28;
/* ---- i token nuovi ---- */
--dl-oro: #826C34;
--dl-oro-ombra: #6E5A28;
--dl-oro-medio: #C9B37E;
--dl-oro-luce: #E7DCBB;
--dl-oro-riflesso: #F7F1DE;
--dl-oro-metallo: linear-gradient(100deg,#6E5A28 0%,#826C34 16%,#C9B37E 34%,#E7DCBB 47%,#F7F1DE 52%,#E7DCBB 57%,#C9B37E 70%,#826C34 86%,#6E5A28 100%);
}
.dl-brand-filter__active:hover{
background-color: var(--dl-oro);
}
.dl-subcat-filter__item:hover{
color: var(--dl-oro);
}
.dl-hero-search__btn:hover, .dl-hero-search button[type="submit"]:hover, .dl-hero-search__submit:hover{
background-color: var(--dl-oro) !important;
}
html body [style*="C8A64B"], html body [style*="c8a64b"]{
color: var(--dl-oro) !important;
}
html body svg[stroke*="C8A64B"], html body svg[stroke*="c8a64b"], html body svg [stroke*="C8A64B"], html body svg [stroke*="c8a64b"]{
stroke: var(--dl-oro) !important;
}
html body svg[fill*="C8A64B"], html body svg[fill*="c8a64b"], html body svg [fill*="C8A64B"], html body svg [fill*="c8a64b"]{
fill: var(--dl-oro) !important;
}
.dl-page .dl-page-step-num{
color: var(--dl-oro) !important;
}
.dl-page .dl-page-cta-eyebrow{
color: var(--dl-oro) !important;
}
html body[class] .dl-page-cta a.dl-page-btn:hover{
background-color: var(--dl-oro) !important;
border-bottom-color: var(--dl-oro) !important;
border-left-color: var(--dl-oro) !important;
border-right-color: var(--dl-oro) !important;
border-top-color: var(--dl-oro) !important;
}
html body .dl-hero-img .dl-btn--primary:hover{
background-color: var(--dl-oro) !important;
border-bottom-color: var(--dl-oro) !important;
border-left-color: var(--dl-oro) !important;
border-right-color: var(--dl-oro) !important;
border-top-color: var(--dl-oro) !important;
}
body.home .dl-btn--primary:hover{
background-color: var(--dl-oro) !important;
border-bottom-color: var(--dl-oro) !important;
border-left-color: var(--dl-oro) !important;
border-right-color: var(--dl-oro) !important;
border-top-color: var(--dl-oro) !important;
}
body .entry-content a:not(.dl-btn):not(.dl-best__link):not(.dl-courier):not(.dl-social-btn){
color: var(--dl-oro);
}
html body.home .dl-hero-img .dl-btn--primary:hover, html body.page-id-71 .dl-hero-img .dl-btn--primary:hover{
background-color: var(--dl-oro) !important;
border-bottom-color: var(--dl-oro) !important;
border-left-color: var(--dl-oro) !important;
border-right-color: var(--dl-oro) !important;
border-top-color: var(--dl-oro) !important;
}
.site-header.dl-header--dark .dl-nav a:hover{
color: var(--dl-oro-medio) !important;
}
.site-header.dl-header--dark .dl-nav a.active{
border-bottom-color: var(--dl-oro) !important;
}
.site-header.dl-header--dark .dl-utility a:hover{
color: var(--dl-oro-medio) !important;
}
.site-header.dl-header--dark .dl-utility .dl-bag-count{
background-color: var(--dl-oro);
}
html body.home #dlHero .dl-hero-img__eyebrow{
color: var(--dl-oro-medio) !important;
}
.b-supreme{
background-color: var(--dl-oro);
}
.dl-mega-list a:hover{
color: var(--dl-oro-medio) !important;
}
.site-header.dl-header--dark .dl-nav .dl-mega-list a:hover, html body .dl-mega-list a:hover{
color: var(--dl-oro-medio) !important;
}
.dl-hero-search__suggestion-price ins, .dl-hero-search__suggestion-price .sale-price{
color: var(--dl-oro) !important;
}
.cmplz-cookiebanner .cmplz-btn.cmplz-accept, .cmplz-cookiebanner button.cmplz-accept-all, .cmplz-cookiebanner button.cmplz-accept{
/* 12/09/2026 (decisione del titolare): a riposo l'oro dei bottoni #826C34 (5,05:1 con la scritta bianca,
lo stesso dei bottoni di testo di #1104); con --dl-oro (#B08A2E) Lighthouse misurava 3,22:1 sul bottone
«Accetta». L'oro chiaro resta per il passaggio del mouse. Letterale e non var(--dl-gold): #899 la forza a
#E50914 con !important. */
background-color: #826C34 !important;
border-bottom-color: #826C34 !important;
border-left-color: #826C34 !important;
border-right-color: #826C34 !important;
border-top-color: #826C34 !important;
}
.cmplz-cookiebanner .cmplz-btn.cmplz-accept:hover, .cmplz-cookiebanner .cmplz-btn.cmplz-accept:focus-visible, .cmplz-cookiebanner button.cmplz-accept-all:hover, .cmplz-cookiebanner button.cmplz-accept:hover{
background-color: var(--dl-oro) !important;
border-color: var(--dl-oro) !important;
}
.woocommerce-checkout #payment ul.payment_methods li[class*="klarna"]::after{
color: var(--dl-oro);
}
.dl-mega-list li.is-new a::after{
background-color: var(--dl-oro);
}
.dl-toast{
border-left-color: var(--dl-oro);
}
.dl-toast a{
color: var(--dl-oro-medio) !important;
}
.dl-toast__cta{
color: var(--dl-oro-medio) !important;
}
a:visited:not(.button):not(.btn):not(.dl-mega-sneakers__item):not([class*="cta"]){
color: #826C34;
}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [role="button"]:focus-visible, [tabindex]:focus-visible{
outline-color: var(--dl-oro) !important;
}
.skip-link, a.skip-link, a[href="#content"], a[href="#main"]{
border-bottom-color: var(--dl-oro);
border-left-color: var(--dl-oro);
border-right-color: var(--dl-oro);
border-top-color: var(--dl-oro);
}
input[type="checkbox"]:checked{
background-color: var(--dl-oro) !important;
border-bottom-color: var(--dl-oro) !important;
border-left-color: var(--dl-oro) !important;
border-right-color: var(--dl-oro) !important;
border-top-color: var(--dl-oro) !important;
}
input[type="radio"]:checked{
border-bottom-color: var(--dl-oro) !important;
border-left-color: var(--dl-oro) !important;
border-right-color: var(--dl-oro) !important;
border-top-color: var(--dl-oro) !important;
}
html body .product .price ins .woocommerce-Price-amount, html body .price ins{
color: var(--dl-oro) !important;
}
body .woocommerce-tabs ul.tabs li.active{
border-bottom-color: var(--dl-oro) !important;
}
html body .dl-footer-cols a:hover{
color: var(--dl-oro-medio) !important;
}
.dl-subcat-filter__label::before{
color: var(--dl-oro) !important;
}
html body a.dl-subcat-filter__item:hover, html body a.dl-subcat-filter__item:hover span{
color: var(--dl-oro) !important;
}
.dl-filter-drawer .ct-widget li a:hover{
color: var(--dl-oro) !important;
}
form.cart.dl-r679-added a.added_to_cart:hover{
background-color: var(--dl-oro);
border-bottom-color: var(--dl-oro);
border-left-color: var(--dl-oro);
border-right-color: var(--dl-oro);
border-top-color: var(--dl-oro);
}
.dl-paga-rapido a:focus-visible{
outline-color: var(--dl-oro);
}
@media (max-width: 1023px){
.dl-mobile-nav .dl-section-header{
color: var(--dl-oro-medio);
}
#dl76-drawer ul a:active{
color: var(--dl-oro-medio);
}
}
@media (max-width: 1023.98px){
details.dl-mobile-nav summary::after{
color: var(--dl-oro-medio);
}
details.dl-mobile-nav details > ul{
border-left-color: var(--dl-oro);
}
html body[class] details.dl-mobile-nav summary::after{
color: var(--dl-oro-medio) !important;
}
html body[class] details.dl-mobile-nav details > ul{
border-left-color: var(--dl-oro) !important;
}
.dl-drawer-close:hover, .dl-drawer-close:focus{
background-color: var(--dl-oro) !important;
border-bottom-color: var(--dl-oro) !important;
border-left-color: var(--dl-oro) !important;
border-right-color: var(--dl-oro) !important;
border-top-color: var(--dl-oro) !important;
}
}
/* ---------------------------------------------------------------- *
* IL MARCHIO: la corona diventa oro, la scritta resta bianca.
*
* ============ ERRORE MIO, TROVATO E CORRETTO IL 01/09 ALLE 17:40 ============
* Alle 13:55 ho puntato questi due sfondi al file **originale**:
* .../uploads/2026/09/DL_LOGO_LIVE_ORO.png 1780x1780, **1.484 KB**
* mostrato a **54x54** nella testata e 110x110 nel piede, **su ogni pagina**.
*
* Il logo vecchio non pesava, e io l'avevo pure verificato e scritto: «Photon
* serve una copia a 220px». Vero — ma quel logo era chiamato con un indirizzo
* `i0.wp.com`. Il mio no: indirizzo diretto al sito, quindi **niente Photon,
* niente ridimensionamento, niente WebP**. E gli sfondi CSS non hanno `srcset`.
* Un megabyte e mezzo per una corona da cinquantaquattro pixel.
*
* Misurato il costo delle alternative, sullo stesso file:
* originale 1.484 KB PNG
* Photon ?w=180 11 KB WebP <- testata (54px x3 = 162)
* Photon ?w=360 43 KB WebP <- piede (110px x3 = 330)
* Photon ?w=540 97 KB WebP
*
* Adesso sono 54 KB in tutto invece di 1.484: **-96%**, e l'immagine e' piu'
* nitida di prima perche' WebP a 180px batte un PNG rimpicciolito dal browser
* da 1780. La qualita' non ci perde niente: ci guadagna.
*
* > La regola: **un'immagine di marca va sempre chiamata da Photon con `?w=`**.
* > Il file originale grande serve per rigenerare, non per essere servito.
*
* Il logo non e' un ![]()
ma uno **sfondo CSS** su `.dl-logo-bg` (testata) e
* `.dl-logo-f` (piede), messo dallo snippet `dl-logo-final`; l'![]()
vero e'
* `display:none`. Quindi si sostituisce da qui, senza toccare quello snippet.
*
* Selettori identici agli originali, `!important` come li' avevano, stampati dopo.
* ATTENZIONE ALLA FONTE. Il sito non usa `DL_LOGO.png` ma `DL_LOGO-e1777491952847.png`,
* cioe' una versione **ritagliata** in WordPress: 1780x1780 quadrata, senza la stellina
* che l'originale ha in basso a destra. Il primo tentativo aveva ricolorato l'originale
* (2108x2048, non quadrato): proporzioni diverse e la stellina di ritorno. Rifatto sul
* file davvero in uso, corona a y 297-670.
*
* E una correzione: avevo scritto che il logo «pesa 3,7 MB e lo paga ogni visita».
* **Falso.** Photon serve una copia ridimensionata a 220px: l'originale grande non
* arriva mai al cliente. Il vantaggio del file nuovo e' la corona, non il peso.
*
* Rollback: spegnere questo snippet. L'originale non e' stato toccato ed e' ancora
* nella libreria media.
* ---------------------------------------------------------------- */
body .dl-logo-h .dl-logo-bg, html body .site-header .dl-logo-h .dl-logo-bg{
background-image: url("https://i0.wp.com/designerlondon.store/wp-content/uploads/2026/09/DL_LOGO_LIVE_ORO.png?w=180&ssl=1") !important;
}
body footer .dl-logo-f, html body .site-footer .dl-logo-f{
background-image: url("https://i0.wp.com/designerlondon.store/wp-content/uploads/2026/09/DL_LOGO_LIVE_ORO.png?w=360&ssl=1") !important;
}
/* dl-r751-proporzioni */
@media (max-width: 1023.98px){
:root{
--dl-t-micro: 12px; --dl-i-micro: 1.5;
--dl-t-piccolo: 13px; --dl-i-piccolo: 1.5;
--dl-t-corpo: 15px; --dl-i-corpo: 1.55;
--dl-t-prezzo: 17px; --dl-i-prezzo: 1.25;
--dl-t-h3: 21px; --dl-i-h3: 1.25;
--dl-t-scheda: 24px; --dl-i-scheda: 1.2;
--dl-t-h2: 26px; --dl-i-h2: 1.15;
--dl-t-h1: 32px; --dl-i-h1: 1.05;
}
/* ---------- 1. IL NOME DEL PRODOTTO: il testo piu' letto del negozio ----------
Nelle card stava a 14px, nella striscia a 13px. Stessa cosa, stessa misura. */
html body a.woocommerce-LoopProduct-link,
html body .woocommerce-loop-product__title,
html body span.dl-clamp3,
html body .dl-r459-name{
font-size: var(--dl-t-corpo) !important;
line-height: var(--dl-i-corpo) !important;
letter-spacing: 0 !important;
}
/* ---------- 2. IL PREZZO: 13, 14 e 15px in tre posti diversi ----------
Ora uno solo, e piu' grande del nome: e' il numero che decide l'acquisto. */
html body .price bdi,
html body .price .woocommerce-Price-amount,
html body bdi.woocommerce-Price-amount,
html body .dl-r459-price,
html body .r742-price{
font-size: var(--dl-t-prezzo) !important;
line-height: var(--dl-i-prezzo) !important;
font-weight: 700 !important;
}
/* «IVA inclusa» era **grassetto a 12px**, 102 volte: competeva col prezzo
invece di stargli sotto. Torna a essere una nota. */
html body small.woocommerce-price-suffix,
html body .woocommerce-price-suffix{
font-size: var(--dl-t-micro) !important;
line-height: var(--dl-i-micro) !important;
font-weight: 400 !important;
opacity: .72 !important;
}
/* ---------- 3. IL BOTTONE «SCEGLI»: 11px in un posto, 12px in un altro ---------- */
html body a.button,
html body a.button.product_type_variable,
html body .woocommerce a.button,
html body button.button,
html body .dl-btn,
html body input[type="submit"]{
font-size: var(--dl-t-piccolo) !important;
line-height: 1.2 !important;
letter-spacing: .06em !important;
}
/* ---------- 4. I TITOLI: tre misure di h2, e l'h1 della scheda piu' piccolo
di quello della categoria. Una gerarchia sola. ---------- */
html body h1.page-title,
html body h1.entry-title:not(.product_title){
font-size: var(--dl-t-h1) !important;
line-height: var(--dl-i-h1) !important;
text-wrap: balance;
}
html body h1.product_title,
html body h1.product_title.entry-title{
font-size: var(--dl-t-scheda) !important;
line-height: var(--dl-i-scheda) !important;
text-wrap: balance;
}
html body h2.dl-best__title,
html body h2.dl-faq__title,
html body h3.dl-newsletter__title,
html body .dl-page h2{
font-size: var(--dl-t-h2) !important;
line-height: var(--dl-i-h2) !important;
text-wrap: balance;
}
html body h2.dl-filter-drawer__title,
html body h3:not(.dl-newsletter__title),
html body .dl-aiuto-chat__t{
font-size: var(--dl-t-h3) !important;
line-height: var(--dl-i-h3) !important;
text-wrap: balance;
}
/* ---------- 5. IL CORPO: paragrafi, link di navigazione, voci di elenco ---------- */
html body .entry-content p,
html body .dl-newsletter__sub,
html body .dl-faq__sub,
html body .dl-aiuto-chat__s,
html body .dl-footer-copy,
html body .dl-footer-cols a,
html body .dl-nav a,
html body .dl-mobile-nav a{
font-size: var(--dl-t-corpo) !important;
line-height: var(--dl-i-corpo) !important;
}
html body .entry-content p{ text-wrap: pretty; }
/* ---------- 6. IL PAVIMENTO: niente sotto i 12px ----------
Marquee, occhielli, conteggi e etichette stavano a 10 e 11px. */
html body span.dl-marquee__item,
html body .dl-newsletter__eyebrow,
html body .dl-brand-strip__label,
html body .dl-pc-mini,
html body .dl-subcat-filter__label,
html body span.count,
html body .dl-subcat-filter__count,
html body .dl-filter-bar__count{
font-size: var(--dl-t-micro) !important;
line-height: var(--dl-i-micro) !important;
}
/* ---------- 7. I RAGGI: 4px e 5px sono indistinguibili da 6px a occhio,
e aggiungono solo disordine. Gli altri restano: 8, 10 e 12 stanno su
superfici piu' grandi e hanno una ragione. ---------- */
html body [style*="border-radius:4px"],
html body [style*="border-radius: 4px"]{ border-radius: 6px !important; }
/* ---------- 8. I BOTTONI DELLE CARD: perdevo di specificita' ----------
Sulla home il corpo lo impone `html body.home ul.products li.product .button`
da dl-css-bundle, che vale (0,4,4). La mia regola generica valeva (0,2,3) e
perdeva — correttamente, non per sfortuna. Qui la specificita' e' pareggiata
e superata di un elemento. Misurato con `chi-vince-misura.mjs`, non dedotto. */
html body.home ul.products li.product a.button,
html body.home ul.products li.product a.button.product_type_variable,
html body ul.products li.product a.button,
html body ul.products li.product a.button.product_type_variable,
html body .woocommerce ul.products li.product a.button{
font-size: var(--dl-t-piccolo) !important;
line-height: 1.2 !important;
}
/* le pastiglie delle taglie stavano a 11px */
html body .dl-mini-chips .t,
html body .dl-mini-chips span.t{
font-size: var(--dl-t-micro) !important;
}
}
/* dl-r752-account */
/* ================= 1. NIENTE BLU ================= */
/* il bottone «Accetto» dei cookie: era blu, e l'avevo messo io */
html body button.ct-cookies-accept-button,
html body .ct-cookies-accept-button,
html body .cookie-notification button.ct-cookies-accept-button{
background-color: #826C34 !important;
border-color: #826C34 !important;
color: #f5f5f2 !important;
}
/* breadcrumb, numeri di pagina, link nelle schede */
html body .woocommerce-breadcrumb a,
html body nav[aria-label*="readcrumb"] a,
html body .woocommerce-pagination.woocommerce-pagination a.page-number,
html body .dl-pc a,
html body .wc-pao-addon-container .wc-pao-addon-description a{
color: #826C34 !important;
-webkit-text-fill-color: #826C34 !important;
}
html body .dl-pc a:hover,
html body .dl-pc a:focus-visible,
html body .wc-pao-addon-container .wc-pao-addon-description a:hover{
color: #6E5A28 !important;
-webkit-text-fill-color: #6E5A28 !important;
}
/* il colore link di default, ereditato sulle card prodotto.
Misurato: li.product ha color rgb(0,0,0) -> «inherit» qui vuol dire nero. */
html body a.ct-media-container,
html body ul.products li.product a,
html body .dl-r459-card a{ color: inherit; }
/* il testo dell'avviso cookie era blu ardesia, su fondo bianco (misurato) */
html body .cookie-notification,
html body .ct-cookies-content,
html body .cookie-notification .container{ color: #2a2722 !important; }
/* i social del visualizzatore foto: blu di Facebook e Twitter */
html body a.pswp__share--facebook:hover,
html body a.pswp__share--twitter:hover{ background-color: #2a2722 !important; }
/* ================= 4. IL MODULO NON E' ROTTO ================= */
/* Finche' l'utente non ha interagito, il bordo resta neutro.
`:not(:focus)` protegge il bordo oro del campo su cui si sta scrivendo. */
html body input:invalid:not(:user-invalid):not(:focus),
html body .woocommerce form .form-row input:invalid:not(:user-invalid):not(:focus),
html body form.woocommerce-form input:invalid:not(:user-invalid):not(:focus){
border-color: rgba(10,10,10,.22) !important;
box-shadow: none !important;
}
/* e quando l'errore c'e' davvero si vede lo stesso, anche se il bordo e'
inchiodato dall'inline: l'anello e' un box-shadow, che nessuno scrive inline */
html body input:user-invalid{
border-color: #B3000F !important;
box-shadow: 0 0 0 2px rgba(179,0,15,.55) !important;
}
/* ================= UN SOLO OCCHIO ================= */
/* Il bottone e' alto 44px (bersaglio da dito, mio #982) e disegna l'occhio con
una mask 14x14 che di serie si RIPETE: tre occhi. Il bersaglio resta grande,
la maschera smette di ripetersi. */
html body [class*="password-input"] .show-password-input,
html body .password-input button.show-password-input,
html body form.woocommerce-form .show-password-input{
-webkit-mask-repeat: no-repeat !important;
mask-repeat: no-repeat !important;
-webkit-mask-position: center !important;
mask-position: center !important;
-webkit-mask-size: 14px 14px !important;
mask-size: 14px 14px !important;
background-repeat: no-repeat !important;
background-position: center !important;
}
/* ================= 3. AREA CLIENTE ================= */
@media (max-width: 1023.98px){
/* NIENTE FASCIA COL TITOLO: su telefono il tema NON mostra `h1.page-title`.
Avevo scritto la regola, l'ho fotografata, e nella foto il titolo non c'e'.
Una regola che non dipinge niente non resta nel file. */
/* le due colonne Accedi/Registrati diventano due schede leggibili */
html body.woocommerce-account .u-column1,
html body.woocommerce-account .u-column2{
background: #ffffff;
border: 1px solid rgba(10,10,10,.12);
border-radius: 6px;
padding: 20px 18px 22px;
margin-bottom: 18px;
}
html body.woocommerce-account .u-column1 > h2,
html body.woocommerce-account .u-column2 > h2{
font-size: 21px;
letter-spacing: .08em;
text-align: center;
margin: 0 0 18px;
}
/* campi: bordo neutro, altezza da dito, niente zoom su iOS.
Misurati prima: username 44px, password 40px. Il minimo comodo e' 48. */
html body.woocommerce-account .woocommerce-form-row input.input-text{
min-height: 48px;
border: 1px solid rgba(10,10,10,.22);
border-radius: 6px;
padding: 0 12px;
font-size: 16px;
}
html body.woocommerce-account .woocommerce-form-row input.input-text:focus{
border-color: #826C34 !important;
outline: 2px solid rgba(130,108,52,.35);
outline-offset: 1px;
}
/* «Password dimenticata?» sotto il campo, discreto, non un link vagante */
html body.woocommerce-account .woocommerce-LostPassword{
margin: -6px 0 16px;
font-size: 13px;
}
html body.woocommerce-account .woocommerce-LostPassword a{
color: #6E5A28 !important;
text-decoration: underline;
text-underline-offset: 2px;
}
/* il bottone principale occupa la riga: e' l'azione della pagina */
html body.woocommerce-account button.woocommerce-form-login__submit,
html body.woocommerce-account button.woocommerce-form-register__submit{
width: 100%;
min-height: 48px;
letter-spacing: .12em;
}
/* il vuoto fra «Accedi con Google» e il modulo era enorme */
html body.woocommerce-account .woocommerce-form-login{ margin-top: 8px; }
/* il menu dell'area cliente: voci da dito, separate, senza pallini.
NOTA: non verificabile da fuori, esiste solo a utente collegato. */
html body.woocommerce-account .woocommerce-MyAccount-navigation ul{
list-style: none; margin: 0 0 22px; padding: 0;
display: grid; gap: 1px; background: rgba(10,10,10,.12);
border: 1px solid rgba(10,10,10,.12); border-radius: 6px; overflow: hidden;
}
html body.woocommerce-account .woocommerce-MyAccount-navigation li{ margin: 0; background: #fff; }
html body.woocommerce-account .woocommerce-MyAccount-navigation li a{
display: flex; align-items: center; min-height: 52px; padding: 0 16px;
text-decoration: none; font-weight: 600; letter-spacing: .04em;
}
html body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{
background: #000000; color: #f5f5f2;
}
}
/* dl-r753-tavolozza */
:root{
--theme-palette-color-1: #826C34;
--theme-palette-color-2: #6E5A28;
--theme-palette-color-3: #514C43;
--theme-palette-color-4: #1A1712;
--theme-palette-color-5: #E5E1D9;
--theme-palette-color-6: #F5F3EE;
--theme-palette-color-7: #FBFAF7;
--theme-palette-color-8: #ffffff;
accent-color: #826C34;
}
/* il testo che si evidenzia col dito */
::selection{ background: #826C34; color: #ffffff; }
::-moz-selection{ background: #826C34; color: #ffffff; }
/* la riga evidenziata nelle tendine (ricerca, taglie): era rgb(56,117,215) */
html body .select2-container--classic .select2-results__option--highlighted[aria-selected],
html body .select2-container--default .select2-results__option--highlighted[aria-selected],
html body .select2-container .select2-results__option--highlighted{
background-color: #826C34 !important;
color: #ffffff !important;
}
/* Complianz si porta i suoi colori, non passa dalla tavolozza del tema */
html body .cmplz-link,
html body .cmplz-links a,
html body .cmplz-documents a,
html body #cmplz-manage-consent a,
html body .cmplz-cookiebanner a{
color: #826C34 !important;
}
/* il collegamento «salta al contenuto» era di un ciano slavato */
html body .screen-reader-text:focus{
color: #000000 !important;
background-color: #f5f5f2 !important;
}
/* dl-r756-bersagli */
@media (pointer: coarse), (max-width: 1023.98px){
/* --- «Scegli» sulle schede: 40-42px -> 44. Solo prodotti variabili. --- */
html body ul.products li.product a.button.product_type_variable,
html body .woocommerce ul.products li.product a.button.product_type_variable,
html body.home ul.products li.product a.button.product_type_variable{
height: 44px !important;
align-items: center !important;
justify-content: center !important;
}
/* --- briciole di pane: erano alte 40 --- */
html body nav.ct-breadcrumbs a,
html body .woocommerce-breadcrumb a{
display: inline-flex !important;
align-items: center !important;
height: 44px !important;
}
/* --- il tasto «mostra password» era largo 14px --- */
html body button.show-password-input,
html body .password-input button.show-password-input{
width: 44px !important;
inset-inline-end: 0 !important;
}
/* --- «Ricordami»: 22px e' sotto il minimo di WCAG 2.2 --- */
html body input#rememberme,
html body input[name="rememberme"]{
width: 24px !important;
height: 24px !important;
}
/* e la riga intera diventa toccabile, non solo la casella */
html body label.woocommerce-form__label-for-checkbox{
display: inline-flex !important;
align-items: center !important;
min-height: 44px !important;
gap: 10px;
}
/* --- IL PREZZO SI SPEZZAVA A META' FRASE ---
Nella foto della categoria si leggeva «160,00 € IVA» a capo «inclusa».
Dentro `span.price` ci sono due pezzi: l'importo a 17px e un
`small.woocommerce-price-suffix` a 12px, tutti e due in linea. A 130px di
larghezza la frase non ci sta e va a capo dove capita.
Il `small` NON ha stile inline, quindi si puo' toccare: messo a blocco,
il suffisso scende su una riga sua e non si spezza piu'. L'altezza della
scheda non cambia (20 + 18 = 38, come le due righe di prima). */
html body ul.products li.product span.price small.woocommerce-price-suffix,
html body ul.products li.product .price .woocommerce-price-suffix{
display: block !important;
font-size: 11px !important;
line-height: 1.35 !important;
margin-top: 1px !important;
white-space: nowrap !important;
opacity: .72;
}
/* --- «Salta al contenuto»: si vede solo col tasto TAB, ma e' un bersaglio --- */
html body a.skip-link{
min-width: 44px !important;
min-height: 44px !important;
}
}