/* The account button in the site header for a logged-in person (inc/tcn-account-tools.php tcn_header_account_menu). Own class family, loaded after every other header rule. */
.tca { position: relative; flex: none; display: inline-flex; }
.tca-btn { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 2px solid var(--n-aqua, #5ce1e6); border-radius: 50%; overflow: hidden; background: #1b1a63; color: #fff; font: 800 16px/1 var(--dp-sans, Inter, system-ui, sans-serif); cursor: pointer; }
.tca-btn img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tca-btn:hover, .tca-btn:focus-visible, .tca-btn[aria-expanded="true"] { border-color: #fff; outline: 0; }
.tca-menu { position: absolute; right: 0; top: calc(100% + 10px); z-index: 300; width: min(320px, calc(100vw - 32px)); max-height: min(70vh, 520px); overflow-y: auto; padding: 8px; border-radius: 16px; background: #fff; border: 1px solid #e5e7eb; box-shadow: 0 18px 50px rgba(30, 16, 90, .28); text-align: left; }
.tca-menu[hidden] { display: none; }
.tca-h, .tca-g { padding: 12px 16px 4px; color: #6b7280; font: 800 11px/1.2 var(--dp-sans, Inter, system-ui, sans-serif); letter-spacing: .08em; text-transform: uppercase; }
.tca-it { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 6px 16px; border-radius: 12px; color: #111827; text-decoration: none; text-transform: none; letter-spacing: 0; cursor: pointer; }
.tca-it:hover, .tca-it:focus-visible { background: #f3f0ff; outline: 0; }
.tca-av { flex: none; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; overflow: hidden; background: #ede9fe; color: #5b21b6; font: 800 16px/1 var(--dp-sans, Inter, system-ui, sans-serif); }
.tca-av img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tca-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.tca-tx b { font: 700 15px/1.25 var(--dp-sans, Inter, system-ui, sans-serif); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tca-tx small { margin-top: 2px; color: #6b7280; font: 500 12px/1.2 var(--dp-sans, Inter, system-ui, sans-serif); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tca-out { margin-top: 6px; border-top: 1px solid #eee; border-radius: 0 0 12px 12px; min-height: 48px; }
.tca-out .tca-tx b { color: #c2412f; }