/* XGN Application Builder
   Public application pages use the same editorial system as tournaments,
   members and secondary XGN pages.
*/

.xgn-application-page {
    background: #f0ede6;
    color: #0a0a0a;
}

.xgn-application-page .xgn-editorial-section {
    padding: 72px 0 110px;
}

.xgn-application-page .xgn-editorial-shell {
    width: min(100% - 36px, 1320px);
    margin: auto;
}

/* ---------------------------------------------------------
   APPLICATION DIRECTORY
   --------------------------------------------------------- */

.xgn-app-public-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    background: #c9c3b8;
    border-top: 2px solid #0a0a0a;
}

.xgn-app-public-list article {
    min-width: 0;
    min-height: 300px;
    padding: 30px;
    background: #f8f5ee;
    color: #0a0a0a;
    display: flex;
    flex-direction: column;
    transition: background .2s ease;
}

.xgn-app-public-list article:hover {
    background: #fffdf7;
}

.xgn-app-public-list article > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
}

.xgn-app-public-list article > div span,
.xgn-app-public-list article > div strong {
    font: 800 9px/1 Inter, sans-serif;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.xgn-app-public-list article > div span {
    color: #946d31;
}

.xgn-app-public-list article > div strong {
    color: #777168;
}

.xgn-app-public-list h2 {
    margin: 22px 0 12px;
    color: #0a0a0a;
    font: 700 clamp(34px, 3.6vw, 50px)/.9 "Barlow Condensed", sans-serif;
    letter-spacing: -.02em;
    text-transform: uppercase;
}

.xgn-app-public-list p {
    flex: 1;
    margin: 0;
    color: #6b655d;
    font-size: 13px;
    line-height: 1.7;
}

.xgn-app-public-list small {
    display: block;
    margin-top: 18px;
    color: #857e74;
    font: 700 10px/1.4 Inter, sans-serif;
}

.xgn-app-public-list a {
    margin-top: 22px;
    padding-top: 17px;
    border-top: 1px solid rgba(0,0,0,.18);
    color: #0a0a0a;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    text-decoration: none;
    font: 800 10px/1 Inter, sans-serif;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.xgn-app-public-list a:hover {
    color: #946d31;
}

/* ---------------------------------------------------------
   EMPTY / SUCCESS / ERROR
   --------------------------------------------------------- */

.xgn-app-public-empty,
.xgn-app-submit-success {
    padding: 54px 40px;
    border-top: 2px solid #0a0a0a;
    border-bottom: 1px solid rgba(0,0,0,.18);
    background: transparent;
    text-align: center;
}

.xgn-app-public-empty h2,
.xgn-app-submit-success h2 {
    margin: 0 0 12px;
    color: #0a0a0a;
    font: 700 clamp(42px, 5vw, 72px)/.86 "Barlow Condensed", sans-serif;
    text-transform: uppercase;
}

.xgn-app-public-empty p,
.xgn-app-submit-success p {
    margin: 0 auto;
    max-width: 600px;
    color: #706a62;
    line-height: 1.7;
}

.xgn-app-submit-success i {
    margin-bottom: 16px;
    color: #946d31;
    font-size: 34px;
}

.xgn-app-submit-success a {
    display: inline-flex;
    margin-top: 22px;
    padding: 13px 18px;
    background: #0a0a0a;
    color: #fff;
    text-decoration: none;
    font: 800 10px/1 Inter, sans-serif;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.xgn-app-public-alert {
    margin: 0 auto 18px;
    padding: 14px 16px;
    max-width: 1120px;
    border-left: 4px solid #9a3838;
    background: #f2dddd;
    color: #762626;
    font-size: 12px;
    font-weight: 700;
}

/* ---------------------------------------------------------
   APPLICATION FORM
   --------------------------------------------------------- */

.xgn-app-public-form {
    width: min(100%, 1120px);
    margin: 0 auto;
    display: grid;
    gap: 0;
    border-top: 2px solid #0a0a0a;
}

.xgn-app-public-section {
    padding: 34px 0 38px;
    border: 0;
    border-bottom: 1px solid rgba(0,0,0,.2);
    background: transparent;
    color: #0a0a0a;
}

.xgn-app-public-section__head {
    display: grid;
    grid-template-columns: 58px 1fr;
    gap: 22px;
    align-items: center;
    margin-bottom: 28px;
    padding: 0;
    border: 0;
}

.xgn-app-public-section__head > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid #946d31;
    color: #946d31;
    font: 800 11px/1 Inter, sans-serif;
    letter-spacing: .08em;
}

.xgn-app-public-section__head h2 {
    margin: 0;
    color: #0a0a0a;
    font: 700 clamp(32px, 4vw, 50px)/.9 "Barlow Condensed", sans-serif;
    letter-spacing: -.02em;
    text-transform: uppercase;
}

.xgn-app-public-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    column-gap: 30px;
    row-gap: 24px;
    padding-left: 80px;
}

.xgn-app-public-field {
    display: grid;
    align-content: start;
    gap: 8px;
    min-width: 0;
    color: #0a0a0a;
}

.xgn-app-public-field[hidden] {
    display: none !important;
}

.xgn-app-public-field > label,
.xgn-app-public-field label {
    margin: 0;
    color: #0a0a0a;
    font: 800 9px/1.3 Inter, sans-serif;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.xgn-app-public-field > small {
    margin-top: -2px;
    color: #817a71;
    font-size: 10px;
    line-height: 1.5;
}

/* Inputs deliberately match tournament filters and the editorial forms */
.xgn-app-public-field input:not([type="checkbox"]):not([type="radio"]),
.xgn-app-public-field textarea,
.xgn-app-public-field select {
    width: 100%;
    min-height: 52px;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid #b9b2a7;
    border-radius: 0;
    background: rgba(255,255,255,.34);
    color: #0a0a0a;
    box-shadow: none;
    outline: 0;
    font: 700 14px/1.35 "Barlow Condensed", sans-serif;
    transition: border-color .18s ease, background .18s ease;
}

.xgn-app-public-field textarea {
    min-height: 118px;
    resize: vertical;
}

.xgn-app-public-field select[multiple] {
    min-height: 145px;
}

.xgn-app-public-field input::placeholder,
.xgn-app-public-field textarea::placeholder {
    color: #938c82;
    opacity: 1;
}

.xgn-app-public-field input:not([type="checkbox"]):not([type="radio"]):hover,
.xgn-app-public-field textarea:hover,
.xgn-app-public-field select:hover {
    border-color: #777168;
}

.xgn-app-public-field input:not([type="checkbox"]):not([type="radio"]):focus,
.xgn-app-public-field textarea:focus,
.xgn-app-public-field select:focus {
    border-color: #946d31;
    background: #fffdf7;
    outline: 1px solid #946d31;
    outline-offset: -1px;
}

/* Browser autofill */
.xgn-app-public-field input:-webkit-autofill,
.xgn-app-public-field input:-webkit-autofill:hover,
.xgn-app-public-field input:-webkit-autofill:focus {
    -webkit-text-fill-color: #0a0a0a;
    box-shadow: 0 0 0 1000px #fffdf7 inset;
}

/* Date and time controls */
.xgn-app-public-field input[type="date"],
.xgn-app-public-field input[type="time"] {
    color-scheme: light;
}

.xgn-app-public-field input[type="date"]::-webkit-calendar-picker-indicator,
.xgn-app-public-field input[type="time"]::-webkit-calendar-picker-indicator {
    opacity: .7;
}

/* Upload */
.xgn-app-public-field input[type="file"] {
    padding: 8px;
}

.xgn-app-public-field input[type="file"]::file-selector-button {
    margin-right: 12px;
    padding: 10px 13px;
    border: 0;
    background: #0a0a0a;
    color: #fff;
    cursor: pointer;
    font: 800 9px/1 Inter, sans-serif;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.xgn-app-public-field input[type="file"]::file-selector-button:hover {
    background: #946d31;
}

/* Checkbox / radio */
.xgn-app-public-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.xgn-app-public-options label,
.xgn-app-public-checkbox {
    min-height: 46px;
    padding: 11px 13px;
    border: 1px solid #c7c0b5;
    background: rgba(255,255,255,.28);
    color: #0a0a0a;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    text-transform: none;
    letter-spacing: 0;
}

.xgn-app-public-options label:hover,
.xgn-app-public-checkbox:hover {
    border-color: #946d31;
    background: #fffdf7;
}

.xgn-app-public-options input,
.xgn-app-public-checkbox input {
    accent-color: #946d31;
}

/* ---------------------------------------------------------
   MULTI STEP + SUBMIT
   --------------------------------------------------------- */

.xgn-app-step-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin: 28px 0 0 80px;
    padding-top: 18px;
    border-top: 1px solid rgba(0,0,0,.16);
}

.xgn-app-step-actions button,
.xgn-app-public-submit button {
    min-height: 50px;
    padding: 0 20px;
    border: 1px solid #0a0a0a;
    background: #0a0a0a;
    color: #fff;
    cursor: pointer;
    font: 800 10px/1 Inter, sans-serif;
    letter-spacing: .13em;
    text-transform: uppercase;
    transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.xgn-app-step-actions button:hover,
.xgn-app-public-submit button:hover {
    border-color: #946d31;
    background: #946d31;
    color: #fff;
}

.xgn-app-step-actions button:first-child {
    margin-right: auto;
    background: transparent;
    color: #0a0a0a;
}

.xgn-app-step-actions button:first-child:hover {
    background: #0a0a0a;
    color: #fff;
}

.xgn-app-public-submit {
    margin-top: 28px;
    padding: 22px 0 0 80px;
    border-top: 2px solid #0a0a0a;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.xgn-app-public-submit p {
    margin: 0;
    max-width: 580px;
    color: #706a62;
    font-size: 11px;
    line-height: 1.6;
}

/* Validation */
.xgn-app-public-field input:invalid:not(:placeholder-shown),
.xgn-app-public-field textarea:invalid:not(:placeholder-shown) {
    border-color: #9a3838;
}

/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 900px) {
    .xgn-app-public-list {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .xgn-app-public-fields {
        padding-left: 64px;
        column-gap: 18px;
    }

    .xgn-app-step-actions,
    .xgn-app-public-submit {
        margin-left: 64px;
        padding-left: 0;
    }
}

@media (max-width: 650px) {
    .xgn-application-page .xgn-editorial-section {
        padding: 46px 0 72px;
    }

    .xgn-app-public-list,
    .xgn-app-public-fields {
        grid-template-columns: 1fr;
    }

    .xgn-app-public-list article {
        min-height: 0;
        padding: 24px 20px;
    }

    .xgn-app-public-section {
        padding: 28px 0;
    }

    .xgn-app-public-section__head {
        grid-template-columns: 42px 1fr;
        gap: 12px;
        margin-bottom: 22px;
    }

    .xgn-app-public-section__head > span {
        width: 34px;
        height: 34px;
    }

    .xgn-app-public-section__head h2 {
        font-size: 31px;
    }

    .xgn-app-public-fields {
        padding-left: 0;
        gap: 18px;
    }

    .xgn-app-public-field input:not([type="checkbox"]):not([type="radio"]),
    .xgn-app-public-field textarea,
    .xgn-app-public-field select {
        min-height: 50px;
        font-size: 16px;
    }

    .xgn-app-step-actions {
        margin-left: 0;
        flex-direction: column-reverse;
    }

    .xgn-app-step-actions button,
    .xgn-app-public-submit button {
        width: 100%;
    }

    .xgn-app-step-actions button:first-child {
        margin-right: 0;
    }

    .xgn-app-public-submit {
        margin-left: 0;
        padding-left: 0;
        align-items: stretch;
        flex-direction: column;
    }
}
