.dtf-old-account-menu-item-hidden { display: none !important; } .dtf-header-account-wrap, .dtf-header-account-menu-li { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; margin-left: 10px !important; vertical-align: middle !important; z-index: 50 !important; list-style: none !important; } .dtf-header-account-wrap { text-decoration: none !important; } .dtf-header-account-btn { width: 58px !important; height: 52px !important; min-width: 58px !important; min-height: 52px !important; border-radius: 18px !important; border: 1px solid #dbeafe !important; background: radial-gradient(circle at top right, rgba(0,159,227,.10), transparent 38%), #ffffff !important; color: #07111f !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; position: relative !important; box-shadow: 0 10px 26px rgba(15,23,42,.06) !important; cursor: pointer !important; text-decoration: none !important; padding: 0 !important; margin: 0 !important; transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease !important; } .dtf-header-account-btn:hover, .dtf-header-account-wrap:hover .dtf-header-account-btn, .dtf-header-account-wrap.is-open .dtf-header-account-btn { transform: translateY(-1px) !important; border-color: #009fe3 !important; background: radial-gradient(circle at top right, rgba(0,159,227,.16), transparent 38%), #f7fbff !important; box-shadow: 0 14px 30px rgba(0,159,227,.12) !important; } .dtf-header-account-btn svg { width: 22px !important; height: 22px !important; fill: currentColor !important; display: block !important; } .dtf-header-account-mini-label { position: absolute !important; left: 50% !important; bottom: -22px !important; transform: translateX(-50%) translateY(3px) !important; opacity: 0 !important; pointer-events: none !important; white-space: nowrap !important; padding: 4px 7px !important; border-radius: 999px !important; background: #07111f !important; color: #ffffff !important; font-size: 10px !important; line-height: 1 !important; font-weight: 800 !important; transition: opacity .18s ease, transform .18s ease !important; z-index: 999999 !important; } .dtf-header-account-wrap:hover .dtf-header-account-mini-label { opacity: 1 !important; transform: translateX(-50%) translateY(0) !important; } .dtf-header-account-avatar, .dtf-account-dropdown__avatar { width: 29px !important; height: 29px !important; border-radius: 999px !important; background: linear-gradient(135deg, #009fe3 0%, #0b5cff 100%) !important; color: #ffffff !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 13px !important; line-height: 1 !important; font-weight: 900 !important; text-transform: uppercase !important; } .dtf-header-account-online { position: absolute !important; right: 13px !important; top: 12px !important; width: 9px !important; height: 9px !important; border-radius: 999px !important; background: #22c55e !important; border: 2px solid #ffffff !important; box-shadow: 0 0 0 2px rgba(34,197,94,.14) !important; } .dtf-account-dropdown { position: fixed !important; top: var(--dtf-account-menu-top, 78px) !important; left: var(--dtf-account-menu-left, auto) !important; width: var(--dtf-account-menu-width, 260px) !important; padding: 8px !important; border-radius: 18px !important; background: #ffffff !important; border: 1px solid #dbeafe !important; box-shadow: 0 22px 60px rgba(15,23,42,.18) !important; opacity: 0 !important; visibility: hidden !important; transform: translateY(8px) scale(.98) !important; transition: opacity .18s ease, visibility .18s ease, transform .18s ease !important; z-index: 999999999 !important; box-sizing: border-box !important; } .dtf-header-account-wrap.is-open .dtf-account-dropdown { opacity: 1 !important; visibility: visible !important; transform: translateY(0) scale(1) !important; } .dtf-account-dropdown__head { padding: 10px !important; margin-bottom: 5px !important; border-radius: 14px !important; background: radial-gradient(circle at top right, rgba(0,159,227,.14), transparent 38%), linear-gradient(135deg, #f8fbff 0%, #ffffff 100%) !important; display: flex !important; align-items: center !important; gap: 9px !important; } .dtf-account-dropdown__head strong { display: block !important; color: #111827 !important; font-size: 13px !important; line-height: 1.2 !important; font-weight: 900 !important; max-width: 175px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } .dtf-account-dropdown__head small { display: block !important; margin-top: 2px !important; color: #64748b !important; font-size: 10.5px !important; line-height: 1.2 !important; font-weight: 700 !important; } .dtf-account-dropdown a { min-height: 38px !important; padding: 0 10px !important; border-radius: 12px !important; color: #334155 !important; text-decoration: none !important; display: flex !important; align-items: center !important; gap: 8px !important; font-size: 12px !important; line-height: 1 !important; font-weight: 800 !important; transition: background .16s ease, color .16s ease !important; } .dtf-account-dropdown a:hover { background: #eff6ff !important; color: #006fa4 !important; } .dtf-account-dropdown a.dtf-account-logout { color: #b91c1c !important; } .dtf-account-dropdown a.dtf-account-logout:hover { background: #fff1f2 !important; color: #991b1b !important; } .dtf-account-menu-icon { width: 22px !important; height: 22px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 8px !important; background: #f8fafc !important; font-size: 13px !important; line-height: 1 !important; flex: 0 0 auto !important; } @media (max-width: 991px) { .dtf-header-account-wrap, .dtf-header-account-menu-li { margin-left: 6px !important; } .dtf-header-account-btn { width: 42px !important; height: 42px !important; min-width: 42px !important; min-height: 42px !important; border-radius: 14px !important; box-shadow: 0 8px 20px rgba(15,23,42,.05) !important; } .dtf-header-account-btn svg { width: 20px !important; height: 20px !important; } .dtf-header-account-avatar { width: 25px !important; height: 25px !important; font-size: 12px !important; } .dtf-header-account-online { right: 8px !important; top: 8px !important; width: 8px !important; height: 8px !important; } .dtf-header-account-mini-label { display: none !important; } .dtf-account-dropdown { border-radius: 16px !important; } } @media (max-width: 480px) { .dtf-header-account-wrap, .dtf-header-account-menu-li { margin-left: 4px !important; } .dtf-header-account-btn { width: 39px !important; height: 39px !important; min-width: 39px !important; min-height: 39px !important; border-radius: 13px !important; } .dtf-account-dropdown { width: calc(100vw - 20px) !important; } }