/* ===================================================================
   INCEPTION_V65A_VISUAL_POLISH

   BERANDA:
   - tetap satu card besar
   - hilangkan "Data diperbarui dari sistem"
   - statistik lebih rapi
   - journey lebih compact & konsisten

   PENGUMPULAN:
   - Proposal = document panel proper
   - GitHub = field proper
   - hilangkan footer title duplikat
   - note + submit lebih rapi

   NO JS / BACKEND / DATABASE CHANGES
   =================================================================== */


/* ===================================================================
   01. BERANDA
   =================================================================== */


/*
 * Hapus tulisan:
 * "Data diperbarui dari sistem"
 */

.participant-content:has(.participant-home-timeline)
.participant-stats-v41-head
> small {

    display:
        none !important;
}


/*
 * Header statistik.
 */

.participant-content:has(.participant-home-timeline)
.participant-stats-v41-head {

    align-items:
        flex-end !important;

    margin-bottom:
        18px !important;
}


.participant-content:has(.participant-home-timeline)
.participant-stats-v41-head
> div {

    gap:
        5px !important;
}


.participant-content:has(.participant-home-timeline)
.participant-stats-v41-head
span {

    font-size:
        10px !important;

    letter-spacing:
        .14em !important;
}


.participant-content:has(.participant-home-timeline)
.participant-stats-v41-head
strong {

    color:
        #202c46 !important;

    font-size:
        19px !important;

    font-weight:
        750 !important;
}


/*
 * Statistik 3 kolom.
 */

@media (min-width: 901px) {

    .participant-content:has(.participant-home-timeline)
    .participant-stats-v41 {

        padding:
            27px
            28px
            25px !important;
    }


    .participant-content:has(.participant-home-timeline)
    .participant-stats-v41-grid {

        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            ) !important;

        gap:
            16px !important;
    }


    .participant-content:has(.participant-home-timeline)
    .participant-stat-v41 {

        min-height:
            108px !important;

        padding:
            17px
            18px !important;

        background:
            linear-gradient(
                145deg,
                #fbfcff 0%,
                #f7f9fd 100%
            ) !important;

        border:
            1px solid #dfe5ef !important;

        border-radius:
            15px !important;

        box-shadow:
            none !important;
    }


    .participant-content:has(.participant-home-timeline)
    .participant-stat-v41
    > strong {

        margin:
            5px
            0
            5px !important;

        color:
            #202c46 !important;

        font-size:
            34px !important;

        font-weight:
            700 !important;

        line-height:
            1 !important;
    }


    .participant-content:has(.participant-home-timeline)
    .participant-stat-v41
    > p {

        color:
            #273247 !important;

        font-size:
            13px !important;

        font-weight:
            400 !important;
    }

}


/* ===================================================================
   BERANDA — JOURNEY
   =================================================================== */

@media (min-width: 901px) {

    .participant-content:has(.participant-stats-v41)
    .participant-home-timeline {

        padding:
            58px
            28px
            28px !important;

        gap:
            14px !important;
    }


    .participant-content:has(.participant-stats-v41)
    .participant-home-timeline::before {

        top:
            25px !important;

        left:
            28px !important;

        color:
            #536cc5 !important;

        font-size:
            10px !important;

        font-weight:
            750 !important;

        letter-spacing:
            .14em !important;
    }


    /*
     * Compact journey cards.
     */

    .participant-content:has(.participant-stats-v41)
    .participant-home-timeline
    .journey-stage {

        min-height:
            335px !important;

        padding:
            18px
            18px
            20px !important;

        border:
            1px solid #dfe5ef !important;

        border-radius:
            16px !important;

        box-shadow:
            none !important;
    }


    /*
     * Lingkaran diperkecil sedikit agar card tidak terasa kosong.
     */

    .participant-content:has(.participant-stats-v41)
    .participant-home-timeline
    .journey-visual {

        width:
            150px !important;

        height:
            150px !important;

        margin:
            16px
            auto
            15px !important;
    }


    .participant-content:has(.participant-stats-v41)
    .participant-home-timeline
    .journey-symbol {

        width:
            82px !important;

        height:
            82px !important;

        padding:
            12px !important;
    }


    /*
     * Typography journey.
     */

    .participant-content:has(.participant-stats-v41)
    .participant-home-timeline
    .journey-stage-copy
    small {

        font-size:
            8px !important;

        line-height:
            1.3 !important;
    }


    .participant-content:has(.participant-stats-v41)
    .participant-home-timeline
    .journey-stage-copy
    h3 {

        margin:
            6px
            0
            7px !important;

        color:
            #2a354d !important;

        font-size:
            20px !important;

        font-weight:
            700 !important;

        line-height:
            1.15 !important;
    }


    .participant-content:has(.participant-stats-v41)
    .participant-home-timeline
    .journey-stage-copy
    p {

        color:
            #66738a !important;

        font-size:
            12px !important;

        font-weight:
            400 !important;

        line-height:
            1.5 !important;
    }

}


