.view-tips{
    max-width: 76rem;
    margin: 0 auto 3rem;
    padding-inline: 1.5rem;
}

.view-tips > .view-content > .views-row > .views-field > .field-content{
    padding: 2rem;
    height: fit-content;
    background-color: var(--color-gray-050);
    border-radius: var(--border-radius);
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
@media(width > 48rem){
    .view-tips > .view-content > .views-row > .views-field > .field-content{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
}

.view-tips > .view-content .tip-content{
    font-size: 0.875rem;
}

.view-tips > .view-content .tip-content > h2{
    font-weight: 500;
    color: var(--color-primary);
}

.view-tips > .view-content .tip-content > .tip-content--doctor{
    font-weight: 700;
}

.view-tips > .view-content .tip-content > h3{
    margin-top: 1.75rem;
    margin-bottom: 1rem;
    font-weight: 500;
    font-size: 1.125rem;
}

.view-tips > .view-content .tip-content > span,
.view-tips > .view-content .tip-content > a{
    display: block;
    margin-top: 0.5rem;
}

.view-tips > .view-content .tip-image img{
    width: 100%;
    height: auto;
}

.view-tips.tips-table {
    max-width: initial;
}

.view-tips.tips-table > .view-content{
    overflow-x: auto;
}

.view-tips.tips-table .view-header h2{
    color: var(--color-primary);
    font-weight: 500;
    margin-bottom: 1.5rem;
}

.view-tips.tips-table > .view-content table{
    border-collapse: separate;
    width: 100%;
    border-radius: var(--border-radius);
    border: 1px solid #C5C6C7;
}

.view-tips.tips-table > .view-content table tbody tr:nth-child(odd){
    background-color: #f8f8f8;
}

.view-tips.tips-table > .view-content table th,
.view-tips.tips-table > .view-content table td{
    text-align: left;
    padding: 0.75rem 1.5rem;
}

.view-tips.tips-table > .view-content table th{
    padding: 1.5rem;
}

.view-tips.tips-table > .view-content table th,
.view-tips.tips-table > .view-content table th a{
    font-weight: 500;
    font-size: 0.9375rem;
    color: var(--color-gray);
}

.view-tips.tips-table > .view-content table th a span.tablesort{
    width: 12px;
    height: 12px;
}

.view-tips.tips-table > .view-content table td.is-active{
    background-color: initial;
}