.application-page {
    background:
        radial-gradient(circle at top left, rgba(39, 90, 181, 0.12), transparent 28%),
        linear-gradient(180deg, #f6f8fc 0%, #eef2f7 100%);
}

.application-page #main {
    padding-bottom: 48px;
}

.application-page #main section:not(.title) .container {
    max-width: 1180px;
    margin: 0 auto;
    padding: 28px 16px 0;
}

.application-shell {
    align-items: flex-start;
    gap: 20px;
}

.application-sidebar,
.application-form-column {
    width: 100%;
}

.application-intro-card,
.application-info-card,
.application-form-card,
.application-inline-panel,
.application-repeat-card,
.participant-entry-card,
.activitygroup,
.subgroup,
.participant-step-card {
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(35, 54, 86, 0.1);
    border-radius: 24px;
    /* box-shadow: 0 18px 45px rgba(25, 38, 64, 0.08); */
}

.application-intro-card,
.application-info-card,
.application-form-card,
.application-inline-panel,
.participant-step-card {
    padding: 14px;
}

.application-intro-card,
.application-info-card {
    margin-bottom: 14px;
}

.application-kicker,
.application-section-step,
.participant-step-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #275ab5;
    background: rgba(39, 90, 181, 0.1);
    border-radius: 999px;
    padding: 8px 12px;
}

.application-sidebar-title,
.application-form-header h2,
.application-form-card h3,
.application-inline-panel h4,
.subgroup h3,
.activitygroup h4,
.participant-entry-header h5,
.participant-step-card h3 {
    font-size: 16px;
    font-weight: 700;
    color: #16325b;
    letter-spacing: -0.02em;
}

.application-sidebar-title {
    margin: 12px 0 8px;
    font-size: clamp(2rem, 3vw, 2.7rem);
    line-height: 1.08;
}

.application-form-header {
    margin-bottom: 18px;
}

.application-form-header h2 {
    margin: 0 0 10px;
    font-size: clamp(2rem, 3vw, 2.5rem);
}

.application-form-header p,
.application-section-heading p,
.application-intro-card p,
.application-info-card p,
.participant-step-card p,
.application-form-shell .form-text p,
.application-helper-text,
.application-note,
.application-list li {
    font-size: 0.98rem;
    line-height: 1.65;
    color: #42526b;
}

.application-intro-card p:last-child,
.application-info-card p:last-child,
.application-form-shell .form-text p:last-child,
.participant-step-card p:last-child {
    margin-bottom: 0;
}

.application-list {
    margin: 12px 0 0;
    padding-left: 18px;
}

.application-list li {
    margin-bottom: 8px;
}

.application-form-shell form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.application-form-card,
.application-inline-panel,
.participant-step-card,
.activitygroup,
.subgroup {
    position: relative;
}

.application-section-heading {
    margin-bottom: 14px;
}

.application-section-heading h3,
.participant-step-card h3,
.application-inline-panel h4 {
    margin: 8px 0 4px;
    font-size: 1.55rem;
}

.application-section-heading p,
.participant-step-card p,
.application-inline-panel .application-helper-text {
    margin: 0;
}

.application-form-shell fieldset {
    margin: 0;
    padding: 0;
}

.application-form-shell .input {
    margin-bottom: 12px;
}

.application-form-shell .input:last-child {
    margin-bottom: 0;
}

.application-form-shell label {
    display: block;
    margin-bottom: 6px;
    margin-right: 0;
    color: #334155;
    font-size: 0.86rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.application-form-shell .required > label::after,
.application-form-shell .required label:first-child::after {
    content: " *";
    color: #bf2138;
}

.application-form-shell input,
.application-form-shell textarea,
.application-form-shell select,
.application-form-shell .input.date > div,
.application-form-shell .input.select > div,
.application-form-shell div.input div.photo {
    width: 100%;
    min-height: 46px;
    padding: 11px 13px;
    border-radius: 16px;
    border: 1px solid #cfd8e6;
    background: #fbfcfe;
    color: #122033;
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.7);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
    margin: 0;
}

.application-form-shell input:hover,
.application-form-shell textarea:hover,
.application-form-shell select:hover,
.application-form-shell .input.date > div:hover,
.application-form-shell .input.select > div:hover {
    border-color: #9bb3d9;
    background: #ffffff;
}

.application-form-shell input:focus,
.application-form-shell textarea:focus,
.application-form-shell select:focus,
.application-form-shell .input.date > div:focus-within,
.application-form-shell .input.select > div:focus-within {
    border-color: #275ab5;
    background: #ffffff;
    box-shadow: 0 0 0 4px rgba(39, 90, 181, 0.14);
    outline: none;
}

.application-form-shell textarea {
    min-height: 96px;
    resize: vertical;
}

.application-form-shell input[type="file"] {
    padding: 10px;
    background: #ffffff;
}

.application-form-shell input[type="checkbox"],
.application-form-shell input[type="radio"] {
    width: 1.15rem;
    min-height: 1.15rem;
    padding: 0;
    margin-right: 10px;
    accent-color: #275ab5;
    box-shadow: none;
    vertical-align: middle;
}

