/* Tenga product constitution: final shared layer for authenticated product UI. */
:root {
  --tenga-brand: #f4511e;
  --tenga-brand-hover: #d94213;
  --tenga-product-blue: #2458df;
  --tenga-product-blue-soft: #eef3ff;
  --tenga-ink: #172033;
  --tenga-muted: #596477;
  --tenga-canvas: #f7f6f2;
  --tenga-surface: #fff;
  --tenga-surface-soft: #fbfaf7;
  --tenga-success: #14845f;
  --tenga-warning: #b66a08;
  --tenga-danger: #c43d4b;
  --tenga-control-border: #d8dde6;
  --tenga-focus-ring: rgba(36, 88, 223, .16);
  --tenga-radius-sm: 10px;
  --tenga-radius-md: 14px;
  --tenga-radius-lg: 20px;
  --tenga-shadow-surface: 0 1px 2px rgba(23,32,51,.025), 0 18px 48px rgba(23,32,51,.06);
  --tenga-space-1: 4px;
  --tenga-space-2: 8px;
  --tenga-space-3: 12px;
  --tenga-space-4: 16px;
  --tenga-space-5: 20px;
  --tenga-space-6: 24px;
  --tenga-space-8: 32px;
  --tenga-space-10: 40px;
}

body[class^="role-"], body[class*=" role-"] { background: var(--tenga-canvas); color: var(--tenga-ink); }

.tenga-product-page { width: min(100%, 1180px); margin-inline: auto; }
.tenga-page-header { margin-bottom: var(--tenga-space-6); }
.tenga-page-header__eyebrow { margin: 0 0 var(--tenga-space-2); color: var(--tenga-brand); }
.tenga-page-header__title { margin: 0; }
.tenga-page-header__subtitle { max-width: 660px; margin: var(--tenga-space-2) 0 0; }

.tenga-surface {
  border: 0;
  border-radius: var(--tenga-radius-lg);
  background: var(--tenga-surface);
  box-shadow: var(--tenga-shadow-surface);
}
.tenga-section-header { margin-bottom: var(--tenga-space-6); }
.tenga-section-header h2 { margin: 0; font-size: 1.125rem; letter-spacing: -.015em; }
.tenga-section-header p { margin: 6px 0 0; color: var(--tenga-muted); font-size: .875rem; }

