/* ═══════════════════════════════════════════════════════════════
   gn_modal.css — système central de dialogues + toasts propriétaires
   API JS : gnAlert / gnConfirm / gnPrompt / gnToast (cf. js/gn_modal.js)
   Mode nuit auto via body.gn-night-mode
   ═══════════════════════════════════════════════════════════════ */

/* Conteneurs root injectés à la volée par le JS */
.gn-modal-root  { position: fixed; inset: 0; pointer-events: none; z-index: 10000; }
.gn-toast-root  {
    position: fixed; left: 50%; bottom: 24px;
    transform: translateX(-50%);
    z-index: 10001; pointer-events: none;
    display: flex; flex-direction: column; gap: 8px; align-items: center;
}

/* ── Modale (alert / confirm / prompt) ── */
.gn-modal-backdrop {
    position: fixed; inset: 0;
    background: rgba(0, 0, 0, 0.7);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    display: flex; align-items: center; justify-content: center;
    pointer-events: auto;
    animation: gn-modal-fade 0.2s ease-out;
    padding: 16px; box-sizing: border-box;
}
@keyframes gn-modal-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.gn-modal-dialog {
    background: #1e293b;
    color: #e2e8f0;
    border: 1px solid rgba(56, 189, 248, 0.35);
    border-radius: 14px;
    padding: 22px 22px 18px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
    max-width: min(440px, 100%);
    width: 100%;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    animation: gn-modal-pop 0.22s cubic-bezier(.2, .8, .3, 1);
    box-sizing: border-box;
}
@keyframes gn-modal-pop {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

.gn-modal-title {
    margin: 0 0 10px; font-size: 1.05rem; font-weight: 700;
    color: #60a5fa;
}
.gn-modal-message {
    margin: 0 0 18px; font-size: 0.95rem; line-height: 1.45;
    color: #cbd5e1; white-space: pre-line; word-wrap: break-word;
}
.gn-modal-input {
    width: 100%; box-sizing: border-box;
    background: rgba(8, 12, 20, 0.7); color: #e2e8f0;
    border: 1px solid rgba(56, 189, 248, 0.35);
    border-radius: 8px; padding: 9px 11px;
    font-size: 0.95rem; margin-bottom: 16px;
    font-family: inherit;
}
.gn-modal-input:focus {
    outline: none; border-color: #38bdf8;
    box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.22);
}

.gn-modal-actions {
    display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap;
}
.gn-modal-btn {
    padding: 9px 18px; border-radius: 8px; border: none;
    font-size: 0.95rem; font-weight: 600; cursor: pointer;
    font-family: inherit;
    transition: background 0.15s, transform 0.05s;
    min-width: 88px;
}
.gn-modal-btn:active { transform: scale(0.97); }
.gn-modal-btn--ok {
    background: #38bdf8; color: #0c1729;
}
.gn-modal-btn--ok:hover  { background: #7dd3fc; }
.gn-modal-btn--ok:focus  { outline: none; box-shadow: 0 0 0 3px rgba(56,189,248,0.35); }
.gn-modal-btn--cancel {
    background: rgba(148, 163, 184, 0.18); color: #cbd5e1;
}
.gn-modal-btn--cancel:hover  { background: rgba(148, 163, 184, 0.32); }
.gn-modal-btn--cancel:focus  { outline: none; box-shadow: 0 0 0 3px rgba(148,163,184,0.25); }

/* ── Toast ── */
.gn-toast {
    background: rgba(15, 23, 42, 0.96); color: #e2e8f0;
    padding: 11px 18px; border-radius: 10px;
    border: 1px solid rgba(56, 189, 248, 0.35);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: 0.92rem; font-weight: 500;
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.45);
    transform: translateY(20px); opacity: 0;
    transition: opacity 0.25s ease, transform 0.25s cubic-bezier(.2, .8, .3, 1);
    pointer-events: auto;
    max-width: min(420px, 90vw);
    text-align: center;
}
.gn-toast.gn-toast--show { opacity: 1; transform: translateY(0); }
.gn-toast--success { border-color: #22c55e; }
.gn-toast--warn    { border-color: #f59e0b; }
.gn-toast--error   { border-color: #ef4444; }

/* ── Mode nuit (rouge sur noir, anti-pollution lumineuse) ── */
body.gn-night-mode .gn-modal-dialog {
    background: #000 !important;
    border-color: rgba(170, 34, 34, 0.55) !important;
    color: #aa2222 !important;
}
body.gn-night-mode .gn-modal-title    { color: #cc0000 !important; }
body.gn-night-mode .gn-modal-message  { color: #aa2222 !important; }
body.gn-night-mode .gn-modal-input    {
    background: rgba(0, 0, 0, 0.7) !important;
    border-color: rgba(120, 0, 0, 0.6) !important;
    color: #aa2222 !important;
}
body.gn-night-mode .gn-modal-input:focus {
    border-color: #aa2222 !important;
    box-shadow: 0 0 0 3px rgba(170, 34, 34, 0.25) !important;
}
body.gn-night-mode .gn-modal-btn--ok {
    background: #aa2222 !important; color: #000 !important;
}
body.gn-night-mode .gn-modal-btn--cancel {
    background: rgba(80, 0, 0, 0.4) !important; color: #aa2222 !important;
}
body.gn-night-mode .gn-toast {
    background: rgba(0, 0, 0, 0.96) !important;
    color: #aa2222 !important;
    border-color: rgba(170, 34, 34, 0.55) !important;
}