.application-form-shell .input.radio,
.application-form-shell .input.checkbox {
    padding: 12px 14px;
    border: 1px solid rgba(39, 90, 181, 0.14);
    border-radius: 18px;
    background: rgba(245, 248, 252, 0.9);
}

.application-form-shell .input.radio legend,
.application-form-shell .input.checkbox legend {
    margin-bottom: 8px;
    color: #334155;
    font-size: 0.92rem;
    font-weight: 700;
}

.application-form-shell .input.radio label,
.application-form-shell .input.checkbox label {
    display: inline-flex;
    align-items: center;
    margin-right: 12px;
    margin-bottom: 6px;
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: #23364f;
}

.application-form-shell .input.checkbox label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.application-form-shell .form-text {
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(39, 90, 181, 0.07), rgba(39, 90, 181, 0.03));
    border: 1px solid rgba(39, 90, 181, 0.1);
    padding: 12px 14px;
    margin-bottom: 12px;
}

.application-form-shell .form-text b p,
.application-form-shell .form-text strong {
    color: #16325b;
}

.application-form-shell .error input,
.application-form-shell .error textarea,
.application-form-shell .error select,
.application-form-shell .input.error input,
.application-form-shell .input.error textarea,
.application-form-shell .input.error select,
.application-form-shell .error .input.date > div,
.application-form-shell .error .input.select > div {
    border-color: #d8445a;
    background: #fff6f7;
    box-shadow: 0 0 0 4px rgba(216, 68, 90, 0.12);
}

.application-form-shell div.error-message,
.application-form-shell .error-message {
    display: block;
    margin: 8px 0 0;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(216, 68, 90, 0.18);
    background: #fff1f3;
    color: #8f132a;
    font-size: 0.9rem;
    line-height: 1.45;
}

.application-error-summary {
    margin: 0 0 12px;
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid rgba(216, 68, 90, 0.2);
    background: #fff1f3;
    color: #8f132a;
}

.application-form-shell .is-invalid,
.application-form-shell input.is-invalid,
.application-form-shell textarea.is-invalid,
.application-form-shell select.is-invalid {
    border-color: #d8445a;
    background: #fff6f7;
    box-shadow: 0 0 0 4px rgba(216, 68, 90, 0.12);
}

.application-form-shell .invalid-feedback {
    display: block;
    margin-top: 6px;
    color: #8f132a;
    font-size: 0.9rem;
    line-height: 1.45;
}

.application-inline-note {
    margin-top: 8px;
}

.application-form-shell .message,
.application-form-shell .success,
.application-form-shell .flash {
    border-radius: 18px;
    padding: 12px 14px;
    margin-bottom: 14px;
}

.application-form-shell .success {
    background: #eefbf3;
    border: 1px solid #8ad0a0;
    color: #17542d;
}

.application-two-column-grid,
.participant-entry-grid {
    display: grid;
    gap: 12px;
}

.application-inline-panel {
    margin-top: 12px;
}

.application-repeat-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.application-repeat-card,
.participant-entry-card,
.activitygroup,
.subgroup {
    padding: 8px;
}

.application-repeat-card h4,
.activitygroup h4,
.subgroup h3,
.participant-entry-header h5 {
    margin-top: 0;
    margin-bottom: 10px;
}

.application-repeat-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 12px;
}

.application-primary-button,
.application-secondary-button,
.application-remove-button,
.application-form-shell button[type="submit"],
.application-form-shell .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    border-radius: 999px;
    padding: 10px 18px;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease, border-color 0.18s ease;
}

