:root { color-scheme: light; font-family: Arial, Helvetica, sans-serif; color: #000; background: #fff; }
* { box-sizing: border-box; }
body { margin: 0; }
.workspace { max-width: 1120px; margin: 0 auto; padding: 0 48px; }
.site-header { min-height: 112px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid #000; }
.wordmark { display: block; height: auto; }
.environment, .eyebrow, .pending-label, footer { font-size: 11px; font-weight: 700; letter-spacing: .12em; }
.environment { border: 1px solid #000; padding: 9px 12px; white-space: nowrap; }
main { padding-top: 64px; }
.eyebrow { margin: 0 0 16px; line-height: 1.6; }
.status-dot { display: inline-block; width: 8px; height: 8px; background: #2aea33; margin-right: 9px; }
h1 { font-size: clamp(48px, 8vw, 86px); line-height: .98; letter-spacing: -.065em; margin: 22px 0; font-weight: 800; }
.accent { color: #2aea33; }
.intro { max-width: 590px; font-size: 18px; line-height: 1.65; margin: 26px 0 40px; }
.connection-card { border: 1px solid #000; border-top: 4px solid #2aea33; padding: 30px 32px; }
.card-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; }
.card-heading .eyebrow { margin-bottom: 8px; }
h2 { font-size: 25px; line-height: 1.25; letter-spacing: -.03em; margin: 0; }
.step-number { font-size: 34px; font-weight: 700; letter-spacing: -.08em; }
.connection-card > p { line-height: 1.6; }
turbo-frame { display: block; }
.connection-result { font-size: 14px; line-height: 1.65; margin: 22px 0; min-height: 46px; }
.checked-at { display: block; font-size: 12px; margin-top: 5px; }
.button { display: inline-block; background: #000; color: #fff; text-decoration: none; padding: 15px 20px; font-size: 14px; font-weight: 700; }
.button:hover { background: #2aea33; color: #000; }
.button:focus-visible { outline: 3px solid #000; outline-offset: 4px; }
.button { border: 0; cursor: pointer; font-family: inherit; }
.header-actions { display: flex; align-items: center; gap: 24px; }
.logout-button { background: #fff; border: 0; border-bottom: 1px solid #000; padding: 8px 0; font: inherit; font-size: 13px; cursor: pointer; }
.login-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 64px; align-items: center; padding: 80px 0 96px; min-height: 640px; }
.login-intro h1 { font-size: clamp(48px, 6vw, 76px); }
.login-intro .intro { font-size: 17px; margin-bottom: 0; }
.login-card { border: 1px solid #000; border-top: 4px solid #2aea33; padding: 36px; }
.login-form { margin-top: 30px; }
.field { margin-bottom: 22px; }
.field label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 9px; }
.field input { width: 100%; min-width: 0; border: 1px solid #000; border-radius: 0; background: #fff; padding: 14px 12px; font: inherit; font-size: 16px; }
input:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid #000; outline-offset: 3px; }
.login-form .button { width: 100%; min-height: 48px; }
.access-help { font-size: 12px; line-height: 1.6; margin: 24px 0 0; }
.flash { border-left: 4px solid #2aea33; padding: 12px; font-size: 14px; line-height: 1.5; }
.flash-alert { border-color: #000; }
.account-main { padding-bottom: 48px; }
.account-name { font-size: clamp(44px, 6vw, 72px); overflow-wrap: anywhere; }
.account-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 36px; }
.account-details { margin: 28px 0 0; font-size: 14px; }
.account-details dt { font-size: 12px; margin-top: 20px; }
.account-details dd { font-weight: 700; margin: 6px 0 0; overflow-wrap: anywhere; }
.next-card { padding: 30px 0; }
.next-card p:not(.eyebrow) { margin-top: 20px; font-size: 16px; }
.connection-check { margin-top: 30px; }
.text-link { color: #000; font-size: 13px; text-underline-offset: 4px; }
@media (max-width: 850px) {
  .login-grid { grid-template-columns: 1fr; gap: 36px; padding: 40px 0 50px; min-height: auto; }
  .login-card { max-width: 480px; width: 100%; }
  .account-grid { grid-template-columns: 1fr; gap: 12px; }
}
turbo-frame[busy] .button { opacity: .5; pointer-events: none; }
.next-step { padding: 36px 0 40px; }
.next-step .eyebrow { display: block; margin-bottom: 8px; }
.next-step p { font-size: 18px; margin: 0 0 12px; line-height: 1.5; }
.pending-label { font-weight: 400; font-size: 11px; letter-spacing: .02em; }
footer { border-top: 1px solid #000; padding: 25px 0 30px; display: flex; justify-content: space-between; gap: 24px; line-height: 1.5; }
footer span { font-weight: 400; letter-spacing: 0; }
@media (max-width: 600px) {
  .workspace { padding: 0 22px; }
  .site-header { min-height: 90px; gap: 12px; }
  .wordmark { width: 136px; }
  .environment { font-size: 9px; padding: 7px 8px; }
  .header-actions { gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
  .login-card { padding: 26px 22px; }
  main { padding-top: 42px; }
  .intro { font-size: 16px; }
  .connection-card { padding: 24px 20px; }
  h2 { font-size: 22px; }
  .step-number { font-size: 27px; }
  footer { flex-direction: column; gap: 8px; }
}

/* Odoo query reuses the workbench components and their mobile layout. */
.odoo-workbench { margin-block: 1.5rem; }
.odoo-workbench fieldset { min-width: 0; }
.odoo-fields { max-height: 26rem; overflow: auto; padding: 1rem; }
.odoo-fields small { display: block; overflow-wrap: anywhere; }
.odoo-workbench p, .odoo-workbench label { overflow-wrap: anywhere; }
.odoo-result { max-height: 36rem; overflow: auto; }

.task-authoring-value { overflow-wrap: anywhere; }

.security-member { padding: 1rem 0; border-bottom: 1px solid #d1d5db; }
.security-permission-form { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.security-permission-form label { flex-basis: 100%; }
.security-permission-form input[type="password"] { max-width: 100%; min-width: 0; padding: .65rem; border: 1px solid #d1d5db; border-radius: .35rem; }

.security-member p { overflow-wrap: anywhere; }
.security-panel { margin-top: 1.5rem; }

.mfa-secret, .mfa-recovery { overflow-wrap: anywhere; }

.field .mfa-recovery-consent { display: flex; align-items: flex-start; gap: 10px; line-height: 1.5; cursor: pointer; }
.field .mfa-recovery-consent input[type="checkbox"] { flex: 0 0 18px; width: 18px; height: 18px; margin: 1px 0 0; padding: 0; accent-color: #000; }

.retention-form { margin-top: 1.5rem; }
.retention-form .field { margin-top: 1.5rem; max-width: 36rem; }
.retention-form input[type="number"] { max-width: 12rem; }
.field .retention-consent { display: flex; align-items: flex-start; gap: 10px; line-height: 1.5; cursor: pointer; }
.field .retention-consent input[type="checkbox"] { flex: 0 0 18px; width: 18px; height: 18px; margin: 2px 0 0; padding: 0; accent-color: #000; }
.retention-table-wrap { overflow-x: auto; margin-block: 1.5rem; }
.retention-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.retention-table th, .retention-table td { text-align: left; padding: .75rem; border-bottom: 1px solid #d1d5db; }
.retention-table caption { text-align: left; margin-bottom: .75rem; }
.retention-table thead { background: #000; color: #fff; }
.retention-table th:first-child { min-width: 12rem; }