/*
 * Règles communes du layout V3.
 *
 * Toute nouvelle page V3 doit porter la classe v3-readable-page.
 * Les tailles ci-dessous constituent les minimums lisibles communs.
 *
 * Toute zone « Actions rapides » doit porter la classe v3-quick-actions.
 * Ses liens et boutons reçoivent alors obligatoirement un fond coloré,
 * alterné automatiquement : orange, vert, violet, bleu.
 *
 * Le numéro de version utilise .v3-layout-version (partial version-badge.php).
 * Survol et focus affichent le journal ; le popover n’est pas recréé par page.
 */
:root {
  --v3-font-title: 1.125rem;
  --v3-font-body: .78rem;
  --v3-font-label: .72rem;
  --v3-font-caption: .68rem;
}

.v3-readable-page {
  font-size: var(--v3-font-body);
  line-height: 1.45;
}
.v3-text-title { font-size: var(--v3-font-title) !important; }
.v3-text-body,
.v3-readable-card { font-size: var(--v3-font-body); }
.v3-text-label,
.v3-readable-control { font-size: var(--v3-font-label) !important; }
.v3-text-caption,
.v3-readable-card :is(small, time) { font-size: var(--v3-font-caption); }

.v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button) {
  border-color: #fdba74 !important;
  background: #fff7ed !important;
  color: #b45309 !important;
  font-size: var(--v3-font-label) !important;
  transition: filter .16s ease, transform .16s ease;
}
.v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button) :is(span, i, svg) {
  color: inherit !important;
}
.v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button):nth-child(4n + 2 of :is(a, button)) {
  border-color: #86efac !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
}
.v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button):nth-child(4n + 3 of :is(a, button)) {
  border-color: #c4b5fd !important;
  background: #f3e8ff !important;
  color: #6d28d9 !important;
}
.v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button):nth-child(4n + 4 of :is(a, button)) {
  border-color: #93c5fd !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}
.v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button):hover {
  filter: brightness(.97);
  transform: translateY(-1px);
}

html[data-pl-theme="dark"] .v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button) {
  border-color: rgba(245, 158, 11, .55) !important;
  background: rgba(245, 158, 11, .14) !important;
  color: #fbbf24 !important;
}
html[data-pl-theme="dark"] .v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button):nth-child(4n + 2 of :is(a, button)) {
  border-color: rgba(16, 185, 129, .5) !important;
  background: rgba(16, 185, 129, .13) !important;
  color: #34d399 !important;
}
html[data-pl-theme="dark"] .v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button):nth-child(4n + 3 of :is(a, button)) {
  border-color: rgba(139, 92, 246, .55) !important;
  background: rgba(139, 92, 246, .15) !important;
  color: #c4b5fd !important;
}
html[data-pl-theme="dark"] .v3-quick-actions:not(.st3-quick):not(.st3-subrail-actions) > :is(a, button):nth-child(4n + 4 of :is(a, button)) {
  border-color: rgba(14, 165, 233, .5) !important;
  background: rgba(14, 165, 233, .13) !important;
  color: #7dd3fc !important;
}

/*
 * Badge version : le numéro doit toujours utiliser .v3-layout-version
 * (partial public/partials/v3/version-badge.php). Survol / focus = journal.
 */
.v3-layout-user {
  overflow: visible;
}
button.v3-layout-version {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 4px 7px;
  border: 1px solid rgba(126, 87, 255, .28);
  border-radius: 7px;
  background: rgba(109, 61, 231, .14);
  color: #c4b5fd;
  font-family: inherit;
  font-size: var(--v3-font-caption);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .01em;
  white-space: nowrap;
  cursor: pointer;
}
button.v3-layout-version:hover,
button.v3-layout-version:focus-visible {
  border-color: rgba(139, 92, 246, .55);
  background: rgba(109, 61, 231, .22);
  outline: 2px solid rgba(167, 139, 250, .55);
  outline-offset: 2px;
}
html:not([data-pl-theme="dark"]) button.v3-layout-version {
  border-color: #d5c9f4;
  background: #eee9ff;
  color: #4f2aad;
}
html:not([data-pl-theme="dark"]) button.v3-layout-version:hover,
html:not([data-pl-theme="dark"]) button.v3-layout-version:focus-visible {
  border-color: #bca9ef;
  background: #e4dbff;
  outline-color: #7c3aed;
}

