/* ================================================================
 * ProVsup Design System — pv-events.css
 * Panneau dropdown Événements (étend .pv-menu de pv-dropdown.css).
 *
 * Classes :
 *   .pv-events-panel          — conteneur (à combiner avec .pv-menu)
 *   .pv-events-header         — compteur en-tête
 *   .pv-events-list           — zone scrollable
 *   .pv-event-item            — ligne d'un événement
 *   .pv-event-item--unread    — événement non-vu
 *   .pv-event-img             — icône équipement
 *   .pv-event-body            — bloc texte (name + label + date)
 *   .pv-event-name            — nom de l'équipement
 *   .pv-event-label           — libellé coloré (type d'événement)
 *   .pv-event-date            — horodatage
 *   .pv-events-footer         — pied avec lien "Voir tous"
 *   .pv-events-footer-link    — lien du pied
 * ================================================================ */


/* ── Panneau ────────────────────────────────────────────────────── */

.pv-theme .pv-events-panel {
  min-width: 320px;
  padding: 0;
}


/* ── En-tête ────────────────────────────────────────────────────── */

.pv-theme .pv-events-header {
  padding: 10px 14px;
  border-bottom: 1px solid oklch(1 0 0 / 0.08);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: oklch(1 0 0 / 0.30);
  font-family: var(--font-ui);
}


/* ── Liste ──────────────────────────────────────────────────────── */

.pv-theme .pv-events-list {
  max-height: 340px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: oklch(1 0 0 / 0.12) transparent;
}

.pv-theme .pv-events-list::-webkit-scrollbar { width: 4px; }

.pv-theme .pv-events-list::-webkit-scrollbar-thumb {
  background: oklch(1 0 0 / 0.12);
  border-radius: 2px;
}


/* ── Item ───────────────────────────────────────────────────────── */

.pv-theme .pv-event-item {
  display: flex !important;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid oklch(1 0 0 / 0.05);
  border-left: 2px solid transparent;
  text-decoration: none !important;
  cursor: pointer;
  transition: background 0.12s;
}

.pv-theme .pv-event-item:hover {
  background: oklch(1 0 0 / 0.05) !important;
  text-decoration: none !important;
}

.pv-theme .pv-event-item:last-child {
  border-bottom: none;
}

/* Événement non-vu */
.pv-theme .pv-event-item--unread {
  border-left-color: var(--accent);
}


/* ── Icône équipement ───────────────────────────────────────────── */

.pv-theme .pv-event-img {
  width: 34px;
  height: 34px;
  border-radius: var(--r-sm);
  flex: none;
  background: oklch(1 0 0 / 0.07);
  padding: 4px;
  box-sizing: border-box;
}


/* ── Corps texte ────────────────────────────────────────────────── */

.pv-theme .pv-event-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}

.pv-theme .pv-event-name {
  font-size: 12.5px;
  font-weight: 600;
  color: oklch(1 0 0 / 0.85);
  font-family: var(--font-ui);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pv-theme .pv-event-label {
  font-size: 11.5px;
  font-family: var(--font-ui);
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pv-theme .pv-event-date {
  font-size: 10.5px;
  color: oklch(1 0 0 / 0.28);
  font-family: var(--font-ui);
}

/* Couleurs labels événements (oklch override Bootstrap text-*) */
.pv-theme .pv-events-panel .text-info    { color: oklch(0.74 0.14 225) !important; }
.pv-theme .pv-events-panel .text-success { color: oklch(0.74 0.18 145) !important; }
.pv-theme .pv-events-panel .text-warning { color: oklch(0.82 0.16 75)  !important; }
.pv-theme .pv-events-panel .text-danger  { color: oklch(0.74 0.20 15)  !important; }
.pv-theme .pv-events-panel .text-muted   { color: oklch(1 0 0 / 0.35)  !important; }


/* ── Pied ───────────────────────────────────────────────────────── */

.pv-theme .pv-events-footer {
  display: flex;
  justify-content: flex-end;
  padding: 9px 14px;
  border-top: 1px solid oklch(1 0 0 / 0.08);
}

.pv-theme .pv-events-footer-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-family: var(--font-ui);
  font-weight: 500;
  color: var(--accent) !important;
  text-decoration: none !important;
  transition: opacity 0.13s;
}

.pv-theme .pv-events-footer-link:hover {
  opacity: 0.72;
  text-decoration: none !important;
}

.pv-theme .pv-events-footer-link > i {
  font-size: 12px;
  opacity: 0.80;
}