/* ============================================================================
   Oceanus — Polish, round 3.
   ----------------------------------------------------------------------------
   Three more surgical tweaks:
     4. Card hover lift — note-card, board-card, task-row, scout candidate
        cards get a 1px hover lift + soft shadow. Linear/Vercel-style.
     5. Typography rhythm — h1/h2 drop a weight (bold → semibold), tighten
        letter-spacing slightly. Reads as "modern app", not "doc".
     6. Chat assistant "thinking" dots — three bouncing dots in the empty
        assistant bubble while waiting for the first streamed token. The
        .is-thinking class is added/removed by chat.js (small wiring change).

   To revert: delete the <link> in base.html.
   ========================================================================== */

/* ----------------------------------------------------------------------------
   #4 — Card hover lift. Subtle: 1px translate + soft accent-tinted shadow.
   Excludes dashboard cards (kept tight + informational) and ticker page
   cards (already in the touching-border tabular style).
   -------------------------------------------------------------------------- */
.note-card,
.board-card,
.vtl-card,
.sc-card {
  transition: transform var(--tr-fast), box-shadow var(--tr-fast),
              border-color var(--tr-fast);
  will-change: transform;
}
.note-card:hover,
.board-card:hover,
.vtl-card:hover,
.sc-card:hover {
  transform: translateY(-1px);
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.15),
    0 8px 24px -10px color-mix(in srgb, var(--accent) 40%, transparent);
}
/* Task rows — flatter list pattern, give a hairline left accent on hover
   instead of a full lift (preserves dense list scanning). */
.task-row {
  transition: background var(--tr-fast), box-shadow var(--tr-fast);
}
.task-row:hover {
  box-shadow: inset 2px 0 0 color-mix(in srgb, var(--accent) 60%, transparent);
}

/* ----------------------------------------------------------------------------
   #5 — Typography rhythm. Tighter, slightly lighter weights for h1/h2;
   nothing changes for h3-h5 (those are already at semibold).
   -------------------------------------------------------------------------- */
h1 {
  font-weight: var(--fw-semibold);   /* 700 → 600 */
  letter-spacing: -0.01em;
}
h2 {
  font-weight: var(--fw-semibold);
  letter-spacing: -0.005em;
}
/* Section labels that already use the small-caps uppercase pattern
   (.dash-card-head h2, .mkt-card-head h3, .ao-tabs button, etc.) gain a
   touch more letter-spacing — that's the look modern apps converge on. */
.dash-card-head h2,
.mkt-card-head h3,
.adm-form label,
.ao-form label,
.adm-teams-list h3,
.adm-team-detail h3 {
  letter-spacing: 0.08em;
}

/* ----------------------------------------------------------------------------
   #6 — Chat assistant "thinking" dots. Pure CSS — chat.js just toggles the
   .is-thinking class on the assistant message div. Dots fade in/out so
   it's calm, not jittery.
   -------------------------------------------------------------------------- */
.chat-msg.assistant.is-thinking .body {
  min-height: 22px;
  display: flex;
  align-items: center;
}
.chat-msg.assistant.is-thinking .body::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 8px;
  background:
    radial-gradient(circle, var(--text-muted) 50%, transparent 51%) 0    50% / 6px 6px no-repeat,
    radial-gradient(circle, var(--text-muted) 50%, transparent 51%) 50%  50% / 6px 6px no-repeat,
    radial-gradient(circle, var(--text-muted) 50%, transparent 51%) 100% 50% / 6px 6px no-repeat;
  animation: oc-thinking 1.4s ease-in-out infinite;
  opacity: 0.7;
}
@keyframes oc-thinking {
  0%, 80%, 100% { opacity: 0.35; }
  40%           { opacity: 0.9;  }
}
/* Three dots take turns being brighter via a slight stagger. Cheap effect
   that uses background-position to "blink" each dot at a different phase. */
.chat-msg.assistant.is-thinking .body::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: -22px;
  border-radius: 50%;
  background: var(--accent);
  animation: oc-thinking-cursor 1.4s ease-in-out infinite;
}
@keyframes oc-thinking-cursor {
  0%, 100% { transform: translateX(0); opacity: 1; }
  33%      { transform: translateX(11px); opacity: 1; }
  66%      { transform: translateX(22px); opacity: 1; }
}

/* Reduced-motion users: keep dots present but skip the moving cursor and
   the brighten animation. */
@media (prefers-reduced-motion: reduce) {
  .chat-msg.assistant.is-thinking .body::before,
  .chat-msg.assistant.is-thinking .body::after {
    animation: none;
  }
}