.v3-layout-changelog {
  position: fixed;
  z-index: 4800;
  box-sizing: border-box;
  width: min(340px, calc(100vw - 16px));
  max-height: min(70vh, 420px);
  overflow: auto;
  padding: 12px 13px 10px;
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 12px;
  background: #151d2f;
  color: #e8edf5;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .42);
  font-family: inherit;
  font-size: var(--v3-font-body);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0;
  white-space: normal;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.v3-layout-changelog.is-open {
  opacity: 1;
  visibility: visible;
}
.v3-layout-changelog-title {
  margin: 0 0 10px;
  color: #c4b5fd;
  font-size: var(--v3-font-label);
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.v3-layout-changelog-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.v3-layout-changelog-list > li + li {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(148, 163, 184, .16);
}
.v3-layout-changelog-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
.v3-layout-changelog-head strong {
  color: #f5f7fb;
  font-size: var(--v3-font-label);
  font-weight: 800;
}
.v3-layout-changelog-head time {
  flex-shrink: 0;
  color: #9aa6b8;
  font-size: var(--v3-font-caption);
  font-weight: 600;
}
.v3-layout-changelog-list ul {
  margin: 0;
  padding-left: 1.1rem;
}
.v3-layout-changelog-list ul li {
  margin-bottom: 5px;
  color: #d5dce8;
}
.v3-layout-changelog-list ul li:last-child { margin-bottom: 0; }
.v3-layout-changelog-empty,
.v3-layout-changelog-hint {
  margin: 0;
  color: #9aa6b8;
  font-size: var(--v3-font-caption);
}
.v3-layout-changelog-hint { margin-top: 10px; }

html:not([data-pl-theme="dark"]) .v3-layout-changelog {
  border-color: #d5dbe6;
  background: #fff;
  color: #1e293b;
  box-shadow: 0 16px 36px rgba(44, 57, 83, .18);
}
html:not([data-pl-theme="dark"]) .v3-layout-changelog-title { color: #5b21b6; }
html:not([data-pl-theme="dark"]) .v3-layout-changelog-list > li + li { border-top-color: #e5e9f0; }
html:not([data-pl-theme="dark"]) .v3-layout-changelog-head strong { color: #172033; }
html:not([data-pl-theme="dark"]) .v3-layout-changelog-head time { color: #64748b; }
html:not([data-pl-theme="dark"]) .v3-layout-changelog-list ul li { color: #334155; }
html:not([data-pl-theme="dark"]) .v3-layout-changelog-empty,
html:not([data-pl-theme="dark"]) .v3-layout-changelog-hint { color: #64748b; }

/*
 * Rappels V3 : sous le logo du menu gauche (slot .v3-layout-reminders).
 * Avant le déplacement JS, le dock fixe est déjà ancré à gauche sous le logo.
 */
.v3-layout-reminders {
  margin: 4px 2px 8px;
  min-height: 0;
}
.v3-layout-reminders .app-reminders-dock {
  position: static;
  top: auto;
  right: auto;
  left: auto;
  width: 100%;
  max-height: min(34vh, 260px);
  z-index: 1;
  pointer-events: auto;
}
.v3-layout-reminders .app-reminders-stack {
  padding: 8px 7px;
  border-radius: 12px;
}
.v3-layout-reminders .app-reminders-stack.is-collapsed {
  margin-left: 0;
  width: 100%;
  max-width: none;
}
body:is(.planning-page, .stock-v3-page, .finances-v3-page, .achats-v3-page) > .app-reminders-dock {
  left: 12px;
  right: auto;
  top: 98px;
  width: 206px;
}