/* ===================================================================
   02. PENGUMPULAN — HEADER
   =================================================================== */

.participant-content:has(.submission-initial-v61)
.submission-section-head {

    align-items:
        center !important;
}


.participant-content:has(.submission-initial-v61)
.submission-section-head
h2 {

    color:
        #202c46 !important;

    font-weight:
        750 !important;
}


.participant-content:has(.submission-initial-v61)
.submission-section-head
p {

    color:
        #111827 !important;

    font-weight:
        400 !important;
}


/* ===================================================================
   03. REQUIREMENT PANELS
   =================================================================== */

@media (min-width: 901px) {

    .participant-content:has(.submission-initial-v61)
    .submission-requirement {

        align-content:
            start !important;

        min-height:
            175px !important;

        padding:
            21px
            22px !important;

        gap:
            16px !important;

        background:
            #fbfcff !important;

        border:
            1px solid #dfe5ef !important;

        border-radius:
            15px !important;

        box-shadow:
            none !important;
    }


    /*
     * Garis gradient atas dipertahankan,
     * tapi sangat tipis.
     */

    .participant-content:has(.submission-initial-v61)
    .submission-requirement::before {

        height:
            2px !important;

        opacity:
            .45 !important;
    }


    /*
     * Header setiap requirement.
     */

    .participant-content:has(.submission-initial-v61)
    .submission-requirement
    > div:first-child {

        align-items:
            flex-start !important;

        gap:
            12px !important;
    }


    .participant-content:has(.submission-initial-v61)
    .submission-requirement
    > div:first-child
    strong {

        color:
            #18233b !important;

        font-size:
            16px !important;

        font-weight:
            700 !important;

        line-height:
            1.35 !important;
    }


    .participant-content:has(.submission-initial-v61)
    .submission-requirement
    > div:first-child
    p {

        margin-top:
            4px !important;

        color:
            #111827 !important;

        font-size:
            12px !important;

        font-weight:
            400 !important;

        line-height:
            1.45 !important;
    }

}


/* ===================================================================
   04. PROPOSAL PANEL

   Header
   ↓
   [ file yang sudah diunggah ] [ Ganti Proposal ]
   =================================================================== */

@media (min-width: 901px) {

    .participant-content:has(.submission-initial-v61)
    .submission-requirement:has(> .participant-upload-button) {

        grid-template-columns:
            minmax(0, 1fr)
            auto !important;

        grid-template-rows:
            auto
            auto !important;

        column-gap:
            13px !important;

        row-gap:
            17px !important;
    }


    /*
     * Judul Proposal mengambil satu baris penuh.
     */

    .participant-content:has(.submission-initial-v61)
    .submission-requirement:has(> .participant-upload-button)
    > div:first-child {

        grid-column:
            1 / -1 !important;
    }


    /*
     * File display.
     */

    .participant-content:has(.submission-initial-v61)
    .submission-requirement:has(> .participant-upload-button)
    > :nth-child(2) {

        grid-column:
            1 !important;

        grid-row:
            2 !important;

        width:
            100% !important;

        min-width:
            0 !important;

        align-self:
            stretch !important;
    }


    /*
     * Tombol Ganti / Unggah Proposal.
     */

    .participant-content:has(.submission-initial-v61)
    .submission-requirement
    > .participant-upload-button {

        grid-column:
            2 !important;

        grid-row:
            2 !important;

        align-self:
            stretch !important;

        justify-self:
            end !important;

        min-width:
            132px !important;

        min-height:
            48px !important;

        margin:
            0 !important;

        padding:
            0
            18px !important;

        display:
            flex !important;

        align-items:
            center !important;

        justify-content:
            center !important;

        color:
            #ffffff !important;

        font-size:
            12px !important;

        font-weight:
            700 !important;

        line-height:
            1.2 !important;

        border:
            0 !important;

        border-radius:
            11px !important;

        cursor:
            pointer !important;
    }

}


/* ===================================================================
   05. GITHUB PANEL

   Header
   ↓
   [ https://github.com/...                         ]
   =================================================================== */

@media (min-width: 901px) {

    .participant-content:has(.submission-initial-v61)
    .submission-requirement:has(> input[type="url"]) {

        grid-template-columns:
            1fr !important;

        grid-template-rows:
            auto
            auto !important;

        row-gap:
            17px !important;
    }


    .participant-content:has(.submission-initial-v61)
    .submission-requirement:has(> input[type="url"])
    > div:first-child {

        grid-column:
            1 !important;

        grid-row:
            1 !important;
    }


    .participant-content:has(.submission-initial-v61)
    .submission-requirement
    > input[type="url"] {

        grid-column:
            1 !important;

        grid-row:
            2 !important;

        width:
            100% !important;

        height:
            48px !important;

        min-width:
            0 !important;

        margin:
            0 !important;

        padding:
            0
            15px !important;

        color:
            #111827 !important;

        background:
            #ffffff !important;

        border:
            1px solid #dbe3ef !important;

        border-radius:
            11px !important;

        font-size:
            13px !important;

        font-weight:
            500 !important;

        box-shadow:
            none !important;
    }


    .participant-content:has(.submission-initial-v61)
    .submission-requirement
    > input[type="url"]:focus {

        border-color:
            #7188d4 !important;

        box-shadow:
            0 0 0 3px
            rgba(
                85,
                110,
                190,
                .10
            ) !important;

        outline:
            none !important;
    }

}


