/*-
 * #%L
 * Pollen :: UI RiotJs
 * %%
 * Copyright (C) 2009 - 2025 Code Lutin
 * %%
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 * 
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 * 
 * You should have received a copy of the GNU Affero General Public License
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 * #L%
 */
/**************************************************************
*****  Reprise de blaze CSS    ********************************
***************************************************************/
.c-button{
    border:1px solid transparent;
    background-color:var(--default);
    color:var(--background);
    display:inline;
    max-width:100%;
    margin:0;
    padding:.5em;
    border-radius:4px;
    outline:0;
    font-family:inherit;
    font-size:1em;
    line-height:normal;
    text-align:center;
    text-decoration:none;
    text-overflow:ellipsis;
    white-space:nowrap;
    cursor:pointer;
    overflow:hidden;
    vertical-align:middle;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
}

.c-button.c-button--active {
    background-color:var(--active);
}

.c-button:not(:disabled):hover {
    background-color:var(--btn-hover);
}

.c-button:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button:not(:disabled):active {
    background-color:var(--active);
}

.c-button:disabled {
    cursor:not-allowed;
    opacity:.5;
}

.c-button--close {
    border:1px solid transparent;
    color:inherit;
    position:absolute;
    right:.5em;
    padding:0;
    outline:0;
    font-size:1.4em;
    font-weight:700;
    line-height:1;
}


.c-button--close,.c-button--close.c-button--active {
    background-color:transparent;
}

.c-button--close:not(:disabled):hover {
    background-color:hsla(0,0%,9%,0);
}

.c-button--close:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--close:not(:disabled):active {
    background-color:transparent;
}

.c-button--block {
    display:inline-block;
    width:100%;
}

.c-button--rounded {
    border-radius:30em;
}

.c-button--brand {
    border:1px solid transparent;
    background-color:var(--brand);
    color:var(--background);
}

.c-button--brand.c-button--active {
    background-color:var(--brand-active);
}

.c-button--brand:not(:disabled):hover {
    background-color:var(--brand-hover);
}

.c-button--brand:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--brand:not(:disabled):active {
    background-color:var(--brand-active);
}

.c-button--info {
    border:1px solid transparent;
    background-color:var(--info);
    color:var(--background);
}

.c-button--info.c-button--active {
    background-color:var(--info-active);
}

.c-button--info:not(:disabled):hover {
    background-color:var(--info-hover);
}

.c-button--info:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--info:not(:disabled):active {
    background-color:var(--info-active);
}

.c-button--warning {
    border:1px solid transparent;
    background-color:var(--warning);
    color:var(--background);
}

.c-button--warning.c-button--active {
    background-color:var(--warning-active);
}

.c-button--warning:not(:disabled):hover {
    background-color:var(--warning-hover);
}

.c-button--warning:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--warning:not(:disabled):active {
    background-color:var(--warning-active);
}

.c-button--success {
    border:1px solid transparent;
    background-color:var(--success);
    color:var(--background);
}

.c-button--success.c-button--active {
    background-color:var(--success-active);
}

.c-button--success:not(:disabled):hover {
    background-color:var(--success-hover);
}

.c-button--success:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--success:not(:disabled):active {
    background-color:var(--success-active);
}

.c-button--error {
    border:1px solid transparent;
    background-color:var(--error);
    color:var(--background);
}

.c-button--error.c-button--active {
    background-color:var(--error-active);
}

.c-button--error:not(:disabled):hover {
    background-color:var(--error-hover);
}

.c-button--error:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--error:not(:disabled):active {
    background-color:var(--error-active);
}

.c-button--ghost {
    border:1px solid var(--default);
    background-color:transparent;
    color:var(--default);
}

.colors-main-invers .c-button--ghost,
.colors-main-invers .c-button--ghost-brand,
.colors-main-invers .c-button--ghost-info,
.colors-main-invers .c-button--ghost-warning,
.colors-main-invers .c-button--ghost-success,
.colors-main-invers .c-button--ghost-error {
    background-color: var(--background);
}

