/* ==========================================================================
   The portal's status dialogs (Pages/Shared/_StartingUpModal, CODE-1): the "portal is starting up" dialog that
   js/common/api-status.js opens on a 502/503/504 from /backend, and the "session expired" dialog and the restored-draft
   notice it shows once a session is gone. The partial links this file; every layout that renders it (Admin, Tenant,
   User, the help centre) loads styles.css, so the brand tokens flip with the theme.
   ========================================================================== */

/* [MODAL-1] The starting-up dialog is the kit's <ic-modal> and opens where every kit modal opens (no centring of its
   own, r3). api-status.js shows and hides it itself (display, .show and its own backdrop), not through bootstrap.Modal,
   so the kit's close X could not close it; the dialog closes itself once the API answers, so it keeps having no X.
   [MODAL-1, r5] The X is hidden with visibility, not display: it keeps its place, so the header keeps the kit's height
   (the title and the rule sat 6 px higher than in every other kit dialog). */
#ic-startingup-modal .modal-header .btn-close { visibility: hidden; pointer-events: none; }

/* Session expired and the restored draft: above an open Bootstrap dialog (1055) and its backdrop (1050), so a reply
   dialog cannot cover them. */
#ic-session-expired { position: fixed; inset: 0; z-index: 1090; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0, 0, 0, 0.55); }
#ic-session-expired .ic-se-card { width: 100%; max-width: 440px; max-height: calc(100vh - 32px); overflow-y: auto; padding: 24px; text-align: left; color: var(--text-2); background: linear-gradient(180deg, var(--surface-overlay) 0%, var(--surface-2) 100%); border: 1px solid var(--border-strong); border-radius: 12px; box-shadow: var(--shadow-overlay); }
#ic-session-expired .ic-se-icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-bottom: 12px; border-radius: 50%; font-size: 1.25rem; background: var(--warn-soft); color: var(--warn-text); }
#ic-session-expired .ic-se-title { margin: 0 0 8px; font-size: 1.125rem; font-weight: 600; color: var(--text); }
#ic-session-expired .ic-se-text p { margin: 0 0 8px; font-size: 0.875rem; line-height: 1.5; }
#ic-session-expired .ic-se-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 20px; }
#ic-session-draft .alert-content { min-width: 0; }
#ic-session-draft .alert-content p { margin: 0 0 6px; }
#ic-session-draft textarea { width: 100%; margin-top: 4px; font-size: 0.8125rem; }
#ic-session-draft .ic-sd-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
#ic-session-draft.ic-sd-floating { position: fixed; top: 76px; left: 50%; transform: translateX(-50%); width: min(560px, calc(100vw - 32px)); z-index: 1090; background-color: var(--surface-overlay); background-image: linear-gradient(var(--info-soft), var(--info-soft)); box-shadow: var(--shadow-overlay); }