.custom-select, .custom-select small,
.custom-textfield, .custom-textfield-small,
.custom-textfield-smaller, .custom-textarea,
.k-multiselect-wrap {
    border-color: #161615;
    color: #161615;
    accent-color: auto !important;
    min-height: 38px;
}

.k-multiselect.k-state-focused {
    box-shadow: none;
    border: 1px solid #161615;
}

:focus:is(.custom-select, .custom-select small,
.custom-textfield, .custom-textfield-small,
.custom-textfield-smaller, .custom-textarea) {
    outline: auto;
}

.custom-form-field {
    height: auto;
    min-height: 30px;
}

    .custom-form-field:after {
        content: '';
        display: table;
        clear: both;
    }

:not(.row) > .custom-form-field:has(> [class*="col-"]) {
    margin-inline: -15px;
}

.k-state-selected,
.k-state-hover,
.k-button:hover {
    border: 1px solid #497593 !important;
    background-color: #497593 !important;
    background-image: none;
    box-shadow: none !important;
}

.wcag .chzn-container-active .chzn-single, .wcag .chzn-container-active .hzn-drop, .wcag .chzn-container-active .chzn-choices, .wcag .custom-select:focus, .wcag .custom-select-opendata:focus, .wcag .custom-select-opendata-formaat:focus, .wcag .custom-textfield:focus, .wcag .custom-textfield-small:focus, .wcag .custom-textfield-smaller:focus, .wcag .custom-textarea:focus, .wcag div.token-input-dropdown {
    outline-color: #497593 !important;
    border-color: #497593 !important;
}

.k-state-focused {
    box-shadow: inset 0 0 0 1px #497593 !important;
}


/* Styling verhalenmodule
 Om de verhalenmpodule weer toonbaar te krijgen, gemaakt voor VZM-906, maar ze blijken geen verhalenmodule te hebben. 
 We checken het wel in want het is zonde weg te gooien, wellicht willen ze in de toekomst wel verhalenmodule */

.custom-form-field-label {
    font-size: clamp(14px, 4vw, 18px);
}

.Grid {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

.Grid.no-tabs {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.custom-form-field {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.col-12 {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.nav-pills > li,
.nav-tabs > li,
.TableTabs > li,
.nav-pills .nav-item,
.nav-tabs .nav-item,
.TableTabs .nav-item,
.card-header-pills.nav-pills > li,
.card-header-pills.nav-pills .nav-item {
    float: none !important;
}

.nav-pills,
.nav-tabs,
.TableTabs,
.card-header-pills.nav-pills {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    float: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
    list-style: none !important;
    text-align: left !important;
    direction: ltr !important;
    justify-content: flex-start !important;
}

.nav-item {
    float: none !important;
}

.card,
.card-header {
    text-align: left !important;
    direction: ltr !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.card-body,
.tab-content,
.tab-pane {
    text-align: left !important;
    direction: ltr !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    padding: 15px !important;
}

.card-text input[type="file"] {
    all: revert;
    display: block !important;
    font-size: inherit;
}

.card-text input[type="file"]::file-selector-button {
    all: revert;
}

.TableForm {
    text-align: left !important;
    direction: ltr !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 15px 15px 15px !important;
}

.Grid {
    text-align: left !important;
    direction: ltr !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 15px !important;
}

.nav-link {
    text-align: left !important;
    direction: ltr !important;
}

.RelationList > p {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.RelationList .card {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.RelationList .card-header {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.RelationList .nav-tabs,
.RelationList .nav-pills {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.RelationList .tab-content {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.RelationList .tab-pane {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.RelationList .card-body {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.RelationList .custom-table.relation-table {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

.RelationList .nav-pills .nav-link.active,
.RelationList .nav-tabs .nav-link.active,
.RelationList .nav-pills .nav-item .nav-link.active,
.RelationList .nav-tabs .nav-item .nav-link.active {
    background-color: #497593 !important;
    color: #fff !important;
}
/* Einde styling verhalenmodule */
