/* ═══════════════════════════════════════════════════════════════════════════
   PANEL MOTION — couche premium pour l'espace opérateur
   Ambiance · entrées orchestrées · micro-interactions · fiches
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Boot sequence page ─────────────────────────────────────────────────── */
[data-panel-scope="panel"] .layout {
  position: relative;
  isolation: isolate;
}
[data-panel-scope="panel"] .layout::before,
[data-panel-scope="panel"] .layout::after {
  content: "";
  position: fixed;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  filter: blur(80px);
  opacity: .45;
}
[data-panel-scope="panel"] .layout::before {
  width: 420px;
  height: 420px;
  top: -120px;
  right: -80px;
  background: radial-gradient(circle, rgba(245, 165, 36, .22), transparent 68%);
  animation: lp-orb-a 18s ease-in-out infinite alternate;
}
[data-panel-scope="panel"] .layout::after {
  width: 360px;
  height: 360px;
  bottom: -100px;
  left: -60px;
  background: radial-gradient(circle, rgba(56, 189, 248, .16), transparent 70%);
  animation: lp-orb-b 22s ease-in-out infinite alternate;
}
[data-panel-scope="panel"] .sidebar,
[data-panel-scope="panel"] .main {
  position: relative;
  z-index: 1;
}

body.lp-panel-boot [data-panel-scope="panel"] .main {
  opacity: 0;
  transform: translateY(18px);
}
body.lp-panel-ready [data-panel-scope="panel"] .main {
  opacity: 1;
  transform: none;
  transition:
    opacity .55s cubic-bezier(.22, .61, .36, 1) .06s,
    transform .55s cubic-bezier(.22, .61, .36, 1) .06s;
}

/* Barre de progression scroll */
.lp-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 0;
  z-index: 9999;
  background: linear-gradient(90deg, var(--accent), var(--accent-light), #38bdf8);
  box-shadow: 0 0 12px rgba(245, 165, 36, .55);
  pointer-events: none;
  transform-origin: left;
  transition: width .12s ease-out;
}

/* ── Sidebar premium ────────────────────────────────────────────────────── */
[data-panel-scope="panel"] .sidebar-brand {
  animation: lp-brand-in .6s cubic-bezier(.22, .61, .36, 1) both;
}
[data-panel-scope="panel"] .pu-avatar,
[data-panel-scope="panel"] .ck-avatar {
  position: relative;
  transition: transform .28s cubic-bezier(.22, .61, .36, 1), box-shadow .28s ease;
}
[data-panel-scope="panel"] .pu-avatar::after,
[data-panel-scope="panel"] .ck-avatar::after {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: inherit;
  border: 1px solid rgba(245, 165, 36, .35);
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events: none;
}
[data-panel-scope="panel"] .sidebar-brand:hover .pu-avatar,
[data-panel-scope="panel"] .sidebar-brand:hover .ck-avatar {
  transform: scale(1.04);
  box-shadow: 0 0 24px rgba(245, 165, 36, .35);
}
[data-panel-scope="panel"] .sidebar-brand:hover .pu-avatar::after,
[data-panel-scope="panel"] .sidebar-brand:hover .ck-avatar::after {
  opacity: 1;
}

[data-panel-scope="panel"] .nav-item {
  transition:
    background .2s ease,
    border-color .2s ease,
    color .2s ease,
    transform .22s cubic-bezier(.22, .61, .36, 1),
    box-shadow .22s ease;
}
[data-panel-scope="panel"] .nav-item:hover {
  transform: translateX(4px);
  box-shadow: -4px 0 0 rgba(245, 165, 36, .45);
}
[data-panel-scope="panel"] .layout.is-sidebar-collapsed .nav-item:hover,
[data-panel-scope="panel"] .layout.is-sidebar-collapsed .nav-item.active {
  transform: none;
  box-shadow: inset 0 0 0 1px rgba(245, 165, 36, .22);
}
[data-panel-scope="panel"] .nav-item.active {
  box-shadow:
    inset 0 0 0 1px rgba(245, 165, 36, .22),
    0 8px 24px rgba(245, 165, 36, .12);
}
[data-panel-scope="panel"] .nav-ripple {
  position: absolute;
  border-radius: 50%;
  transform: scale(0);
  background: rgba(245, 165, 36, .35);
  animation: lp-ripple .55s ease-out forwards;
  pointer-events: none;
}