.tenga-field, .application-flow-page input:not([type="checkbox"]):not([type="radio"]),
.application-flow-page select, .application-flow-page textarea {
  width: 100%; min-height: 52px; padding: 0 15px;
  border: 1px solid var(--tenga-control-border); border-radius: var(--tenga-radius-sm);
  background: #fff; color: var(--tenga-ink); font-size: 1rem;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.application-flow-page textarea { min-height: 112px; padding-block: 13px; resize: vertical; }
.tenga-field:focus, .application-flow-page input:focus, .application-flow-page select:focus, .application-flow-page textarea:focus {
  outline: 0; border-color: var(--tenga-product-blue); box-shadow: 0 0 0 4px var(--tenga-focus-ring);
}
.application-flow-page [aria-invalid="true"] { border-color: var(--tenga-danger); }
.application-flow-page .form-group { margin-bottom: var(--tenga-space-5); }
.application-flow-page .form-group > label { display:block; margin-bottom: 8px; color:var(--tenga-ink); font-size:.8125rem; font-weight:650; }
.application-flow-page .field-help { margin: 7px 0 0; color: var(--tenga-muted); }

.tenga-button, .application-flow-page .btn { min-height: 48px; border-radius: var(--tenga-radius-sm); font-weight: 650; }
.application-flow-page .ts-button-primary { border-color: var(--tenga-brand); background: var(--tenga-brand); }
.application-flow-page .ts-button-primary:hover { border-color: var(--tenga-brand-hover); background: var(--tenga-brand-hover); }

.application-workspace { display:grid; grid-template-columns:minmax(220px, .72fr) minmax(0, 1.6fr); gap:32px; align-items:start; }
.application-workspace__context { position:sticky; top:96px; padding:28px; }
.application-workspace__context .application-progress { margin:0; padding:0; border:0; background:transparent; box-shadow:none; }
.application-workspace__form { min-width:0; }
.application-form-surface { padding: clamp(22px, 4vw, 40px); }
.application-form-surface.form-card { max-width:none; margin:0; border:0 !important; border-radius:var(--tenga-radius-lg); box-shadow:var(--tenga-shadow-surface); }
.application-form-divider { margin:32px 0 24px; padding-top:24px; border-top:1px solid rgba(23,32,51,.08); }
.application-form-divider p { margin:0; color:var(--tenga-muted); font-size:.6875rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.application-flow-page .form-actions { position:sticky; bottom:calc(70px + env(safe-area-inset-bottom, 0px)); z-index:5; margin:32px -12px -12px; padding:12px; border-radius:14px; background:rgba(255,255,255,.94); box-shadow:0 -8px 30px rgba(23,32,51,.06); backdrop-filter:blur(12px); }

@media (max-width: 800px) {
  .tenga-product-page { width:100%; }
  .application-workspace { grid-template-columns:1fr; gap:18px; }
  .application-workspace__context { position:static; padding:20px; }
  .application-form-surface { padding:22px 18px; }
  .application-flow-page .form-actions { margin-inline:-6px; }
}

@media (prefers-reduced-motion: reduce) {
  .tenga-field, .application-flow-page input, .application-flow-page select, .application-flow-page textarea { transition:none; }
}

/* Desktop application workstation ------------------------------------------------ */
.application-flow-page.tenga-product-page,
.application-flow-page.application-flow-page--desktop-workspace,
.loc-page.application-flow-page--desktop-workspace {
  width: min(100%, 1180px);
  max-width: 1180px !important;
  margin-inline: auto;
}

@media (min-width: 901px) {
  .application-workspace {
    grid-template-columns: minmax(240px, 260px) minmax(0, 1fr);
    gap: 30px;
  }

  .application-workspace__context {
    top: 88px;
    padding: 28px 24px;
  }

  .application-workspace__form {
    max-width: 790px;
  }

  .application-flow-page--desktop-workspace {
    display: grid;
    grid-template-columns: minmax(240px, 260px) minmax(0, 1fr);
    column-gap: 30px;
    align-items: start;
    padding-inline: 20px;
  }

  .application-flow-page--desktop-workspace > .application-progress {
    grid-column: 1;
    grid-row: 1 / span 80;
    position: sticky;
    top: 88px;
    margin: 0;
    padding: 28px 24px;
    border-radius: var(--tenga-radius-lg);
    background: var(--tenga-surface);
    box-shadow: var(--tenga-shadow-surface);
  }

  .application-flow-page--desktop-workspace > :not(.application-progress) {
    grid-column: 2;
    min-width: 0;
  }

  .application-flow-page--desktop-workspace > .greeting {
    margin-top: 0;
  }

  .application-progress-meta {
    display: block;
    margin-bottom: 14px;
  }

  .application-progress-meta-step,
  .application-progress-meta-name {
    display: block;
  }

  .application-progress-meta-step {
    margin-bottom: 4px;
    color: var(--tenga-brand);
    font-size: .6875rem;
    letter-spacing: .07em;
    text-transform: uppercase;
  }

  .application-progress-meta-name {
    color: var(--tenga-ink);
    font-size: .9375rem;
    font-weight: 700;
  }

  .application-progress-meta-sep { display: none; }
  .application-progress-bar { height: 4px; margin-bottom: 18px; }
  .application-progress-fill { background: var(--tenga-brand); }

  .application-stepper {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow: visible;
  }

  .application-step {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    width: 100%;
    min-height: 34px;
    padding: 4px 0;
    border-radius: 0;
    background: transparent;
    font-size: .78rem;
  }

  .application-step-number,
  .application-step > svg {
    grid-column: 1;
    grid-row: 1;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border: 1px solid var(--tenga-control-border);
    border-radius: 50%;
    color: var(--tenga-muted);
    background: #fff;
    font-size: .6875rem;
    font-weight: 750;
  }

  .application-step-complete > svg {
    border-color: rgba(36, 88, 223, .22);
    color: var(--tenga-product-blue);
    background: var(--tenga-product-blue-soft);
    padding: 6px;
  }

  .application-step-complete .application-step-number { display: none; }
  .application-step-label { grid-column: 2; overflow: hidden; text-overflow: ellipsis; }
  .application-step-active .application-step-number { border-color: var(--tenga-brand); color: #fff; background: var(--tenga-brand); }
  .application-step-active .application-step-label { color: var(--tenga-brand); font-weight: 750; }

  .application-step-status {
    grid-column: 3;
    color: var(--tenga-brand);
    font-size: .625rem;
    font-weight: 750;
    letter-spacing: .04em;
    text-transform: uppercase;
  }

  .application-stepper-sep {
    width: 1px;
    height: 10px;
    margin: 0 0 0 12px;
    background: var(--tenga-control-border);
  }

  .questionnaire-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 22px;
  }

  .questionnaire-grid > .tenga-section-header,
  .questionnaire-grid > .section-lock-header,
  .questionnaire-grid > .application-form-divider,
  .questionnaire-grid > .alert-warning,
  .questionnaire-grid > .form-actions,
  .questionnaire-grid > .errorlist,
  .questionnaire-grid > .questionnaire-field--full {
    grid-column: 1 / -1;
  }

  .questionnaire-grid > .form-actions {
    margin-inline: 0;
  }
}

@media (max-width: 900px) {
  .application-flow-page.application-flow-page--desktop-workspace,
  .loc-page.application-flow-page--desktop-workspace {
    display: block;
    max-width: 620px !important;
    padding-inline: 16px;
  }

  .application-step-label { display: inline; }
  .application-step-number,
  .application-step-status { display: none; }
}

/* Merchant and underwriter application viewport integrity. */
.application-flow-page,
.application-flow-page *,
.application-flow-page *::before,
.application-flow-page *::after,
body.role-underwriter .uw-canvas,
body.role-underwriter .uw-canvas *,
body.role-underwriter .uw-canvas *::before,
body.role-underwriter .uw-canvas *::after,
body.role-underwriter .ts-review-page,
body.role-underwriter .ts-review-page *,
body.role-underwriter .ts-review-page *::before,
body.role-underwriter .ts-review-page *::after { box-sizing:border-box; }
.application-flow-page,
.application-workspace,
.application-workspace__context,
.application-workspace__form,
.application-form-surface,
body.role-underwriter .uw-canvas,
body.role-underwriter .uw-card,
body.role-underwriter .ts-review-page,
body.role-underwriter .ts-review-card { min-width:0; max-width:100%; }
.application-flow-page :is(input,select,textarea,button,img,svg,video),
body.role-underwriter :is(.uw-canvas,.ts-review-page) :is(input,select,textarea,button,img,svg,video) { max-width:100%; }
.application-flow-page .application-stepper-wrap { width:100%; max-width:100%; overscroll-behavior-inline:contain; }
.application-flow-page .application-stepper { max-width:none; }
.application-flow-page :is(.tenga-page-header__eyebrow,.tenga-page-header__title,.tenga-page-header__subtitle),
body.role-underwriter :is(.uw-canvas,.ts-review-page) :is(.uw-header,h1,h2,p,strong,a) { overflow-wrap:anywhere; }

@media (max-width:767.98px) {
  body.role-merchant .application-flow-page,
  body.role-underwriter :is(.uw-canvas,.ts-review-page) {
    width:100% !important;
    max-width:100% !important;
    margin-inline:0 !important;
    padding-inline:16px !important;
  }
  .application-flow-page .tenga-page-header { display:block; width:100%; }
  .application-flow-page .application-workspace { grid-template-columns:minmax(0,1fr); width:100%; }
  .application-flow-page .application-workspace__context,
  .application-flow-page .application-workspace__form,
  .application-flow-page .application-form-surface { width:100%; }
  .application-flow-page .questionnaire-grid,
  .application-flow-page :is(.form-row,.field-row,.kyc-grid,.deal-grid,.review-grid) { grid-template-columns:minmax(0,1fr) !important; }
  .application-flow-page :is(input,select,textarea,input[type="file"]),
  body.role-underwriter .uw-canvas :is(input,select,textarea,input[type="file"]) { width:100%; min-width:0; }
  .application-flow-page :is(.form-actions,.app-action-bar),
  body.role-underwriter .uw-canvas :is(.form-actions,.uw-actions,.call-actions) { max-width:100%; flex-wrap:wrap; }
  .application-flow-page :is(.form-actions,.app-action-bar)>*,
  body.role-underwriter .uw-canvas :is(.form-actions,.uw-actions,.call-actions)>* { min-width:0; }
  body.role-underwriter .uw-header { display:flex; width:100%; min-width:0; flex-wrap:wrap; }
  body.role-underwriter .uw-header>div { min-width:0; flex:1 1 220px; }
  body.role-underwriter .uw-card { width:100%; padding-inline:16px; }
  body.role-underwriter .ts-review-row { min-width:0; gap:12px; }
  body.role-underwriter .ts-review-row > * { min-width:0; }
  body.role-underwriter .ts-review-call-actions { max-width:100%; flex-wrap:wrap; }
  body.role-underwriter .ts-review-call-actions > * { min-width:0; }
  body.role-underwriter :is(.review-field,.review-field__copy,.ts-question-card,.uw-comparison,.ts-call-section-grid) { min-width:0; max-width:100%; }
  body.role-underwriter :is(.review-field__value,.ts-question-card__value) { overflow-wrap:anywhere; word-break:break-word; }
}