/* Approved ticket 04: coloured band, square quantity and a cropped brand macroprint. */
#device-host .pd-tk.pd-tk-v4 .pd-tk-card{display:grid;grid-template-columns:32px minmax(0,1fr);min-height:0;isolation:isolate;background:#101215;border:1px solid #ffffff1b;border-radius:16px;box-shadow:none}
#device-host .pd-tk.pd-tk-v4 .pd-tk-card::before{display:none}
#device-host .pd-tk.pd-tk-v4 .pd-tk-card::after{content:'';position:absolute;z-index:0;pointer-events:none;width:220px;height:220px;right:-44px;top:50%;transform:translateY(-50%) rotate(-14deg);background:url('../assets/logo-mark.svg') center/contain no-repeat;opacity:.065}
#device-host .pd-tk.pd-tk-v4 .pd-tk-band{z-index:1;display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;transform:rotate(180deg);background:var(--cp-tone,#e9c86a);color:#211d12;font:700 10px/14px var(--pd-font,'Play',sans-serif);letter-spacing:.18em}
#device-host .pd-tk.pd-tk-v4 .pd-tk-main{position:relative;z-index:1;min-width:0;padding:16px;gap:0}
#device-host .pd-tk.pd-tk-v4 .pd-tk-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
#device-host .pd-tk.pd-tk-v4 .pd-tk-type{display:block;margin:0;color:#a9adb7;font:700 10px/14px var(--pd-font,'Play',sans-serif);letter-spacing:.1em;text-transform:uppercase}
#device-host .pd-tk.pd-tk-v4 .pd-tk-qty{width:28px;height:28px;flex:none;padding:0;display:grid;place-items:center;border-radius:var(--radius-sm,8px);background:color-mix(in srgb,var(--cp-tone,#e9c86a) 10%,#141619);color:var(--cp-tone,#e9c86a);font:700 12px/16px var(--pd-font,'Play',sans-serif);font-variant-numeric:tabular-nums}
#device-host .pd-tk.pd-tk-v4 .pd-tk-name{margin:2px 0 0;font:700 28px/34px var(--pd-font,'Play',sans-serif);letter-spacing:-.025em;color:#f2f3f5;white-space:nowrap;font-variant-numeric:tabular-nums}
#device-host .pd-tk.pd-tk-v4 .pd-tk-value{gap:4px;margin-top:4px;flex-wrap:wrap}
#device-host .pd-tk.pd-tk-v4 .pd-tk-value small,#device-host .pd-tk.pd-tk-v4 .pd-tk-value b{font:400 12px/16px var(--pd-font,'Play',sans-serif);color:#a9adb7}
#device-host .pd-tk.pd-tk-v4 .pd-tk-value b{color:#dce0e6}
#device-host .pd-tk.pd-tk-v4 .pd-tk-foot{margin-top:12px;padding-top:10px;border-top:1px solid #ffffff12;gap:8px;flex-wrap:wrap;min-height:28px}
#device-host .pd-tk.pd-tk-v4 .pd-tk-until{font:400 11px/16px var(--pd-font,'Play',sans-serif);color:#a9adb7;overflow:visible;text-overflow:clip;white-space:normal}
#device-host .pd-tk.pd-tk-v4 .pd-tk-use{font:700 12px/16px var(--pd-font,'Play',sans-serif);color:#ff5363;margin-left:auto}
#device-host .pd-tk.pd-tk-v4:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:16px}
#device-host .pd-tk.pd-tk-v4:active .pd-tk-card{border-color:color-mix(in srgb,var(--cp-tone,#e9c86a) 55%,transparent)}
/* Keep the new-item badge separate from the quantity square. */
#device-host .pd-bp-tkw:has(.pd-tk-v4)>.pd-bp-new{left:8px;right:auto;top:8px;width:6px;height:6px;padding:0;border:0;border-radius:50%;font-size:0;background:#d71921;box-shadow:0 0 0 2px var(--cp-tone,#e9c86a)}
@media(max-width:360px){#device-host .pd-tk.pd-tk-v4 .pd-tk-main{padding:14px 12px}#device-host .pd-tk.pd-tk-v4 .pd-tk-name{font-size:25px;line-height:32px}}