/* ── Header cockpit ─────────────────────────────────────────────────────── */
[data-panel-scope="panel"] .ck-header {
  animation: lp-header-in .65s cubic-bezier(.22, .61, .36, 1) both .08s;
}
[data-panel-scope="panel"] .ck-header .ck-avatar,
[data-panel-scope="panel"] .ck-header .pu-avatar {
  animation: lp-avatar-pop .5s cubic-bezier(.22, .8, .3, 1) both .12s;
}

/* ── Bannière focus ─────────────────────────────────────────────────────── */
[data-panel-scope="panel"] .ck-focus {
  animation: lp-focus-in .6s cubic-bezier(.22, .61, .36, 1) both .14s;
}
[data-panel-scope="panel"] .ck-focus::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(
    120deg,
    rgba(245, 165, 36, .7),
    rgba(56, 189, 248, .35),
    rgba(245, 165, 36, .5)
  );
  background-size: 200% 200%;
  animation: lp-border-flow 6s linear infinite;
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
[data-panel-scope="panel"] .ck-focus-cta {
  position: relative;
  overflow: hidden;
}
[data-panel-scope="panel"] .ck-focus-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .28) 50%, transparent 70%);
  transform: translateX(-120%);
  transition: transform .55s ease;
}
[data-panel-scope="panel"] .ck-focus-cta:hover::after {
  transform: translateX(120%);
}

/* ── KPI & stats ────────────────────────────────────────────────────────── */
[data-panel-scope="panel"] .stat-card {
  position: relative;
  overflow: hidden;
}
[data-panel-scope="panel"] .stat-card::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: radial-gradient(600px 120px at var(--mx, 50%) var(--my, 0%), rgba(245, 165, 36, .14), transparent 55%);
  opacity: 0;
  transition: opacity .3s ease;
  pointer-events: none;
}
[data-panel-scope="panel"] .stat-card:hover::after {
  opacity: 1;
}
[data-panel-scope="panel"] .stat-value.lp-counted {
  animation: lp-num-glow .8s ease both;
}
[data-panel-scope="panel"] .stat-card--focus {
  animation: lp-focus-card 3s ease-in-out infinite;
}

/* ── Panels & hero ──────────────────────────────────────────────────────── */
[data-panel-scope="panel"] .ck-panel {
  transition:
    transform .28s cubic-bezier(.22, .61, .36, 1),
    border-color .25s ease,
    box-shadow .3s ease;
}
[data-panel-scope="panel"] .ck-panel:hover {
  border-color: rgba(245, 165, 36, .28);
  box-shadow:
    0 20px 50px rgba(0, 0, 0, .35),
    0 0 0 1px rgba(245, 165, 36, .08) inset;
}
[data-panel-scope="panel"] .ck-hero .ck-panel {
  animation: lp-panel-in .55s cubic-bezier(.22, .61, .36, 1) both;
}
[data-panel-scope="panel"] .ck-hero .ck-gauge-panel { animation-delay: .18s; }
[data-panel-scope="panel"] .ck-hero .ck-pipeline { animation-delay: .26s; }

/* Jauge animée */
[data-panel-scope="panel"] .ck-dial {
  box-shadow: 0 0 0 0 rgba(245, 165, 36, .25);
  animation: lp-dial-glow 2.8s ease-in-out infinite;
}
[data-panel-scope="panel"] .ck-dial.lp-dial-ready {
  transition: background 1.1s cubic-bezier(.22, .61, .36, 1);
}
[data-panel-scope="panel"] .ck-dial-num.lp-counted {
  animation: lp-pop-num .5s cubic-bezier(.22, .8, .3, 1) both;
}

