/* ============================================
   HEC SYMPTOM LETTER
   One letter card + linked symptoms
   ============================================ */

.hec-symptom-letter {
    display: grid;
    grid-template-columns: 40px 1fr;
    column-gap: 32px;
    align-items: start;

    width: 100%;
    margin: 0;
    padding: 32px 36px;

    border-radius: 12px;
    background: #EEEEB6;
    box-sizing: border-box;
}

.hec-symptom-letter__badge-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    min-width: 0;
}

.hec-symptom-letter__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 40px;
    height: 40px;
    min-width: 40px;
    padding: 0;

    border-radius: 100px;
    background: #FDFCFB;

    font-family: var(--font-primary, 'Google Sans', sans-serif);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.52em;

    color: #212121;
    box-sizing: border-box;
}

.hec-symptom-letter__list {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(var(--hec-symptom-rows, 3), auto);
    column-gap: 72px;
    row-gap: 24px;

    margin: 0;
    padding: 0;
    list-style: none;
    box-sizing: border-box;
}

.hec-symptom-letter__item {
    margin: 0;
    padding: 0;
    min-width: 0;
    box-sizing: border-box;
}

.hec-symptom-letter__item:last-child {
    margin-bottom: 0;
}

.hec-symptom-letter__link,
.hec-symptom-letter__text {
    display: inline-block;

    font-family: var(--font-primary, 'Google Sans', sans-serif);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.52em;

    color: #212121;
    text-decoration: none;
    word-break: normal;
    overflow-wrap: anywhere;

    transition:
        color 0.2s ease,
        opacity 0.2s ease;
}

.hec-symptom-letter__link:hover {
    color: var(--color-primary, #4E5B31);
    opacity: 0.72;
    text-decoration: none;
}

.hec-symptom-letter__item:last-child {
    margin-bottom: 0;
}


@media (max-width: 767px) {
    .hec-symptom-letter {
        display: grid;
        grid-template-columns: 1fr;
        row-gap: 20px;
        column-gap: 0;
        padding: 24px 20px;
    }

    .hec-symptom-letter__badge-wrap {
        justify-content: flex-start;
    }

    .hec-symptom-letter__list {
        display: grid;
        grid-auto-flow: row;
        grid-template-columns: 1fr !important;
        grid-template-rows: none !important;
        column-gap: 0 !important;
        row-gap: 18px;
        width: 100%;
    }
}

/*@media (max-width: 767px) {*/
/*    .hec-symptom-letter {*/
/*        display: grid;*/
/*        grid-template-columns: 1fr;*/
/*        row-gap: 20px;*/
/*        column-gap: 0;*/
/*        padding: 24px 20px;*/
/*    }*/

/*    .hec-symptom-letter__badge-wrap {*/
/*        justify-content: flex-start;*/
/*    }*/

/*    .hec-symptom-letter__list {*/
/*        grid-auto-flow: row;*/
/*        grid-template-columns: 1fr;*/
/*        grid-template-rows: none;*/
/*        column-gap: 0;*/
/*        row-gap: 18px;*/
/*        width: 100%;*/
/*    }*/
/*}*/

/*@media (max-width: 767px) {*/
/*    .hec-symptom-letter {*/
/*        grid-template-columns: 40px 1fr;*/
/*        column-gap: 20px;*/
/*        padding: 24px 20px;*/
/*    }*/

/*    .hec-symptom-letter__list {*/
/*        grid-auto-flow: row;*/
/*        grid-template-columns: 1fr;*/
/*        grid-template-rows: none;*/
/*        column-gap: 0;*/
/*        row-gap: 18px;*/
/*    }*/
    
/*    .hec-symptom-letter__item {*/
/*        margin-bottom: 18px;*/
/*    }*/
/*}*/
