/* Norvia V2 — Universal Copilot shell
   Desktop: global bottom command bar + collapsible right conversation drawer.
   Mobile: global composer above primary navigation + universal conversation sheet.
   The underlying React ChatInterface remains the single source of truth. */

#nv-copilot-dock,
#nv-copilot-close,
#nv-copilot-backdrop {
  display: none;
}

@media (min-width: 1024px) {
  body.nv-universal-copilot .nv-chat-zone {
    width: 0 !important;
    min-width: 0 !important;
    flex: 0 0 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    position: static !important;
    opacity: 0;
    pointer-events: none;
  }

  body.nv-universal-copilot .nv-left-divider {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
  }

  /* Desktop conversation is owned by the whole chat zone, not a nested
     wrapper. This avoids the previous width:0 ancestor + fixed-child race
     where the composer sent correctly but the conversation stayed invisible. */
  body.nv-universal-copilot.nv-copilot-open .nv-chat-zone {
    display: flex !important;
    flex-direction: column !important;
    position: fixed !important;
    top: 72px !important;
    right: 18px !important;
    bottom: auto !important;
    left: auto !important;
    width: min(440px, calc(100vw - 36px)) !important;
    min-width: min(440px, calc(100vw - 36px)) !important;
    height: min(72vh, 650px) !important;
    min-height: min(420px, calc(100vh - 32px)) !important;
    padding: 0 !important;
    margin: 0 !important;
    z-index: 1100 !important;
    overflow: hidden !important;
    opacity: 1;
    pointer-events: auto;
    border-radius: 22px !important;
    background: #fafaf7 !important;
    box-shadow: 0 24px 72px rgba(26, 36, 28, 0.24), 0 3px 14px rgba(26, 36, 28, 0.10) !important;
    border: 1px solid rgba(42, 61, 46, 0.14) !important;
    animation: nv-desktop-copilot-in 240ms cubic-bezier(0.2,0.8,0.2,1) both;
  }

  body.nv-universal-copilot.nv-copilot-open.nv-copilot-positioned .nv-chat-zone {
    left: var(--nv-copilot-left, auto) !important;
    top: var(--nv-copilot-top, 72px) !important;
    right: auto !important;
    animation: none !important;
  }

  body.nv-universal-copilot.nv-copilot-open [data-norvia-copilot-drag-handle="true"] {
    cursor: grab;
    user-select: none;
    touch-action: none;
  }

  body.nv-universal-copilot.nv-copilot-dragging [data-norvia-copilot-drag-handle="true"] {
    cursor: grabbing;
  }

  .nv-copilot-header-close {
    display: none;
  }

  body.nv-universal-copilot.nv-copilot-open .nv-copilot-header-close {
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(42,61,46,0.14);
    border-radius: 50%;
    background: rgba(255,255,255,0.92);
    color: #667066;
    cursor: pointer;
    flex: 0 0 auto;
  }

  body.nv-universal-copilot.nv-copilot-open .nv-copilot-header-close:hover {
    background: #eef3eb;
    color: #2a3d2e;
  }

  body.nv-universal-copilot .nv-chat-wrapper {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    flex: 1 1 auto !important;
    padding: 0 !important;
    z-index: auto !important;
    overflow: hidden !important;
    opacity: 1;
    pointer-events: auto;
    transform: none !important;
  }

  body.nv-universal-copilot.nv-copilot-open .nv-chat-wrapper {
    display: block !important;
  }

  @keyframes nv-desktop-copilot-in {
    from { transform: translateX(22px) scale(0.985); opacity: 0; }
    to { transform: translateX(0) scale(1); opacity: 1; }
  }

  body.nv-universal-copilot .nv-chat-root {
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow: none !important;
    border: 0 !important;
    background: #fafaf7 !important;
  }

  #nv-copilot-dock {
    position: fixed;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    z-index: 920;
    width: min(760px, calc(100vw - 64px));
    min-height: 58px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border-radius: 30px;
    background: rgba(250, 247, 241, 0.96);
    border: 1px solid rgba(42, 61, 46, 0.15);
    box-shadow: 0 14px 44px rgba(26, 36, 28, 0.20), 0 2px 8px rgba(26, 36, 28, 0.08);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }

  #nv-copilot-close {
    position: fixed;
    top: 82px;
    right: 28px;
    z-index: 1120;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid rgba(42,61,46,0.14);
    background: rgba(255,255,255,0.96);
    color: #667066;
    box-shadow: 0 4px 14px rgba(26,36,28,0.14);
    cursor: pointer;
    font-size: 17px;
    line-height: 1;
  }

  body.nv-copilot-open #nv-copilot-close {
    display: none;
  }

  /* One composer at a time: with the Copilot open its own input is the place
     to type (the dock below repeated it, same placeholder, on desktop). */
  body.nv-copilot-open #nv-copilot-dock {
    display: none !important;
  }
}

#nv-copilot-dock button {
  border: 0;
  cursor: pointer;
  flex-shrink: 0;
}

#nv-copilot-brand {
  min-width: 94px;
  height: 44px;
  border-radius: 22px;
  background: #eef3eb;
  color: #2a3d2e;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font: 600 13px/1 Inter, sans-serif;
}