/* ── Dock actions rapides ───────────────────────────────────────────────── */
[data-panel-scope="panel"] .ck-cmd {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
[data-panel-scope="panel"] .ck-cmd::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent, rgba(245, 165, 36, .08), transparent);
  transform: translateX(-100%);
  transition: transform .45s ease;
}
[data-panel-scope="panel"] .ck-cmd:hover::before {
  transform: translateX(100%);
}
[data-panel-scope="panel"] .ck-cmd:hover .ck-cmd-ico {
  transform: scale(1.08) rotate(-3deg);
  box-shadow: 0 0 20px rgba(245, 165, 36, .35);
}
[data-panel-scope="panel"] .ck-cmd-ico {
  transition: transform .28s cubic-bezier(.22, .8, .3, 1), box-shadow .28s ease;
}
[data-panel-scope="panel"] .ck-cmd:hover .ck-cmd-arrow {
  transform: translateX(5px);
  color: var(--accent-light);
}

/* ── Feed demandes ──────────────────────────────────────────────────────── */
[data-panel-scope="panel"] .ck-feed-row {
  opacity: 0;
  transform: translateX(-8px);
  transition:
    opacity .35s ease,
    transform .35s cubic-bezier(.22, .61, .36, 1),
    background .2s ease;
}
[data-panel-scope="panel"] .ck-feed-row.is-visible {
  opacity: 1;
  transform: none;
}
[data-panel-scope="panel"] .ck-feed-row:hover {
  background: rgba(245, 165, 36, .06);
  transform: translateX(4px);
}

/* ── Écrans fiche (make / call) ───────────────────────────────────────── */
[data-panel-scope="panel"] .fq {
  animation: lp-fq-in .55s cubic-bezier(.22, .61, .36, 1) both .08s;
}
[data-panel-scope="panel"] .fq-dossier {
  animation: lp-dossier-in .6s cubic-bezier(.22, .61, .36, 1) both .14s;
}
[data-panel-scope="panel"] .fq-console {
  animation: lp-console-in .55s cubic-bezier(.22, .61, .36, 1) both .22s;
}
[data-panel-scope="panel"] .fq-queue-fill {
  transition: width .85s cubic-bezier(.22, .8, .3, 1);
}
[data-panel-scope="panel"] .fq-avatar {
  animation: lp-avatar-pop .5s cubic-bezier(.22, .8, .3, 1) both .2s;
}
[data-panel-scope="panel"] .fq-tel:hover {
  animation: lp-pulse-tel .6s ease;
}
[data-panel-scope="panel"] .fq-iconbtn:not(:disabled):active {
  transform: scale(.92);
}

/* ── Cartes génériques panel ────────────────────────────────────────────── */
[data-panel-scope="panel"] .card {
  animation: lp-card-in .5s cubic-bezier(.22, .61, .36, 1) both;
}
[data-panel-scope="panel"] .main > .card:nth-child(2) { animation-delay: .06s; }
[data-panel-scope="panel"] .main > .card:nth-child(3) { animation-delay: .12s; }
[data-panel-scope="panel"] .main > .card:nth-child(4) { animation-delay: .18s; }
[data-panel-scope="panel"] .main > .topbar {
  animation: lp-header-in .5s cubic-bezier(.22, .61, .36, 1) both;
}

/* Team cards */
[data-panel-scope="panel"] .pu-card {
  animation: lp-card-in .45s cubic-bezier(.22, .61, .36, 1) both;
}
[data-panel-scope="panel"] .pu-grid .pu-card:nth-child(2) { animation-delay: .05s; }
[data-panel-scope="panel"] .pu-grid .pu-card:nth-child(3) { animation-delay: .10s; }
[data-panel-scope="panel"] .pu-grid .pu-card:nth-child(4) { animation-delay: .15s; }
[data-panel-scope="panel"] .pu-grid .pu-card:nth-child(n+5) { animation-delay: .20s; }

/* Lookup cards */
[data-panel-scope="panel"] .lookup-card {
  transition:
    transform .25s cubic-bezier(.22, .61, .36, 1),
    border-color .2s ease,
    box-shadow .25s ease;
}
[data-panel-scope="panel"] .lookup-card:hover {
  transform: translateY(-4px);
  border-color: rgba(245, 165, 36, .35);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .3);
}

