/* Hanna seal branding and app tiles (kit workspace-brand-fix, 2026-10-31).
 * Sign-in: the small logo leaves the top-left corner and the seal becomes the hero of the left panel.
 * Signed-in Workspace: no logo in the top-left corner (the page's own hero seal stays).
 * App tiles: the whole tile reacts on hover and opens the app on click; the small arrow stays.
 * Shared Chat, Calendar, Email and Voice notes: the "hanna ✦" wordmark is replaced by the seal (in shared-workspace.html).
 * Colours come from the current Hanna theme (--ht-*), with the Classic greens as fallback. */

/* ---------- sign-in: hero seal ---------- */
.auth-story > .brand { display: none; }
.auth-story .story-copy { display: flex; flex-direction: column; align-items: flex-start; }
.hb-hero-seal { display: block; margin: 0 0 clamp(24px, 4.5vh, 44px) -6px; line-height: 0; }
.hb-hero-seal hanna-seal {
  width: clamp(200px, 25vw, 340px) !important; height: clamp(200px, 25vw, 340px) !important;
  filter: drop-shadow(0 18px 40px color-mix(in srgb, var(--ht-accent, #236b57) 18%, transparent));
}
@media (max-height: 760px) and (min-width: 761px) {
  .hb-hero-seal hanna-seal { width: clamp(170px, 30vh, 260px) !important; height: clamp(170px, 30vh, 260px) !important; }
}
@media (max-width: 760px) {
  .hb-hero-seal { margin: 4px auto 18px; align-self: center; }
  .hb-hero-seal hanna-seal { width: 148px !important; height: 148px !important; }
  .auth-story .story-copy { padding-top: 8px; }
}

/* ---------- signed-in Workspace: no top-left logo ---------- */
.sidebar > .brand { display: none; }
.sidebar > .nav-label { margin-top: 6px; }

/* ---------- app tiles: the whole tile is the target ---------- */
.app-card.hb-tile {
  cursor: pointer; position: relative;
  transition: transform .18s cubic-bezier(.2,.7,.2,1), box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
}
.app-card.hb-tile:hover, .app-card.hb-tile:focus-within {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--ht-accent, #236b57) 55%, var(--ht-line, #e3e9e4));
  box-shadow: 0 14px 34px -14px color-mix(in srgb, var(--ht-accent, #236b57) 38%, transparent),
              0 2px 6px -2px color-mix(in srgb, var(--ht-text, #243e3b) 14%, transparent);
}
.app-card.hb-tile:active { transform: translateY(-1px); transition-duration: .06s; }
.app-card.hb-tile h3 { transition: color .18s ease; }
.app-card.hb-tile:hover h3, .app-card.hb-tile:focus-within h3 { color: var(--ht-accent, #236b57); }
.app-card.hb-tile .circle, .app-card.hb-tile .app-card-bottom a.secondary {
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.app-card.hb-tile:hover .circle, .app-card.hb-tile:focus-within .circle {
  background: var(--ht-accent, #236b57); border-color: var(--ht-accent, #236b57); color: var(--ht-accent-ink, #fff);
  transform: translate(2px, -2px);
}
.app-card.hb-tile:hover .app-card-bottom a.secondary { color: var(--ht-accent, #236b57); }
.app-card.hb-tile .circle:focus-visible { outline: 2px solid var(--ht-accent, #236b57); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  .app-card.hb-tile, .app-card.hb-tile .circle { transition: none; }
  .app-card.hb-tile:hover, .app-card.hb-tile:focus-within, .app-card.hb-tile:hover .circle { transform: none; }
}

/* ---------- shared Chat / Calendar / Email / Voice notes: the seal in place of the wordmark ---------- */
.sw-brand { display: inline-flex; align-items: center; line-height: 0; border-radius: 50%; }
.sw-brand hanna-seal { width: 48px !important; height: 48px !important; transition: transform .2s ease; }
.sw-brand:hover hanna-seal { transform: scale(1.06); }
.sw-brand:focus-visible { outline: 2px solid var(--ht-accent, #236b57); outline-offset: 4px; }
@media (max-width: 760px) { .sw-brand hanna-seal { width: 40px !important; height: 40px !important; } }

/* ---------- the firm's logo in the Workspace top bar (from User & firm details) ---------- */
.topbar-right .hb-firm { height: 30px; max-width: 150px; object-fit: contain; margin-right: 6px; display: block; }
@media (max-width: 760px) { .topbar-right .hb-firm { display: none; } }