/* Sign-in card and workspace chooser.
   Scoped to #loginForm and #workspacePage only: the landing page's hero, images, transition and
   landing stylesheets are untouched. Landing CSS sizes and places the card; this file only refines
   what is inside it. Loaded after every landing stylesheet, so equal-weight !important rules here win. */

:root {
  --ds-navy: #0c233c;
  --ds-navy-deep: #061a2d;
  --ds-ink: #142739;
  --ds-muted: #5b6f82;
  --ds-line: #d5dde6;
  --ds-gold: #dfb35a;
  --ds-gold-soft: #f3c86e;
}

/* ---------- Sign-in card ----------
   The card keeps exactly its original size (it sets the hero's height, and so how the photo is
   cropped), so only colour, type, corners and focus states change here, never box sizes. */
html body #landingPage #loginForm .auth-lock-circle { box-shadow: 0 0 0 4px rgba(223,179,90,.22) !important; }
html body #landingPage #loginForm .auth-card-heading { letter-spacing: -.01em !important; }
html body #landingPage #loginForm .auth-gold-divider { background: var(--ds-gold) !important; }
html body #landingPage #loginForm .auth-card-subheading { color: var(--ds-muted) !important; }
html body #landingPage #loginForm .auth-field label {
  letter-spacing: .08em !important; text-transform: uppercase !important; font-size: 11.5px !important; line-height: 15px !important; color: var(--ds-navy) !important;
}
/* 16px text: iPhones don't zoom the page when the field is tapped. */
html body #landingPage #loginForm .input-icon-wrap input {
  font-size: 16px !important; border-radius: 10px !important; border-color: var(--ds-line) !important;
  background: #f8fafc !important; color: var(--ds-ink) !important;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease !important;
}
html body #landingPage #loginForm .input-icon-wrap input::placeholder { color: #9aabbb !important; }
html body #landingPage #loginForm .input-icon-wrap input:focus {
  background: #fff !important; border-color: var(--ds-gold) !important; box-shadow: 0 0 0 4px rgba(223,179,90,.2) !important;
}
html body #landingPage #loginForm .auth-inline .check { color: #3c5570 !important; }
html body #landingPage #loginForm .text-link { text-underline-offset: 3px !important; }
html body #landingPage #loginForm .btn-secure-navy {
  border-radius: 10px !important; letter-spacing: .02em !important;
  background: linear-gradient(180deg, #123356 0%, var(--ds-navy) 100%) !important;
  box-shadow: 0 10px 24px rgba(12,35,60,.28), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html body #landingPage #loginForm .btn-secure-navy:focus-visible { outline: 3px solid var(--ds-gold) !important; outline-offset: 3px !important; }
html body #landingPage #loginForm .btn-instant-demo { border-radius: 10px !important; }
html body #landingPage #loginForm .auth-switch { color: var(--ds-muted) !important; }

/* ---------- Workspace chooser ---------- */
#workspacePage.workspace-screen {
  background:
    radial-gradient(1100px 520px at 50% -120px, rgba(223,179,90,.14), transparent 70%),
    linear-gradient(180deg, #071d31 0%, var(--ds-navy-deep) 100%);
  min-height: 100vh;
}
#workspacePage .workspace-body { max-width: 1120px; padding: 64px 32px 80px; text-align: center; }
#workspacePage .ws-eyebrow {
  margin: 0 0 14px; color: var(--ds-gold-soft); font: 700 12px/1 Inter, system-ui, -apple-system, sans-serif;
  letter-spacing: .22em; text-transform: uppercase;
}
#workspacePage .workspace-body h1 {
  font-family: Georgia, 'Times New Roman', serif; font-size: clamp(34px, 4.2vw, 50px); line-height: 1.08;
  letter-spacing: -.015em; margin: 0 0 14px; color: #fff;
}
#workspacePage .ws-lede { margin: 0 auto 44px; max-width: 46ch; color: #b9c8d6; font-size: 17px; line-height: 1.55; }
#workspacePage .workspace-body .plan-note { margin: -20px auto 28px; }

