.author-app-wrapper {
    --vr-gray-25: #fcfcfc;
    --vr-gray-50: #fafafa;
    --vr-gray-100: #f4f4f5;
    --vr-gray-200: #e4e4e7;
    --vr-gray-300: #d4d4d8;
    --vr-gray-400: #a1a1aa;
    --vr-gray-500: #71717a;
    --vr-gray-800: #27272a;
    --vr-gray-900: #18181b;
    --vr-gray-925: #111113;
    --app-bg: #fff;
    --app-surface: #fff;
    --app-surface-alt: var(--vr-gray-50);
    --app-border: var(--vr-gray-200);
    --app-border-step: var(--vr-gray-300);
    --app-text-title: var(--vr-gray-900);
    --app-text-body: var(--vr-gray-500);
    --app-primary: var(--vr-theme-color);
    --app-primary-soft: rgba(var(--vr-theme-color-rgb, 0, 0, 0), .04);
    --app-shadow-premium: 0 1rem 3rem rgba(0, 0, 0, .03);
    --app-input-bg: var(--vr-gray-25);
    --app-input-border: var(--vr-gray-200);
    --app-line: var(--vr-gray-200);
    --app-pending-bg: #eff6ff;
    --app-pending-color: #3b82f6;
    --app-danger-bg: #fef2f2;
    --app-danger-color: #ef4444;
    --app-warning-bg: #fffbeb;
    --app-warning-border: #fde68a;
    --app-warning-title: #92400e;
    --app-warning-text: #b45309;
    background-color: var(--app-bg);
    padding-bottom: 6rem;
    padding-top: 3rem;
}

[data-bs-theme="dark"] .author-app-wrapper {
    --app-bg: var(--vr-body-bg);
    --app-surface: var(--vr-body-secondary-bg);
    --app-surface-alt: var(--vr-gray-900);
    --app-border: var(--vr-border-color);
    --app-text-title: var(--vr-text-main);
    --app-text-body: var(--vr-text-muted);
    --app-primary-soft: rgba(var(--vr-theme-color-rgb, 255, 255, 255), .05);
    --app-shadow-premium: 0 1rem 3rem rgba(0, 0, 0, .2);
    --app-input-bg: var(--vr-input-bg);
    --app-input-border: var(--vr-input-border-color);
    --app-line: var(--vr-border-color);
    --app-border-step: var(--vr-gray-700);
    --app-pending-bg: rgba(59, 130, 246, .1);
    --app-pending-color: #60a5fa;
    --app-danger-bg: rgba(239, 68, 68, .1);
    --app-danger-color: #f87171;
    --app-warning-bg: rgba(245, 158, 11, .05);
    --app-warning-border: rgba(245, 158, 11, .2);
    --app-warning-title: #fcd34d;
    --app-warning-text: #fbbf24;
}

.author-app-wrapper .app-container {
    max-width: 80rem;
}

.author-app-wrapper .app-hero {
    margin-block-end: 7rem;
    max-width: 50rem;
}

.author-app-wrapper .app-hero-title {
    color: var(--app-text-title);
    font-size: 2.375rem;
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1.1;
}

.author-app-wrapper .app-hero-desc {
    color: var(--app-text-body);
    font-size: var(--vr-fs-xl);
    line-height: var(--vr-lh-xl);
    transition: color .3s;
}

.author-app-wrapper .app-hero-badge {
    align-items: center;
    background-color: var(--app-surface);
    border: .0625rem solid var(--app-border);
    border-radius: 6.25rem;
    box-shadow: rgba(0, 0, 0, .03) 0 .25rem 1rem;
    cursor: default;
    display: inline-flex;
    margin-block-end: 1.75rem;
    padding: .375rem 1.25rem .375rem .375rem;
    transition: .3s cubic-bezier(.175, .885, .32, 1.275);
}

.author-app-wrapper .app-hero-badge:hover {
    border-color: var(--app-primary);
    box-shadow: 0 .5rem 1.25rem var(--app-primary-soft);
    transform: translateY(-.125rem);
}

.author-app-wrapper .app-badge-icon-wrap {
    align-items: center;
    background-color: var(--app-primary);
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, .1) 0 .125rem .25rem;
    color: #fff;
    display: flex;
    height: 1.875rem;
    justify-content: center;
    margin-inline-end: .75rem;
    width: 1.875rem;
}

.author-app-wrapper .app-badge-text {
    color: var(--app-text-title);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .0625rem;
    text-transform: uppercase;
}

.author-app-wrapper .app-status-card {
    background-color: var(--app-surface);
    border: .0625rem solid var(--app-border);
    border-radius: 1rem;
    box-shadow: var(--app-shadow-premium);
    max-width: 36rem;
    padding: 3.5rem 2.5rem;
}

.author-app-wrapper .app-status-icon-wrap {
    height: 4.5rem;
    position: relative;
    width: 4.5rem;
}

.author-app-wrapper .app-status-icon-wrap::before {
    border-radius: 50%;
    content: "";
    inset: -.75rem;
    opacity: .2;
    position: absolute;
    z-index: 0;
}

