/* Menus contextuels Skolami (utils/popover.js) : compte, établissement, notifications, choix de la langue.
   Partagé par le tableau de bord et la page de connexion ; couleurs : theme.css. */

/* ─── Menus contextuels (compte, établissement, notifications) ─── */
.sk-popover { position: fixed; z-index: 60; min-width: 240px; max-width: calc(100vw - 16px); max-height: calc(100vh - 16px); overflow-y: auto;
              padding: 6px; border-radius: 12px; background: var(--sk-popover-bg); border: 1px solid var(--sk-popover-border); box-shadow: var(--sk-popover-shadow);
              color: var(--sk-sb-text); font-size: 13px;
              opacity: 0; visibility: hidden; transform: translateY(4px) scale(.98); transform-origin: bottom left;
              transition: opacity .14s ease, transform .14s ease, visibility 0s linear .14s; }
.sk-popover[data-placement="bottom"] { transform-origin: top left; transform: translateY(-4px) scale(.98); }
.sk-popover.open { opacity: 1; visibility: visible; transform: none; transition: opacity .14s ease, transform .14s ease, visibility 0s; }
.sk-popover svg.lucide { width: 17px; height: 17px; flex-shrink: 0; stroke-width: 1.75; }
.sk-pop-label { padding: 6px 10px 4px; font-size: 12px; color: var(--sk-sb-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sk-pop-sep { height: 1px; margin: 6px 4px; background: var(--sk-popover-border); }
.sk-pop-item { width: 100%; min-height: 36px; display: flex; align-items: center; gap: 12px; padding: 6px 10px; border-radius: 8px; border: 0; background: transparent;
               color: var(--sk-sb-text); text-decoration: none; cursor: pointer; text-align: left; font-size: 13px; transition: background-color .12s ease, color .12s ease; }
.sk-pop-item:hover { background: var(--sk-sb-hover); color: var(--sk-sb-active-text); }
.sk-pop-item .sk-pop-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.sk-pop-item .sk-pop-sub { font-size: 12px; color: var(--sk-sb-muted); }
.sk-pop-item .sk-check { color: #3b82f6; }
.sk-pop-item.danger { color: #dc2626; }
html.dark .sk-pop-item.danger { color: #f87171; }

/* Choix du thème : Clair / Sombre / Système */
.sk-segmented { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; padding: 2px; margin: 2px 4px 4px; border-radius: 8px; background: var(--sk-kbd-bg); border: 1px solid var(--sk-popover-border); }
.sk-segmented button { height: 30px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border-radius: 6px; border: 0; background: transparent;
                       color: var(--sk-sb-muted); font-size: 12px; font-weight: 600; cursor: pointer; transition: background-color .15s ease, color .15s ease, box-shadow .15s ease; }
.sk-segmented button:hover { color: var(--sk-sb-active-text); }
.sk-segmented button[aria-pressed="true"] { background: var(--sk-popover-bg); color: var(--sk-sb-active-text); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.sk-segmented svg.lucide { width: 14px; height: 14px; }

/* Bouton de langue (utils/languageMenu.js) */
.sk-lang-btn { height: 36px; display: inline-flex; align-items: center; gap: 7px; padding: 0 10px; border-radius: 9px; cursor: pointer;
               border: 1px solid var(--sk-popover-border); background: var(--sk-popover-bg); color: var(--sk-sb-text); font-size: 12px; font-weight: 700;
               transition: border-color .15s ease, color .15s ease, transform .1s ease; }
.sk-lang-btn:hover { border-color: var(--sk-field-border-hover); color: var(--sk-sb-active-text); }
.sk-lang-btn:active { transform: scale(.97); }
.sk-lang-btn svg.lucide { width: 14px; height: 14px; stroke-width: 2; color: var(--sk-sb-muted); }
.sk-flag { box-shadow: 0 0 0 1px rgba(0, 0, 0, .08); }

@media (prefers-reduced-motion: reduce) { .sk-popover { transition: none; } }