@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
:root {

    /***Logo's***/
    --logo-standard: url("../../custom/theme/assets/images/ECE-logo.jpg");
    --logo-alt: url("../../custom/theme/assets/images/ECE-logo.jpg");

    /***Header Image (Van toepassing op visual.twig)***/
    /* --header-image: url("../../custom/theme/assets/images/header_background.jpg"); */

    /***Brand Colors***/
    --color-brand-primary: #009640;
    --color-brand-primary-rgb: 0, 150, 64;
    --color-brand-secondary: #E99FC5;
    --color-brand-tertiary: #9E614D;
    --color-brand-accent: #E9E6BB;
    --color-brand-light: #F7F5E5;
    --color-brand-dark: #00421C;
    --text-color: #4B5555;
    --color-message-success: #009640;

    /***Font***/
    --font-family: 'Roboto', sans-serif;
    --font-family-title: "Roboto Condensed", sans-serif;
    /* --font-size: 1.6rem; */
    --border-radius-s: 4px;
    --border-radius-m: 20px;
    --border-radius-l: 40px;
    --border-top-left-radius-s: var(--border-radius-s);
    --border-top-right-radius-s: var(--border-radius-s);
    --border-bottom-right-radius-s: var(--border-radius-s);
    --border-bottom-left-radius-s: var(--border-radius-s);
    --border-top-left-radius-m: var(--border-radius-m);
    --border-top-right-radius-m: var(--border-radius-m);
    --border-bottom-right-radius-m: var(--border-radius-m);
    --border-bottom-left-radius-m: var(--border-radius-m);
    --border-top-left-radius-l: var(--border-radius-l);
    --border-top-right-radius-l: var(--border-radius-l);
    --border-bottom-right-radius-l: var(--border-radius-l);
    --border-bottom-left-radius-l: var(--border-radius-l);
    /**** Voor meer settings zie: /themes/base/assets/style/variables.css ****/
}
html{
    color: var(--text-color);
    background-color: var(--color-brand-light);
}
h1, h2, h3, h4, h5, h6 {
  font-family: "Roboto Condensed", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  color: var(--color-brand-primary);
}

p {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
    color: var(--text-color)
}
body.indevelopment .container-fluid .sidebar{
    background-color: var(--color-brand-dark);
}
.container-fluid .sidebar {
    background-color: var(--color-brand-dark);
}
.container-fluid .sidebar h3{
    color: var(--color-brand-light)
}
.multistep_vertical_step .step_title {
    color: var(--color-brand-light)
}
.multistep_vertical_step.pointer--current {
    background: var(--color-brand-light);
}
.pointer--current .step_title {
    color: var(--color-brand-dark);
}
.container-fluid .poweredby a {
    font-size: var(--font-size-xxs);
    color: var(--color-brand-light);
    opacity: 0.5;
}
.floating-calculation .floating-calculation-content {
    background-color: var(--color-brand-accent);
}
select, input, .input, fieldset {
    border: 1px solid var(--color-brand-accent);

}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--color-brand-primary);
    color: white;
}
.assign-ticket--confirm-modal .ui-button.button--primary, .button--primary {
    background-color: var(--color-brand-primary);
    color: var(--color-neutral-black);
    cursor: pointer;
}
.assign-ticket--confirm-modal .ui-button.button--primary:hover, .button--primary:hover, .button-secondary:hover {
    background-color: #26A65D;
}
button, .button {
border-radius: var(--border-radius-l);
    color: var(--color-neutral-black);
}
.button:disabled {
    cursor: not-allowed;
    background-color: var(--color-brand-accent);
    color: var(--color-neutral-black);
}
.button--link {
    color: var(--color-brand-primary);
    cursor: pointer;
}
.tickets-progress .progress_container .progress_inner-circle,
.tickets-progress {
    background: var(--color-brand-light);
}
.tickets-progress .progress_container {
    width: 75%;
    height: auto;
    max-width: unset;
    aspect-ratio: 1/1;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: conic-gradient(var(--color-brand-primary) var(--percentage-degrees), var(--color-brand-accent) 0deg);
}
.button--gray {
    color: var(--color-brand-accent);
    cursor: pointer;
    background-color: transparent;
}
.menu-items li .menu-item {
    display: inline;
    color: var(--color-brand-dark);
    font-size: var(--font-size-s);
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    font-family: var(--font-family-title);
}
.sidebar-menu--item a.active {
    color: var(--color-neutral-white);
}
td.right{
    text-align: right;
}

.dataTables_filter {
    display: none;
}

.form_check {
    display: inline;
}