.author-app-wrapper .app-status-icon-wrap.success::before {
    background-color: #10b981;
}

.author-app-wrapper .app-status-icon-wrap.success {
    background-color: rgba(16, 185, 129, .1);
    color: #10b981;
}

[data-bs-theme="dark"] .author-app-wrapper .app-status-icon-wrap.success {
    background-color: rgba(16, 185, 129, .15);
    color: #34d399;
}

.author-app-wrapper .app-status-icon-wrap.pending::before {
    background-color: var(--app-pending-color);
}

.author-app-wrapper .app-status-icon-wrap.danger::before {
    background-color: var(--app-danger-color);
}

.author-app-wrapper .app-status-icon-wrap.pending {
    background-color: var(--app-pending-bg);
    color: var(--app-pending-color);
}

.author-app-wrapper .app-status-icon-wrap.danger {
    background-color: var(--app-danger-bg);
    color: var(--app-danger-color);
}

.author-app-wrapper .app-status-icon {
    height: 2rem;
    position: relative;
    stroke-width: .125rem;
    width: 2rem;
    z-index: 1;
}

.author-app-wrapper .app-status-title {
    color: var(--app-text-title);
    font-size: 1.5rem;
    letter-spacing: -.02rem;
}

.author-app-wrapper .app-status-desc {
    color: var(--app-text-body);
    font-size: .9375rem;
    line-height: 1.6;
}

.author-app-wrapper .app-status-back-btn {
    background-color: var(--app-surface-alt);
    border: .0625rem solid var(--app-border);
    color: var(--app-text-title);
    font-size: .9375rem;
    transition: .3s;
}

.author-app-wrapper .app-status-back-btn:hover {
    border-color: var(--app-primary) !important;
    color: var(--app-primary) !important;
    transform: translateY(-.125rem);
}

.author-app-wrapper .app-timeline-section {
    margin-block-end: 8rem;
}

.author-app-wrapper .app-timeline-grid {
    display: grid;
    gap: 4rem;
    grid-template-columns: 1fr;
    position: relative;
}

@keyframes flowLine {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 2rem 0;
    }
}

@media (min-width: 992px) {
    .author-app-wrapper .app-timeline-grid {
        gap: 3rem;
        grid-template-columns: repeat(3, 1fr);
    }

    .author-app-wrapper .app-timeline-grid::before {
        animation: flowLine 20s linear infinite;
        background-image: linear-gradient(90deg, var(--app-border-step) 50%, transparent 50%);
        background-size: .5rem 100%;
        content: "";
        height: .0625rem;
        left: 16.66%;
        opacity: .6;
        position: absolute;
        right: 16.66%;
        top: 3rem;
        z-index: 1;
    }
}

.author-app-wrapper .app-step-icon-wrap {
    align-items: center;
    background-color: var(--vr-gray-100);
    border-radius: 50%;
    color: var(--app-text-title);
    display: flex;
    height: 6rem;
    justify-content: center;
    margin-block-end: 2.5rem;
    margin-inline: auto;
    position: relative;
    transition: .4s cubic-bezier(.2, .8, .2, 1);
    width: 6rem;
    z-index: 2;
}

[data-bs-theme="dark"] .author-app-wrapper .app-step-icon-wrap {
    background-color: var(--vr-gray-900);
}

.author-app-wrapper .app-step-icon {
    height: 1.8rem;
    stroke-width: .1rem;
    transition: transform .4s, color .4s;
    width: 1.8rem;
}

.author-app-wrapper .app-step:hover .app-step-icon-wrap {
    box-shadow: rgba(0, 0, 0, .05) 0 1rem 2.5rem -.5rem;
    transform: translateY(-.5rem);
}

.author-app-wrapper .app-step:hover .app-step-icon {
    color: var(--app-primary);
    transform: scale(1.1);
}

.author-app-wrapper .app-step-title {
    color: var(--app-text-title);
    font-size: var(--vr-fs-title-lg);
    letter-spacing: -.01rem;
    line-height: var(--vr-lh-title-lg);
}

.author-app-wrapper .app-step-desc {
    color: var(--app-text-body);
    font-size: var(--vr-fs-lg);
    line-height: var(--vr-lh-lg);
    max-width: 18rem;
    opacity: .9;
}

.author-app-wrapper .app-split-grid {
    display: grid;
    gap: 4rem;
    grid-template-columns: 1fr;
}

@media (min-width: 992px) {
    .author-app-wrapper .app-split-grid {
        gap: 4rem;
        grid-template-columns: 1.25fr 1fr;
    }

    .author-app-wrapper .app-form-plate {
        padding: 4rem;
    }
}

.author-app-wrapper .app-form-plate {
    background-color: var(--app-surface);
    border: .0625rem solid var(--app-border);
    border-radius: 1.5rem;
    box-shadow: var(--app-shadow-premium);
    padding: 3rem;
}

.author-app-wrapper .app-form-header {
    margin-bottom: 3rem;
}

