/**
 * The account menu that opens from the signed-in person's picture, in the
 * site header (header.php) and the seller dashboard header
 * (inc/dashboard-nav.php → ts_dash_photo_menu_html()). Design: account-menu.js
 * (design-changes-27-10-2026), DESIGN-CHANGES BT.
 */
.ts-acct { position: relative; display: inline-flex; align-items: center; font-family: "Inter", system-ui, sans-serif; text-transform: none; letter-spacing: normal; }
.ts-acct * { box-sizing: border-box; }
.ts-acct-btn { display: inline-flex !important; align-items: center; gap: 6px; border: 0 !important; background: none !important; cursor: pointer; padding: 2px !important; border-radius: 999px; font: inherit; color: #1C1A18 !important; box-shadow: none !important; }
.ts-acct-btn:focus-visible { outline: 2px solid var(--mascot); outline-offset: 2px; }
.ts-acct .ts-av { width: 40px; height: 40px; border-radius: 50%; background: #F3EDE3 center / cover no-repeat; border: 1px solid #D8D4CE; display: inline-flex !important; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: #1C1A18; flex: none; }
.ts-acct-btn .ts-av { width: 38px; height: 38px; }
.ts-acct .ts-chev { transition: transform .15s; color: #8C8278; }
.ts-acct-btn[aria-expanded="true"] .ts-chev { transform: rotate(180deg); }
.ts-acct-menu { position: absolute; top: calc(100% + 12px); right: 0; width: 304px; max-width: calc(100vw - 24px); max-height: calc(100vh - 90px); overflow-y: auto; background: #fff; border: 1px solid #D8D4CE; border-radius: 10px; box-shadow: 0 12px 32px rgba(28, 26, 24, .12); padding: 8px; z-index: 1000; text-align: left; font-size: 14px; line-height: 1.35; }
.ts-acct-menu[hidden] { display: none !important; }
.ts-acct .ts-who { display: flex; gap: 12px; align-items: center; padding: 12px 12px 14px; border-bottom: 1px solid #D8D4CE; margin-bottom: 6px; }
.ts-acct .ts-who .ts-av { width: 44px; height: 44px; }
.ts-acct .ts-name { font-size: 15px; font-weight: 700; color: #1C1A18; }
.ts-acct .ts-store { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 3px; font-size: 12.5px; color: #8C8278; }
.ts-acct .ts-tier { font-size: 9px; font-weight: 700; letter-spacing: .06em; color: #fff; border-radius: 3px; padding: 2px 5px; text-transform: uppercase; }
.ts-acct .ts-tier.seller, .ts-acct .ts-tier.plus { background: #728D9C; }
.ts-acct .ts-tier.pro { background: #C9A96E; }
.ts-acct .ts-label { font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #8C8278; padding: 10px 12px 4px; }
.ts-acct a.ts-item, .ts-acct a.ts-go { display: flex !important; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 6px; font-size: 14px !important; font-weight: 500 !important; color: #1C1A18 !important; text-transform: none !important; letter-spacing: normal !important; text-decoration: none !important; background: none; line-height: 1.35; }
.ts-acct a.ts-item:hover, .ts-acct a.ts-go:hover { background: #FAF7F2 !important; }
.ts-acct a.ts-item.is-planned { pointer-events: none; opacity: .65; }
.ts-acct a::after { display: none !important; }
.ts-acct .ts-ico { width: 20px; height: 20px; flex: none; color: #1C1A18; display: inline-flex; }
.ts-acct a.ts-item:hover .ts-ico { color: #bc886d; }
.ts-acct .ts-txt { flex: 1; min-width: 0; }
.ts-acct a.ts-go .ts-txt { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: #BDB8B0; }
.ts-acct a.ts-go:hover .ts-txt { text-decoration-color: #1C1A18; }
.ts-acct .ts-chip { font-size: 11px; font-weight: 700; border-radius: 999px; padding: 2px 8px; background: #FAF7F2; border: 1px solid #D8D4CE; color: #1C1A18; white-space: nowrap; }
.ts-acct .ts-count { font-size: 11px; font-weight: 700; color: #fff; background: #cb7263; border-radius: 999px; min-width: 20px; height: 20px; padding: 0 6px; display: inline-flex !important; align-items: center; justify-content: center; }
.ts-acct .ts-sep { height: 1px; background: #D8D4CE; margin: 6px 4px; }
.ts-acct .ts-meta { font-size: 12.5px; color: #8C8278; margin-top: 2px; overflow-wrap: anywhere; }
.ts-acct a.ts-cta { display: block !important; margin: 8px 4px 4px; text-align: center; background: #cb7263; color: #fff !important; border-radius: 4px; padding: 10px 14px; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .06em !important; text-transform: uppercase !important; text-decoration: none !important; }
.ts-acct a.ts-cta:hover { background: #bc886d; }
.ts-acct .ts-ico svg { width: 20px; height: 20px; }

/* Site header: picture at the far right, after the cart. */
.nav-right .ts-acct { margin-left: 4px; }
.nav-right .ts-acct-btn .ts-av { width: 36px; height: 36px; }
