/* Customer responsive surface v1. Customer-facing only. */
:root {
  --customer-surface-max-width: 1120px;
}

.customer-auth-primary-nav,
.customer-account-readiness,
.customer-my-videos-empty-state,
.customer-create-start-guide,
.customer-create-progress-steps,
.customer-create-review-checklist,
.customer-auth-login-required,
.customer-auth-signout {
  box-sizing: border-box;
}

.customer-auth-primary-nav,
.customer-account-readiness,
.customer-my-videos-empty-state,
.customer-create-start-guide,
.customer-create-progress-steps,
.customer-create-review-checklist {
  max-width: var(--customer-surface-max-width);
  margin-left: auto;
  margin-right: auto;
}

.customer-auth-primary-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.customer-auth-primary-nav a,
.customer-auth-primary-nav button,
.customer-auth-signout button,
.customer-my-videos-empty-state a,
.customer-create-start-guide a {
  min-height: 40px;
}

.customer-create-progress-steps ol,
.customer-create-review-checklist ul,
.customer-account-readiness ul,
.customer-my-videos-empty-state ul {
  padding-left: 1.25rem;
}

@media (max-width: 760px) {
  body {
    overflow-x: hidden;
  }

  .customer-auth-primary-nav,
  .customer-account-readiness,
  .customer-my-videos-empty-state,
  .customer-create-start-guide,
  .customer-create-progress-steps,
  .customer-create-review-checklist,
  .customer-auth-login-required,
  .customer-auth-signout {
    width: 100%;
  }

  .customer-auth-primary-nav {
    flex-direction: column;
    align-items: stretch;
  }

  .customer-auth-primary-nav a,
  .customer-auth-primary-nav button,
  .customer-auth-signout button,
  .customer-my-videos-empty-state a,
  .customer-create-start-guide a {
    display: block;
    width: 100%;
    text-align: center;
  }

  input,
  select,
  textarea,
  button {
    max-width: 100%;
  }
}

/* CUSTOMER_ACCESSIBILITY_FOCUS_V2 */
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 3px;
}

:where(button, .button, .primary-button, .secondary-button, a.button):focus-visible {
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.75);
}

:where(input, textarea, select):focus-visible {
  border-color: currentColor;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

.customer-skip-link {
  position: fixed;
  left: 16px;
  top: 16px;
  z-index: 9999;
  transform: translateY(-160%);
  padding: 10px 14px;
  border-radius: 10px;
  background: #111827;
  color: #ffffff;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.22);
}

.customer-skip-link:focus,
.customer-skip-link:focus-visible {
  transform: translateY(0);
  outline: 3px solid #f59e0b;
  outline-offset: 3px;
}

.customer-main-anchor {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.customer-nav-active,
a[aria-current="page"] {
  font-weight: 700;
  text-decoration-thickness: 0.16em;
  text-underline-offset: 0.18em;
}

/* Customer touch target polish v1 */
.customer-page a,
.customer-page button,
.customer-page input,
.customer-page select,
.customer-page textarea {
  touch-action: manipulation;
}

.customer-page button,
.customer-page input,
.customer-page select,
.customer-page textarea,
.customer-page .button,
.customer-page .btn,
.customer-page .nav-link {
  min-height: 44px;
}

.customer-page input,
.customer-page select,
.customer-page textarea {
  font-size: 16px;
  line-height: 1.4;
}

.customer-page .customer-nav,
.customer-page nav {
  row-gap: 8px;
}

@media (max-width: 760px) {
  .customer-page button,
  .customer-page .button,
  .customer-page .btn,
  .customer-page .nav-link {
    width: 100%;
  }

  .customer-page input,
  .customer-page select,
  .customer-page textarea {
    width: 100%;
  }
}

.customer-status-message {
  min-height: 1.25rem;
}

.customer-status-message:empty {
  min-height: 0;
}

.customer-action-feedback {
  cursor: progress;
  opacity: 0.86;
}

.customer-action-feedback:focus-visible {
  outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
  .customer-action-feedback {
    transition: none;
  }
}


/* CUSTOMER_UX_CLEANUP_V1 */
.customer-technical-panel {
  margin-top: 1rem;
}

.customer-technical-panel > details,
.customer-technical-panel details {
  border-top: 1px solid rgba(143, 160, 213, 0.18);
  padding-top: 0.75rem;
}

.customer-auth-primary-nav-unified .customer-auth-primary-nav-status {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border-radius: 999px;
  color: #475569;
  background: rgba(255, 255, 255, 0.72);
  font-weight: 700;
}

@media print {
  .customer-skip-link,
  .customer-main-anchor {
    display: none !important;
  }
}
