.option-card {

    transition:
        border-color .2s ease,
        background-color .2s ease,
        transform .12s ease;

}


.option-card:hover {

    transform:translateX(2px);

}


.option-card.selected {

    border-color:#5f9b5e;

    background-color:#eaf4ea;

}


.option-card input[type="radio"] {

    accent-color:#5f9b5e;

}


.diamond-deco {

    position:absolute;

    right:-20px;

    width:130px;

    height:130px;

    opacity:.55;

    pointer-events:none;

}


button[disabled] {

    opacity:.45;

    cursor:not-allowed;

}   

/* ==========================================
   ESTADO DAS RESPOSTAS
========================================== */

.option-card.correct {
    background-color: #dcfce7;
    border-color: #16a34a;
    color: #166534;
}

.option-card.wrong {
    background-color: #fee2e2;
    border-color: #dc2626;
    color: #991b1b;
}

.option-card.correct::after {
    content: " ✔";
    float: right;
    font-weight: bold;
}

.option-card.wrong::after {
    content: " ✖";
    float: right;
    font-weight: bold;
}

.option-card.disabled {
    pointer-events: none;
}
.option-card.correct{

    background:#d1fae5;
    border-color:#22c55e;

}

.option-card.wrong{

    background:#fee2e2;
    border-color:#ef4444;

}