.c-button--ghost.c-button--active {
    border-color:var(--active);
    background-color:var(--active);
    color:var(--background);
}

.c-button--ghost:not(:disabled):hover {
    background-color:var(--default);
    color:var(--background);
}

.c-button--ghost:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--ghost:not(:disabled):active {
    border-color:var(--active);
    background-color:var(--active);
    color:var(--background);
}

.c-button--ghost-brand {
    border:1px solid var(--brand);
    background-color:transparent;
    color:var(--brand);
}

.c-button--ghost-brand.c-button--active {
    border-color:var(--brand-active);
    background-color:var(--brand-active);
    color:var(--background);
}

.c-button--ghost-brand:not(:disabled):hover {
    background-color:var(--brand);
    color:var(--background);
}

.c-button--ghost-brand:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--ghost-brand:not(:disabled):active {
    border-color:var(--brand-active);
    background-color:var(--brand-active);
    color:var(--background);
}

.c-button--ghost-info {
    border:1px solid var(--info);
    background-color:transparent;
    color:var(--info);
}

.c-button--ghost-info.c-button--active {
    border-color:var(--info-active);
    background-color:var(--info-active);
    color:var(--background);
}

.c-button--ghost-info:not(:disabled):hover {
    background-color:var(--info);
    color:var(--background);
}

.c-button--ghost-info:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--ghost-info:not(:disabled):active {
    border-color:var(--info-active);
    background-color:var(--info-active);
    color:var(--background);
}

.c-button--ghost-warning {
    border:1px solid var(--warning);
    background-color:transparent;
    color:var(--warning);
}

.c-button--ghost-warning.c-button--active {
    border-color:var(--warning-active);
    background-color:var(--warning-active);
    color:var(--background);
}

.c-button--ghost-warning:not(:disabled):hover {
    background-color:var(--warning);
    color:var(--background);
}

.c-button--ghost-warning:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--ghost-warning:not(:disabled):active {
    border-color:var(--warning-active);
    background-color:var(--warning-active);
    color:var(--background);
}

.c-button--ghost-success {
    border:1px solid var(--success);
    background-color:transparent;
    color:var(--success);
}

.c-button--ghost-success.c-button--active {
    border-color:var(--success-active);
    background-color:var(--success-active);
    color:var(--background);
}

.c-button--ghost-success:not(:disabled):hover {
    background-color:var(--success);
    color:var(--background);
}

.c-button--ghost-success:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--ghost-success:not(:disabled):active {
    border-color:var(--success-active);
    background-color:var(--success-active);
    color:var(--background);
}

.c-button--ghost-error {
    border:1px solid var(--error);
    background-color:transparent;
    color:var(--error);
}

.c-button--ghost-error.c-button--active {
    border-color:var(--error-active);
    background-color:var(--error-active);
    color:var(--background);
}

.c-button--ghost-error:not(:disabled):hover {
    background-color:var(--error);
    color:var(--background);
}

.c-button--ghost-error:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-button--ghost-error:not(:disabled):active {
    border-color:var(--error-active);
    background-color:var(--error-active);
    color:var(--background);
}

.c-button__icon-left {
    padding-right:.5em;
}

.c-button__icon-right {
    padding-left:.5em;
}

.c-input-group {
    display:-ms-flexbox;
    display:flex;
}

.c-input-group .c-button {
    border-radius:0;
}

.c-input-group .c-button:not(:first-child) {
    border-left-width:0;
}

.c-input-group .c-button:first-child {
    border-top-left-radius:4px;
    border-bottom-left-radius:4px;
}

.c-input-group .c-button:last-child {
    border-top-right-radius:4px;
    border-bottom-right-radius:4px;
}

.c-input-group .o-field {
    -ms-flex:1;
    flex:1;
}

.c-input-group .o-field .c-field {
    border-radius:0;
}

