/* ===================================================================== USBCheck Header Dropdowns (neuer Header) + Logout-Modal ===================================================================== */ /* Dropdown Panels für Sprach- & User-Menü */ #langMenu, #userMenu { background: rgba(255, 255, 255, 0.96); border-radius: 12px; border: 1px solid rgba(200, 203, 208, 0.85); box-shadow: var(--shadow-soft); backdrop-filter: blur(10px); } #langMenu .lang-pill, #userMenu a, #userMenu button { background: transparent; } #langMenu .lang-pill:hover, #userMenu a:hover, #userMenu button:hover { background: rgba(237, 242, 251, 0.95); } /* Logout-Modal Overlay & Panel */ #logoutModalBackdrop { background: rgba(15, 31, 61, 0.32); backdrop-filter: blur(4px); } #logoutModalBackdrop > div { background: #ffffff; border-radius: 24px; border: 1px solid rgba(200, 203, 208, 0.85); box-shadow: var(--shadow-soft); padding: 1.8rem 2rem; } #logoutModalBackdrop h2 { font-family: var(--font-heading); font-weight: 700; font-size: 1.25rem; color: var(--deep-gray); margin-bottom: 0.4rem; } #logoutModalBackdrop p { font-size: 0.95rem; color: #555; } /* Cancel Button */ #logoutCancel { border-radius: var(--radius-pill); border: 1px solid var(--silver); background: #fff; color: #555; font-family: var(--font-heading); font-weight: 600; font-size: 0.8rem; letter-spacing: 0.18em; text-transform: uppercase; padding: 0.45rem 1.4rem; transition: background 0.12s ease, box-shadow 0.12s ease, transform 0.08s ease; } #logoutCancel:hover { background: var(--very-light-gray); transform: translateY(-1px); } /* Confirm Button (Danger) */ #logoutConfirm { border-radius: var(--radius-pill); border: none; background: linear-gradient(135deg, var(--error-red), #ff7a7a); color: #fff; font-family: var(--font-heading); font-weight: 600; font-size: 0.8rem; letter-spacing: 0.18em; text-transform: uppercase; padding: 0.45rem 1.6rem; box-shadow: 0 12px 24px rgba(244, 102, 102, 0.35); transition: background 0.12s ease, box-shadow 0.12s ease, transform 0.08s ease; } #logoutConfirm:hover { background: linear-gradient(135deg, #ff7a7a, var(--error-red)); box-shadow: 0 16px 30px rgba(244, 102, 102, 0.45); transform: translateY(-1px); }