/**
 * File role: VOGO chat (rag-ai) — the look of the "Instalează aplicația" invitation on iPhone (ios-install.js,
 * AGENTMOB D-055). The page's own colours (rag-ai.css variables), flat, corners of 5 px.
 *
 * @file_version 1.0.0
 */
.ii-overlay { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center;
  padding: 20px; background: rgba(0, 0, 0, .45); }
.ii-card { position: relative; width: 100%; max-width: 360px; padding: 22px 20px 18px; background: var(--panel);
  color: var(--fg); border: 1px solid var(--line); border-radius: 5px; text-align: center; }
.ii-x { position: absolute; top: 6px; right: 8px; width: 36px; height: 36px; padding: 0; border: none;
  background: transparent; color: var(--muted); font-size: 24px; line-height: 1; cursor: pointer; }
.ii-icon { width: 64px; height: 64px; border-radius: 5px; }
.ii-title { margin: 10px 0 6px; font-size: 17px; font-weight: 600; }
.ii-text, .ii-note { margin: 0 0 14px; font-size: 14px; color: var(--muted); }
.ii-list { margin: 6px 0 12px; padding-left: 22px; text-align: left; font-size: 15px; line-height: 1.45; }
.ii-list li { margin-bottom: 6px; }
.ii-share { color: var(--vogo-icon-blue, #0F6CBD); font-size: 17px; }
.ii-primary { display: block; width: 100%; min-height: 44px; border: none; border-radius: 5px; background: var(--acc);
  color: #fff; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
.ii-secondary { display: block; width: 100%; min-height: 40px; margin-top: 6px; border: none; background: transparent;
  color: var(--muted); font: inherit; font-size: 14px; cursor: pointer; }
/* the steps sit low, near Safari's toolbar, the arrow under them points at it */
.ii-steps { align-items: flex-end; padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
.ii-arrow { position: fixed; left: 50%; bottom: calc(8px + env(safe-area-inset-bottom)); transform: translateX(-50%);
  color: #fff; font-size: 40px; animation: ii-bounce 1s ease-in-out infinite; }
@keyframes ii-bounce {
  0%, 100% { transform: translate(-50%, 0); }
  50% { transform: translate(-50%, 10px); }
}
