.view {
    width: 100%;

    &.is-radius {
        .views-view-responsive-grid__item, .row {
            
            img {
                border-radius: var(--bulma-radius-large);
                box-shadow: var(--bulma-shadow);
                transition: all .2s linear;
            }

            &:hover {
                img {
                    transform: scale(1.01);
                }
            }
        }
    }
}

.view-content {
    overflow: visible;
}

.view-content table {
    width: 100%;
}

.views-form {
    width: 100%;
}

.view-filters {
    margin-bottom: 3em;
}

.views-exposed-form {
    
    border: 1px solid var(--bulma-border);
    border-radius: var(--bulma-radius-large);
    padding-top: 0.8em;
    padding-bottom: 0.8em;

    button, input, select {
        border: 1px solid var(--bulma-border-active);
        box-shadow: none;
    }
    .buttons {
       margin-bottom: 1rem;
       align-content: flex-end;
    }
}

.view-row-linked a, .views-view-responsive-grid__item-inner {
    text-decoration: none;
    color: var(--bulma-body-color);

    .title {  color: var(--bulma-text); }

    &:hover {
        .title {
            color: var(--bulma-link);
        }

        img {
            transform: scale(1.03);
        }
    }
}


.views-view-responsive-grid--horizontal {
    padding: 0 0 2em;

    &:not(:first-child) {
            margin-top: 30px;
    }
    .views-view-responsive-grid__item {
        position: relative;
    }
}

.layout-component:has(.exposed-form-columns) {
    .views-exposed-form .field.form-item-title {
         width: 100%;
         input {
            max-width: 100%!important;
         }
    }
}

.container-radius-shadow {
    figure {
        overflow: visible;
        img {
            border-radius: var(--bulma-radius-large);
            box-shadow: var(--bulma-shadow);
        }
    }
}

.container-hover-effect {
    &:hover {
        img {
           transform: scale(1.03);
        }
        .title {
            color: var(--bulma-link);
        }
    }
}

.view-resources {
    
    .title {  color: var(--bulma-text); }

    a:hover {
        .title {
            color: var(--bulma-link);
        }
    }
    figure {
        width: 100%;
        height: 200px;
        overflow: hidden;
        position: relative;
        text-align: center;
        padding: 1em;
        background: var(--bulma-text-100);
        border-radius: var(--bulma-radius-large);
        img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            object-position: center center;
            display: block;
        }
    }
}


.view-header-course {
    .has-border.is-radius-large {
        border-radius: 30px;
    }
}