:root, [data-theme-default], [data-theme-light], [data-theme-dark], [data-theme-light-highcontrast], [data-theme-dark-highcontrast] { /* Body container settings, mostly for removing the side margins, and for applying the styles to guest pages */
--body-container-margin: 0px !important;
--body-container-radius: 0px !important;
--border-radius-large: 4px !important;
--border-radius-container-large: 4px !important;
--border-radius-rounded: 4px !important; 
--border-radius-pill: 4px !important;
--border-radius-element: 4px !important;
}

#app-navigation:not(.vue) {
  --border-radius-pill: var(--border-radius-pill) !important; /* Navigation buttons on sidebar */
}

.checkbox-radio-switch__label { /* Radio button, used mainly in settings */
  border-radius: var(--border-radius-pill) !important;
}

.list-item, .list-item-style, .action-item--single, .action-item__menutoggle{ /* For E-mail app */
    border-radius: var(--border-radius-pill) !important;
}

.envelope { /* Content part of E-mails */
  border-radius: var(--border-radius-pill) !important;
}

.fc-day-today .fc-daygrid-day-number{ /* For Calendar app */
    border-radius: var(--border-radius-pill) !important;
}

.note-card-view, .folder-card-view{ /* For Carnet app */
    border-radius: var(--border-radius-pill) !important;
}

#uploadprogressbar { /* For upload progress bar */
    border-radius: var(--border-radius-pill) 0 0 var(--border-radius-pill) !important;
}

/* For buttons, needs to be before specific button overrides (like the E-mail icon-history) */
input[type='submit'],
input[type='submit'].icon-confirm,
input[type='button'],
button,
a.button,
.button,
select {
    border-radius: var(--border-radius-pill) !important;
}

.guest-box, .body-login-container { /* Login container (requires hardcoded radius, login page overrides local variables) */
    border-radius: 4px !important;
}
 
.two-factor-provider { /* For two-factor login options */
    width: 100% !important;
}
 
/* Fix some button misalignments */
#body-login:first-of-type button[type="submit"] { /* For login button, also requires hardcoded radius */
    width: 100% !important;    
    border-radius: 4px !important;
}

.icon-history{
    border-radius: 100px !important; /* Still E-mail, reversing the border for this icon as it has an animation that would overlap */
}

/* Fix width of select items, especially for the contacts page */
.vs__selected {
    min-width: unset !important;
}

/* Used at the file navigation buttons for example */
.button-vue {
   border-radius: var(--border-radius-pill) !important;
}

/* Used on some settings panels */
.checkbox-content {
   border-radius: var(--border-radius-pill) !important;
}

/* Fix OnlyOffice app height */
#onlyofficeFrame {
  height: calc(100vh + 8px);
}

/* Used for mail settings, upper button */
.checkbox-radio-switch--button-variant-v-grouped:first-of-type {
  border-top-left-radius: 4px !important;
  border-top-right-radius: 4px !important;
}

/* Used for mail settings, lower button */
.checkbox-radio-switch--button-variant-v-grouped:last-of-type {
  border-bottom-left-radius: 4px !important; 
  border-bottom-right-radius: 4px !important;
}

/* Used for mail tags */
.tag-group__bg {
  border-radius: unset !important;
}