#workspacePage .product-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; text-align: left; }
#workspacePage .product-card {
  position: relative; display: flex; flex-direction: column; gap: 0; min-height: 340px; padding: 40px 40px 36px;
  border-radius: 20px; text-decoration: none; color: #fff; overflow: hidden;
  background: linear-gradient(165deg, #0f3050 0%, #0a243c 55%, #081d31 100%);
  border: 1px solid rgba(223,179,90,.38);
  box-shadow: 0 1px 0 rgba(255,255,255,.06) inset, 0 22px 48px rgba(0,0,0,.35);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
#workspacePage .product-card::before {  /* thin gold rule across the top */
  content: ""; position: absolute; left: 40px; right: 40px; top: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--ds-gold), transparent); opacity: .8;
}
#workspacePage .product-card:hover { transform: translateY(-4px); border-color: var(--ds-gold-soft); box-shadow: 0 30px 64px rgba(0,0,0,.45); }
#workspacePage .product-card:focus-visible { outline: 3px solid var(--ds-gold-soft); outline-offset: 5px; }
#workspacePage .product-icon {
  display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 26px; border-radius: 50%;
  color: var(--ds-gold-soft); border: 1px solid rgba(223,179,90,.55); background: rgba(223,179,90,.08);
}
#workspacePage .product-name { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(30px, 3vw, 38px); line-height: 1.1; letter-spacing: -.01em; margin-bottom: 12px; }
#workspacePage .product-desc { font-size: 17px; line-height: 1.55; color: #c3d1dd; flex: 1; margin-bottom: 28px; }
#workspacePage .product-status { font-size: 14px; color: var(--ds-gold-soft); margin: -14px 0 18px; }
#workspacePage .product-status:empty { display: none; }
#workspacePage .product-action {
  display: flex; align-items: center; justify-content: space-between; align-self: stretch; gap: 12px;
  min-height: 58px; padding: 0 24px; border-radius: 12px; font: 800 16.5px/1.2 Inter, system-ui, -apple-system, sans-serif;
  letter-spacing: .01em; color: var(--ds-navy-deep); background: linear-gradient(180deg, #f6d38a 0%, var(--ds-gold) 100%);
  box-shadow: 0 8px 20px rgba(223,179,90,.22), inset 0 1px 0 rgba(255,255,255,.5);
}
#workspacePage .product-action::after { content: "→"; font-size: 20px; transition: transform .2s ease; }
#workspacePage .product-card:hover .product-action::after { transform: translateX(4px); }
#workspacePage .product-card[aria-disabled="true"] { cursor: default; }
#workspacePage .product-card[aria-disabled="true"]:hover { transform: none; border-color: rgba(223,179,90,.38); }
#workspacePage .product-card[aria-disabled="true"] .product-action,
#workspacePage .product-card[data-state="request"] .product-action {
  color: #e6edf3; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 1px rgba(223,179,90,.5);
}
#workspacePage .product-card[aria-disabled="true"] .product-action::after { content: ""; }
#workspacePage .product-card.is-opening .product-action::after {
  content: ""; width: 18px; height: 18px; border-radius: 50%; border: 2px solid rgba(6,26,45,.25); border-top-color: var(--ds-navy-deep);
  animation: ws-spin .8s linear infinite;
}
@keyframes ws-spin { to { transform: rotate(360deg); } }
#workspacePage .ws-signed-in { margin: 36px 0 0; color: #8fa3b6; font-size: 13.5px; }
#workspacePage .ws-signed-in:empty { display: none; }

@media (max-width: 760px) {
  #workspacePage .workspace-body { padding: 36px 16px 56px; }
  #workspacePage .ws-eyebrow { font-size: 11px; margin-bottom: 12px; }
  #workspacePage .workspace-body h1 { font-size: clamp(30px, 8.4vw, 36px); margin-bottom: 10px; }
  #workspacePage .ws-lede { font-size: 15.5px; margin-bottom: 28px; }
  #workspacePage .product-cards { grid-template-columns: 1fr; gap: 16px; }
  #workspacePage .product-card { min-height: 0; padding: 26px 22px 22px; border-radius: 18px; }
  #workspacePage .product-card::before { left: 22px; right: 22px; }
  #workspacePage .product-icon { width: 48px; height: 48px; margin-bottom: 18px; }
  #workspacePage .product-name { font-size: 28px; margin-bottom: 8px; }
  #workspacePage .product-desc { font-size: 15.5px; margin-bottom: 20px; }
  #workspacePage .product-action { min-height: 54px; padding: 0 20px; font-size: 16px; }
  #workspacePage .ws-signed-in { margin-top: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  #workspacePage .product-card, #workspacePage .product-action::after { transition: none; }
  #workspacePage .product-card:hover { transform: none; }
}