/**
 * Styling for diagnoses.
 */

 .chsm-diagnoses{
    padding: 5rem 0;
 }


 .find-diagnosis{
    text-align: center;
    width: 60%;
    margin: auto;
    padding: 0 0 3rem;
 }

 .chsm-diagnoses.zones .find-diagnosis{
    text-align: start;
    width: 100%;
 }

 .chsm-diagnoses.zones .chsm-btn-2 {
    margin-bottom: 1rem;
}

 .find-diagnosis h2{
    color: var(--secundario);
    margin-bottom: 2rem;
 }

 .find-diagnosis .view-filters {
    width: 100%;
}

.find-diagnosis #views-exposed-form-chsm-diagnoses-index-page-diagnoses .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.find-diagnosis .js-form-type-search-api-autocomplete {
    width: 70%;
    margin-right: -20px;
}

.find-diagnosis .form-type-textfield, .find-diagnosis input.form-autocomplete {
    width: 100%;;
    border-radius: 50px;
    padding: 0.8rem 2rem;
    height: 50px;
    font-size: 1.2rem;
}

.find-diagnosis form .form-actions {
    width: 30%;
    margin-left: -20px;
}

/* .find-diagnosis .form-type-textfield input, .find-diagnosis input.form-autocomplete {
    
} */

.find-diagnosis form .form-actions input {
    padding: 0.8rem 2rem;
    font-size: 1.2rem;
    font-weight: bold;
    height: 50px;
    line-height: 1;
}

.find-diagnosis .form-type-textfield input {
    border-radius: 50px;
    padding: 0.8rem 2rem;
    
    border: none;
    box-shadow: 0 2px 5px #ccc;
 }



 h2.node__title a {
    color: var(--secundario);
    text-decoration: none;
}

.view-chsm-diagnoses-index .views-row {
    background: var(--gris-claro);
    margin: 2rem;
    border-radius: 40px;
    padding: 2rem 5rem;
}

.view-chsm-diagnoses-index .views-row .node--view-mode-teaser {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}


.chsm-diagnosis{
    display: flex;
    flex-wrap: wrap;
}

.chsm-diagnosis .info{
    width: 60%;
}

.chsm-diagnosis .image{
    width: 40%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.chsm-diagnosis .image img{
    width: 100%;
    height: auto;
}

.chsm-diagnosis .image .field.field--name-field-telefono.field--type-telephone {
    justify-content: center;
}

.chsm-diagnosis .info h2.node__title {
    border-bottom: 1px solid var(--secundario);
    margin-bottom: 1.5rem;
}

.specialties li.list-group-item {
    background: none;
    border: none;
}

.specialties {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    align-items: baseline;
}

.specialties ul.term.list-group {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: .5rem;
}

.specialties ul.term.list-group li{
    padding: 0;
}

.specialties ul.term.list-group li a{
    transition: color .4s ease, color .4s ease;
}

.specialties ul.term.list-group li a:hover{
    color: var(--secundario);
    transition: color .4s ease, color .4s ease;
}


.chsm-diagnosis .info .chsm-btn a {
    border: 2px solid var(--principal);
    padding: 0.5rem 1rem;
    border-radius: 50px;
    font-weight: bolder;
    text-decoration: none;
    transition: background .4s ease, color .4s ease;
}

.chsm-diagnosis .info .chsm-btn a:hover {
    background: var(--principal);
    color: var(--blanco);
    transition: background .4s ease, color .4s ease;
}

.chsm-diagnosis .image .field--name-field-imagen img {
    border-radius: 300px;
    background: var(--principal);
    margin: 0;
}

.chsm-diagnosis .image .field.field--name-field-telefono a {
    background: var(--secundario);
    color: var(--blanco);
    padding: .5rem 2rem;
    font-size: 1rem;
    text-decoration: none;
    border-radius: 100px;
    width: 100%;
    text-align: center;
    position: relative;
    justify-content: center;
    align-items: center;
    display: flex;
    gap: 1rem;
    margin-top: -1.5rem;
    transition: color .4s ease, background .4s ease;
}

.chsm-diagnosis .image .field.field--name-field-telefono a:hover{
    background: var(--principal);
    transition: color .4s ease, background .4s ease;
}

.chsm-diagnosis .image .field.field--name-field-telefono a::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url(/sites/default/files/iconos/phone.png);
    background-size: cover;
    background-position: center;
    filter: brightness(0) invert(1);
    transition: filter .4s ease;
}