.c-input-group .o-field:not(:first-child) .c-field {
    border-left-width:0;
}

.c-input-group .o-field:first-child .c-field {
    border-top-left-radius:4px;
    border-bottom-left-radius:4px;
}

.c-input-group .o-field:last-child .c-field {
    border-top-right-radius:4px;
    border-bottom-right-radius:4px;
}

.c-input-group .o-field--fixed {
    -ms-flex:0 1 auto;
    flex:0 1 auto;
}

.c-input-group--rounded .c-button:first-child {
    border-top-left-radius:30em;
    border-bottom-left-radius:30em;
}

.c-input-group--rounded .c-button:last-child {
    border-top-right-radius:30em;
    border-bottom-right-radius:30em;
}

.c-input-group--rounded .o-field:first-child .c-field {
    border-top-left-radius:30em;
    border-bottom-left-radius:30em;
}

.c-input-group--rounded .o-field:last-child .c-field {
    border-top-right-radius:30em;
    border-bottom-right-radius:30em;
}

.c-input-group--rounded-left .c-button:first-child,.c-input-group--rounded-left .o-field:first-child .c-field {
    border-top-left-radius:30em;
    border-bottom-left-radius:30em;
}

.c-input-group--rounded-right .c-button:last-child,.c-input-group--rounded-right .o-field:last-child .c-field {
    border-top-right-radius:30em;
    border-bottom-right-radius:30em;
}

.c-input-group--stacked {
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}

.c-input-group--stacked .c-button:not(:first-child),.c-input-group--stacked .o-field:not(:first-child) .c-field {
    border-left-width:1px;
}

.c-input-group--stacked .c-button,.c-input-group--stacked .o-field {
    -ms-flex:0 0 100%;
    flex:0 0 100%;
    max-width:100%;
    margin-left:0;
}

.c-input-group--stacked .c-button:not(:first-child) {
    border-top:0;
}

.c-input-group--stacked .c-button:not(:first-child):not(:last-child) {
    border-radius:0;
}

.c-input-group--stacked .c-button:first-child {
    border-radius:4px 4px 0 0;
}

.c-input-group--stacked .c-button:last-child {
    border-radius:0 0 4px 4px;
}

.c-input-group--stacked .o-field:not(:first-child) .c-field {
    border-top:0;
}

.c-input-group--stacked .o-field:not(:first-child):not(:last-child) .c-field {
    border-radius:0;
}

.c-input-group--stacked .o-field:first-child .c-field {
    border-radius:4px 4px 0 0;
}

.c-input-group--stacked .o-field:last-child .c-field {
    border-radius:0 0 4px 4px;
}

.o-field {
    position:relative;
}

.o-field .c-field--success~.c-icon {
    color:var(--success);
}

.o-field .c-field--error~.c-icon {
    color:var(--error);
}

.o-field .c-field:disabled~.c-icon {
    color:var(--default);
}

.o-field .c-icon {
    position:absolute;top:50%;
    transform:translateY(-50%);
    color:var(--default);
}

.o-field--icon-right .c-field+.c-icon {
    right:.5em;
}

.o-field--icon-right .c-field {
    padding-right:2em;
}

.o-field--icon-left .c-icon:first-child {
    left:.5em;
}

.o-field--icon-left .c-field {
    padding-left:2em;
}

.c-label {
    padding:1em 0;
}

.c-field {
    display:block;
    width:100%;
    margin:0;
    padding:.5em;
    border:1px solid var(--default);
    border-radius:4px;
    outline:0;
    background-color:var(--background);
    font-family:inherit;
    font-size:1em;
    font-weight:400;
    resize:vertical;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}

.c-field:focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);

}

select.c-field {
    cursor:pointer;
}

select.c-field:not([multiple]) {
    padding-right:1em;
    background:url("data:image/png;base64,R0lGODlhDwAUAIABAAAAAP///yH5BAEAAAEALAAAAAAPABQAAAIXjI+py+0Po5wH2HsXzmw//lHiSJZmUAAAOw==") no-repeat 99% 50%;
}