.author-app-wrapper .app-form-title {
    color: var(--app-text-title);
    font-size: var(--vr-fs-title-3xl);
    letter-spacing: -.03rem;
    line-height: var(--vr-lh-title-3xl);
    margin-bottom: .75rem;
}

.author-app-wrapper .app-form-subtitle {
    color: var(--app-text-body);
}

.author-app-wrapper .app-input-wrap {
    margin-block-end: 1.75rem;
}

.author-app-wrapper .app-input-wrap.grid-input {
    margin-block-end: 0;
}

.author-app-wrapper .form-input {
    background-color: var(--app-input-bg);
    border: .0625rem solid var(--app-input-border);
    color: var(--app-text-title);
    transition: .2s;
}

.author-app-wrapper .form-input:focus {
    background-color: var(--app-surface);
    border-color: var(--app-primary);
    box-shadow: 0 0 0 .25rem var(--app-primary-soft);
    outline: none;
}

.author-app-wrapper .form-input::placeholder {
    color: var(--vr-gray-400);
    font-weight: 400;
}

.author-app-wrapper .app-hint {
    color: var(--app-text-body);
    font-size: .8125rem;
    line-height: 1.5;
    margin-block-start: .5rem;
    opacity: .8;
}

.author-app-wrapper .app-submit-btn {
    border-radius: .75rem;
    font-size: var(--vr-fs-lg);
    font-weight: 600;
    padding: 1.125rem;
    transition: .2s ease-in-out;
}

.author-app-wrapper .app-submit-btn:hover {
    box-shadow: 0 .5rem 1rem var(--app-primary-soft);
}

.author-app-wrapper .app-soft-alert {
    background-color: var(--app-warning-bg);
    border: .0625rem solid var(--app-warning-border);
    border-radius: 1rem;
}

.author-app-wrapper .app-soft-alert-icon {
    color: var(--app-warning-text);
    height: 1.75rem;
    width: 1.75rem;
}

.author-app-wrapper .app-soft-alert-title {
    color: var(--app-warning-title);
    font-size: 1.0625rem;
}

.author-app-wrapper .app-soft-alert-desc {
    color: var(--app-warning-text);
    font-size: .9375rem;
    line-height: 1.6;
}

.author-app-wrapper .app-admin-note {
    background-color: var(--app-surface);
    border-inline-start: .25rem solid var(--app-warning-text);
    color: var(--app-text-title);
}

.author-app-wrapper .app-guidelines-plate {
    padding-block-start: 3rem;
}

.author-app-wrapper .app-gl-title {
    color: var(--app-text-title);
    font-size: var(--vr-fs-title-3xl);
    letter-spacing: -.02rem;
    line-height: var(--vr-lh-title-3xl);
}

.author-app-wrapper .app-gl-list {
    position: relative;
}

.author-app-wrapper .app-gl-list::before {
    background-color: var(--app-line);
    bottom: 1rem;
    content: "";
    inset-inline-start: .625rem;
    position: absolute;
    top: 1rem;
    width: .0625rem;
    z-index: 1;
}

.author-app-wrapper .app-gl-dot {
    background-color: var(--app-bg);
    border: .25rem solid var(--app-primary);
    height: 1.25rem;
    position: relative;
    transition: transform .3s;
    width: 1.25rem;
    z-index: 2;
}

.author-app-wrapper .app-gl-item:hover .app-gl-dot {
    transform: scale(1.2);
}

.author-app-wrapper .app-gl-heading {
    color: var(--app-text-title);
    font-size: var(--vr-fs-title-md);
    line-height: var(--vr-lh-title-md);
}

.author-app-wrapper .app-gl-desc {
    color: var(--app-text-body);
    opacity: .9;
}

.author-app-wrapper .app-editor-content {
    border-block-start: .0625rem solid var(--app-border);
    color: var(--app-text-body);
    margin-block-start: 6rem;
    padding-block-start: 3rem;
}

.author-app-wrapper .app-editor-content h1,
.author-app-wrapper .app-editor-content h2,
.author-app-wrapper .app-editor-content h3,
.author-app-wrapper .app-editor-content h4 {
    color: var(--app-text-title);
    font-weight: 700;
    margin-block: 1.5rem 1rem;
}

.author-app-wrapper .app-editor-content p {
    margin-block-end: 1.25rem;
}

.author-app-wrapper .app-editor-content ol,
.author-app-wrapper .app-editor-content ul {
    margin-block-end: 1.25rem;
    padding-inline-start: 1.5rem;
}

.author-app-wrapper .app-editor-content a {
    color: var(--app-primary);
    text-decoration: none;
}

.author-app-wrapper .app-editor-content a:hover {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .author-app-wrapper {
        padding-bottom: 3rem;
        padding-top: 1rem;
    }

    .author-app-wrapper .app-hero {
        margin-block-end: 3rem;
    }

    .author-app-wrapper .app-form-plate {
        padding: 2rem;
    }

    .author-app-wrapper .app-soft-alert svg {
        display: none;
    }
}

html[dir="rtl"] .author-app-wrapper .app-hero-badge {
    padding: .375rem .375rem .375rem 1.25rem;
}
