/* Written by Richard Christopher, Copyright 2026 Mindfull */
/* Shared CloudCanvas sign-in presentation. Authenticated workspace styles are untouched. */
[data-activity-login] {
  min-height: 100dvh; display: grid; place-items: center; padding: 3rem 1.25rem;
  color: #202d28; background: #f5f7f5; font: 15px/1.5 ui-sans-serif, system-ui, sans-serif;
  --cc-font: ui-sans-serif, system-ui, sans-serif;
  --cc-ui-surface: #fff; --cc-ui-text: #202d28; --cc-ui-border: #dce3dd;
  --cc-tone-danger: #a52a32;
}
[data-activity-login] *, [data-activity-login] *::before, [data-activity-login] *::after { box-sizing: border-box; }
[data-activity-login] [hidden] { display: none !important; }
[data-activity-login] [data-activity-auth] {
  width: min(100%, 26rem); margin: 0 auto; padding: 2.5rem;
  border: 1px solid #e0e6e0; border-radius: 18px; background: #fff;
  box-shadow: 0 12px 44px #183d3508;
}
[data-activity-login] .activity-login-header { margin-bottom: 2rem; }
[data-activity-login] .activity-login-header p { margin: 0; }
[data-activity-login] .activity-login-brand { color: #183d35; font-size: 1.5rem; letter-spacing: -.04em; font-weight: 700; }
[data-activity-login] h2 { font-size: 1.65rem; font-weight: 650; letter-spacing: -.035em; margin: 0 0 1.5rem; }
[data-activity-login] p { color: #67736b; }
[data-activity-login] form, [data-activity-login] label { display: grid; gap: .5rem; }
[data-activity-login] form { gap: 1.25rem; margin: 0; }
[data-activity-login] label { color: #46534b; font-size: .875rem; }
[data-activity-login] button, [data-activity-login] input, [data-activity-login] select { font: inherit; }
[data-activity-login] input, [data-activity-login] select {
  width: 100%; min-height: 46px; padding: .75rem .85rem; border: 1px solid #cdd7cf; border-radius: 8px;
  background: #fff; color: #202d28;
}
[data-activity-login] button {
  min-height: 44px; padding: .75rem 1rem; border: 1px solid #cdd7cf; border-radius: 8px;
  background: #fff; color: #244e41; cursor: pointer; font-weight: 600;
}
[data-activity-login] button[type=submit] { border-color: #244e41; background: #244e41; color: #fff; }
[data-activity-login] button[type=submit]:hover { background: #183d35; }
[data-activity-login] button:disabled { cursor: not-allowed; opacity: .55; }
[data-activity-login] [data-activity-resend], [data-activity-login] [data-activity-logout] {
  border: 0; background: transparent; font-size: .875rem; padding: .5rem 0;
}
[data-activity-login] details { margin: 1rem 0; font-size: .875rem; }
[data-activity-login] summary { cursor: pointer; color: #46534b; }
[data-activity-login] details[open] > summary { margin-bottom: 1rem; }
[data-activity-login] .activity-login-status { margin: 1rem 0 0; font-size: .875rem; }
[data-activity-login] [data-status="error"] .cloudcanvas-ui-status-message { color: #a52a32; }
[data-activity-login] :is(button, input, select, summary):focus-visible { outline: 3px solid #8ab6a4; outline-offset: 3px; }
@media (max-width: 480px) {
  [data-activity-login] { padding: 1.25rem; }
  [data-activity-login] [data-activity-auth] { padding: 1.75rem; }
}
[data-activity-login] [data-status="error"] .cloudcanvas-ui-status-label[hidden] + .cloudcanvas-ui-status-message {
  color: var(--cc-tone-danger, #f87171);
}

/* Written by Richard Christopher, Copyright 2026 Mindfull */
* { box-sizing: border-box; margin: 0; padding: 0; }
:root { color-scheme: light; --cc-font: ui-sans-serif, system-ui, sans-serif; font: 15px/1.5 ui-sans-serif, system-ui, sans-serif; }
main { width: min(100%, 26rem); }
#connection-status:empty { display: none; }
#connection-status { padding: 1rem; text-align: center; color: #67736b; }
[data-login-module] [data-status="ready"] { display: none; }
[data-local-development] { margin-bottom: .75rem; color: #7c4d14; font-size: .875rem; }
[data-login-products] { padding: 2.5rem; background: #fff; border: 1px solid #e0e6e0; border-radius: 18px; }
[data-login-products] a { display: block; margin-top: 1.25rem; padding: .75rem 1rem;
  border-radius: 8px; background: #244e41; color: #fff; text-decoration: none; text-align: center; }
[data-login-products] a:focus-visible { outline: 3px solid #8ab6a4; outline-offset: 3px; }