.c-field input {
    margin-right:.125em;
    outline:0;
    font-size:1em;
}

.c-field--label {
    margin:.5em 0 0;
}

.c-field--error {
    border-color:var(--error);
    color:var(--error);
}

.c-field--success {
    border-color:var(--success);
    color:inherit;
}

.c-field--choice {
    border:0;
    border-radius:0;
    background-color:transparent;
}

.c-field--disabled,
.c-field:disabled {
    color:var(--default);
    cursor:not-allowed;
    border-color:var(--default);
    background-color:var(--disabled);
}

.c-field--disabled.c-field--choice,
.c-field:disabled.c-field--choice {
    background-color:transparent;
}

.c-field input:disabled {
    color:var(--default);
    cursor:not-allowed;
}

.o-form-element {
    position:relative;
    padding:1em 0
}

.o-form-element .c-label:first-child {
    padding:0 0 .5em
}

.c-toggle {
    display:-ms-flexbox;
    display:flex;
    -ms-flex-align:center;
    align-items:center;
    width:auto;
    cursor:pointer;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
}

.c-toggle input:not(:checked)+.c-toggle__track {
    background-color:var(--disabled);
}

.c-toggle input:not(:checked)+.c-toggle__track .c-toggle__handle {
    transform:translateZ(0);
}

.c-toggle input:disabled+.c-toggle__track,
.c-toggle input:disabled+.c-toggle__track .c-toggle__handle {
    background-color:var(--disabled);
    cursor:not-allowed;
}

.c-toggle--brand .c-toggle__track {
    background-color:var(--brand);
}

.c-toggle--info .c-toggle__track {
    background-color:var(--info);
}

.c-toggle--warning .c-toggle__track {
    background-color:var(--warning);
}

.c-toggle--success .c-toggle__track {
    background-color:var(--success);
}

.c-toggle--error .c-toggle__track {
    background-color:var(--error);
}

.c-toggle input {
    display:none;
}

.c-toggle__track {
    -ms-flex:1;
    flex:1;
    padding-right:1em;
    padding-left:1em;
    -ms-flex:0 1 auto;
    flex:0 1 auto;
    background-color:var(--default);
    position:relative;
    width:1em;
    height:.5em;
    margin:0 .5em;
    border-radius:30em;
}

.c-toggle__handle {
    position:absolute;
    top:-.25em;
    left:0;
    width:1em;
    height:1em;
    transform:translateX(100%);
    border-radius:30em;
    background-color:var(--toggle);
    box-shadow:0 1px 4px -1px var(--toggle-shadow);
}

.o-modal {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    display:block;
    width:80%;
    border:0 solid var(--default);
    border-radius:4px;
    background-color:var(--background);
    overflow:hidden;
    z-index:1;
}

.o-modal .c-card {
    background-color:transparent;
    box-shadow:none;
}

.o-modal .c-card__body {
    position:relative;
}

.c-card {
    padding:0;
    list-style:none;
    display:block;
    border-radius:4px;
    background-color:var(--background);
    box-shadow:0 0 1px var(--shadow);
    overflow:hidden;
}

.c-card>.o-image:not(:first-child) {
    padding:1em 0 0;
}

.c-card+.c-card {
    margin:.5em 0 0;
}

.c-card__header {
    padding:.5em .5em 0;
}

.c-card__header .c-heading {
    padding:0;
}

.c-card__body,.c-card__footer,.c-card__item {
    padding:.5em;
}

.c-card__item+.c-card__footer--block {
    padding:0;
}

.c-card__footer--block {
    padding:.5em 0 0;
}

.c-card__footer--block .c-input-group .c-button:first-child {
    border-top-left-radius:0;
    border-bottom-left-radius:0;
}