/* ===================================================================
   06. SEBELUM MENGIRIM
   =================================================================== */

.participant-content:has(.submission-initial-v61)
.submission-guide-note {

    display:
        flex !important;

    align-items:
        center !important;

    gap:
        14px !important;

    margin:
        20px
        0
        0 !important;

    padding:
        14px
        16px !important;

    color:
        #111827 !important;

    background:
        #f8faff !important;

    border:
        1px solid #e4e9f2 !important;

    border-radius:
        11px !important;
}


.participant-content:has(.submission-initial-v61)
.submission-guide-note
> b {

    flex:
        0 0 auto !important;

    color:
        #263c7b !important;

    font-size:
        12px !important;

    font-weight:
        700 !important;
}


.participant-content:has(.submission-initial-v61)
.submission-guide-note
> span {

    color:
        #111827 !important;

    font-size:
        12px !important;

    font-weight:
        400 !important;

    line-height:
        1.45 !important;
}


/* ===================================================================
   07. SUBMIT FOOTER
   =================================================================== */

.participant-content:has(.submission-initial-v61)
.participant-save {

    align-items:
        center !important;

    margin:
        18px
        0
        0 !important;

    padding:
        18px
        0
        22px !important;
}


/*
 * HAPUS title duplikat:
 * "Pengumpulan Penyisihan"
 *
 * Header halaman sudah menjelaskan ini.
 */

.participant-content:has(.submission-initial-v61)
.participant-save
> div
> strong {

    display:
        none !important;
}


.participant-content:has(.submission-initial-v61)
.participant-save
> div
> span {

    display:
        block !important;

    color:
        #111827 !important;

    font-size:
        12px !important;

    font-weight:
        400 !important;

    line-height:
        1.5 !important;
}


/*
 * Tombol utama.
 */

.participant-content:has(.submission-initial-v61)
.participant-save
button {

    min-height:
        46px !important;

    padding:
        0
        20px !important;

    border:
        0 !important;

    border-radius:
        11px !important;

    color:
        #ffffff !important;

    font-size:
        12px !important;

    font-weight:
        700 !important;
}


/* ===================================================================
   08. HASIL SELEKSI
   =================================================================== */

.participant-content:has(.submission-initial-v61)
.participant-selection-banner {

    min-height:
        118px !important;

    padding:
        20px
        23px !important;

    background:
        #fffaf0 !important;

    border:
        1px solid #eadbad !important;

    border-radius:
        15px !important;

    box-shadow:
        none !important;
}


.participant-content:has(.submission-initial-v61)
.participant-selection-banner
h2,

.participant-content:has(.submission-initial-v61)
.participant-selection-banner
h3 {

    color:
        #202c46 !important;

    font-weight:
        700 !important;
}


.participant-content:has(.submission-initial-v61)
.participant-selection-banner
p {

    color:
        #111827 !important;

    font-size:
        12px !important;

    font-weight:
        400 !important;
}


/* ===================================================================
   09. MOBILE
   =================================================================== */

@media (max-width: 900px) {

    /*
     * Statistik.
     */

    .participant-content:has(.participant-home-timeline)
    .participant-stats-v41-grid {

        grid-template-columns:
            1fr !important;

        gap:
            12px !important;
    }


    /*
     * Proposal / GitHub stacked.
     */

    .participant-content:has(.submission-initial-v61)
    .submission-requirement {

        display:
            grid !important;

        grid-template-columns:
            1fr !important;

        gap:
            14px !important;

        min-height:
            0 !important;

        padding:
            18px !important;
    }


    .participant-content:has(.submission-initial-v61)
    .submission-requirement
    > * {

        grid-column:
            1 !important;

        grid-row:
            auto !important;
    }


    .participant-content:has(.submission-initial-v61)
    .submission-requirement
    > .participant-upload-button {

        width:
            100% !important;

        min-height:
            45px !important;
    }


    .participant-content:has(.submission-initial-v61)
    .submission-requirement
    > input[type="url"] {

        width:
            100% !important;

        height:
            46px !important;
    }


    .participant-content:has(.submission-initial-v61)
    .submission-guide-note {

        align-items:
            flex-start !important;

        flex-direction:
            column !important;

        gap:
            5px !important;
    }


    .participant-content:has(.submission-initial-v61)
    .participant-save {

        align-items:
            stretch !important;

        flex-direction:
            column !important;

        gap:
            13px !important;
    }


    .participant-content:has(.submission-initial-v61)
    .participant-save
    button {

        width:
            100% !important;
    }

}


/* ===================================================================
   END V65A
   =================================================================== */