/* ── Keyframes ──────────────────────────────────────────────────────────── */
@keyframes lp-orb-a {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(-40px, 30px) scale(1.12); }
}
@keyframes lp-orb-b {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(35px, -25px) scale(1.08); }
}
@keyframes lp-brand-in {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: none; }
}
@keyframes lp-header-in {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}
@keyframes lp-focus-in {
  from { opacity: 0; transform: scale(.98) translateY(10px); }
  to   { opacity: 1; transform: none; }
}
@keyframes lp-panel-in {
  from { opacity: 0; transform: translateY(16px) scale(.99); }
  to   { opacity: 1; transform: none; }
}
@keyframes lp-card-in {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}
@keyframes lp-avatar-pop {
  0%   { opacity: 0; transform: scale(.85); }
  70%  { transform: scale(1.04); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes lp-border-flow {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes lp-focus-card {
  0%, 100% { box-shadow: 0 0 0 1px rgba(245, 165, 36, .25) inset, 0 18px 50px rgba(245, 165, 36, .1); }
  50%      { box-shadow: 0 0 0 1px rgba(245, 165, 36, .4) inset, 0 22px 56px rgba(245, 165, 36, .16); }
}
@keyframes lp-num-glow {
  0%   { filter: brightness(1.4); transform: scale(1.06); }
  100% { filter: none; transform: none; }
}
@keyframes lp-pop-num {
  0%   { opacity: 0; transform: scale(.7); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes lp-dial-glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(245, 165, 36, .2); }
  50%      { box-shadow: 0 0 28px 4px rgba(245, 165, 36, .15); }
}
@keyframes lp-ripple {
  to { transform: scale(2.8); opacity: 0; }
}
@keyframes lp-fq-in {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}
@keyframes lp-dossier-in {
  from { opacity: 0; transform: translateX(-16px); }
  to   { opacity: 1; transform: none; }
}
@keyframes lp-console-in {
  from { opacity: 0; transform: translateX(16px); }
  to   { opacity: 1; transform: none; }
}
@keyframes lp-pulse-tel {
  0%, 100% { box-shadow: 0 0 0 0 rgba(245, 165, 36, .4); }
  50%      { box-shadow: 0 0 0 8px rgba(245, 165, 36, 0); }
}

/* Fluidité — alléger le paint / scroll sur bases lourdes */
[data-panel-scope="panel"] .main {
  contain: layout style;
  content-visibility: auto;
}
[data-panel-scope="panel"] .ck-feed-row,
[data-panel-scope="panel"] .lookup-card,
[data-panel-scope="panel"] .pu-card,
[data-panel-scope="panel"] .table-wrap tbody tr {
  content-visibility: auto;
  contain-intrinsic-size: auto 64px;
}
[data-panel-scope="panel"] .fq {
  contain: layout;
}
#make-fiche-root.is-loading,
#call-fiche-root.is-loading {
  opacity: .62;
  pointer-events: none;
  transition: opacity .12s ease;
}
@media (max-width: 900px) {
  [data-panel-scope="panel"] .layout::before,
  [data-panel-scope="panel"] .layout::after,
  [data-panel-scope="panel"] .ck-focus::before,
  [data-panel-scope="panel"] .stat-card--focus,
  [data-panel-scope="panel"] .ck-dial {
    animation: none !important;
  }
  [data-panel-scope="panel"] .ck-bridge-dot {
    animation-duration: 3.5s;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-panel-scope="panel"] .layout::before,
  [data-panel-scope="panel"] .layout::after,
  [data-panel-scope="panel"] .ck-focus::before,
  [data-panel-scope="panel"] .stat-card--focus,
  [data-panel-scope="panel"] .ck-dial {
    animation: none !important;
  }
  body.lp-panel-boot [data-panel-scope="panel"] .main {
    opacity: 1;
    transform: none;
  }
  [data-panel-scope="panel"] .ck-feed-row {
    opacity: 1;
    transform: none;
  }
}