:root { --ink:#1f2933; --muted:#6b7785; --line:#e2e6ea; --bg:#f6f7f9; --card:#fff; --accent:#1d4f91; --ok:#1b7f4b; --bad:#b3261e; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--ink); background:var(--bg); }
a { color:var(--accent); }
img { max-width:100%; height:auto; }
h1 { font-size:1.6rem; margin:0 0 1rem; } h2 { font-size:1.15rem; margin:0 0 .5rem; }
.container { max-width:1100px; margin:0 auto; padding:1.5rem 1rem 3rem; }
.site-header { display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; padding:.9rem 1rem; background:var(--card); border-bottom:1px solid var(--line); }
.site-header nav { display:flex; flex-wrap:wrap; gap:1rem; align-items:center; }
.brand { font-weight:700; text-decoration:none; color:var(--ink); }
.muted { color:var(--muted); }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; overflow:hidden; text-decoration:none; color:inherit; display:flex; flex-direction:column; }
.card:hover { border-color:var(--accent); }
.card-image { aspect-ratio:1/1; background:#eef0f3; }
.card-image img { width:100%; height:100%; object-fit:cover; display:block; }
.card-body { padding:.75rem; } .card-body h2 { font-size:1rem; }
.price { font-weight:700; margin:.25rem 0; }
.product { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2rem; }
.product-images { display:grid; gap:.75rem; } .product-images img { border-radius:8px; border:1px solid var(--line); }
.variants { padding-left:1.2rem; }
.panel { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:1.25rem; margin-bottom:1.25rem; overflow-x:auto; }
.narrow { max-width:420px; margin:2rem auto; }
.notice { text-align:center; padding:3rem 1rem; }
.stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:1rem; margin-bottom:1.25rem; }
.stat { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:1rem; }
.stat strong { display:block; font-size:1.8rem; } .stat span { color:var(--muted); font-size:.9rem; }
table { width:100%; border-collapse:collapse; background:var(--card); }
th, td { text-align:left; padding:.55rem .6rem; border-bottom:1px solid var(--line); vertical-align:middle; font-size:.93rem; }
th { color:var(--muted); font-weight:600; }
.details th { width:180px; }
.thumb { width:56px; } .thumb img { width:44px; height:44px; object-fit:cover; border-radius:4px; display:block; }
.thumbs { display:flex; flex-wrap:wrap; gap:.6rem; } .thumbs img { width:120px; height:120px; object-fit:cover; border-radius:6px; border:1px solid var(--line); }
label { display:block; margin-bottom:.9rem; font-size:.93rem; }
input[type=text], input[type=email], input[type=password], input[type=search] { display:block; width:100%; padding:.55rem .65rem; margin-top:.25rem; border:1px solid #c5ccd3; border-radius:6px; font:inherit; }
button { padding:.55rem 1rem; border:0; border-radius:6px; background:var(--accent); color:#fff; font:inherit; cursor:pointer; }
button.secondary { background:#fff; color:var(--accent); border:1px solid var(--accent); }
button.link { background:none; color:var(--accent); padding:0; text-decoration:underline; }
form.inline { display:inline-block; margin:0 .5rem .25rem 0; }
.search { display:flex; gap:.5rem; margin-bottom:1rem; max-width:480px; } .search input { margin-top:0; }
.flash { background:#e8f1fb; border:1px solid #b8d2ee; padding:.7rem .9rem; border-radius:6px; }
.flash-error { background:#fdecea; border-color:#f3b9b4; }
.badge { display:inline-block; padding:.1rem .5rem; border-radius:999px; font-size:.8rem; }
.badge-on { background:#e3f4ea; color:var(--ok); } .badge-off { background:#fdecea; color:var(--bad); }
.pager a, .pager strong { margin-right:.5rem; }
code { background:#eef0f3; padding:.1rem .3rem; border-radius:4px; }
@media (max-width:720px) { .product { grid-template-columns:1fr; } }
.small { font-size:.85rem; font-weight:400; }
.num { text-align:right; white-space:nowrap; }
tfoot td { border-bottom:0; } tr.total td { font-weight:700; border-top:2px solid var(--line); }
.qty { width:5rem; padding:.4rem; border:1px solid #c5ccd3; border-radius:6px; font:inherit; }
a.button { display:inline-block; padding:.55rem 1rem; border-radius:6px; background:var(--accent); color:#fff; text-decoration:none; }
.buy { margin:1rem 0; max-width:340px; }
select, textarea, input[type=number], input[type=tel] { display:block; width:100%; padding:.55rem .65rem; margin-top:.25rem; border:1px solid #c5ccd3; border-radius:6px; font:inherit; background:#fff; }
.checkout { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); gap:1.25rem; align-items:start; }
.checkout h2 { margin-top:1rem; } .checkout h2:first-of-type { margin-top:0; }
.field-error { display:block; color:var(--bad); font-size:.85rem; margin-top:.2rem; }
.bank { background:#eef0f3; padding:.75rem; border-radius:6px; }
@media (max-width:720px) { .checkout { grid-template-columns:1fr; } }

/* ---------- Storefront ---------- */
body.shop { --accent:#2f4a43; --bg:#faf8f5; --line:#e7e2da; background:var(--bg); }
body.shop h1, body.shop h2 { font-family:Georgia,"Times New Roman",serif; font-weight:600; letter-spacing:.01em; }
body.shop .container { max-width:1240px; padding:1.5rem 16px 3rem; }
.shop-header { background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; }
.shop-bar { max-width:1240px; margin:0 auto; padding:.8rem 16px; display:flex; align-items:center; gap:1.25rem; }
.logo { font:600 1.5rem Georgia,"Times New Roman",serif; color:var(--ink); text-decoration:none; flex:none; display:flex; align-items:center; }
.logo img { height:44px; width:auto; max-width:200px; display:block; }
.shop-search { flex:1; display:flex; max-width:560px; margin:0 auto; }
.shop-search input { flex:1; min-width:0; margin:0; padding:.6rem .9rem; border:1px solid #cfc8bd; border-right:0; border-radius:999px 0 0 999px; font:inherit; background:#fff; }
.shop-search button { border-radius:0 999px 999px 0; padding:.6rem 1.1rem; }
.cart-link { flex:none; color:var(--ink); text-decoration:none; font-weight:600; white-space:nowrap; }
.cart-count { display:inline-block; min-width:1.5rem; padding:.05rem .4rem; border-radius:999px; background:var(--accent); color:#fff; font-size:.8rem; text-align:center; }
.shop-nav { max-width:1240px; margin:0 auto; padding:0 16px; display:flex; gap:1.4rem; overflow-x:auto; white-space:nowrap; scrollbar-width:thin; }
.shop-nav a { padding:.6rem 0; color:var(--muted); text-decoration:none; border-bottom:2px solid transparent; font-size:.95rem; }
.shop-nav a:hover, .shop-nav a.active { color:var(--ink); border-bottom-color:var(--accent); }
.shop-footer { border-top:1px solid var(--line); background:#fff; text-align:center; color:var(--muted); font-size:.9rem; padding:1.5rem 16px; }
.list-head { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1rem; }
.list-head h1, .list-head p { margin:0; }
body.shop .grid { grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:1.25rem; }
body.shop .card { border-radius:10px; border-color:var(--line); transition:box-shadow .2s ease, border-color .2s ease; }
body.shop .card:hover { border-color:#cfc8bd; box-shadow:0 8px 24px rgba(40,35,25,.09); }
body.shop .card-image { position:relative; overflow:hidden; background:#fff; }
body.shop .card-image img { transition:transform .35s ease; }
body.shop .card:hover .card-image img { transform:scale(1.07); }
.card-badge { position:absolute; left:.6rem; top:.6rem; }
body.shop .card-body { padding:.85rem .9rem 1rem; }
body.shop .card-body h2 { font:500 .95rem/1.35 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; letter-spacing:0; margin:0 0 .35rem;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.55rem; }
body.shop .pager { display:flex; flex-wrap:wrap; gap:.4rem; justify-content:center; margin-top:2rem; }
body.shop .pager a, body.shop .pager strong { margin:0; padding:.4rem .8rem; border:1px solid var(--line); border-radius:6px; background:#fff; text-decoration:none; color:var(--ink); }
body.shop .pager strong { background:var(--accent); border-color:var(--accent); color:#fff; }
.crumbs { color:var(--muted); font-size:.9rem; margin:0 0 1rem; } .crumbs a { color:var(--muted); }
body.shop .product { grid-template-columns:minmax(0,11fr) minmax(0,9fr); gap:2.5rem; align-items:start; }
.gallery { display:grid; grid-template-columns:76px minmax(0,1fr); gap:.75rem; outline:none; position:sticky; top:7.5rem; }
.gallery-thumbs { display:flex; flex-direction:column; gap:.5rem; max-height:560px; overflow-y:auto; scrollbar-width:thin; }
.gallery-thumbs a { flex:none; display:block; width:68px; height:68px; border:2px solid var(--line); border-radius:8px; overflow:hidden; background:#fff; }
.gallery-thumbs a.active, .gallery-thumbs a:hover { border-color:var(--accent); }
.gallery-thumbs img { width:100%; height:100%; object-fit:cover; display:block; }
.gallery-main { position:relative; grid-column:2; aspect-ratio:1/1; max-height:560px; background:#fff; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.gallery:not(:has(.gallery-thumbs)) { grid-template-columns:minmax(0,1fr); }
.gallery:not(:has(.gallery-thumbs)) .gallery-main { grid-column:1; }
.gallery-main img { width:100%; height:100%; object-fit:contain; display:block; }
.gallery-arrow { position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; padding:0; border-radius:50%; background:rgba(255,255,255,.92); color:var(--ink); font-size:1.5rem; line-height:1; border:1px solid var(--line); }
.gallery-arrow.prev { left:.6rem; } .gallery-arrow.next { right:.6rem; }
.gallery-arrow:hover { background:#fff; border-color:var(--accent); }
.product-info h1 { font-size:1.55rem; line-height:1.3; margin-bottom:.6rem; }
.product-info h2 { margin-top:1.5rem; }
.price-large { font-size:1.6rem; margin:.25rem 0 .6rem; }
.buy-row { display:flex; gap:.75rem; align-items:flex-end; } .buy-row label { width:6rem; margin:0; } .buy-row button { flex:1; padding:.7rem 1rem; }
body.shop .buy { max-width:420px; }
.description { line-height:1.65; } .description table { margin:.5rem 0; }
@media (max-width:820px) {
    .shop-bar { flex-wrap:wrap; gap:.6rem 1rem; } .shop-search { order:3; flex-basis:100%; max-width:none; } .cart-link { margin-left:auto; }
    .shop-header { position:static; }
    body.shop .product { grid-template-columns:1fr; gap:1.25rem; }
    .gallery { position:static; grid-template-columns:minmax(0,1fr); }
    .gallery-main { grid-column:1; grid-row:1; }
    .gallery-thumbs { flex-direction:row; max-height:none; overflow-x:auto; overflow-y:hidden; }
    body.shop .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
}

/* ---------- Related and cross-sell rows ---------- */
.more { margin-top:3rem; padding-top:1.75rem; border-top:1px solid var(--line); }
.more > h2 { font-size:1.3rem; margin-bottom:1rem; }
.row-scroll { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(180px,208px); gap:1rem; overflow-x:auto; padding-bottom:.75rem; scroll-snap-type:x proximity; scrollbar-width:thin; }
.row-scroll .card { scroll-snap-align:start; }
.row-scroll .card-body h3 { font:500 .9rem/1.35 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; margin:0 0 .3rem;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.45rem; }
.row-scroll .card-body h3 a { color:inherit; text-decoration:none; }
.card.pick { cursor:default; } .card.pick .card-image { display:block; }
.pick-box { display:flex; align-items:center; gap:.45rem; margin:.4rem 0 0; font-size:.9rem; cursor:pointer; }
.pick-box input { width:1.1rem; height:1.1rem; accent-color:var(--accent); }
.bundle-bar { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem 1.5rem; margin-top:.75rem; padding:.9rem 1rem; background:#fff; border:1px solid var(--line); border-radius:10px; }
.bundle-bar .pick-box { margin:0; } .bundle-total { margin-left:auto; }
@media (max-width:820px) { .row-scroll { grid-auto-columns:46%; } .bundle-total { margin-left:0; } .bundle-bar button { width:100%; } }

/* ---------- Admin: cross-sell picker ---------- */
.panel h3 { font-size:1rem; margin:1.25rem 0 .5rem; }
.picker-filter { max-width:360px; margin-bottom:.5rem; display:block; width:100%; padding:.55rem .65rem; border:1px solid #c5ccd3; border-radius:6px; font:inherit; }
.picker { max-height:420px; overflow-y:auto; border:1px solid var(--line); border-radius:8px; }
.picker table { margin:0; } .picker tr:last-child td { border-bottom:0; } .picker tr[hidden] { display:none; }
.picker-empty { padding:.75rem; margin:0; }
.small-button { padding:.3rem .8rem; font-size:.9rem; }
.picker-copy { margin-top:1.25rem; }

/* ---------- Cross-sell set discount ---------- */
.set-note { margin:-.25rem 0 1rem; color:var(--muted); }
.card.pick .card-image { position:relative; }
.set-badge { position:absolute; right:.6rem; top:.6rem; background:#b3261e; color:#fff; font-weight:700; z-index:2; }
.together { margin:.15rem 0 0; color:var(--ok); }
.combo { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:.3rem; padding:.5rem; background:#fff; opacity:0; transition:opacity .2s ease; z-index:1; }
.combo img { width:calc(50% - 1rem); height:auto; aspect-ratio:1/1; object-fit:cover; border-radius:6px; border:1px solid var(--line); transform:none !important; }
.combo-plus { flex:none; width:1.6rem; height:1.6rem; border-radius:50%; background:var(--accent); color:#fff; font-weight:700; line-height:1.6rem; text-align:center; }
.card.pick:hover .combo, .card.pick:focus-within .combo { opacity:1; }

/* ---------- Colours of an article ---------- */
.colours { margin:1rem 0 1.25rem; }
.colours-title { margin:0 0 .5rem; }
.colours-list { display:flex; flex-wrap:wrap; gap:.5rem; }
.colour { width:68px; text-decoration:none; color:var(--ink); font-size:.72rem; line-height:1.2; text-align:center; }
.colour img { display:block; width:64px; height:64px; object-fit:cover; border-radius:8px; border:2px solid var(--line); background:#fff; margin-bottom:.2rem; }
.colour span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.colour:hover img, .colour.active img { border-color:var(--accent); }
.colour.active span { font-weight:700; }
.colour.disabled { color:var(--muted); cursor:not-allowed; position:relative; }
.colour.disabled img { opacity:.35; filter:grayscale(1); border-style:dashed; }
span.colour.disabled::after { content:""; position:absolute; left:6px; top:32px; width:52px; border-top:2px solid var(--muted); transform:rotate(-45deg); }
.colours-count { margin:.1rem 0 0; }
[data-ajax-section].is-busy { opacity:.6; pointer-events:none; }

/* A sold-out colour stays clickable but is shown struck through. */
a.colour.disabled { cursor:pointer; position:relative; }
a.colour.disabled::after { content:""; position:absolute; left:6px; top:32px; width:52px; border-top:2px solid var(--muted); transform:rotate(-45deg); }
a.colour.disabled.active img { opacity:.6; }

/* ---------- Categories, badges, attributes ---------- */
.shop-nav { overflow:visible; flex-wrap:wrap; gap:0 1.4rem; }
.nav-item { position:relative; }
.nav-item > a { display:block; }
.nav-sub { display:none; position:absolute; left:-.9rem; top:100%; min-width:220px; background:#fff; border:1px solid var(--line); border-radius:0 0 8px 8px; box-shadow:0 10px 24px rgba(40,35,25,.1); padding:.35rem 0; z-index:20; }
.nav-item:hover .nav-sub, .nav-item:focus-within .nav-sub { display:block; }
.shop-nav .nav-sub a { display:block; padding:.45rem .9rem; border-bottom:0; white-space:normal; }
.shop-nav .nav-sub a:hover { background:var(--bg); border-bottom:0; }
.nav-badge, .new-badge { background:#b3261e; color:#fff; font-weight:700; }
.nav-badge { display:inline-block; padding:0 .4rem; border-radius:999px; font-size:.7rem; vertical-align:middle; }
.set-badge-inline { background:#b3261e; color:#fff; }
.chips { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.25rem; }
.chip { padding:.35rem .9rem; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink); text-decoration:none; font-size:.92rem; }
.chip:hover { border-color:var(--accent); }
table.attributes { width:auto; min-width:60%; background:transparent; } table.attributes th { width:40%; font-weight:500; }
table.attributes th, table.attributes td { padding:.4rem .6rem .4rem 0; }
.form-row { display:flex; flex-wrap:wrap; gap:.75rem 1rem; align-items:flex-end; }
.form-row label { margin:0; min-width:150px; flex:1 1 150px; } .form-row label.check, label.check { display:flex; align-items:center; gap:.4rem; flex:0 0 auto; min-width:0; margin:0; padding-bottom:.55rem; }
.form-row select, .panel select { background:#fff; }
.narrow-input { max-width:6rem; }
.tick { width:2rem; } .tick input, label.check input { width:1.1rem; height:1.1rem; }
.picker-tools { display:flex; flex-wrap:wrap; gap:.5rem 1.25rem; align-items:center; margin-bottom:.5rem; } .picker-tools .picker-filter { margin:0; }
.picker-short { max-height:300px; }
.inline-edit { display:flex; gap:.5rem; align-items:center; max-width:420px; } .inline-edit input { margin:0; }
.danger { color:var(--bad) !important; } .danger-zone { margin-top:1rem; }
.attribute-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:0 1rem; }
.bulk h2 { margin-bottom:.75rem; }
@media (max-width:820px) {
    .shop-nav { flex-wrap:nowrap; overflow-x:auto; } .nav-item { position:static; } .nav-sub { display:none !important; }
}

/* Indentation by depth in the category tree (no inline styles: the site's security policy forbids them). */
td.depth-1 { padding-left:2rem; } td.depth-2 { padding-left:3.4rem; } td.depth-3 { padding-left:4.8rem; } td.depth-4 { padding-left:6.2rem; } td.depth-5 { padding-left:7.6rem; }
.shop-nav .nav-sub a.depth-1 { padding-left:1.7rem; } .shop-nav .nav-sub a.depth-2 { padding-left:2.5rem; } .shop-nav .nav-sub a.depth-3 { padding-left:3.3rem; } .shop-nav .nav-sub a.depth-4, .shop-nav .nav-sub a.depth-5 { padding-left:4.1rem; }

/* ---------- Sale prices ---------- */
.sale-price { color:#b3261e; font-weight:700; }
.sale-badge { background:#b3261e; color:#fff; font-weight:700; }
.price-old { font-size:1.05rem; font-weight:400; }
.sale-until { margin:-.3rem 0 .6rem; }
.category-intro { max-width:70ch; color:var(--muted); margin:0 0 1.25rem; }

/* ---------- Mega menu ---------- */
.shop-nav { position:relative; }
.nav-item.has-mega { position:static; }
.mega-panel { left:16px; right:16px; min-width:0; padding:1.25rem 1.5rem; border-radius:0 0 12px 12px; }
.nav-item.has-mega:hover .mega-panel, .nav-item.has-mega:focus-within .mega-panel { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:2rem; }
.mega-cols { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:1rem 1.5rem; align-content:start; }
.shop-nav .mega-col a { display:block; padding:.25rem 0; border-bottom:0; color:var(--muted); white-space:normal; font-size:.93rem; }
.shop-nav .mega-col a:hover { background:none; color:var(--accent); border-bottom:0; }
.shop-nav .mega-col a.mega-head { color:var(--ink); font-weight:700; font-size:1rem; padding-bottom:.4rem; margin-bottom:.25rem; border-bottom:1px solid var(--line); }
.shop-nav .mega-col a.mega-all { color:var(--accent); font-weight:600; }
.shop-nav a.mega-feature { display:block; padding:0; border:1px solid var(--line); border-radius:10px; overflow:hidden; color:var(--ink); white-space:normal; background:var(--bg); }
.shop-nav a.mega-feature:hover { border-color:var(--accent); background:var(--bg); }
.mega-image { display:block; position:relative; aspect-ratio:4/3; overflow:hidden; background:#fff; }
.mega-image img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.mega-feature:hover .mega-image img { transform:scale(1.05); }
.mega-image .badge { position:absolute; left:.6rem; top:.6rem; }
.mega-name { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; padding:.6rem .8rem 0; font-size:.9rem; line-height:1.35; }
.mega-feature .price { display:block; padding:.2rem .8rem .7rem; margin:0; }

/* ---------- Admin: category tree ---------- */
.tree-row { display:grid; grid-template-columns:minmax(0,3fr) 70px 80px minmax(0,2fr) minmax(0,1.6fr); gap:.5rem 1rem; align-items:center; padding:.5rem .6rem; border-bottom:1px solid var(--line); font-size:.93rem; background:#fff; }
.tree-head { color:var(--muted); font-weight:600; }
.tree-row[draggable=true] { cursor:grab; }
.tree-grip { color:var(--muted); margin-right:.4rem; }
.tree-row.depth-1 .tree-name { padding-left:1.5rem; } .tree-row.depth-2 .tree-name { padding-left:3rem; } .tree-row.depth-3 .tree-name { padding-left:4.5rem; } .tree-row.depth-4 .tree-name { padding-left:6rem; } .tree-row.depth-5 .tree-name { padding-left:7.5rem; }
.tree-row.is-dragged { opacity:.45; }
.tree-row.is-drop { outline:2px solid var(--accent); outline-offset:-2px; background:#e8f1fb; }
.tree-root { margin:.5rem 0 .75rem; padding:.6rem; border:2px dashed #c5ccd3; border-radius:8px; text-align:center; color:var(--muted); font-size:.93rem; }
.tree-root.is-drop { border-color:var(--accent); background:#e8f1fb; color:var(--ink); }
textarea { display:block; width:100%; padding:.55rem .65rem; margin-top:.25rem; border:1px solid #c5ccd3; border-radius:6px; font:inherit; background:#fff; }
input[type=date] { display:block; width:100%; padding:.5rem .65rem; margin-top:.25rem; border:1px solid #c5ccd3; border-radius:6px; font:inherit; background:#fff; }
.bulk .form-row + .form-row { margin-top:.75rem; }
@media (max-width:820px) { .mega-panel { display:none !important; } .tree-row { grid-template-columns:minmax(0,1fr) auto; } .tree-row > span:nth-child(2), .tree-row > span:nth-child(3) { display:none; } }

/* ---------- Design: header image, side links, start page ---------- */
.hero { position:relative; margin:0 0 2rem; border-radius:12px; overflow:hidden; background:#e9e4dc; aspect-ratio:1920/700; max-height:560px; width:100%; }
.hero img { width:100%; height:100%; object-fit:cover; display:block; }
.hero-text { position:absolute; left:0; bottom:0; right:0; padding:3rem clamp(1rem,4vw,3rem) clamp(1rem,3vw,2.5rem); color:#fff; background:linear-gradient(to top,rgba(20,24,22,.72),rgba(20,24,22,0)); }
.hero-text p { margin:0 0 .6rem; max-width:40rem; text-shadow:0 1px 2px rgba(0,0,0,.4); }
.hero-headline { font:600 clamp(1.5rem,4vw,2.8rem)/1.15 Georgia,"Times New Roman",serif; }
.hero-preview { max-width:480px; width:100%; border-radius:8px; border:1px solid var(--line); display:block; }
.with-side { display:grid; grid-template-columns:minmax(0,1fr); gap:2rem; align-items:start; }
.with-side.side-left { grid-template-columns:220px minmax(0,1fr); }
.with-side.side-right { grid-template-columns:minmax(0,1fr) 220px; }
.with-side.side-right .side-links { order:2; }
.side-main { min-width:0; }
.side-links { background:#fff; border:1px solid var(--line); border-radius:10px; padding:1rem; position:sticky; top:7.5rem; }
.side-links h2 { font-size:1.05rem; margin-bottom:.5rem; }
.side-links ul { list-style:none; margin:0; padding:0; }
.side-links a { display:block; padding:.4rem .5rem; border-radius:6px; color:var(--ink); text-decoration:none; font-size:.95rem; }
.side-links a:hover, .side-links a.active { background:var(--bg); color:var(--accent); }
.home-section { margin-bottom:2.5rem; }
.home-section > h2, .list-title { font-size:1.4rem; margin:0 0 1rem; }
.load-more { text-align:center; margin:2rem 0 0; } .load-more button { padding:.7rem 2.5rem; }
.carousel { position:relative; }
.carousel-arrow { position:absolute; top:38%; transform:translateY(-50%); z-index:2; width:40px; height:40px; padding:0; border-radius:50%; background:#fff; color:var(--ink); font-size:1.5rem; line-height:1; border:1px solid var(--line); box-shadow:0 2px 8px rgba(0,0,0,.12); }
.carousel-arrow.prev { left:-.5rem; } .carousel-arrow.next { right:-.5rem; }
.carousel-arrow[hidden] { display:none; }
@media (max-width:820px) {
    .with-side.side-left, .with-side.side-right { grid-template-columns:minmax(0,1fr); }
    .with-side.side-right .side-links { order:0; }
    .side-links { position:static; } .side-links ul { display:flex; flex-wrap:wrap; gap:.25rem; }
    .hero { aspect-ratio:4/3; } .carousel-arrow { display:none; }
}

/* ---------- Product page: description, article number ---------- */
.description.is-clamped { max-height:14rem; overflow:hidden; -webkit-mask-image:linear-gradient(to bottom,#000 55%,transparent); mask-image:linear-gradient(to bottom,#000 55%,transparent); }
.sku-line { margin:-.3rem 0 .6rem; }
.code-area { font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
details { margin-top:1rem; } summary { cursor:pointer; color:var(--accent); }

/* ---------- Header: account, small cart, banner, toast ---------- */
.account-link { flex:none; color:var(--ink); text-decoration:none; white-space:nowrap; font-size:.95rem; }
.cart-box { position:relative; flex:none; }
.mini-cart { display:none; position:absolute; right:0; top:100%; width:min(360px,calc(100vw - 32px)); padding:1rem; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 12px 32px rgba(0,0,0,.14); z-index:30; }
.cart-box:hover .mini-cart, .cart-box:focus-within .mini-cart, .cart-box.is-open .mini-cart { display:block; }
.cart-box.is-closed .mini-cart { display:none; }
.mini-lines { list-style:none; margin:0; padding:0; max-height:320px; overflow-y:auto; }
.mini-lines li { display:grid; grid-template-columns:52px minmax(0,1fr) auto; gap:.6rem; align-items:start; padding:.5rem 0; border-bottom:1px solid var(--line); }
.mini-thumb { width:52px; height:52px; border-radius:6px; overflow:hidden; background:#eef0f3; display:block; }
.mini-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.mini-info a { color:var(--ink); text-decoration:none; font-size:.88rem; line-height:1.3; display:block; }
.mini-row { display:flex; align-items:center; gap:.6rem; margin-top:.3rem; font-size:.9rem; }
.mini-row .qty { width:4rem; padding:.25rem .4rem; margin:0; }
.mini-remove { background:none; color:var(--muted); padding:0 .3rem; font-size:1.3rem; line-height:1; }
.mini-remove:hover { color:var(--bad); }
.mini-total { display:flex; justify-content:space-between; margin:.75rem 0; }
.mini-actions { display:flex; gap:.5rem; } .mini-actions > * { flex:1; text-align:center; padding:.55rem .5rem; font-size:.92rem; }
.mini-empty { margin:0; }
.promo-banner { position:fixed; right:0; top:50%; transform:translateY(-50%); z-index:20; width:150px; padding:.9rem .75rem; display:flex; flex-direction:column; gap:.4rem; align-items:center; text-align:center;
    background:#8a2f24; color:#fff; border-radius:10px 0 0 10px; box-shadow:0 6px 20px rgba(0,0,0,.2); font-size:.88rem; }
.promo-percent { font:700 1.5rem/1 Georgia,"Times New Roman",serif; }
.promo-banner button { background:#fff; color:#8a2f24; font-weight:600; padding:.45rem .6rem; font-size:.85rem; }
.promo-banner form { margin:0; }
.promo-field { max-width:260px; }
.toast { position:fixed; left:50%; bottom:1.5rem; transform:translateX(-50%); z-index:40; background:var(--ink); color:#fff; padding:.7rem 1.1rem; border-radius:8px; box-shadow:0 6px 20px rgba(0,0,0,.25); max-width:calc(100vw - 32px); }
.toast[hidden] { display:none; } .toast-error { background:var(--bad); }
@media (max-width:820px) {
    .account-link { margin-left:auto; } .shop-bar .cart-box { margin-left:0; } .shop-bar .cart-link { margin-left:0; }
    .promo-banner { top:auto; bottom:0; left:0; right:0; transform:none; width:auto; flex-direction:row; justify-content:center; border-radius:0; padding:.5rem .75rem; }
    .promo-percent { font-size:1.1rem; } body.shop:has(.promo-banner) { padding-bottom:3rem; }
    .toast { bottom:4rem; }
}

/* ---------- Messages ---------- */
.messages { display:flex; flex-direction:column; gap:.6rem; margin-bottom:1rem; }
.message { max-width:80%; padding:.6rem .8rem; border-radius:10px; background:#eef0f3; }
.message p { margin:0; } .message p + p { margin-top:.2rem; overflow-wrap:anywhere; }
.message.from-shop { align-self:flex-end; background:#e3f0ea; }
body.admin .message.from-shop { align-self:flex-end; } body.admin .message.from-customer { background:#fff4e0; }

/* ---------- Admin: design page ---------- */
.side-editor { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1.5rem; }
.side-list { list-style:none; margin:0 0 1rem; padding:.4rem; min-height:3.5rem; border:1px dashed #c5ccd3; border-radius:8px; }
.side-list li, .side-source { display:flex; align-items:center; gap:.6rem; padding:.4rem .5rem; margin:0; border-radius:6px; background:#fff; cursor:grab; }
.side-list li + li { border-top:1px solid var(--line); }
.side-source { border-bottom:1px solid var(--line); border-radius:0; }
.side-label { flex:1; min-width:0; }
.drag-handle { color:var(--muted); letter-spacing:-.3em; }
.side-list li.is-drop { box-shadow:0 -2px 0 var(--accent); } .side-list.is-drop { border-color:var(--accent); background:#f1f6fb; }
.is-dragged { opacity:.5; }
.side-empty { cursor:default !important; }
.side-list button[disabled] { opacity:.3; cursor:default; }
.design-sections input[type=text], .design-sections select { margin:0; }
@media (max-width:820px) { .side-editor { grid-template-columns:1fr; } }
.side-source.depth-1 { padding-left:1.6rem; } .side-source.depth-2 { padding-left:2.7rem; } .side-source.depth-3, .side-source.depth-4, .side-source.depth-5 { padding-left:3.8rem; }
.pager[hidden], .load-more[hidden] { display:none; }

/* ---------- Cart page ---------- */
.cart-actions { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; }
.cart-actions .button:last-child { margin-left:auto; }
a.button-secondary { background:#fff; color:var(--accent); border:1px solid var(--accent); }
.has-script [data-no-script-only] { display:none; }
.tax-row td { padding-top:0; }
.gallery-thumbs[hidden], .gallery-arrow[hidden] { display:none; }
@media (max-width:820px) { .cart-actions .button:last-child { margin-left:0; } .cart-actions > * { flex:1 1 100%; text-align:center; } }
/* On screens without free space beside the page the banner is a slim tab that opens on mouse-over, so it never covers content. */
@media (min-width:821px) and (max-width:1559px) {
    body.shop:has(.promo-banner) .container { padding-right:60px; }
    .promo-banner { width:44px; padding:.8rem .3rem; overflow:hidden; }
    .promo-banner > :not(.promo-percent) { display:none; }
    .promo-banner .promo-percent { writing-mode:vertical-rl; font-size:1.1rem; white-space:nowrap; }
    .promo-banner:hover, .promo-banner:focus-within { width:150px; padding:.9rem .75rem; }
    .promo-banner:hover > *, .promo-banner:focus-within > * { display:block; }
    .promo-banner:hover .promo-percent, .promo-banner:focus-within .promo-percent { writing-mode:horizontal-tb; font-size:1.5rem; }
}

/* ---------- Header slides and column choice ---------- */
.hero-slide { position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .6s ease, visibility .6s; }
.hero-slide.active { opacity:1; visibility:visible; }
.hero-link { display:block; width:100%; height:100%; }
.hero .gallery-arrow { z-index:3; }
.hero-dots { position:absolute; left:0; right:0; bottom:.7rem; z-index:3; display:flex; justify-content:center; gap:.5rem; }
.hero-dots button { width:11px; height:11px; padding:0; border-radius:50%; background:rgba(255,255,255,.55); border:1px solid rgba(0,0,0,.25); }
.hero-dots button.active { background:#fff; }
@media (prefers-reduced-motion:reduce) { .hero-slide { transition:none; } }
.slide-edit { display:grid; grid-template-columns:220px minmax(0,1fr); gap:1rem; align-items:start; padding:1rem 0; border-top:1px solid var(--line); }
.slide-edit .hero-preview { max-width:220px; aspect-ratio:1920/700; object-fit:cover; }
@media (max-width:820px) { .slide-edit { grid-template-columns:1fr; } }
@media (min-width:1101px) {
    body.shop .grid.cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)); } body.shop .grid.cols-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
    body.shop .grid.cols-4 { grid-template-columns:repeat(4,minmax(0,1fr)); } body.shop .grid.cols-5 { grid-template-columns:repeat(5,minmax(0,1fr)); }
    body.shop .grid.cols-6 { grid-template-columns:repeat(6,minmax(0,1fr)); }
}
@media (min-width:821px) and (max-width:1100px) {
    body.shop .grid.cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
    body.shop .grid.cols-3, body.shop .grid.cols-4, body.shop .grid.cols-5, body.shop .grid.cols-6 { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* ---------- Announcement bar, filters, banner, information section, footer, pages ---------- */
.hero img { object-position:center top; }
.top-bar { overflow:hidden; text-align:center; font-size:.9rem; line-height:1.3; }
.top-bar a { color:inherit; }
.bar-track { padding:.45rem 16px; }
.bar-rotate .bar-item, .bar-fade .bar-item, .bar-slide .bar-item, .bar-flip .bar-item, .bar-typing .bar-item, .bar-words .bar-item { display:none; }
.bar-rotate .bar-item.active, .bar-typing .bar-item.active, .bar-words .bar-item.active { display:inline; }
.bar-fade .bar-item.active, .bar-slide .bar-item.active, .bar-flip .bar-item.active { display:inline-block; }
.bar-fade .bar-item.active { animation:bar-fade .7s ease; }
.bar-slide .bar-item.active { animation:bar-slide .45s ease; }
.bar-flip .bar-track { perspective:600px; } .bar-flip .bar-item.active { animation:bar-flip .55s ease; transform-origin:50% 50%; }
.bar-typing .bar-track, .bar-words .bar-track { min-height:calc(1.3em + .9rem); }
.bar-typing .bar-item.active [data-bar-out]::after { content:""; display:inline-block; width:2px; height:1em; margin-left:2px; vertical-align:-.12em; background:currentColor; animation:bar-caret 1s steps(1) infinite; }
@keyframes bar-fade { from { opacity:0; } to { opacity:1; } }
@keyframes bar-slide { from { opacity:0; transform:translateY(90%); } to { opacity:1; transform:translateY(0); } }
@keyframes bar-flip { from { opacity:0; transform:rotateX(-90deg); } to { opacity:1; transform:rotateX(0); } }
@keyframes bar-caret { 50% { opacity:0; } }
@media (prefers-reduced-motion:reduce) { .bar-fade .bar-item.active, .bar-slide .bar-item.active, .bar-flip .bar-item.active { animation:none; } }
.bar-scroll .bar-track { display:inline-flex; gap:4rem; padding-left:0; padding-right:0; white-space:nowrap; min-width:200%; justify-content:space-around; animation:bar-scroll 28s linear infinite; }
.bar-scroll:hover .bar-track, .bar-scroll:focus-within .bar-track { animation-play-state:paused; }
@keyframes bar-scroll { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce) { .bar-scroll .bar-track { animation:none; min-width:0; display:block; white-space:normal; } .bar-scroll .bar-item[aria-hidden] { display:none; } .bar-scroll .bar-item { margin:0 .75rem; } }
.side-column { display:flex; flex-direction:column; gap:1rem; position:sticky; top:7.5rem; max-height:calc(100vh - 8.5rem); overflow-y:auto; scrollbar-width:thin; }
.side-column .side-links { position:static; }
.with-side.side-right .side-column { order:2; }
.with-side.banner-right.side-off { grid-template-columns:minmax(0,1fr) 200px; }
.with-side.banner-right.side-left { grid-template-columns:220px minmax(0,1fr) 200px; }
.side-banner img { width:100%; display:block; border-radius:10px; }
aside.side-banner { position:sticky; top:7.5rem; }
.filters fieldset { border:0; border-top:1px solid var(--line); margin:0; padding:.75rem 0; min-width:0; }
.filters legend { font-weight:600; font-size:.92rem; padding:0; }
.price-range { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; } .price-range label { margin:0; font-size:.85rem; }
.filter-options { max-height:13rem; overflow-y:auto; scrollbar-width:thin; }
.filter-options label.check { padding:.15rem 0; font-size:.9rem; align-items:flex-start; }
.filters button { width:100%; } .filter-reset { display:block; text-align:center; margin-top:.5rem; font-size:.9rem; }
.info-section { border-top:1px solid var(--line); background:#fff; padding:2rem 16px; }
.info-blocks, .footer-cols { max-width:1240px; margin:0 auto; display:grid; gap:1.5rem 2rem; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }
.info-blocks h2, .footer-cols h2 { font-size:1.05rem; margin:0 0 .5rem; }
.info-blocks p, .footer-cols p { margin:0; font-size:.93rem; overflow-wrap:anywhere; }
.site-footer { padding:2rem 16px 1.25rem; font-size:.93rem; }
.site-footer.border-line { border-top:1px solid var(--line); } .site-footer.border-thick { border-top:4px solid var(--accent); }
.site-footer.is-centered { text-align:center; } .site-footer.is-centered .footer-logo { margin-left:auto; margin-right:auto; }
.site-footer a { color:inherit; } .site-footer ul { list-style:none; margin:.5rem 0 0; padding:0; } .site-footer li { padding:.15rem 0; }
.footer-logo { max-height:56px; max-width:180px; width:auto; display:block; margin-bottom:.6rem; }
.footer-bottom { max-width:1240px; margin:1.5rem auto 0; text-align:center; font-size:.88rem; opacity:.8; }
.footer-cols + .footer-bottom { padding-top:1rem; border-top:1px solid rgba(128,128,128,.3); }
.text-page { max-width:820px; margin:0 auto; background:#fff; border:1px solid var(--line); border-radius:10px; padding:2rem clamp(1rem,4vw,2.5rem); }
.google-button { display:block; text-align:center; background:#fff; color:var(--ink); border:1px solid #c5ccd3; font-weight:600; }
.or-line { text-align:center; }
.block-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; }
.banner-preview { max-width:160px; border-radius:8px; border:1px solid var(--line); display:block; }
.footer-logo-preview { max-height:56px; max-width:180px; display:block; }
input[type=color] { display:block; width:4rem; height:2.4rem; padding:.15rem; margin-top:.25rem; border:1px solid #c5ccd3; border-radius:6px; background:#fff; }
@media (max-width:1100px) { .with-side.banner-right.side-left { grid-template-columns:220px minmax(0,1fr); } .with-side.banner-right.side-left aside.side-banner { grid-column:1 / -1; position:static; max-width:320px; margin:0 auto; } }
@media (max-width:820px) {
    .with-side.banner-right.side-off, .with-side.banner-right.side-left { grid-template-columns:minmax(0,1fr); }
    aside.side-banner { position:static; max-width:320px; margin:0 auto; grid-column:auto; }
    .side-column { position:static; max-height:none; } .with-side.side-right .side-column { order:0; }
}

/* ---------- Start page, product cards, search suggestions, phone bar ---------- */
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.skip-link { position:absolute; left:-999px; top:.5rem; z-index:60; background:#fff; color:var(--ink); padding:.5rem .9rem; border-radius:6px; border:2px solid var(--accent); }
.skip-link:focus { left:.5rem; }
body.shop a:focus-visible, body.shop button:focus-visible, body.shop input:focus-visible, body.shop summary:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
html { scroll-padding-top:8rem; }
@media (prefers-reduced-motion:no-preference) { html { scroll-behavior:smooth; } }

.shop-search { position:relative; }
.suggest { position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:35; margin:0; padding:.3rem; list-style:none; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 12px 32px rgba(0,0,0,.14); max-height:70vh; overflow-y:auto; }
.suggest a { display:flex; align-items:center; gap:.7rem; padding:.45rem .5rem; border-radius:6px; color:var(--ink); text-decoration:none; }
.suggest li[aria-selected=true] a, .suggest a:hover { background:var(--bg); }
.suggest img { flex:none; width:40px; height:40px; object-fit:cover; border-radius:4px; }
.suggest-name { flex:1; min-width:0; font-size:.93rem; line-height:1.3; } .suggest-name small { display:block; color:var(--bad); }
.suggest-price { font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums; }
.suggest a.suggest-all { color:var(--accent); font-weight:600; font-size:.93rem; }

.home-intro { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); gap:1.5rem 2.5rem; align-items:center; margin:0 0 1.5rem; }
.home-intro h1 { font-size:clamp(1.7rem,4vw,2.5rem); line-height:1.2; margin:0 0 .75rem; text-wrap:balance; }
.home-intro-text > p { color:var(--muted); max-width:60ch; margin:0; }
.home-intro .home-actions { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.1rem; }
.home-actions .button { padding:.7rem 1.2rem; }
.home-facts { list-style:none; margin:0; padding:1rem 1.2rem; display:grid; gap:.7rem; background:#fff; border:1px solid var(--line); border-radius:10px; font-size:.95rem; }
.home-facts strong, .home-facts span { display:block; } .home-facts span { color:var(--muted); overflow-wrap:anywhere; }
.home-cats { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:.75rem; margin:0 0 2.25rem; }
.home-cat { display:flex; flex-direction:column; gap:.15rem; justify-content:center; min-height:64px; padding:.75rem 1rem; background:#fff; border:1px solid var(--line); border-left:4px solid var(--accent); border-radius:8px; color:var(--ink); text-decoration:none; }
.home-cat:hover { border-color:var(--accent); }
.home-cat strong { font-weight:600; font-size:1.05rem; } .home-cat span { color:var(--muted); font-size:.85rem; }

.list-tabs { display:flex; gap:.25rem; overflow-x:auto; border-bottom:1px solid var(--line); margin:0 0 .9rem; scrollbar-width:thin; }
.list-tabs a { flex:none; display:inline-flex; align-items:center; min-height:44px; padding:.5rem .9rem; color:var(--muted); text-decoration:none; border-bottom:3px solid transparent; white-space:nowrap; }
.list-tabs a:hover { color:var(--ink); } .list-tabs a.active { color:var(--ink); font-weight:700; border-bottom-color:var(--accent); }
.list-tools { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1rem; margin:0 0 1rem; }
.list-tools .list-count { margin:0 0 0 auto; font-variant-numeric:tabular-nums; }
.size-chips { display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; }
.chips-label { font-size:.8rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-right:.2rem; }
.size-chips .chip { min-height:36px; display:inline-flex; align-items:center; font-variant-numeric:tabular-nums; }
.chip.is-on { background:var(--accent); border-color:var(--accent); color:#fff; }
[data-list].is-busy { opacity:.55; pointer-events:none; transition:opacity .15s; }

body.shop .card-title { font:500 .95rem/1.35 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; letter-spacing:0; margin:0 0 .35rem; }
.row-scroll .card-title { font-size:.9rem; }
.card-title a { color:inherit; text-decoration:none; } .card-title a:hover { text-decoration:underline; }
a.card-image { display:block; }
.card-body { display:flex; flex-direction:column; flex:1; }
.card-options { display:flex; flex-wrap:wrap; gap:.3rem; margin:.35rem 0 0; }
.opt { display:block; width:40px; height:40px; padding:2px; border:2px solid transparent; border-radius:8px; }
.opt img { width:100%; height:100%; object-fit:cover; border-radius:5px; display:block; border:1px solid var(--line); }
.opt.is-active { border-color:var(--accent); } .opt.is-off img { opacity:.35; }
body.shop .card:hover .opt img { transform:none; }
.opt-more { display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding:0 .3rem; border:1px solid var(--line); border-radius:8px; color:var(--muted); text-decoration:none; font-size:.85rem; }
.card-buy { margin:auto 0 0; padding-top:.7rem; }
.card-buy button, .card-buy .button { width:100%; min-height:44px; text-align:center; }
.card-buy button[disabled] { background:#e9ecef; color:var(--muted); cursor:not-allowed; }

.home-offer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem 1.5rem; margin:2.5rem 0; padding:1.2rem 1.4rem; background:var(--accent); color:#fff; border-radius:10px; }
.home-offer h2 { margin:0 0 .25rem; font-size:1.35rem; } .home-offer p { margin:0; max-width:62ch; }
.home-offer a.button { background:#fff; color:var(--accent); font-weight:700; }
.home-guide { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2rem 3rem; margin:2.5rem 0 0; }
.home-guide h2 { font-size:1.4rem; margin:0 0 .75rem; } .home-guide h3 { font-size:1.05rem; margin:1.1rem 0 .3rem; } .home-guide p { margin:0; max-width:65ch; }
.table-scroll { overflow-x:auto; }
.home-guide table { width:auto; margin-top:.6rem; background:none; font-variant-numeric:tabular-nums; } .home-guide th, .home-guide td { padding:.3rem 1.5rem .3rem 0; }
.home-guide details { margin:0; padding:.7rem 0; border-bottom:1px solid var(--line); }
.home-guide summary { color:var(--ink); font-weight:600; } .home-guide details p { margin-top:.5rem; color:var(--muted); }

.dock { display:none; }
@media (max-width:820px) {
    .home-intro, .home-guide { grid-template-columns:minmax(0,1fr); }
    body.shop .card-body { padding:.65rem .65rem .8rem; }
    .dock { display:grid; grid-template-columns:repeat(4,1fr); position:fixed; left:0; right:0; bottom:0; z-index:25; background:#fff; border-top:1px solid var(--line); padding-bottom:env(safe-area-inset-bottom,0px); }
    .dock a { display:flex; align-items:center; justify-content:center; gap:.3rem; min-height:54px; padding:.4rem .2rem; color:var(--ink); text-decoration:none; font-size:.85rem; }
    body.shop { padding-bottom:calc(54px + env(safe-area-inset-bottom,0px)); }
    .promo-banner { bottom:calc(54px + env(safe-area-inset-bottom,0px)); }
    body.shop:has(.promo-banner) { padding-bottom:calc(54px + 3rem + env(safe-area-inset-bottom,0px)); }
    .toast { bottom:calc(54px + 4rem); }
}
.row-scroll .card-buy button, .row-scroll .card-buy .button { font-size:.88rem; padding:.5rem .4rem; }
@media (max-width:820px) { .card-buy button, .card-buy .button { font-size:.88rem; padding:.5rem .4rem; } }
.image-variants { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:1rem; margin:1rem 0; }
.image-variants label { margin:0; } .image-variants img { display:block; width:96px; height:96px; object-fit:cover; border-radius:6px; border:1px solid var(--line); margin-bottom:.4rem; }
.variant-picker { margin:1rem 0; display:grid; gap:1rem; }
.variant-picker .colours { margin:0; }
.size-list { display:flex; flex-wrap:wrap; gap:.5rem; }
.size-option { display:flex; flex-direction:column; justify-content:center; min-height:48px; padding:.4rem .8rem; border:2px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); text-decoration:none; font-size:.92rem; line-height:1.25; font-variant-numeric:tabular-nums; }
.size-option small { color:var(--muted); font-size:.8rem; }
.size-option:hover, .size-option.active { border-color:var(--accent); } .size-option.active span { font-weight:700; }
.size-option.is-off { color:var(--muted); border-style:dashed; background:none; cursor:not-allowed; } .size-option.is-off span { text-decoration:line-through; }
.buy label[hidden] { display:none; }

/* ---------- Banner on the left, cart login and newsletter ---------- */
.with-side.banner-left.side-off { grid-template-columns:200px minmax(0,1fr); }
.with-side.banner-left.side-right { grid-template-columns:200px minmax(0,1fr) 220px; }
.with-side.banner-left > aside.side-banner { order:-1; }
@media (max-width:1100px) { .with-side.banner-left.side-right { grid-template-columns:minmax(0,1fr) 220px; } .with-side.banner-left.side-right > aside.side-banner { grid-column:1 / -1; order:3; position:static; max-width:320px; margin:0 auto; } }
@media (max-width:820px) { .with-side.banner-left.side-off, .with-side.banner-left.side-right { grid-template-columns:minmax(0,1fr); } .with-side.banner-left > aside.side-banner { order:3; } }
.cart-top { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1rem; margin-bottom:1.25rem; }
.cart-top .panel { margin:0; } .cart-top h2 { font-size:1.1rem; margin:0 0 .6rem; }
.cart-inline { display:flex; flex-wrap:wrap; gap:.6rem; align-items:flex-end; } .cart-inline label { flex:1 1 200px; margin:0; } .cart-inline button { min-height:42px; }
.cart-note { margin:0; padding:.75rem 1rem; background:#fff; border:1px solid var(--line); border-radius:8px; align-self:start; }
.cart-note-good { border-color:var(--ok); }
.saving-row td { color:var(--ok); font-weight:600; }
.payment-choice { border:0; margin:0 0 1rem; padding:0; display:grid; gap:.5rem; }
.payment-choice label.check { align-items:flex-start; gap:.6rem; padding:.7rem .9rem; border:1px solid var(--line); border-radius:8px; margin:0; background:#fff; }
.payment-choice label.check:has(input:checked) { border-color:var(--accent); }

.footer-legal { max-width:1240px; margin:1.5rem auto 0; display:flex; flex-wrap:wrap; gap:.4rem 1.5rem; justify-content:center; font-size:.9rem; }
.footer-legal + .footer-bottom { margin-top:.6rem; }

.load-more button.is-loading { display:inline-flex; align-items:center; gap:.6rem; opacity:1; cursor:progress; }
.load-more button.is-loading::before { content:""; width:1.1em; height:1.1em; border-radius:50%; border:2px solid currentColor; border-right-color:transparent; animation:spin .7s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .load-more button.is-loading::before { animation-duration:2s; } }
.info-icon { display:block; width:2rem; height:2rem; margin:0 0 .5rem; color:var(--accent); }
.is-centered .info-icon { margin-left:auto; margin-right:auto; }

.home-intro { grid-template-columns:minmax(0,1fr); }
.shop-nav .mega-col a.mega-size { padding:.15rem 0 .15rem .7rem; font-size:.88rem; }
.shop-nav .mega-col a.mega-size::before { content:"›"; margin-right:.4rem; color:var(--accent); }

.share { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin:.2rem 0 .8rem; }
.share-button { display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .8rem; font-size:.9rem; background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:999px; }
.share-button:hover { border-color:var(--accent); color:var(--accent); }
.share-icon { width:1rem; height:1rem; }
.wa-help { position:fixed; z-index:45; display:inline-flex; align-items:center; gap:.5rem; padding:.7rem 1rem; border-radius:999px; background:#128c4b; color:#fff; text-decoration:none; font-weight:600; font-size:.93rem; box-shadow:0 8px 22px rgba(0,0,0,.22); transition:transform .15s, box-shadow .15s; }
.wa-help:hover { transform:translateY(-2px); box-shadow:0 12px 26px rgba(0,0,0,.28); color:#fff; }
.wa-icon { width:1.5rem; height:1.5rem; }
.wa-right { right:16px; } .wa-left { left:16px; } .wa-bottom { bottom:16px; } .wa-top { top:120px; }
@media (max-width:820px) { .wa-help span { display:none; } .wa-help { padding:.8rem; } .wa-bottom { bottom:84px; } }
@media print { .wa-help, .share { display:none; } }

.home-banners { display:flex; flex-wrap:wrap; gap:1rem; margin:1.5rem 0 1.75rem; justify-content:center; }
.home-banner { display:block; margin:0; } .home-banner img { display:block; width:100%; height:auto; border-radius:10px; }
.home-banner.width-full { flex:1 1 100%; } .home-banner.width-half { flex:1 1 calc(50% - .5rem); min-width:260px; }
.home-banner.width-auto { flex:0 1 auto; max-width:100%; } .home-banner.width-auto img { width:auto; max-width:100%; }
.home-text { margin:0 0 1.75rem; max-width:75ch; } .home-text h2 { margin:0 0 .4rem; }

.home-banner figcaption { margin-top:.6rem; } .home-banner figcaption p { margin:0 0 .4rem; }
.home-banner a { display:block; }
.home-custom { margin:2rem 0; } .home-custom h2 { font-size:1.4rem; margin:0 0 .6rem; } .home-custom h3 { font-size:1.1rem; margin:1.1rem 0 .3rem; } .home-custom h4 { font-size:1rem; margin:1rem 0 .2rem; }
.home-custom p { margin:0 0 .7rem; max-width:75ch; } .home-custom table { width:auto; background:none; margin:.5rem 0; } .home-custom th, .home-custom td { padding:.3rem 1.5rem .3rem 0; }
.home-intro-body p { color:inherit; max-width:60ch; margin:0 0 .5rem; }

.home-banners > .home-text { margin:0; max-width:none; align-self:flex-start; }
.home-text.width-full { flex:1 1 100%; } .home-text.width-half { flex:1 1 calc(50% - .5rem); min-width:260px; } .home-text.width-auto { flex:0 1 auto; }

.home-button { margin:.8rem 0 0; } .home-banner .home-button a { display:inline-block; }


.home-intro-wrap { margin:0 0 1.5rem; } .home-intro-wrap .home-intro { margin-bottom:1rem; } .home-intro-wrap .home-cats { margin-bottom:0; }
.home-intro-wrap.width-full .home-intro-text > p, .home-intro-wrap.width-full .home-intro-body p { max-width:none; }
.home-intro-wrap.width-half, .hb-guide.width-half { width:50%; min-width:min(100%,320px); }
.home-intro-wrap.width-auto, .hb-guide.width-auto { width:fit-content; max-width:100%; }
.hb-guide.width-full p { max-width:none; }
.hb-guide.width-half, .hb-guide.width-auto { grid-template-columns:minmax(0,1fr); }
@media (max-width:820px) { .home-intro-wrap.width-half, .hb-guide.width-half { width:100%; } }
.home-intro-wrap a.home-cat.home-cat { color:var(--ink); }
.home-intro-wrap .home-actions .button { box-shadow:0 0 0 1px rgba(255,255,255,.55); }

/* Mega menu: full width, lighter headings, one small best-seller picture on the right. */
.mega-panel { left:0; right:0; padding:1.4rem max(16px, calc((100% - 1240px) / 2 + 16px)); border-radius:0 0 14px 14px; }
.nav-item.has-mega:hover .mega-panel, .nav-item.has-mega:focus-within .mega-panel { grid-template-columns:minmax(0,1fr); }
.nav-item.has-mega:hover .mega-panel.has-feature, .nav-item.has-mega:focus-within .mega-panel.has-feature { grid-template-columns:minmax(0,1fr) 190px; }
.shop-nav .mega-col a.mega-head { color:var(--accent); font-weight:600; font-size:.8rem; letter-spacing:.07em; text-transform:uppercase; padding-bottom:.35rem; margin-bottom:.3rem; border-bottom:0; }
.shop-nav .mega-col a.mega-head:hover { text-decoration:underline; }
.mega-feature { align-self:start; display:block; text-decoration:none; color:inherit; }
.mega-feature .mega-image { display:block; position:relative; aspect-ratio:1/1; border-radius:10px; overflow:hidden; background:#eef0f3; }
.mega-feature .mega-image img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s; }
.mega-feature:hover .mega-image img { transform:scale(1.04); }
.mega-meta { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:.2rem .6rem; margin-top:.5rem; }
.mega-meta .price { margin:0; } .mega-size-note { color:var(--muted); font-size:.85rem; }
/* Start page texts run from edge to edge of their block. */
.home-custom p, .home-intro-body p, .home-intro-text > p, .home-guide p, .home-banner figcaption p, .category-intro { text-align:justify; hyphens:auto; max-width:none; }
.home-text { max-width:none; }
.mega-meta { padding:0 .6rem .5rem; }

.shop-nav .mega-col a.mega-thumb { display:block; width:120px; margin-top:.6rem; padding:0; color:var(--ink); }
.mega-thumb .mega-image { display:block; position:relative; aspect-ratio:1/1; border-radius:8px; overflow:hidden; background:#eef0f3; }
.mega-thumb .mega-image img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s; }
.mega-thumb:hover .mega-image img { transform:scale(1.05); }
.mega-thumb .badge { position:absolute; left:.35rem; top:.35rem; font-size:.68rem; }
.mega-thumb .price { display:block; margin:.3rem 0 0; font-size:.9rem; }

/* Mega menu: chosen number of columns; the product pictures stand on one line at the bottom. */
.mega-cols.cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.mega-cols.cols-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.mega-cols.cols-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.mega-cols.cols-5 { grid-template-columns:repeat(5,minmax(0,1fr)); }
.mega-cols.cols-6 { grid-template-columns:repeat(6,minmax(0,1fr)); }
.mega-cols.cols-7 { grid-template-columns:repeat(7,minmax(0,1fr)); }
.mega-cols.cols-8 { grid-template-columns:repeat(8,minmax(0,1fr)); }
.mega-cols { align-content:stretch; align-items:stretch; }
.mega-cols .mega-col { display:flex; flex-direction:column; }
.shop-nav .mega-col a.mega-thumb { margin-top:auto; padding-top:.6rem; }
.mega-panel.has-feature .mega-feature { align-self:end; }

/* Designed pages and forms */
.landing-title { margin:0 0 1.25rem; }
.category-blocks { margin:0 0 1.5rem; }
.home-form.width-full { flex:1 1 100%; } .home-form.width-half { flex:1 1 calc(50% - .5rem); min-width:260px; } .home-form.width-auto { flex:0 1 26rem; }
.home-banners > .home-form { margin:0; align-self:flex-start; }
.home-form form { display:grid; gap:.8rem; max-width:34rem; margin-top:.8rem; }
.home-form label { display:block; margin:0; font-weight:600; }
.home-form input[type=text], .home-form input[type=email], .home-form input[type=tel], .home-form textarea { display:block; width:100%; margin-top:.25rem; padding:.6rem .7rem; border:1px solid #c5ccd3; border-radius:8px; font:inherit; background:#fff; color:#1f2933; }
.home-form .narrow-input { max-width:6rem; }
.home-form button { justify-self:start; padding:.7rem 1.6rem; }
.form-trap { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* Position of blocks that are narrower than the page: left, centre or right. */
.home-banners { justify-content:flex-start; }
.home-banner.width-half, .home-text.width-half, .home-form.width-half { flex:0 1 calc(50% - .5rem); }
.home-banners > .side-right { margin-left:auto; }
.home-banners > .side-center { margin-left:auto; margin-right:auto; }
.home-banners > .side-left + .side-right { margin-left:0; }
.home-intro-wrap.side-right, .hb-guide.side-right { margin-left:auto; }
.home-intro-wrap.side-center, .hb-guide.side-center { margin-left:auto; margin-right:auto; }
.home-banner.side-right img, .home-banner.side-left img { margin-left:0; margin-right:0; }
@media (max-width:640px) { .home-banner.width-half, .home-text.width-half, .home-form.width-half { flex:1 1 100%; } }

/* Header: icons for account and cart */
.account-link, .cart-link { display:inline-flex; align-items:center; gap:.4rem; }
.head-icon { width:1.45rem; height:1.45rem; flex:none; }
@media (max-width: 640px) {
    .head-label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
    .cart-link { position:relative; gap:0; } .cart-link .cart-count { margin-left:-.35rem; margin-top:-1rem; min-width:1.2rem; padding:0 .3rem; font-size:.7rem; }
}

/* Card: wish list heart and quick "add to cart" on the picture */
.card-media { position:relative; }
.card-wish-form, .card-quick-form { position:absolute; margin:0; z-index:2; }
.card-wish-form { top:.5rem; right:.5rem; }
.card-quick-form { right:.5rem; bottom:.5rem; }
button.card-round { display:flex; align-items:center; justify-content:center; width:2.5rem; height:2.5rem; padding:0; border-radius:50%; border:1px solid var(--line); background:rgba(255,255,255,.94); color:var(--ink); box-shadow:0 2px 8px rgba(0,0,0,.12); cursor:pointer; }
button.card-round .icon { width:1.25rem; height:1.25rem; }
button.card-round:hover, button.card-round:focus-visible { border-color:var(--accent); color:var(--accent); background:#fff; }
button.card-quick { background:var(--accent); color:#fff; border-color:var(--accent); }
button.card-quick:hover, button.card-quick:focus-visible { background:var(--accent); color:#fff; filter:brightness(1.12); }
button.card-quick:disabled { background:#cbd0d6; border-color:#cbd0d6; cursor:not-allowed; }
button.card-wish.is-on, .wish-button.is-on { color:#c0392b; border-color:#c0392b; }
button.card-wish.is-on .icon, .wish-button.is-on .share-icon { fill:currentColor; }
.wish-line { display:flex; flex-wrap:wrap; align-items:center; gap:.8rem; margin:0 0 .8rem; }
.wish-count[hidden] { display:none; }
/* Reviews */
.stars { color:#cfd4da; letter-spacing:.05em; white-space:nowrap; } .stars-on { color:#e0a100; }
.review-link { text-decoration:none; color:var(--ink); }
.reviews { margin:2rem 0; padding-top:1.2rem; border-top:1px solid var(--line); }
.review-summary { font-size:1.1rem; }
.review { padding:.9rem 0; border-top:1px solid var(--line); } .review p { margin:.3rem 0; }
.review-own { background:#fff8e6; border:1px solid #f0d58a; border-radius:8px; padding:.8rem 1rem; margin-bottom:.8rem; }
.review-head { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; }
.review-write { margin:1rem 0; } .review-write summary { cursor:pointer; font-weight:600; color:var(--accent); }
.review-form { display:grid; gap:.7rem; max-width:36rem; margin-top:.8rem; }
.review-form input[type=text], .review-form textarea { width:100%; }
.rating-pick { display:flex; flex-direction:row-reverse; justify-content:flex-end; gap:.15rem; border:0; padding:0; margin:0; }
.rating-pick legend { float:left; width:100%; margin-bottom:.2rem; }
.rating-pick input { position:absolute; opacity:0; width:1px; height:1px; }
.rating-pick label { font-size:1.9rem; line-height:1; color:#cfd4da; cursor:pointer; }
.rating-pick input:checked ~ label, .rating-pick label:hover, .rating-pick label:hover ~ label { color:#e0a100; }
.rating-pick input:focus-visible + label { outline:2px solid var(--accent); outline-offset:2px; }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

/* Card: choosing a variant right on the picture */
.card-choose { position:absolute; inset:0; z-index:2; pointer-events:none; }
.card-choose > summary { position:absolute; right:.5rem; bottom:.5rem; list-style:none; pointer-events:auto; display:flex; align-items:center; justify-content:center; width:2.5rem; height:2.5rem; border-radius:50%; background:var(--accent); color:#fff; border:1px solid var(--accent); box-shadow:0 2px 8px rgba(0,0,0,.12); cursor:pointer; }
.card-choose > summary::-webkit-details-marker { display:none; }
.card-choose > summary .icon { width:1.25rem; height:1.25rem; }
.card-choices { position:absolute; left:.4rem; right:.4rem; bottom:3.4rem; max-height:calc(100% - 4rem); overflow:auto; pointer-events:auto; display:grid; gap:.3rem; padding:.5rem; background:#fff; border:1px solid var(--line); border-radius:8px; box-shadow:0 6px 20px rgba(0,0,0,.18); }
.card-choices-title { margin:0 0 .1rem; font-size:.8rem; font-weight:600; color:var(--ink); }
button.card-choice { display:flex; justify-content:space-between; gap:.6rem; width:100%; padding:.4rem .6rem; font-size:.85rem; text-align:left; background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:6px; }
button.card-choice:hover, button.card-choice:focus-visible { border-color:var(--accent); background:#f4f7f5; color:var(--ink); }
button.card-choice:disabled { color:#9aa1a9; background:#f5f6f7; cursor:not-allowed; }
.card-choice-price { white-space:nowrap; font-weight:600; }

/* Promotion code above the button that leads on */
.promo-box { margin:1rem 0; padding:.8rem 1rem; border:1px dashed var(--accent); border-radius:8px; background:#fff; max-width:30rem; }
.promo-box label { display:block; font-weight:600; margin-bottom:.3rem; }
.promo-box-row { display:flex; gap:.5rem; } .promo-box-row input { flex:1; min-width:0; text-transform:uppercase; }
.promo-box-on { margin:0; }
.guest-note { display:flex; gap:.6rem; align-items:flex-start; background:#fff8e6; border:1px solid #f0d58a; border-radius:8px; padding:.7rem .9rem; }
.guest-note-icon { flex:none; width:1.3rem; height:1.3rem; color:#b07d00; margin-top:.1rem; }
/* The whole promotion panel is the button */
.promo-banner { cursor:default; } .promo-banner form { display:flex; flex-direction:column; gap:.4rem; align-items:center; }
.promo-banner .promo-cover::after { content:""; position:absolute; inset:0; cursor:pointer; }
@media (min-width:821px) and (max-width:1559px) {
    /* The slim tab is clickable as a whole, too. */
    .promo-banner:not(:hover):not(:focus-within) > form { display:block; }
    .promo-banner:not(:hover):not(:focus-within) > form > :not(.promo-cover) { display:none; }
    .promo-banner:not(:hover):not(:focus-within) .promo-cover { font-size:0; padding:0; border:0; background:none; min-height:0; height:0; box-shadow:none; }
}

.acting-bar { display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; justify-content:center; margin:0; padding:.6rem 1rem; background:#1d3557; color:#fff; font-size:.95rem; }
.acting-bar button { background:#fff; color:#1d3557; padding:.3rem .9rem; font-weight:600; }

/* Bulk customer registration */
.bulk { max-width:620px; }
.bulk h2 { margin:1.4rem 0 .4rem; font-size:1.15rem; }
.bulk-steps { display:flex; gap:.4rem; list-style:none; margin:1.2rem 0 .5rem; padding:0; counter-reset:none; }
.bulk-steps li { flex:1; padding:.5rem .4rem; border-bottom:3px solid var(--line); color:var(--muted); font-size:.85rem; text-align:center; }
.bulk-steps li b { display:inline-grid; place-items:center; width:1.5rem; height:1.5rem; border-radius:50%; background:var(--line); color:var(--ink); font-size:.8rem; }
.bulk-steps li.is-current { border-color:var(--accent); color:var(--ink); font-weight:600; }
.bulk-steps li.is-current b, .bulk-steps li.is-done b { background:var(--accent); color:#fff; }
.bulk-steps li.is-done { border-color:var(--accent); }
.bulk-steps a { color:inherit; text-decoration:none; }
.chip-checks { display:flex; flex-wrap:wrap; gap:.5rem; margin:.5rem 0; }
.chip-check { margin:0; cursor:pointer; }
.chip-check input { position:absolute; opacity:0; width:1px; height:1px; }
.chip-check span { display:inline-block; padding:.55rem 1rem; border:1px solid var(--line); border-radius:999px; background:#fff; }
.chip-check input:checked + span { background:var(--accent); border-color:var(--accent); color:#fff; }
.chip-check input:focus-visible + span { outline:2px solid var(--accent); outline-offset:2px; }
.bulk button.chip { cursor:pointer; font:inherit; min-height:40px; }
.bulk-warn { margin:1rem 0; padding:1rem; border:1px solid #e9b949; border-radius:8px; background:#fff8e6; }
.bulk-warn p { margin:.4rem 0 .6rem; }
.bulk-actions { display:flex; gap:.6rem; justify-content:flex-end; margin-top:1.5rem; }
.bulk-note { padding:.8rem 1rem; border:1px solid var(--line); border-left:4px solid var(--accent); border-radius:6px; background:#fff; }
.footer-bulk { text-align:center; margin:.8rem 0 0; font-size:.92rem; }
@media (max-width:520px) { .bulk-steps li { font-size:0; } .bulk-steps li b { font-size:.8rem; } }
.bulk-bar { margin:0 0 1rem; padding:.5rem .9rem; border-radius:6px; background:#fff7e8; border:1px solid #e9b949; font-size:.92rem; }

/* Colour badges above the product list (top right) */
.colour-badges { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem; margin-left:auto; }
.colour-badges + .list-count { margin-left:0; }
.colour-badge { display:inline-flex; align-items:center; gap:.35rem; padding:.2rem .3rem .2rem .45rem; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink); font-size:.82rem; text-decoration:none; line-height:1.4; }
.colour-badge:hover { border-color:var(--accent); }
.colour-badge.is-on { border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); font-weight:600; }
.colour-badge b { min-width:1.35rem; padding:0 .35rem; border-radius:999px; background:var(--accent); color:#fff; font-size:.72rem; font-weight:600; text-align:center; }
.colour-dot { width:.8rem; height:.8rem; border-radius:50%; border:1px solid rgba(0,0,0,.18); flex:none; background:linear-gradient(135deg,#e5e7eb,#9ca3af); }
.colour-more { display:inline-block; position:relative; }
.colour-more summary { list-style:none; cursor:pointer; padding:.2rem .55rem; border:1px dashed var(--line); border-radius:999px; font-size:.82rem; }
.colour-more summary::-webkit-details-marker { display:none; }
.colour-more-list { position:absolute; right:0; top:calc(100% + .3rem); z-index:5; display:flex; flex-wrap:wrap; gap:.35rem; width:max-content; max-width:min(22rem,80vw); padding:.6rem; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 10px 24px rgba(0,0,0,.12); }
.dot-multi { background:conic-gradient(#c62f2f,#f2cf3a,#3f8f4f,#3b6fd1,#8a63b8,#c62f2f); }
.dot-anthracite { background:#3d4247; }
.dot-grey { background:#9aa0a6; }
.dot-silver { background:#c9ccd1; }
.dot-black { background:#16181b; }
.dot-white { background:#ffffff; }
.dot-cream { background:#f3ead6; }
.dot-beige { background:#d9c4a3; }
.dot-taupe { background:#8f8173; }
.dot-brown { background:#7a5232; }
.dot-red { background:#c62f2f; }
.dot-wine { background:#6d1f2f; }
.dot-pink { background:#e98aa8; }
.dot-purple { background:#8a63b8; }
.dot-blue { background:#3b6fd1; }
.dot-navy { background:#1f2f5c; }
.dot-teal { background:#1d7f86; }
.dot-mint { background:#a8dcc3; }
.dot-green { background:#3f8f4f; }
.dot-olive { background:#7a7d3a; }
.dot-yellow { background:#f2cf3a; }
.dot-mustard { background:#c99a1e; }
.dot-orange { background:#e7843a; }
.dot-gold { background:#c9a94a; }
.dot-terracotta { background:#c0643f; }
@media (max-width:640px) { .colour-badges { margin-left:0; width:100%; } .colour-more-list { right:auto; left:0; } }

/* Online withdrawal function */
.footer-legal a.withdraw-link { border:1px solid currentColor; border-radius:6px; padding:.15rem .55rem; font-weight:600; }
.withdraw-summary { padding:1rem; border:1px solid var(--line); border-left:4px solid var(--accent); border-radius:6px; background:#fff; margin:1rem 0; }
.withdraw-actions { display:flex; gap:.6rem; flex-wrap:wrap; }
.withdraw-scope { border:0; padding:0; margin:0 0 1rem; }

.footer-social { display:flex; flex-wrap:wrap; gap:.4rem 1rem; justify-content:inherit; margin:.6rem 0; font-size:.9rem; }
.footer-social span { opacity:.8; }
