.add-system-app-overlay { z-index: 2000; } .add-system-app-card { position: fixed; display: flex; top: 10%; flex-direction: column; align-items: center; width: calc(90vw - 60px); max-width: 400px; max-height: calc(80vh - 60px); overflow-y: auto; padding: 30px; background-color: var(--bg-secondary); border-radius: 15px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); } .add-system-app-title { text-align: center; font-size: 26px; user-select: none; margin-bottom: 20px; } .add-system-app-content { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; } .add-system-app-content input { width: 100%; padding: 15px; color: var(--text-primary); background-color: var(--bg-primary); border: 1px solid var(--border-color); outline-color: var(--btn-primary); border-radius: 10px; box-sizing: border-box; font-size: 16px; } .add-system-app-button { margin-top: 15px; width: 100%; padding: 12px; border: none; border-radius: 12px; font-size: 18px; font-weight: bold; background-color: var(--btn-primary); color: var(--btn-primary-text); user-select: none; } .current-system-app-list { text-align: center; margin-top: 25px; margin-bottom: 10px; user-select: none; } .current-system-app-list-content { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; width: 100%; } .system-app-item { display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 100%; border-bottom: 1px solid var(--border-color); padding: 10px; word-wrap: break-word; overflow-wrap: anywhere; word-break: break-all; } .system-app-item:last-child { border-bottom: none; } .remove-system-app-button { flex-shrink: 0; margin-left: 10px; background-color: #e84d4d; border: none; border-radius: 8px; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; }