/* Selected icons from the supplied TINTIN set. Labels remain the accessible name. */
.tintin-icon {
  display:inline-block;flex:0 0 auto;width:20px;height:20px;
  background:currentColor;vertical-align:middle;pointer-events:none;
  -webkit-mask:var(--tintin-icon) center / contain no-repeat;
  mask:var(--tintin-icon) center / contain no-repeat;
}
.tintin-icon--grid { --tintin-icon:url("/assets/icons/grid.svg"); }
.tintin-icon--package { --tintin-icon:url("/assets/icons/package.svg"); }
.tintin-icon--store { --tintin-icon:url("/assets/icons/store.svg"); }
.tintin-icon--external-link { --tintin-icon:url("/assets/icons/external-link.svg"); }
.tintin-icon--gamepad { --tintin-icon:url("/assets/icons/gamepad.svg"); }
.tintin-icon--coin { --tintin-icon:url("/assets/icons/coin.svg"); }
.tintin-icon--gift { --tintin-icon:url("/assets/icons/gift.svg"); }
.tintin-icon--membership { --tintin-icon:url("/assets/icons/membership.svg"); }

.shop-step-label { display:flex;align-items:center;gap:12px;min-height:32px; }
.shop-step-label .tintin-icon { width:28px;height:28px;color:#e31e26; }
.shop-step-label > span:last-child { font-size:11px;line-height:1.5;color:#76504b; }
.market-options a { gap:12px; }
.market-options .tintin-icon { width:16px;height:16px; }
.hub-quickbar nav a { gap:9px;flex-shrink:0;white-space:nowrap; }
.hub-quickbar nav .tintin-icon { width:18px;height:18px;color:#e31e26; }
@media(max-width:560px) {
  .hub-quickbar nav { justify-content:flex-start; }
  .hub-quickbar nav a { gap:7px; }
  .hub-quickbar nav .tintin-icon { width:16px;height:16px; }
}

.tintin-icon--shopping-bag { --tintin-icon:url("/assets/icons/shopping-bag.svg"); }
.tintin-icon--eye { --tintin-icon:url("/assets/icons/eye.svg"); }
.tintin-icon--quiz { --tintin-icon:url("/assets/icons/quiz.svg"); }
.tintin-icon--stamp { --tintin-icon:url("/assets/icons/stamp.svg"); }
.tintin-icon--receipt { --tintin-icon:url("/assets/icons/receipt.svg"); }
.tintin-icon--share { --tintin-icon:url("/assets/icons/share.svg"); }
.tintin-icon--chat { --tintin-icon:url("/assets/icons/chat.svg"); }

/* Action icons share a quiet size and baseline, never replacing the label. */
.icon-action { display:inline-flex;align-items:center;justify-content:center;gap:10px; }
.button.icon-action, .text-link.icon-action, .solid-action.icon-action,
.hub-hero-actions > a.icon-action { gap:10px; }
.icon-action > .tintin-icon { width:22px;height:22px; }
#catalog-grid .shop-product-link { width:fit-content;gap:9px;align-items:center; }
#catalog-grid .shop-product-link > .tintin-icon { width:20px;height:20px; }
.shop-step-label .tintin-icon { width:32px;height:32px; }
.mission-copy .icon-action { justify-content:flex-start; }
.hunt-stamp > .tintin-icon { width:22px;height:22px; }
.hunt-stamp[data-found="true"] > .tintin-icon { --tintin-icon:url("/assets/icons/check.svg"); }
.footer .footer-contact.icon-action { gap:12px; }
@media(max-width:560px) {
  .icon-action { gap:9px; }
  .icon-action > .tintin-icon { width:20px;height:20px; }
  #catalog-grid .shop-product-link { gap:7px; }
  #catalog-grid .shop-product-link > .tintin-icon { width:18px;height:18px; }
}

/* A compact stamp status, with a check aligned to the label rather than a badge. */
.hunt-stamp[data-found="true"] > .tintin-icon { width:16px;height:16px; }
#perjalanan .journey-note {
  display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;
  gap:4px 16px;padding:14px var(--gutter);
}
#perjalanan .journey-note .hunt-stamp {
  min-height:32px;padding:6px 0;gap:7px;font-size:11px;line-height:20px;
}
#perjalanan .journey-note .hunt-stamp > .tintin-icon { width:16px;height:16px; }
#perjalanan .journey-note .hunt-message { min-height:0;font-size:11px;line-height:20px; }
#perjalanan .journey-note .hunt-next { padding:6px 0;text-underline-offset:3px; }
@media(max-width:560px) {
  #perjalanan .journey-note { justify-content:flex-start;gap:0 12px; }
}