.c-card__footer--block .c-input-group .c-button:last-child {
    border-top-right-radius:0;
    border-bottom-right-radius:0;
}

.c-card__item:not(:last-child) {
    border-bottom:1px solid rgba(202,212,216,.5);
}

.c-card--accordion label.c-card__item {
    display:block;
    position:relative;
    width:100%;
    padding-left:2em;
    cursor:pointer;
}

.c-card--accordion label.c-card__item:before {
    position:absolute;
    left:.75em;
    content:"+";
}

.c-card--accordion>input,.c-card--accordion>input+.c-card__item+.c-card__item {
    display:none;
}

.c-card--accordion>input:checked+.c-card__item+.c-card__item {
    display:block;
}

.c-card--accordion>input:checked+.c-card__item:before {
    transform:rotate(45deg);
}

.c-card--menu {
    display:block;
    width:100%;
    max-height:280px;
    margin:.5em 0 0;
    z-index:1;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
}

.c-card--grouped .c-card__item:not(:last-child) {
    border-bottom:0;
}

.c-card__divider {
    height:1px;
    background-color:var(--defaut);
    overflow:hidden;
}

.c-card__item--divider {
    background-color:var(--defaut);
    color:var(--background);
    font-weight:700;
}

.c-card__item--brand {
    background-color:var(--brand);
    color:var(--background);
}

.c-card__item--info {
    background-color:var(--info);
    color:var(--background);
}

.c-card__item--warning {
    background-color:var(--warning);
    color:var(--background);
}

.c-card__item--success {
    background-color:#4caf50;
    color:var(--background);
}

.c-card__item--error {
    background-color:var(--error);
    color:var(--background);
}

.c-card__item--disabled {
    cursor:not-allowed;
    opacity:.6;
}

.c-card--accordion label.c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover,.c-card--menu .c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover {
    background-color:var(--disabled);
    cursor:pointer;
}

.c-card--accordion label.c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--brand,.c-card--menu .c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--brand {
    background-color:var(--brand-over);
}

.c-card--accordion label.c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--info,.c-card--menu .c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--info {
    background-color:var(--info-hover);
}

.c-card--accordion label.c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--warning,.c-card--menu .c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--warning {
    background-color:var(--warbning-hover);
}

.c-card--accordion label.c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--success,.c-card--menu .c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--success {
    background-color:var(--success-hover);
}

.c-card--accordion label.c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--error,.c-card--menu .c-card__item:not(.c-card__item--disabled):not(.c-card__item--divider):hover.c-card__item--error {
    background-color:var(--error-hover);
}

.c-card--accordion>input:checked+.c-card__item,.c-card__item--active {
    background-color:rgba(202,212,216,.5);
    font-weight:700;
}

.c-card--accordion>input:checked+.c-card__item.c-card__item--brand,.c-card__item--active.c-card__item--brand {
    background-color:var(--brand-active);
}

.c-card--accordion>input:checked+.c-card__item.c-card__item--info,.c-card__item--active.c-card__item--info {
    background-color:var(--info-active);
}

.c-card--accordion>input:checked+.c-card__item.c-card__item--warning,.c-card__item--active.c-card__item--warning {
    background-color:var(--warning-active);
}

.c-card--accordion>input:checked+.c-card__item.c-card__item--success,.c-card__item--active.c-card__item--success {
    background-color:var(--success-active);
}

.c-card--accordion>input:checked+.c-card__item.c-card__item--error,.c-card__item--active.c-card__item--error {
    background-color:var(--error-active);
}

.c-overlay {
    display:block;
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    background-color: var(--overlay);
    z-index:1;
}

.c-hint {
    position:absolute;
    padding:0 .5em;
    transform:scale(.8);
    transform-origin:top left;
    color:var(--active);
    font-size:1em;
    opacity:0;
    pointer-events:none;
}

.c-field:focus~.c-hint,
.c-hint--static,
.c-label__field:focus~.c-hint {
    transform:scale(.9);opacity:1;
}

