/*
 * Orvannis glass shell (approved mockup v3, new-deliverables/crm-live-home-mockup).
 * Loads after woodforge-9.css. orvannis-shell.js tags the elements with
 * data-ov="…" because the platform's own class names change every build.
 * Static gradients only: no blur filters or backdrop blur, so pages stay fast.
 */
:root {
  --ov-glass: rgba(26, 34, 41, 0.78);
  --ov-edge: rgba(255, 255, 255, 0.08);
  --ov-edge2: rgba(255, 255, 255, 0.16);
  --ov-text: #ece7e1;
  --ov-muted: #9aa6b0;
  --ov-copper: #a56336;
  --ov-copper2: #d59b70;
  --ov-teal: #5fc9b8;
}

/* Aurora behind everything */
[data-ov='layout'] {
  background:
    radial-gradient(520px 520px at 0% 0%, rgba(165, 99, 54, 0.3), transparent 70%),
    radial-gradient(460px 460px at 100% 30%, rgba(43, 184, 176, 0.16), transparent 70%),
    radial-gradient(620px 560px at 45% 110%, rgba(91, 63, 168, 0.22), transparent 70%),
    #0f1418 !important;
}

/* Left menu: a floating glass panel */
[data-click-outside-id='navigation-drawer'] {
  margin: 14px 0 14px 14px;
  height: calc(100% - 28px) !important;
  max-height: calc(100% - 28px) !important;
  border-radius: 18px;
  background: var(--ov-glass) !important;
  border: 1px solid var(--ov-edge);
  border-top-color: var(--ov-edge2);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
[data-click-outside-id='navigation-drawer'] > div:first-child {
  padding: 14px 10px 12px !important;
}

/* Brand line: the Orvannis CRM lockup replaces the workspace logo and name.
   The workspace menu underneath still opens on click. */
[data-ov='brand'] > :first-child {
  min-width: 150px;
  height: 32px;
  background: url(/branding/orvannis-crm-lockup.png) left center / contain no-repeat !important;
}
[data-ov='brand'] > :first-child > * { opacity: 0; }

/* Menu items */
[data-ov='layout'] .navigation-drawer-item {
  position: relative;
  height: 38px !important;
  padding-left: 12px !important;
  border-radius: 12px !important;
  border: 0 !important;
  font-size: 14px;
  color: var(--ov-muted) !important;
  transition: color 0.2s, background 0.2s, transform 0.2s;
}
[data-ov='layout'] .navigation-drawer-item:hover {
  color: var(--ov-text) !important;
  background: rgba(255, 255, 255, 0.05) !important;
  transform: translateX(3px);
}
[data-ov='layout'] .navigation-drawer-item[aria-current='page'] {
  color: #fff !important;
  background: linear-gradient(90deg, rgba(165, 99, 54, 0.45), rgba(165, 99, 54, 0.08)) !important;
  box-shadow: inset 0 0 0 1px rgba(213, 155, 112, 0.35), 0 0 24px rgba(165, 99, 54, 0.25);
}
[data-ov='layout'] .navigation-drawer-item[aria-current='page']::before {
  content: '';
  position: absolute;
  left: 3px;
  top: 22%;
  bottom: 22%;
  width: 3px;
  border-radius: 3px;
  background: var(--ov-copper2);
  box-shadow: 0 0 12px var(--ov-copper2);
}
[data-ov='layout'] .navigation-drawer-item[data-ov='eryn']:not([aria-current='page']) {
  color: #dff !important;
  background: linear-gradient(90deg, rgba(43, 184, 176, 0.22), rgba(91, 63, 168, 0.18)) !important;
  box-shadow: inset 0 0 0 1px rgba(95, 201, 184, 0.3);
}

/* "Eryn is listening" card at the bottom of the menu */
.ov-sidecard {
  flex: none;
  margin: auto 2px 0;
  padding: 12px;
  border-radius: 14px;
  background: linear-gradient(150deg, rgba(43, 184, 176, 0.16), rgba(91, 63, 168, 0.16));
  border: 1px solid rgba(95, 201, 184, 0.25);
  color: var(--ov-text);
  font: 13px/1.45 Inter, -apple-system, sans-serif;
}
.ov-sidecard b { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.ov-sidecard p { margin: 6px 0 10px; color: var(--ov-muted); font-size: 12px; }
.ov-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--ov-teal); box-shadow: 0 0 10px var(--ov-teal); }
.ov-wave { display: flex; gap: 3px; align-items: center; height: 22px; }
.ov-wave i { width: 3px; height: 20px; border-radius: 2px; background: var(--ov-teal); transform: scaleY(0.2); }
.ov-sidecard.ov-live .ov-dot { animation: ov-pulse 1.6s infinite; }
.ov-sidecard.ov-live .ov-wave i { animation: ov-wave 1.1s ease-in-out infinite; }
.ov-wave i:nth-child(2n) { animation-delay: 0.15s; }
.ov-wave i:nth-child(3n) { animation-delay: 0.3s; }
.ov-wave i:nth-child(5n) { animation-delay: 0.45s; }
@keyframes ov-wave { 50% { transform: scaleY(1); } }
@keyframes ov-pulse { 50% { opacity: 0.35; transform: scale(0.8); } }
.ov-mic {
  width: 100%;
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(95, 201, 184, 0.18);
  color: #dffaf6;
  border: 1px solid rgba(95, 201, 184, 0.4);
  font: 600 13px Inter, -apple-system, sans-serif;
  cursor: pointer;
}
.ov-mic:hover { background: rgba(95, 201, 184, 0.28); }
.ov-mic svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }

/* Home's Live board: no widget frame or title bar, edge to edge */
[data-ov='frameless'] {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}
[data-ov='frameless'] > [data-ov='widget-head'] { display: none !important; }

/* Boxes between the Live board and its widget: no frame, no inner scroll */
[data-ov='flat'] {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

/* Phone: the menu page becomes a glass panel with Eryn's card on top */
[data-ov='mnav'] {
  padding: 12px 12px 96px;
}
[data-ov='mnav'] > div {
  height: auto !important;
  max-height: none !important;
  padding: 12px 10px !important;
  border-radius: 18px;
  background: var(--ov-glass);
  border: 1px solid var(--ov-edge);
  border-top-color: var(--ov-edge2);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
}
[data-ov='mnav'] > div > div { height: auto !important; max-height: none !important; flex: none !important; }
[data-ov='mnav'] .ov-sidecard { margin: 0 2px 14px; }
[data-ov='mnav'] .navigation-drawer-item { height: 44px !important; font-size: 15px; }
/* Phone: the page card turns to glass */
[data-ov='pane'] {
  background: linear-gradient(180deg, rgba(26, 34, 41, 0.72), rgba(20, 26, 31, 0.6)) !important;
  border: 1px solid var(--ov-edge) !important;
  border-top-color: var(--ov-edge2) !important;
  border-radius: 18px !important;
  overflow: hidden;
}
[data-ov='pane-head'] { background: transparent !important; }
@media (max-width: 767px) {
  .lv { padding: 10px !important; }
}
/* Phone: glass bottom bar */
[data-ov='mbar'] > * {
  background: var(--ov-glass) !important;
  border: 1px solid var(--ov-edge2) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45) !important;
}

@media (max-width: 768px) {
  [data-click-outside-id='navigation-drawer'] {
    margin: 0;
    height: 100% !important;
    max-height: 100% !important;
    border-radius: 0;
    border: 0;
  }
}
/* Calls & Messages: a copper count while owner alerts wait (orvannis-shell.js). */
.ov-badge {
  margin-left: auto; min-width: 18px; height: 18px; padding: 0 6px; border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  font-size: 11px; font-weight: 700; line-height: 1; color: #fff;
  background: var(--ov-copper); box-shadow: 0 0 8px rgba(165, 99, 54, 0.6);
}
[data-ov="mbar"] [data-ov-waiting="1"] { position: relative; }
[data-ov="mbar"] [data-ov-waiting="1"]::after {
  content: ''; position: absolute; top: 6px; right: 6px; width: 9px; height: 9px; border-radius: 50%;
  background: var(--ov-copper2); box-shadow: 0 0 6px var(--ov-copper2);
}

/* Phone: the platform shows each menu row's hover buttons all the time on
 * touch screens (the heart-off "remove from menu" button). Hide them so a
 * stray tap cannot remove Calls, Messages, etc. from the sidebar. */
@media (max-width: 768px) {
  .navigation-drawer-item [data-visible='true'] button { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .ov-sidecard *, [data-ov='layout'] .navigation-drawer-item { animation: none !important; transition: none !important; }
}
