/* KarobarOS os-28 — official brand icons + unified professional icon set.
   Brand glyphs are the OFFICIAL marks (Simple Icons path data):
   WhatsApp in brand green #25D366, Shopify in #96BF48 (Shopify card only).
   Every generic UI icon comes from the single Feather-style ico() set in
   linked-entry.js (1.8px stroke, round caps/joins) — no emoji or dingbat
   characters stand in for interface icons anywhere in the chrome. */

/* — WhatsApp official glyph — */
.wa-glyph{color:#25D366;flex:none}
.wa-reminder .wa-glyph{color:#25D366}
.support-icon .wa-glyph{width:22px;height:22px}
#reminderShareButton .wa-glyph,.card-share-actions .wa-glyph{color:#25D366}
/* Mobile header is orange (white glyph); the desktop header is light, so the
   brand green stays there. */
@media (max-width:899px){
  main>header .support-icon .wa-glyph{color:#fff}
}

/* — Shopify official glyph (Shopify card context only) — */
.shopify-glyph{width:20px;height:20px;color:#96BF48;vertical-align:-4px;margin-right:2px}

/* — Cloud header button: real cloud icon, not a text glyph — */
#cloudButton{display:inline-flex;align-items:center;justify-content:center;gap:6px}
#cloudButton .k-icon{width:16px;height:16px}

/* — Icon sizing inside notes, dashboard activity, pickers — */
.kos-note-ico{display:inline-flex}
.kos-note-ico .k-icon{width:20px;height:20px}
.kos-act-ico{display:inline-flex;align-items:center}
.kos-act-ico .k-icon{width:18px;height:18px}
.tiny-photo{display:inline-flex;align-items:center;justify-content:center}
.tiny-photo .k-icon{width:18px;height:18px}

/* — "More" summaries use a real dots icon — */
.page-options>summary .dots-icon{width:22px;height:22px;vertical-align:middle}

/* — Hamburger summary in the shell menu — */
.page-options>summary .k-icon{vertical-align:middle}

/* Icon + label buttons: centre the glyph with the text baseline */
button .k-icon,label.btn .k-icon{vertical-align:-5px}