/* Use the account's container, card grid and type scale. */
.visitor-trial { padding-top: 1.75rem; padding-bottom: .75rem; }
.trial-heading, .trial-toolbar, .trial-editor-heading, .trial-editor-footer, .trial-account-invite { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.trial-heading { justify-content: center; text-align: center; }
.trial-title { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .75rem; margin-bottom: .5rem; }
.trial-heading h2 { font: 700 1.875rem/1.2 'Montserrat', sans-serif; color: var(--gray-800); margin: 0; }
.trial-count { border-radius: var(--rounded-full); background: var(--gray-100); color: var(--gray-600); padding: .25rem .65rem; font-size: .8rem; white-space: nowrap; }
.trial-heading p { color: var(--gray-600); margin: 0; }
.trial-toolbar { flex-direction: column; justify-content: center; gap: .85rem; padding: 1.25rem 0; margin: 0 0 1.25rem; border-bottom: 1px solid var(--gray-200); font-size: .85rem; color: var(--gray-600); text-align: center; }
.trial-toolbar > .btn { flex-shrink: 0; }
.trial-storage { display: flex; align-items: center; justify-content: center; gap: .6rem; max-width: 100%; }
.trial-editor { border: 1px solid var(--gray-200); border-radius: var(--rounded-lg); background: var(--gray-50); padding: 1rem 1.25rem; margin-bottom: 1rem; }
.trial-editor-heading { margin-bottom: .75rem; }
.trial-editor legend { float: none; width: auto; font-size: 1rem; font-weight: 600; margin: 0; }
.trial-inputs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(160px, .55fr) auto; align-items: end; gap: .75rem; }
.trial-inputs .form-control, .trial-inputs > .btn { min-height: 46px; }
.trial-editor .form-label { font-size: .85rem; margin-bottom: .3rem; }
.trial-editor-footer { margin-top: .75rem; flex-wrap: wrap; font-size: .8rem; color: var(--gray-600); }
.trial-examples { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.trial-examples button { color: var(--primary-700); background: white; border: 1px solid var(--gray-300); border-radius: var(--rounded-full); padding: .25rem .6rem; }
.trial-examples button:hover { background: var(--primary-50); border-color: var(--primary-500); }
.trial-preview-text { color: var(--primary-700); font-weight: 600; }
.trial-status { color: #226548; font-size: .85rem; margin: .5rem 0; }
.trial-status:empty { display: none; }
#trialFormStatus:empty { display: none; }
.trial-storage-notice { color: #80520c; font-size: .85rem; }
.trial-empty { padding: 1.5rem; text-align: center; color: var(--gray-600); background: var(--gray-50); border-radius: var(--rounded-lg); }
#trialEvents .card-title { overflow-wrap: anywhere; }
.trial-card-actions { display: flex; gap: .25rem; flex-shrink: 0; }
.trial-card-actions .btn { padding: .25rem .5rem; }
.trial-account-invite { background: var(--primary-50); border: 1px solid var(--primary-100); border-radius: var(--rounded-lg); padding: 1rem 1.25rem; }
.trial-account-invite p { font-size: .85rem; color: var(--gray-600); margin: .25rem 0 0; }
.trial-account-invite .btn { flex-shrink: 0; }
#trialEventModal .modal-content { height: 100%; }
#trialEventModal form, #trialEventModal fieldset { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
#trialEventModal fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
#trialEventModal .modal-body { min-height: 0; }
.trial-next-step { text-align: center; padding: .75rem; }
.trial-next-step .trial-eyebrow { display: none; }
.trial-next-step h2 { font-size: 1.25rem; }
.trial-next-step p { font-size: .9rem; color: var(--gray-600); margin: .5rem auto; max-width: 650px; }
.trial-video { max-width: 650px; margin: .5rem auto; }
.trial-video summary { color: var(--primary-700); cursor: pointer; }
.trial-video video { margin-top: .75rem; }
.trial-auth-context { background: var(--primary-50); border-radius: var(--rounded-lg); padding: 1rem; font-size: .9rem; color: #244e6b; }
.trial-handoff { margin-top: 1.5rem; }
.trial-handoff-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--rounded-lg); box-shadow: var(--shadow-sm); padding: 1.25rem; }
.trial-handoff-card h2 { font-size: 1.25rem; font-weight: 600; margin-bottom: .5rem; }
.trial-handoff-card > p { font-size: .9rem; color: var(--gray-600); }
.trial-import-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--gray-200); }
.trial-import-details { min-width: 0; overflow-wrap: anywhere; }
.trial-import-title { font-weight: 600; }
.trial-import-description { font-size: .875rem; color: var(--gray-600); margin: .25rem 0 0; white-space: pre-line; }
.trial-import-meta { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; color: var(--gray-600); font-size: .875rem; }
.trial-import-date { white-space: nowrap; }
.trial-import-footer { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem; margin-top: 1rem; }
.trial-import-destination { min-width: 0; max-width: 100%; overflow-wrap: anywhere; font-size: .875rem; color: var(--gray-600); }
.trial-import-destination .form-label { margin-bottom: .375rem; }
.trial-import-destination .form-select { width: 16rem; max-width: 100%; }
.trial-import-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.trial-import-actions .btn, .trial-import-destination .form-select { min-height: 2.5rem; font-size: .875rem; border-radius: var(--rounded-md); }
.trial-import-actions .btn { padding: .5rem 1rem; }
.visitor-trial :focus-visible, .trial-handoff :focus-visible { outline: 3px solid var(--primary-600); outline-offset: 3px; }
.visitor-trial [hidden], .trial-handoff [hidden] { display: none !important; }
@media (min-width: 768px) {
    .trial-handoff-card { max-width: 48rem; }
    .trial-import-row, .trial-import-footer { justify-content: flex-start; }
    p.trial-import-destination { align-self: center; }
}
@media (max-width: 767px) {
    .visitor-trial { padding-top: 1rem; }
    .trial-heading { flex-wrap: wrap; gap: .75rem; }
    .trial-heading h2 { font-size: 1.5rem; }
    .trial-heading p { font-size: .9rem; }
    .trial-editor { padding: 1rem; }
    .trial-inputs { grid-template-columns: minmax(0, 1fr); }
    .trial-account-invite { align-items: stretch; flex-direction: column; }
    .trial-import-row { align-items: flex-start; flex-direction: column; gap: .35rem; }
    .trial-import-footer { align-items: stretch; flex-direction: column; }
    .trial-import-destination .form-select { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .visitor-trial .btn, .visitor-trial .card { transition: none; transform: none; } }