#nv-copilot-brand::before {
  content: '';
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #c4956a;
  box-shadow: 0 0 0 4px rgba(196,149,106,0.14);
}

#nv-copilot-attach,
#nv-copilot-mic {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: transparent;
  color: #6d746c;
  font-size: 19px;
  display: grid;
  place-items: center;
}

#nv-copilot-attach:hover,
#nv-copilot-mic:hover,
#nv-copilot-brand:hover {
  background: #e5ece2;
}

#nv-copilot-input {
  flex: 1;
  min-width: 0;
  height: 44px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #2a3d2e;
  font: 500 14px/1.2 Inter, sans-serif;
  padding: 0 8px;
}

#nv-copilot-input::placeholder {
  color: #9a9d96;
}

#nv-copilot-send {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #2a3d2e;
  color: white;
  display: grid;
  place-items: center;
  font-size: 18px;
  transition: transform 150ms ease, opacity 150ms ease;
}

#nv-copilot-send:disabled {
  opacity: 0.38;
  cursor: default;
}

#nv-copilot-send:not(:disabled):hover {
  transform: scale(1.04);
}

@media (max-width: 1023px) {
  .nv-copilot-header-close { display: none; }
  body.nv-universal-copilot.nv-copilot-open .nv-copilot-header-close {
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(42,61,46,0.12);
    border-radius: 50%;
    background: rgba(255,255,255,0.96);
    color: #667066;
  }
  #nv-copilot-dock {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: calc(66px + env(safe-area-inset-bottom));
    z-index: 880;
    min-height: 54px;
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 5px 6px;
    border-radius: 28px;
    background: rgba(250, 247, 241, 0.97);
    border: 1px solid rgba(42, 61, 46, 0.14);
    box-shadow: 0 10px 34px rgba(26, 36, 28, 0.20), 0 2px 8px rgba(26,36,28,0.08);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }

  #nv-copilot-brand {
    min-width: 76px;
    height: 42px;
    font-size: 12px;
    padding: 0 10px;
  }

  #nv-copilot-brand::before {
    width: 8px;
    height: 8px;
    box-shadow: 0 0 0 3px rgba(196,149,106,0.14);
  }

  #nv-copilot-attach,
  #nv-copilot-mic {
    width: 34px;
    height: 42px;
    font-size: 17px;
  }

  #nv-copilot-input {
    height: 42px;
    padding: 0 4px;
    font-size: 13px;
  }

  #nv-copilot-send {
    width: 38px;
    height: 38px;
    margin-left: 2px;
    font-size: 16px;
  }

  body.nv-universal-copilot .nv-chat-wrapper {
    opacity: 0;
    pointer-events: none;
  }

  /* The native mobile layout hides the original desktop chat column. The
     universal sheet reuses that same ChatInterface, so its ancestor must be
     made renderable while the sheet is open. Keep the ancestor dimensionless
     so it never competes with the mobile workspace; the fixed wrapper is the
     only visible surface. */
  body.nv-universal-copilot.nv-copilot-open .nv-chat-zone {
    display: block !important;
    position: static !important;
    width: 0 !important;
    min-width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    flex: 0 0 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    z-index: 930 !important;
  }

  body.nv-universal-copilot.nv-copilot-open .nv-left-divider {
    display: none !important;
  }

  body.nv-universal-copilot.nv-copilot-open .nv-chat-wrapper {
    display: flex !important;
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    top: max(86px, 16dvh) !important;
    bottom: calc(62px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    z-index: 930 !important;
    overflow: hidden !important;
    border-radius: 24px 24px 18px 18px !important;
    opacity: 1;
    pointer-events: auto;
    box-shadow: 0 22px 64px rgba(26,36,28,0.32) !important;
    animation: nv-mobile-sheet-in 260ms cubic-bezier(0.2,0.8,0.2,1) both;
  }

  body.nv-universal-copilot.nv-copilot-open .nv-chat-root {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    border-radius: inherit !important;
    overflow: hidden !important;
    border: 1px solid rgba(42,61,46,0.12) !important;
    background: #faf7f1 !important;
  }

  body.nv-copilot-open #nv-copilot-dock {
    display: none !important;
  }

  #nv-copilot-backdrop {
    position: fixed;
    inset: 0;
    z-index: 910;
    border: 0;
    background: rgba(20, 29, 22, 0.28);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
  }

  body.nv-copilot-open #nv-copilot-backdrop {
    display: block;
  }

  #nv-copilot-close {
    position: fixed;
    top: max(96px, calc(16dvh + 10px));
    right: 18px;
    z-index: 950;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid rgba(42,61,46,0.12);
    background: rgba(255,255,255,0.96);
    color: #667066;
    box-shadow: 0 4px 14px rgba(26,36,28,0.14);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
  }

  body.nv-copilot-open #nv-copilot-close {
    display: none;
  }

  @keyframes nv-mobile-sheet-in {
    from { transform: translateY(22px) scale(0.985); opacity: 0; }
    to { transform: translateY(0) scale(1); opacity: 1; }
  }
}