.application-primary-button,
.application-form-shell button[type="submit"],
.application-form-shell .btn {
    width: 100%;
    max-width: none;
    margin: 0;
    background: linear-gradient(135deg, #275ab5 0%, #183b79 100%);
    border: 1px solid transparent;
    color: #ffffff;
    box-shadow: 0 16px 28px rgba(24, 59, 121, 0.22);
}

.application-primary-button:hover,
.application-form-shell button[type="submit"]:hover,
.application-form-shell .btn:hover {
    background: linear-gradient(135deg, #2e66cc 0%, #204a94 100%);
    color: #ffffff;
    transform: translateY(-1px);
}

.application-secondary-button,
.application-form-shell .btn-white {
    width: auto;
    margin: 0;
    min-width: 160px;
    background: #f4f7fb !important;
    border: 1px solid #c8d4e6 !important;
    color: #183b79 !important;
    box-shadow: none !important;
}

.application-secondary-button:hover,
.application-form-shell .btn-white:hover {
    background: #e7eef8 !important;
    border-color: #9bb3d9 !important;
    color: #16325b !important;
    transform: translateY(-1px);
}

.application-remove-button,
.remove-child-application,
.remove-permit-row,
.remove-activity-area {
    width: auto;
    min-width: 0;
    background: #fff4f3;
    border: 1px solid #f0b5b0;
    color: #9f2e20;
    box-shadow: none;
}

.application-remove-button:hover,
.remove-child-application:hover,
.remove-permit-row:hover,
.remove-activity-area:hover {
    background: #ffe8e5;
    border-color: #dd8f88;
    color: #7b2016;
}

.application-form-shell button:disabled,
.application-form-shell .btn:disabled,
.application-form-shell input[type="submit"]:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.application-form-shell .photo img {
    width: 100%;
    max-width: 240px;
    border-radius: 18px;
    box-shadow: 0 12px 24px rgba(18, 32, 51, 0.18);
}

.participant-step-card {
    margin-top: 12px;
}

.subgroup {
    margin: 12px 0 14px;
    overflow: hidden;
}

.subgroup h3 {
    margin: -14px -14px 14px;
    padding: 14px 16px;
    font-size: 1.2rem;
    background: linear-gradient(135deg, #16325b 0%, #275ab5 100%);
    color: #ffffff;
}

.activitygroup {
    margin-bottom: 12px;
    background: #f9fbfe;
}

.participant-entry-card {
    margin-bottom: 12px;
}

.participant-entry-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(35, 54, 86, 0.1);
}

.participant-entry-meta {
    font-size: 0.85rem;
    font-weight: 700;
    color: #275ab5;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.participant-entry-fields {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.participant-field-row {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 0.75rem;
    align-items: center;
    margin-bottom: 0.75rem;
    padding: 0.7rem 0.85rem;
    border: 1px solid rgba(35, 54, 86, 0.08);
    border-radius: 18px;
    /* background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%); */
}

.participant-field-row:last-of-type {
    margin-bottom: 0;
}

.participant-field-row > label {
    margin: 0;
    color: #23364f;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.35;
}

.participant-field-input {
    min-width: 0;
}

.participant-field-input .input {
    margin-bottom: 0;
}

.participant-field-input input,
.participant-field-input select,
.participant-field-input textarea,
.participant-field-input .input.date > div,
.participant-field-input .input.select > div {
    width: 100%;
}

.participant-field-input-checkbox {
    display: flex;
    align-items: center;
}

.participant-field-input-checkbox .input.checkbox {
    display: inline-flex;
    align-items: center;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.participant-field-input-checkbox .input.checkbox label {
    margin: 0;
}

.participant-field-input-checkbox input[type="checkbox"] {
    width: 1.15rem;
    min-width: 1.15rem;
    min-height: 1.15rem;
    margin: 0;
}

@media (max-width: 768px) {
    .participant-field-row {
        grid-template-columns: 1fr;
        gap: 0.5rem;
        align-items: flex-start;
        padding: 0.85rem;
    }
}

.participant-entry-card .clearfix,
.application-page .clearfix {
    display: none;
}

.participant-entry-card br {
    display: none;
}

.application-page a {
    /* color: #1d4b99; */
}

.application-page a:hover {
    color: #0f2d61;
}

#district-warning {
    margin-bottom: 12px;
    padding: 10px 12px;
    border-radius: 14px;
    background: #fff7e5;
    border: 1px solid #f0d291;
    color: #8a6216;
    font-size: 0.92rem;
    font-weight: 600;
}

@media only screen and (min-width: 768px) {
    .application-two-column-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .participant-entry-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .participant-entry-card .col10,
    .participant-entry-card .col20,
    .participant-entry-card .col30,
    .participant-entry-card .col50 {
        width: 100%;
    }
}

@media only screen and (min-width: 1024px) {
    .application-page #main section:not(.title) .container {
        padding-top: 40px;
    }

    .application-sidebar {
        width: 34%;
        padding-right: 8px;
        position: sticky;
        top: 92px;
        align-self: flex-start;
    }

    .application-form-column {
        width: calc(66% - 28px);
    }

    .participant-entry-grid {
        grid-template-columns: repeat(10, minmax(0, 1fr));
    }

    .participant-entry-card .col30 {
        grid-column: span 3;
    }

    .participant-entry-card .col20 {
        grid-column: span 2;
    }

    .participant-entry-card .col10 {
        grid-column: span 2;
    }

    .participant-entry-card .col50 {
        grid-column: span 5;
    }
}

@media only screen and (max-width: 767px) {
    .application-intro-card,
    .application-info-card,
    .application-form-shell,
    .application-form-card,
    .application-inline-panel,
    .application-repeat-card,
    .participant-entry-card,
    .activitygroup,
    .subgroup,
    .participant-step-card {
        border-radius: 20px;
        padding: 14px;
    }

    .application-form-shell .input.radio label,
    .application-form-shell .input.checkbox label {
        display: flex;
        margin-right: 0;
    }

    .application-form-shell .input.radio label {
        margin-bottom: 12px;
    }

    .application-form-shell .application-repeat-actions,
    .application-form-shell .submit,
    .application-form-shell .button {
        flex-direction: column;
    }

    .application-form-shell button[type="submit"],
    .application-form-shell .btn,
    .application-secondary-button,
    .application-remove-button,
    .remove-child-application,
    .remove-permit-row,
    .remove-activity-area {
        width: 100%;
    }

    .subgroup h3 {
        margin-left: -20px;
        margin-right: -20px;
    }
}