#transactionShortcutBar .shortcut-code{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font:800 11px Arial,sans-serif;letter-spacing:.25px;line-height:1;color:inherit}
#transactionShortcutBar button[data-shortcut-index]>.lo-icon{display:none!important}

/* Topbar shortcut row replaces the floating side rail. */
.topbar #transactionShortcutBar{position:static!important;inset:auto!important;transform:none!important;z-index:auto;width:auto!important;height:40px!important;min-width:0;flex:1 1 0;margin:0 12px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
.topbar #transactionShortcutBar .shortcut-icons{position:static!important;inset:auto!important;transform:none!important;opacity:1!important;display:flex!important;flex-direction:row!important;gap:4px;width:max-content;max-height:none!important;overflow:visible!important;padding:2px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none;transition:none!important}
.topbar #transactionShortcutBar .shortcut-edge,.topbar #transactionShortcutBar .shortcut-pin,.topbar #transactionShortcutBar .shortcut-label{display:none!important}
.topbar #transactionShortcutBar button[data-shortcut-index]{width:34px;height:34px;flex:0 0 34px;border-radius:8px;box-shadow:none;transform:none}
.topbar:has(#transactionShortcutBar):has(.dashboard-topbar-greeting){height:auto!important;flex-wrap:wrap!important;padding-top:8px!important;padding-bottom:6px!important}
.topbar:has(.dashboard-topbar-greeting) #transactionShortcutBar{order:10;flex:1 1 100%;margin:4px 0 0}
@media(max-width:1100px){.topbar:has(#transactionShortcutBar){height:auto!important;flex-wrap:wrap;gap:6px;padding-top:8px;padding-bottom:6px}.topbar #transactionShortcutBar{order:10;flex:1 1 100%;margin:3px 0 0}.topbar:has(#transactionShortcutBar) .top-actions{margin-left:auto}}

.topbar #transactionShortcutBar .shortcut-icons{margin-inline:auto!important}

/* Comfortable, consistent topbar transaction shortcuts. */
.topbar #transactionShortcutBar{height:46px!important}
.topbar #transactionShortcutBar .shortcut-icons{gap:6px;padding:4px!important}
.topbar #transactionShortcutBar button[data-shortcut-index]{width:auto;min-width:40px;height:36px;flex:0 0 auto;padding:0 10px;border:1px solid rgba(255,255,255,.18);border-radius:10px;background:linear-gradient(145deg,#246b57,#123e33);color:#f5fffb;box-shadow:0 2px 4px rgba(14,56,43,.12),inset 0 1px 0 rgba(255,255,255,.1);transition:background .16s,box-shadow .16s,transform .16s}
.topbar #transactionShortcutBar .shortcut-code{font-family:inherit;font-size:11px;font-weight:700;letter-spacing:.45px;line-height:1;white-space:nowrap;text-shadow:none}
.topbar #transactionShortcutBar button[data-shortcut-index]:hover{background:linear-gradient(145deg,#30856b,#1c5846);transform:translateY(-1px);box-shadow:0 4px 8px rgba(14,56,43,.18)}
.topbar #transactionShortcutBar button[data-shortcut-index]:active{transform:translateY(0);box-shadow:inset 0 1px 3px rgba(0,0,0,.2)}
.topbar #transactionShortcutBar button[data-shortcut-index]:focus-visible{outline:2px solid #43ad88;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.topbar #transactionShortcutBar button[data-shortcut-index]{transition:none}}