.c-hint--success {
    color:var(--success);
}

.c-hint--error {
    color:var(--error);
}

.c-alerts {
    display:block;
    position:absolute;
    width:250px;
    max-height:100%;
    background-color:transparent;
    z-index:1;
    overflow-y:auto
}

.c-alert {
    background-color:var(--default);
    color:var(--background);
    position:relative;
    margin:0 0 1em;
    padding:1em 3em 1em 1em;
    border-radius:4px;
}

.c-alert--brand {
    background-color:var(--brand);
    color:var(--background);
}

.c-alert--info {
    background-color:var(--info);
    color:var(--background);
}

.c-alert--warning {
    background-color:var(--warning);
    color:var(--background);
}

.c-alert--success {
    background-color:var(--success);
    color:var(--background);
}

.c-alert--error {
    background-color:var(--error);
    color:var(--background);
}

.c-pagination {
    display:block;
    width:100%;
    padding:1em;
    font-size:.83em;
    text-align:center;
}

.c-pagination__controls {
    display:inline-block;
    text-align:center;
}

.c-pagination__controls--backward {
    float:left;
    text-align:left;
}

.c-pagination__controls--forward {
    float:right;
    text-align:right;
}

.c-pagination__control,.c-pagination__page {
    border:1px solid transparent;
    background-color: var(--default);
    color: var(--background);
    display:inline;
    max-width:100%;
    margin:0;
    padding:.5em;
    border-radius:4px;
    outline:0;
    font-family:inherit;
    font-size:1em;
    line-height:normal;
    text-align:center;
    text-decoration:none;
    text-overflow:ellipsis;
    white-space:nowrap;
    cursor:pointer;
    overflow:hidden;
    vertical-align:middle;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    border:1px solid var(--brand);
    background-color:transparent;
    color: var(--brand);
    min-width:2.4em;
    border-radius:30em;
}

.c-pagination__control.c-button--active,.c-pagination__page.c-button--active {
    background-color:var(--active);
}

.c-pagination__control:not(:disabled):hover,.c-pagination__page:not(:disabled):hover {
    background-color:var(--btn-hover);
}

.c-pagination__control:not(:disabled):active,.c-pagination__page:not(:disabled):active {
    background-color:var(--active);
}

.c-pagination__control:disabled,.c-pagination__page:disabled {
    cursor:not-allowed;
    opacity:.5;
}

.c-pagination__control.c-button--active,.c-pagination__page.c-button--active {
    border-color: var(--brand-active);
    background-color: var(--brand-active);
    color: var(--background);
}

.c-pagination__control:not(:disabled):hover,.c-pagination__page:not(:disabled):hover {
    background-color: var(--brand);
    color: var(--background);
}