.chsm-diagnosis .image .field.field--name-field-telefono.field--type-telephone.field--label-hidden.field__item a:hover::before {
    filter: brightness(0) invert(1);
    transition: filter .4s ease;
}

div#sidebar_first {
    width: 30%;
}

.sidebar .block {
    background: none;
    border: none;
}

.sidebar h4 {
    color: var(--secundario);
    border-bottom: 1px solid var(--secundario);
    font-size: 1.2rem;
}

.sidebar ul {
    color: var(--gris-oscuro);
    padding: 0;
}

.sidebar #block-firstletter ul{
    font-weight: bold;
}

.sidebar ul li input {
    margin-right: 0.5rem;
}

.sidebar ul li::marker {
    content: none;
}

.sidebar li.facet-item a {
    color: var(--gris-oscuro);
    text-decoration: none;
}

.main-content{
    padding: 0 4rem;
}

.main-content h3{
    color: var(--gris-oscuro);
    margin-bottom: 2rem;
}

.main-content .views-row {
    margin-bottom: 1.5rem;
}

.main-content .views-row a:hover {
    color: var(--secundario);
    text-decoration: underline;
}

.main-content .views-row a::before {
    content: "•";
    font-size: 1.5rem;
    line-height: 1;
    margin-right: 0.6rem;
}
.main-content  .views-row a {
    font-size: 1.2rem;
    text-decoration: none;
    font-weight: bold;
}

.chsm-diagnoses.zones .find-diagnosis{
    padding: 0 0 6rem;
}

.chsm-diagnoses.zones .find-diagnosis h2{
    display: none;
}

.chsm-diagnoses.zones .find-diagnosis h1{
    color: var(--secundario);
}

.chsm-diagnoses.zones .find-diagnosis h1, .chsm-diagnoses.zones .find-diagnosis p{
    text-align: center;
}

.chsm-diagnoses.zones div#block-mainpagecontent {
    display: none;
}

.sidebar .block-facet-blockdiagnostics-first-letter ul{
    display: flex;
    flex-wrap: wrap;
}

.sidebar .block-facet-blockdiagnostics-first-letter ul .facet-item{
    width: 33%;
}

.sidebar .block-facet-blockdiagnostics-first-letter ul label {
    text-transform: uppercase;
}

.sidebar select {
    font-size: 1.2rem;
    width: 100%;
    padding: 0.5rem;
    border-radius: 50px;
    box-shadow: 0 0 5px #ccc;
    border: 1px solid #ccc;
    color: var(--gris-oscuro);
}

@media (max-width: 900px){
    div#sidebar_first {
        width: 40%;
    }
}


@media (max-width: 767px){

.chsm-diagnoses.zones .find-diagnosis h1{
    margin-top: 2rem;
}

.chsm-diagnoses.zones .find-diagnosis a {
    font-size: 1.2rem;
}
    
 .find-diagnosis{
    width: 100%;
    padding: 5rem 0 2rem;
 }

 .chsm-diagnoses.zones .find-diagnosis {
    padding: 0 0 2rem 0;
}

 .view-chsm-diagnoses-index .views-row {
    margin: 2rem 0;
    padding: 2rem;
 }

 .chsm-diagnosis .info, .chsm-diagnosis .image{
    width: 50%;
 }

 div#sidebar_first {
    width: 100%;
}

.main-content{
    padding: 2rem 0;
}
}