/* Mugs Printing: shop pages (category, product, basket, checkout, help, account) in the mosaic look. Loaded after
   fp-shop.css; palette and fonts follow through the tokens re-pointed in mug.css, this sheet changes shape and colour. */

body.mg-site:not(.mg-front){background:var(--page)}
body.mg-site:not(.mg-front) h1,body.mg-site:not(.mg-front) h2,body.mg-site:not(.mg-front) h3{font-family:var(--display);font-weight:900;letter-spacing:-.02em}
.fp-wrap{max-width:1440px}

/* no mascots on this shop: their empty frames go too */
.fp-cathead-blob,.fp-accdash-art,.fp-acc-peek,.fp-arthead-art,.fp-getcard-art,.fp-fill-pet,.fp-side-price-m,.fph-pair,.fp-loading-pug,.fp-askcard-m,.fp-empty-m,.sx-art{display:none!important}

/* ---------------- head bands: an ink tile with the colour key ---------------- */
.fp-cathead,.fp-arthead{background:transparent!important;color:var(--ink);padding-top:var(--gap)!important;padding-bottom:0!important;position:relative;overflow:visible}
.fp-cathead::before,.fp-cathead::after,.fp-arthead::before,.fp-arthead::after{display:none!important}
.fp-cathead-in,.fp-arthead-in{background:var(--ink);color:#fff;border-radius:var(--rL);padding:30px 34px!important;position:relative;z-index:1;overflow:hidden}
.fp-cathead-in::before,.fp-arthead-in::before{content:"";position:absolute;left:34px;top:0;width:87px;height:8px;background:var(--mg-key) left top/87px 8px no-repeat}
.fp-arthead--slim .fp-arthead-in{background:#fff;color:var(--ink);padding:20px 26px!important}
.fp-arthead--slim .fp-arthead-in::before{left:26px}
.fp-cathead h1,.fp-arthead h1{color:#fff!important;font-weight:900!important;font-family:var(--display)!important;letter-spacing:-.035em!important;text-shadow:none!important}
.fp-arthead--slim h1{color:var(--ink)!important}
.fp-cathead .crumbs li,.fp-arthead .crumbs li,.fp-cathead .crumbs [aria-current],.fp-arthead .crumbs [aria-current]{color:#cfd2d5!important}
.fp-cathead .crumbs a,.fp-arthead .crumbs a{color:#fff!important;text-decoration-color:var(--yellow)}
.fp-arthead--slim .crumbs li,.fp-arthead--slim .crumbs a{color:var(--ink)!important}
.fp-cathead .fp-answer,.fp-cathead-lede,.fp-cathead-lede p,.fp-arthead-sum,.fp-arthead-meta{color:#e9eaeb!important}
.fp-cathead-lede a{color:var(--yellow)!important}
.fp-arthead-meta .fp-ui{color:var(--yellow)!important}
.fp-eyebrow{color:var(--yellow)!important;font-weight:800!important}
.fp-fact{background:#2a2f35!important;color:#fff!important;border:0!important;border-radius:var(--rS)!important}
.fp-fact .fp-ui{color:var(--yellow)!important}
.fp-fact--price{background:var(--yellow)!important;color:var(--ink)!important;font-family:var(--display)!important;font-weight:900!important}
.fp-fact--price small{color:var(--ink)!important}
/* fp-steps (basket / checkout) on the white slim head */
.fp-steps li{color:var(--ink)!important}
.fp-steps li b{background:var(--page)!important;color:var(--ink)!important;border-radius:var(--rS)!important}
.fp-steps li.is-on b{background:var(--yellow)!important;color:var(--ink)!important}
.fp-steps li.is-done b{background:var(--green)!important;color:var(--ink)!important}
/* category head art: three CSS mugs in the mosaic colours */
.mg-cathead-art{position:relative;align-self:center;justify-self:end;width:300px;height:190px;margin:8px;background:none!important}
.mg-cmug{position:absolute;bottom:14px;width:92px;height:100px;border-radius:4px 4px 46px 46px/4px 4px 10px 10px;background:var(--c);box-shadow:inset -10px 0 14px rgba(16,20,24,.18),inset 10px 0 14px rgba(255,255,255,.25)}
.mg-cmug::after{content:"";position:absolute;right:-30px;top:20px;width:30px;height:50px;border:11px solid var(--c);border-left:0;border-radius:0 50% 50% 0}
.mg-cmug i{position:absolute;left:14px;right:14px;top:26px;height:34px;border-radius:3px;background:#fff;opacity:.92}
.mg-cmug--0{left:0;transform:rotate(-4deg)}.mg-cmug--1{left:104px;bottom:46px}.mg-cmug--2{left:196px;transform:rotate(5deg)}
.mg-cathead-art::after{content:"";position:absolute;left:-8px;right:-8px;bottom:6px;height:10px;border-radius:2px;background:#2a2f35}
@media (max-width:759px){.mg-cathead-art{display:none}.fp-cathead-in,.fp-arthead-in{padding:24px 18px!important}.fp-cathead-in::before,.fp-arthead-in::before{left:18px}}

/* chips + anchor bars */
.fp-chip{border:2px solid var(--ink)!important;background:#fff!important;color:var(--ink)!important;border-radius:var(--rS)!important;font-weight:700!important}
.fp-chip small{color:var(--mute)!important}
.fp-chip.is-on,.fp-chip:hover{background:var(--ink)!important;color:#fff!important}
.fp-chip.is-on small,.fp-chip:hover small{color:#cfd2d5!important}
.fp-anchors{background:transparent!important;border:0!important}
.fp-anchors .fp-wrap>ul{background:#fff;border-radius:var(--r);padding:4px 6px!important}
.fp-anchors a{color:var(--ink)!important;font-weight:800!important;font-family:var(--display)!important;border-radius:var(--rS);border-bottom:0!important}
.fp-anchors a.is-on,.fp-anchors a:hover{background:var(--yellow)!important;color:var(--ink)!important}

/* section heads */
.fp-sec-h h2{color:var(--ink)!important}
.fp-link{color:var(--blue-d)!important;font-weight:800!important}

/* product cards: white tiles with a colour frame on hover */
.fp-pcard{background:#fff!important;border:0!important;border-radius:var(--r)!important;box-shadow:none!important;overflow:hidden;transition:transform .2s ease;outline:0 solid var(--yellow)}
.fp-pgrid>.fp-pcard:nth-child(6n+1){--c:#2d5bff}.fp-pgrid>.fp-pcard:nth-child(6n+2){--c:#ff2e8b}.fp-pgrid>.fp-pcard:nth-child(6n+3){--c:#ffd60a}.fp-pgrid>.fp-pcard:nth-child(6n+4){--c:#00d4e0}.fp-pgrid>.fp-pcard:nth-child(6n+5){--c:#48e05a}.fp-pgrid>.fp-pcard:nth-child(6n){--c:#ff6a13}
.fp-pcard{border-top:8px solid var(--c,var(--yellow))!important}
.fp-pcard:hover{transform:translateY(-4px)}
.fp-from{background:var(--yellow)!important;color:var(--ink)!important;font-family:var(--display)!important;font-weight:900!important;border-radius:var(--rS)!important}
.fp-from small{color:var(--ink)!important}
.fp-pcard-t{font-family:var(--display)!important;font-weight:900!important;color:var(--ink)!important;letter-spacing:-.015em}
.fp-fill{border:0!important;box-shadow:none!important;border-radius:var(--r)!important}
.fp-fill--navy{background:var(--ink)!important;color:#fff!important}.fp-fill--sky{background:var(--blue)!important;color:#fff!important}.fp-fill--red{background:var(--pink)!important;color:var(--ink)!important}
.fp-fill *{color:inherit!important}

/* buttons on shop pages */
.fp-btn{border-radius:var(--rS)!important;font-family:var(--display)!important;font-weight:800!important}
.fp-btn--red,.single_add_to_cart_button,.checkout-button,#place_order{background:var(--yellow)!important;border-color:var(--yellow)!important;color:var(--ink)!important;border-radius:var(--rS)!important;font-family:var(--display)!important;font-weight:900!important}
.fp-btn--red:hover,.single_add_to_cart_button:hover,.checkout-button:hover,#place_order:hover{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}
.fp-btn--line{background:#fff!important;color:var(--ink)!important;border-color:var(--ink)!important}
.fp-btn--line:hover{background:var(--ink)!important;color:#fff!important}

/* ---------------- product page ---------------- */
.fp-buy{background:#fff!important;border:0!important;border-radius:var(--rL)!important;box-shadow:none!important;overflow:hidden}
.fp-buy-head{background:var(--ink)!important;color:#fff;position:relative}
.fp-buy-head::before{content:"";position:absolute;left:24px;top:0;width:87px;height:8px;background:var(--mg-key) left top/87px 8px no-repeat}
.fp-buy-head::after{display:none!important}
.fp-buy-fam{font-weight:800!important;color:var(--yellow)!important;text-transform:uppercase;letter-spacing:.08em;font-size:13px!important}
.fp-buy-head h1,.fp-buy-head .product_title{color:#fff!important;text-shadow:none!important;font-weight:900!important;letter-spacing:-.035em!important}
.fp-buy-head .fp-answer{color:#e9eaeb!important}
.fp-buy-head .pdp-price{background:var(--yellow)!important;color:var(--ink)!important;border-radius:var(--rS)!important}
.fp-buy-head .pdp-price small{color:var(--ink)!important}
.fp-buy-head .pdp-price__amt{color:var(--ink)!important}
.fp-buy-head .pdp-more{color:var(--yellow)!important}
.fp-buy-head a:not(.fp-buy-fam){color:#fff}
.pdp-price__amt,.fp-total-p{font-family:var(--display)!important;font-weight:900!important;color:var(--ink)!important}
.mg-trust{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;padding:0 !important;margin-top:16px!important;border:0!important;background:none!important}
.mg-trust li{display:flex!important;align-items:flex-start;gap:8px;padding:12px!important;border-radius:var(--rS);font-size:14.5px;line-height:1.3;margin:0!important;color:var(--ink);background:var(--page);border-left:6px solid var(--line)}
.mg-trust li.k-c{border-left-color:var(--blue)}.mg-trust li.k-m{border-left-color:var(--pink)}.mg-trust li.k-y{border-left-color:var(--yellow)}.mg-trust li.k-k{border-left-color:var(--green)}
.mg-trust .fp-ui{width:19px;height:19px;color:var(--ink)}
.mg-trust b{font-weight:700}
.mg-days{display:flex;align-items:center;gap:8px;margin:12px 0 0;font:500 14.5px/1.4 var(--body);color:var(--mute)}
.mg-days .fp-ui{width:17px;height:17px;color:var(--ink)}
.fp-gal-stage{border:8px solid var(--yellow)!important;background:#fff!important;border-radius:var(--rL)!important;overflow:hidden}
.fp-gal-thumbs button{border:3px solid transparent!important;border-radius:var(--rS)!important;overflow:hidden;background:#fff!important}
.fp-gal-thumbs button.is-on{border-color:var(--ink)!important}
.fp-getcard{background:#fff!important;border:0!important;border-radius:var(--rL)!important;border-top:8px solid var(--cyan)!important}
.fp-getcard .fp-ui{color:var(--ink)!important}
.fp-mbar{background:#fff!important;border-top:3px solid var(--ink)!important}
.fp-mbar-p b{font-family:var(--display)!important;font-weight:900!important;color:var(--ink)!important}

/* configurator */
.ib-cfg .ib-opt,.ib-cfg label,.ib-cfg legend{font-family:var(--body)}

/* specs + questions */
.fp-specs dt,.fp-specs th{font-weight:700!important;text-transform:uppercase;font-size:12.5px!important;letter-spacing:.05em;color:var(--mute)!important}
.fp-faq details,.ib-faq details,#faq details{background:#fff;border:0!important;border-left:6px solid var(--blue)!important;border-radius:var(--r)!important;margin-bottom:8px}
.fp-faq details:nth-child(3n+2),#faq details:nth-child(3n+2){border-left-color:var(--pink)!important}
.fp-faq details:nth-child(3n),#faq details:nth-child(3n){border-left-color:var(--yellow)!important}
.fp-faq summary,#faq details summary{font-family:var(--display)!important;font-weight:800!important;color:var(--ink)!important}
.fp-faq details[open],#faq details[open]{background:#fff!important}
.fp-faq details[open] summary,#faq details[open] > summary{background:transparent}

/* basket + checkout */
.fp-freebar{background:#fff!important;border:0!important;border-radius:var(--r)!important}
.fp-freebar-track{border-radius:var(--rS)!important}
.fp-freebar-track i{background:var(--green)!important;border-radius:var(--rS)!important}
.fp-askcard{background:var(--yellow)!important;color:var(--ink)!important;border:0!important;border-radius:var(--rL)!important}
.fp-askcard h2,.fp-askcard p{color:var(--ink)!important}
.fp-askcard .fp-btn--red{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}
.fp-empty{background:#fff!important;border-radius:var(--rL)!important}
@media (min-width:1024px){.fp-pdp-top .fp-gal{position:sticky;top:12px;align-self:start}}
.fp-fill--sky em,.fp-fill--sky em *{color:var(--ink)!important} /* QA 5 Nov: white pill had white text */

/* Blog guides per range (nx-mug-guides.php, 5 Nov 2026): category "Guides for this range" cards + product "Buying guides" list */
.mg-rguides-sub{margin:-6px 0 18px;color:var(--mute);font-size:1rem;line-height:1.55;max-width:68ch}
.mg-rguides .fp-guide{border-left-width:6px}
.mg-rguides .fp-guide:nth-child(6n+1){border-left-color:var(--blue)}.mg-rguides .fp-guide:nth-child(6n+2){border-left-color:var(--pink)}
.mg-rguides .fp-guide:nth-child(6n+3){border-left-color:var(--yellow)}.mg-rguides .fp-guide:nth-child(6n+4){border-left-color:var(--cyan)}
.mg-rguides .fp-guide:nth-child(6n+5){border-left-color:var(--green)}.mg-rguides .fp-guide:nth-child(6n+6){border-left-color:var(--orange)}
.mg-rguides .fp-sec-h .fp-link{min-height:44px;display:inline-flex;align-items:center}
@media (min-width:760px) and (max-width:1099px){.mg-rguides .fp-guides{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:759px){.mg-rguides .fp-guides>.fp-guide:nth-child(n+4){display:none}}
.mg-pguides-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--gap)}
@media (min-width:760px){.mg-pguides-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mg-pguides-list a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:12px 16px;background:var(--card);border-radius:var(--r);box-shadow:0 0 0 1px var(--line);border-left:6px solid var(--blue);color:var(--ink);font-weight:700;line-height:1.35;text-decoration:none}
.mg-pguides-list li:nth-child(4n+2) a{border-left-color:var(--pink)}.mg-pguides-list li:nth-child(4n+3) a{border-left-color:var(--yellow)}.mg-pguides-list li:nth-child(4n+4) a{border-left-color:var(--green)}
.mg-pguides-list a:hover,.mg-pguides-list a:focus-visible{box-shadow:0 0 0 2px var(--ink)}
.mg-pguides-list .fp-ui{flex:none;width:16px;height:16px}