.c-pagination__control:not(:disabled):focus,.c-pagination__page:not(:disabled):focus {
    border-color: var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-pagination__control:not(:disabled):active,.c-pagination__page:not(:disabled):active {
    border-color: var(--brand-active);
    background-color: var(--brand-active);
    color: var(--background);
}

.c-pagination__page--current {
    background-color: var(--brand);
    color: var(--background);
}

.c-pagination__ellipsis {
    padding:0 1em;
}
.c-code {
    margin:-.125em;
    padding:.25em .25em .125em;
    background-color: var(--code);
    color: var(--code-text);
    display:inline;
    font-family:Consolas,Andale Mono WT,Andale Mono,Lucida Console,Lucida Sans Typewriter,DejaVu Sans Mono,Bitstream Vera Sans Mono,Liberation Mono,Nimbus Mono L,Monaco,Courier New,Courier,monospace;
    font-weight:400;
}

.c-code--multiline {
    display:block;
    padding:.5em 1em;
    border-radius:4px;
    white-space:pre;
    overflow-x:auto;
}

.c-calendar {
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -ms-flex-align:center;
    align-items:center;
    padding-right:.001em;
    padding-left:.001em;
    max-width:400px;
    padding:.25em;
    border:1px solid var(--default);
    border-radius:4px;
    background-color: var(--background);
    text-align:center;
    z-index:1;
}

.c-calendar__control,.c-calendar__date {
    background-color: var(--background);
    color:var(--default);
    display:inline;
    -ms-flex:0 0 14.28%;
    flex:0 0 14.28%;
    max-width:14.28%;
    margin:0;
    padding:1em .5em;
    border:1px solid transparent;
    border-radius:4px;
    outline:0;
    font-size:1em;
    cursor:pointer;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
}

.c-calendar__control.c-button--active,.c-calendar__date.c-button--active {
    background-color: var(--active);
}

.c-calendar__control:not(:disabled):hover,.c-calendar__date:not(:disabled):hover {
    background-color: var(--background);
}

.c-calendar__control:not(:disabled):focus,.c-calendar__date:not(:disabled):focus {
    border-color: var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-calendar__control:not(:disabled):active,.c-calendar__date:not(:disabled):active {
    background-color:var(--active);
}

.c-calendar__header {
    -ms-flex:1;
    flex:1;
    -ms-flex:0 0 70%;
    flex:0 0 70%;
    max-width:70%;
}

.c-calendar__day,.c-calendar__header {
    padding-right:1em;
    padding-left:1em;
    padding-right:.001em;
    padding-left:.001em;
    padding:.5em 0;
}

.c-calendar__day {
    -ms-flex:1;
    flex:1;
    -ms-flex:0 0 14.28%;
    flex:0 0 14.28%;
    max-width:14.28%;
    font-weight:700;
}

.c-calendar__date:hover {
    border:1px solid var(--default);
}

.c-calendar__date--in-month {
    color: var(--default);
}

.c-calendar__date--today {
    border-color: var(--info);
}

.c-calendar__date--selected,.c-calendar__date--selected:hover {
    border:1px solid transparent;
    background-color:var(--brand);
    color: var(--background);
    border-color:var(--brand);
}

.c-calendar__date--selected.c-button--active,.c-calendar__date--selected:hover.c-button--active {
    background-color: var(--brand-active);
}

.c-calendar__date--selected:hover:not(:disabled):hover,.c-calendar__date--selected:not(:disabled):hover {
    background-color:var(--brand-hover);
}

.c-calendar__date--selected:hover:not(:disabled):focus,.c-calendar__date--selected:not(:disabled):focus {
    border-color:var(--focus);
    box-shadow:inset 0 0 0 2px var(--shadow);
}

.c-calendar__date--selected:hover:not(:disabled):active,.c-calendar__date--selected:not(:disabled):active {
    background-color: var(--brand-active);
}

.u-super {
    font-size:2em;
}

.u-xlarge {
    font-size:1.5em;
}

.u-large {
    font-size:1.17em;
}

.u-medium {
    font-size:1em;
}

.u-small {
    font-size:.83em;
}

.u-xsmall{
    font-size:.67em;
}

.c-heading,
.c-heading__sub {
    margin:0;
    padding:1em 0 .5em;
    font-weight:400;
}

.c-heading__sub {
    padding:0;
    font-size:.8em;
    opacity:.6;
}

h1.c-heading {
    font-size:2em;
}

h2.c-heading {
    font-size:1.5em;
}

h3.c-heading {
    font-size:1.17em;
}

h4.c-heading {
    font-size:1em;
}

h5.c-heading {
    font-size:.83em;
}

h6.c-heading{
    font-size:.67em;
}

.o-fieldset,
.o-fieldset.c-list {
    display:block;
    width:100%;
    margin:.5em 0;
    padding:0;
    border:0;
}

.o-fieldset__legend {
    display:block;
    width:100%;
    padding:1em 0;
    cursor:pointer;
    padding:.25em 0;
}

.o-form-element {
    position:relative;
    padding:1em 0;
}

.o-form-element .c-label:first-child {
    padding:0 0 .5em;
}

.c-badge {
    border:1px solid var(--default);
    background-color:var(--default);
    color:var(--background);
    display:inline-block;
    margin:0;
    padding:.25em .5em;
    border-radius:4px;
    font-size:.8em;
    font-weight:700;
    line-height:1.2;
}

.c-badge.c-badge--ghost {
    border:1px solid var(--default);
    background-color:transparent;
    color:var(--default);
}

.c-badge--rounded {
    border-radius:30em;
}

.c-badge--brand {
    border:1px solid var(--brand);
    background-color:var(--brand);
    color:var(--background);
}

.c-badge--brand.c-badge--ghost {
    border:1px solid var(--brand);
    background-color:transparent;
    color:var(--brand);
}

.c-badge--info {
    border:1px solid var(--info);
    background-color:var(--info);
    color:var(--background);
}

.c-badge--info.c-badge--ghost {
    border:1px solid var(--info);
    background-color:transparent;
    color:var(--info);
}

.c-badge--warning {
    border:1px solid var(--warning);
    background-color:var(--warning);
    color:var(--background);
}

.c-badge--warning.c-badge--ghost {
    border:1px solid var(--warning);
    background-color:transparent;
    color:var(--warning);
}

.c-badge--success {
    border:1px solid var(--success);
    background-color:var(--success);
    color:var(--background);
}

.c-badge--success.c-badge--ghost {
    border:1px solid var(--success);
    background-color:transparent;
    color:var(--success);
}

.c-badge--error {
    border:1px solid var(--error);
    background-color:var(--error);
    color:var(--background);
}

.c-badge--error.c-badge--ghost {
    border:1px solid var(--error);
    background-color:transparent;
    color:var(--error);
}

.c-breadcrumbs {
    display:block;
    margin:0;
    padding:0;
    list-style:none;
}

.c-breadcrumbs__crumb {
    display:inline-block;
    width:auto;
    padding:0;
}

.c-breadcrumbs__crumb:not(:last-child):after {
    padding:0 .5em;
    color: var(--link);
    content:"/";
}

.c-tooltip {
    position:relative;
    overflow:visible;
}

.c-tooltip:after,.c-tooltip:before {
    visibility:hidden;
    z-index:1;
}

.c-tooltip:before {
    position:absolute;
    border:.6em solid transparent;
    content:"";
}

.c-tooltip:after {
    position:absolute;
    padding:.25em .5em;
    border:1px solid var(--tooltip-background);
    border-radius:4px;
    background-color:var(--tooltip-background);
    color:var(--tooltip-color);
    line-height:1.45;
    white-space:nowrap;
    content:attr(aria-label);
    visibility:hidden;
}

.c-tooltip:hover:after,.c-tooltip:hover:before {
    visibility:visible;
}

.c-tooltip--top:before {
    top:0;
    left:50%;
    transform:translate(-50%,-1em);
    border-top-color:var(--tooltip-background);
}

.c-tooltip--top:after {
    top:0;
    left:50%;
    transform:translate(-50%,-3em);
}

.c-tooltip--right:before {
    top:50%;
    left:100%;
    transform:translateY(-50%);
    border-right-color:var(--tooltip-background);
}

.c-tooltip--right:after {
    top:50%;
    left:100%;
    transform:translate(1em,-50%);
}

.c-tooltip--bottom:before {
    bottom:0;
    left:50%;
    transform:translate(-50%,1em);
    border-bottom-color:var(--tooltip-background);
}

.c-tooltip--bottom:after {
    bottom:0;
    left:50%;
    transform:translate(-50%,3em);
}

.c-tooltip--left:before {
    top:50%;
    right:100%;
    transform:translateY(-50%);
    border-left-color:var(--tooltip-background);
}

.c-tooltip--left:after {
    top:50%;
    right:100%;
    transform:translate(-1em,-50%);
}

.c-required {
  color: red;
}