@import url("./dialog-component.css?version=1.1");
/** 
    @import url("https://use.typekit.net/wzo6vxi.css");
    @import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap');
    * http://meyerweb.com/eric/tools/css/reset/ 
    * v2.0 | 20110126
    * License: none (public domain)
    @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
    */

:root,
* {
    --space-unit: 1rem;
    --space-xxxxs       : calc(0.125 * var(--space-unit));
    --space-xxxs        : calc(0.25 * var(--space-unit));
    --space-xxs         : calc(0.375 * var(--space-unit));
    --space-xs          : calc(0.5 * var(--space-unit));
    --space-sm          : calc(0.75 * var(--space-unit));
    --space-md          : calc(1.25 * var(--space-unit));
    --space-lg          : calc(2 * var(--space-unit));
    --space-xl          : calc(3.25 * var(--space-unit));
    --space-xxl         : calc(5.25 * var(--space-unit));
    --space-xxxl        : calc(8.5 * var(--space-unit));
    --space-xxxxl       : calc(13.75 * var(--space-unit));
    --component-padding : var(--space-md);
    --bs-font-sans-serif: "Inter", "Helvetica Neue", Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-family-nunito: 'Nunito Sans', sans-serif;
    --font-family-inter:  'Inter', sans-serif;
    --font-family-dmsans:  'DM Sans', sans-serif;
    --font-family-soleil: soleil,sans-serif;
}

/* HTML5 display-role reset for older browsers */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

*,
::after,
::before {
    box-sizing    : border-box;
    /* font-family:  'Nunito Sans', sans-serif; */
}

.sd-classic-app :is(h1, h2, h3, h4, h5, h6) {
    margin : 0;
    padding: 0;
}

body,
html {
    position: absolute;
    left    : env(safe-area-inset-left, 0px);
    right   : env(safe-area-inset-right, 0px);
    top     : env(safe-area-inset-top, 0px);
    bottom  : env(safe-area-inset-bottom, 0px);
    contain : layout size style;
}

body {
    line-height          : 1;
    position             : fixed;
    width                : 100%;
    max-width            : 100%;
    height               : 100%;
    max-height           : 100%;
    transform            : translateZ(0);
    text-rendering       : optimizeLegibility;
    overflow             : hidden;
    touch-action         : manipulation;
    -webkit-user-drag    : none;
    -ms-content-zooming  : none;
    word-wrap            : break-word;
    overscroll-behavior-y: none;
    text-size-adjust     : none;
    margin               : 0;
    padding              : 0;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing : 0;
}


html {
    overflow: hidden;

}

body,
html {
    height        : calc(var(--vh, 1vh) * 100 - var(--offsetHeigtIOS, 0px));
    min-height    : calc(var(--vh, 1vh) * 100 - var(--offsetHeigtIOS, 0px));
    width         : 100%;
    min-width     : 100%;
    /* font-family: 'Poppins', sans-serif; */

}

svg {
    display       : inline-block;
    vertical-align: -0.1em;
}

/* 
body{
    display: flex;
    flex-direction: column;
} */
form,
body,
form {
    display       : flex;
    flex-direction: column;
    flex-wrap     : nowrap;
    flex          : 1;
    touch-action  : manipulation;
}
/* [bug-chrome executava o botao mesmo disabilitado] */
button:disabled{
    pointer-events: none!important;
    cursor: not-allowed!important;
}

/* 
    APENAS PARA RENDERIZAR A TELA QUANDO O PROGRAMA CARREGAR TODOS OS SCRIPTS
    Fara ele aparecer /var/www/html/web/padrao/hidden.php
*/
/* body{
    display: none;
} */

[hidden] {
    display: none !important;
}

.sd-not-visible {
    visibility: hidden;
}

.sd-custom-scroll

/* .table-clusterize .grid-table > footer .wrap-tools */
    {
    overflow       : auto;
    scrollbar-color: #000000c2 rgb(188, 187, 192);
    scrollbar-width: thin;
}

.table-clusterize .context-menu nav,
.table-clusterize .grid-table>footer .tools {
    visibility: visible;
}

.sd-custom-scroll::-webkit-scrollbar {
    width        : 7px;
    height       : 7px;
    border-radius: 3px;
}

.sd-custom-scroll::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.sd-custom-scroll::-webkit-scrollbar-thumb {
    background   : rgb(188, 187, 192);
    border-radius: 3px
}

.sd-custom-scroll::-webkit-scrollbar-thumb:hover {
    background: rgb(106, 105, 110);
}

.sd-classic-app,
.sd-classic-app-content,

.sd-classic-form {
    width     : 100%;
    height    : 100%;
    min-height: 0;

}

.sd-classic-app,
.sd-classic-form {
    display       : flex;
    flex-direction: column;
    overflow      : auto;


}

.sd-classic-app-content {
    display       : flex;
    flex-direction: column;

}

.sd-classic-app-content .sd-classic-vertical-tabs {
    padding              : 0.225em;
    background-color     : #e9ecf1;
    display              : flex;
    grid-template-columns: auto 1fr;
    flex                 : 1;
    overflow             : auto;
    min-height           : 50vh
}

/* .sd-classic-app-content .sd-classic-vertical-tabs {
    } */

.sd-classic-app-content .sd-classic-vertical-tabs>input[type=radio] {
    position: absolute;
    opacity : 0;
}

.sd-classic-app-content .sd-classic-vertical-tabs .sd-classic-tab-nav {
    background-color: #e9ecf1;

}

.sd-classic-app-content .sd-classic-vertical-tabs .sd-classic-tab-contents {
    border-radius   : 3px;
    background-color: #fff;
    padding         : .525em;

}



.sd-classic-tab-contents [class*=sd-classic-tab-content] {
    display   : none;
    max-height: 100%;
    overflow  : auto;


}

.sd-classic-radio-tab1:checked~.sd-classic-tab-contents>.sd-classic-tab-content1,
.sd-classic-radio-tab2:checked~.sd-classic-tab-contents>.sd-classic-tab-content2,
.sd-classic-radio-tab3:checked~.sd-classic-tab-contents>.sd-classic-tab-content3,
.sd-classic-radio-tab4:checked~.sd-classic-tab-contents>.sd-classic-tab-content4,
.sd-classic-radio-tab5:checked~.sd-classic-tab-contents>.sd-classic-tab-content5,
.sd-classic-radio-tab6:checked~.sd-classic-tab-contents>.sd-classic-tab-content6 {
    display: flex;
}

.sd-classic-radio-tab1:checked~.sd-classic-tab-aside .sd-classic-tab-nav-child1,
.sd-classic-radio-tab2:checked~.sd-classic-tab-aside .sd-classic-tab-nav-child2,
.sd-classic-radio-tab3:checked~.sd-classic-tab-aside .sd-classic-tab-nav-child3,
.sd-classic-radio-tab4:checked~.sd-classic-tab-aside .sd-classic-tab-nav-child4,
.sd-classic-radio-tab5:checked~.sd-classic-tab-aside .sd-classic-tab-nav-child5,
.sd-classic-radio-tab6:checked~.sd-classic-tab-aside .sd-classic-tab-nav-child6 {
    background-color: white;
    color           : #323035;
}

.sd-classic-radio-tab1:disabled~.sd-classic-tab-aside .sd-classic-tab-nav-child1,
.sd-classic-radio-tab2:disabled~.sd-classic-tab-aside .sd-classic-tab-nav-child2,
.sd-classic-radio-tab3:disabled~.sd-classic-tab-aside .sd-classic-tab-nav-child3,
.sd-classic-radio-tab4:disabled~.sd-classic-tab-aside .sd-classic-tab-nav-child4,
.sd-classic-radio-tab5:disabled~.sd-classic-tab-aside .sd-classic-tab-nav-child5,
.sd-classic-radio-tab6:disabled~.sd-classic-tab-aside .sd-classic-tab-nav-child6 {
    opacity: .3;
    
}


.sd-classic-tab-aside .sd-classic-tab-nav-child6 .svg-inline--fa .fa-secondary {
    color: #7be096
}


.sd-kbd {
    -moz-border-radius   : 3px;
    -moz-box-shadow      : 0 1px 0 rgba(0, 0, 0, 0.2), 0 0 0 2px #fff inset;
    -webkit-border-radius: 3px;
    -webkit-box-shadow   : 0 1px 0 rgb(0 0 0 / 20%), 0 0 0 2px #fff inset;
    background-color     : #f7f7f7;
    border               : 1px solid #ccc;
    border-radius        : 3px;
    box-shadow           : 0 1px 0 rgb(0 0 0 / 20%), 0 0 0 2px #fff inset;
    color                : #333;
    display              : inline-block;
    font-family          : Arial, Helvetica, sans-serif;
    font-size            : 11px;
    line-height          : 1.4;
    margin               : 0 0.1em;
    padding              : 0.1em 0.6em;
    text-shadow          : 0 1px 0 #fff;
}




.sd-classic-tab-aside {
    display       : flex;
    flex-direction: column;

    padding: 0 0 0 1rem;
    flex   : 1;
    height : 100%;
}

.sd-classic-tab-nav {
    gap            : .25em;
    width          : 3rem;
    height         : 100%;
    display        : flex;
    flex-direction : column;
    align-items    : center;
    justify-content: space-around;
    position       : -webkit-sticky;
    position       : sticky;
    top            : .275rem;
    bottom         : .275rem;
}

[class*=sd-classic-tab-nav-child],
.sd-classic-tab-icon {
    width: 100%;

}

[class*=sd-classic-tab-nav-child] {
    color          : #75717b;
    cursor         : pointer;
    border-radius  : 3px 0 0 3px;
    height         : 100%;
    display        : flex;
    align-items    : center;
    justify-content: center;
    transition     : background-color .2s, color .2s;
    overflow       : hidden;

}

[class*=sd-classic-tab-nav-child]:hover,
[class*=sd-classic-tab-nav-child]:focus {
    background-color: white;
    color           : #323035;
}

[class*=sd-classic-tab-content] {
    height: 100%;
    width : 100%;

}

.sd-classic-tab-icon {
    padding: .4rem;
    display: block;

}

.svg-inline--fa .fa-secondary {
    fill   : var(--fa-secondary-color, currentColor);
    opacity: 0.4;
    opacity: var(--fa-secondary-opacity, 0.4);
}

.sd-classic-tab-aside .sd-classic-tab-nav-child6 .svg-inline--fa .fa-secondary {
    opacity: var(--fa-secondary-opacity, 0.7);
}

.sd-classic-tab-aside .sd-classic-tab-nav-child6:hover .svg-inline--fa .fa-secondary,
.sd-classic-radio-tab6:checked~.sd-classic-tab-aside .sd-classic-tab-nav-child6 .svg-inline--fa .fa-secondary,
.sd-classic-tab-aside .sd-classic-tab-nav-child6:focus .svg-inline--fa .fa-secondary {
    color  : #39ad58;
    opacity: var(--fa-secondary-opacity, 0.9);
}

.sd-classic-app-sticky-top {
    position: -webkit-sticky;
    position: sticky;
    top     : 0;
    bottom  : 0;
    z-index : 10;

}

.sd-classic-app-header {
    padding         : 0 0.275em;
    background-color: white;
}

.sd-classic-app-main {
    display: flex;

    flex-direction: column;
    flex          : 1 1 auto;
    overflow      : auto;
}

.sd-classic-group-column {
    display       : flex;
    flex-direction: column;
    gap           : .275rem;

}

.sd-classic-label,
.sd-classic-field,
.sd-classic-group {
    display    : flex;
    flex-wrap  : wrap;
    align-items: center;
    position   : relative;
    gap        : .275rem;
    flex       : 1;

}



.sd-classic-label-highlight {
    background   : #cfd0f5;
    border-radius: .25rem;
    padding      : 0.25rem;
    box-shadow   : inset 0 0 0px 1px #8287c5;
}

.sd-classic-label-name-auto {
    white-space: nowrap;
}

.sd-text-center {
    text-align: center;
}

.sd-text-right {
    text-align: right;
}

.sd-text-left {
    text-align: left;
}

:root{
    --min-plus-ch: 2ch
}

/* :is(input)[size="1"]{
    min-width: calc(var(--min-plus-ch) + 1ch)!important;
    width: calc(var(--min-plus-ch) + 1ch)!important;
}
:is(input)[size="2"]{
    min-width: calc(var(--min-plus-ch) + 2ch)!important;
    width: calc(var(--min-plus-ch) + 2ch)!important;
}
:is(input)[size="3"]{
    min-width: calc(var(--min-plus-ch) + 3ch)!important;
    width: calc(var(--min-plus-ch) + 3ch)!important;
}
:is(input)[size="4"]{
    min-width: calc(var(--min-plus-ch) + 4ch)!important;
    width: calc(var(--min-plus-ch) + 4ch)!important;
}
:is(input)[size="5"]{
    min-width: calc(var(--min-plus-ch) + 5ch)!important;
    width: calc(var(--min-plus-ch) + 5ch)!important;
}
:is(input)[size="6"]{
    min-width: calc(var(--min-plus-ch) + 6ch)!important;
    width: calc(var(--min-plus-ch) + 6ch)!important;
}
:is(input)[size="7"]{
    min-width: calc(var(--min-plus-ch) + 7ch)!important;
    width: calc(var(--min-plus-ch) + 7ch)!important;
}
:is(input)[size="8"]{
    min-width: calc(var(--min-plus-ch) + 8ch)!important;
    width: calc(var(--min-plus-ch) + 8ch)!important;
}
:is(input)[size="9"]{
    min-width: calc(var(--min-plus-ch) + 9ch)!important;
    width: calc(var(--min-plus-ch) + 9ch)!important;
}
:is(input)[size="10"]{
    min-width: calc(var(--min-plus-ch) + 10ch)!important;
    width: calc(var(--min-plus-ch) + 10ch)!important;
}
:is(input)[size="11"]{
    min-width: calc(var(--min-plus-ch) + 11ch)!important;
    width: calc(var(--min-plus-ch) + 11ch)!important;
}
:is(input)[size="12"]{
    min-width: calc(var(--min-plus-ch) + 12ch)!important;
    width: calc(var(--min-plus-ch) + 12ch)!important;
}
:is(input)[size="13"]{
    min-width: calc(var(--min-plus-ch) + 13ch)!important;
    width: calc(var(--min-plus-ch) + 13ch)!important;
}
:is(input)[size="14"]{
    min-width: calc(var(--min-plus-ch) + 14ch)!important;
    width: calc(var(--min-plus-ch) + 14ch)!important;
}
:is(input)[size="15"]{
    min-width: calc(var(--min-plus-ch) + 15ch)!important;
    width: calc(var(--min-plus-ch) + 15ch)!important;
}
:is(input)[size="16"]{
    min-width: calc(var(--min-plus-ch) + 16ch)!important;
    width: calc(var(--min-plus-ch) + 16ch)!important;
}
:is(input)[size="17"]{
    min-width: calc(var(--min-plus-ch) + 17ch)!important;
    width: calc(var(--min-plus-ch) + 17ch)!important;
}
:is(input)[size="18"]{
    min-width: calc(var(--min-plus-ch) + 18ch)!important;
    width: calc(var(--min-plus-ch) + 18ch)!important;
}
:is(input)[size="19"]{
    min-width: calc(var(--min-plus-ch) + 19ch)!important;
    width: calc(var(--min-plus-ch) + 19ch)!important;
}
:is(input)[size="20"]{
    min-width: calc(var(--min-plus-ch) + 20ch)!important;
    width: calc(var(--min-plus-ch) + 20ch)!important;
}
 */

.sd-classic-input-group-text {
    display         : flex;
    align-items     : center;
    padding         : 0.12em 0.4rem;
    font-size       : -0.1rem;
    font-weight     : 400;
    color           : #212529;
    text-align      : center;
    white-space     : nowrap;
    background-color: #e9ecef;
    border          : 1px solid #ced4da;
    border          : 1px solid #9e9e9e;
    border-radius   : .25rem;
}

.sd-classic-input-group-text:disabled {
    opacity: .6;
}

[class^=sd-classic-input] input,
[class^=sd-classic-input] textarea,
[class^=sd-classic-input] select,
[class^=sd-classic-input] button,
.sd-classic-group>no-grow {
    flex     : 1 1 auto;
    min-width: 0;
    width    : 100%;

}

[class^=sd-classic-input] input,
[class^=sd-classic-input] textarea {
    padding: 0.375rem 0.175rem;
}
[class^=sd-classic-input] select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 5' fill='%2383888E'%3E%3Cpath fill-rule='evenodd' d='M7.11 0H.889a.667.667 0 0 0-.47 1.138l3.11 3.11a.661.661 0 0 0 .943 0l3.11-3.11A.666.666 0 0 0 7.112 0z' clip-rule='evenodd'/%3E%3C/svg%3E");
    background-position: calc(100% - 5px);
    background-repeat: no-repeat;
    background-size: 8px;
    padding: 0.375rem 1rem 0.375rem 0.25rem;
}

.sd-classic-input,
.sd-classic-input-group {
    width      : 100%;
    display    : flex;
    gap        : 5px;
    align-items: center;

    position   : relative;
    display    : flex;
    align-items: stretch;


}

.sd-classic-input-group>*+* {
    margin-left: -1px; 
    
}

.sd-classic-input-group {
    gap: 0px;
}

.sd-classic-input-group * {
    border-radius: 0;
}

.sd-classic-remove-gap {
    gap: 0px !important;
}

.sd-classic-remove-gap > select {
    margin-left: 0px !important;
}



@media screen and (min-width: 768px) {
    .sd-classic-input-group-column > select:not(:last-child),
    .sd-classic-input-group-column > input:not(:last-child) {
        border-right: 0px;
    }
}

@media screen and (max-width: 768px) {
    .sd-classic-input-group-column > select:not(:last-child),
    .sd-classic-input-group-column > input:not(:last-child) {
        border-bottom: 0px;
    }
}

@media screen and (max-width: 768px) {
    .sd-classic-max-width-mobile {
        width: 100% !important;
    }
    
    .sd-classic-input-group-column > select,
    .sd-classic-input-group-column > input {
        width: 100% !important;
    }
}


.sd-classic-input-group>*:first-child {
    border-top-left-radius   : 0.15rem;
    border-bottom-left-radius: 0.15rem;

}

.sd-classic-input-group>*:last-child {
    border-top-right-radius   : 0.15rem;
    border-bottom-right-radius: 0.15rem;
}


.sd-classic-input-group-column {
    border-radius: 0.15rem;
    overflow: hidden;
}



.sd-classic-input-important {
    font-size  : 18px;
    font-weight: bold;
    color      : #170da9;
    font-family: sans-serif;
}

.sd-classic-input-important::-webkit-input-placeholder {
    font-weight: normal;
    font-size  : 1rem;
}

.sd-classic-input-important::-moz-placeholder {
    font-weight: normal;
    font-size  : 1rem;
}

.sd-classic-input-important:-ms-input-placeholder {
    font-weight: normal;
    font-size  : 1rem;
}

.sd-classic-input-important::-ms-input-placeholder {
    font-weight: normal;
    font-size  : 1rem;
}

.sd-classic-input-important::placeholder {
    font-weight: bold;
    font-size  : 1rem;
}

.sd-classic-input-group-icon {
    width: var(--icon-size,.75rem);
    color: #767881
}
.sd-classic-input-group-icon-small{
    width: .5rem;
} 
.sd-classic-input-group-icon-large{
    
    width: 1rem;
} 


.sd-classic-icon {
    width  : 2rem;
    /*display: inline-block;*/
    display: flex;
    color  : currentColor;
}

.sd-classic-root-icon {
    width  : 1rem;
    fill   : currentColor;
    display: inline-block;
}


.sd-classic-icon-round {
    border-radius  : 50%;
    padding        : .55rem;
    display        : flex;
    align-items    : center;
    justify-content: center;

    width: 2.5rem;
}



.sd-classic-title-header {
    border-radius   : .275rem;
    padding         : .7rem;
    background-color: #e9ecf1;
    text-align      : center;
    margin          : 0 0 .25rem 0;
    position        : -webkit-sticky;
    position        : sticky;


}

.sd-classic-title-header h2 {
    font-size: 1rem;
    padding  : 0;
}

.sd-classic-full-center {
    display        : flex;
    align-items    : center;
    justify-content: center;
}

.sd-classic-dot {

    height          : 0.375rem;
    width           : .375rem;
    background-color: #bbb;
    border-radius   : 50%;
    display         : inline-block;

}

.sd-classic-chip {
    width        : 100%;
    text-align   : center;
    padding      : .375rem;
    font-weight  : 600;
    border-radius: .275rem;
    box-shadow   : inset 0 0 0 1px rgb(0 0 0 / 15%);
}

.sd-classic-color-red {
    background-color: #ff00003b;
    color           : #902828;
}

.sd-classic-color-blue {
    background-color: #3131e447;
    color           : #7171b3;
}

.sd-classic-app-footer {
    display         : flex;
    flex-wrap       : nowrap;
    gap             : .3rem;
    padding         : .3rem;
    z-index         : 3;
    background-color: #fff;
    position        : sticky;
    bottom          : 0;
}

form > .sd-classic-app-footer, form  .sd-classic-app-content > .sd-classic-app-footer{
    box-shadow      : 0 -1px 7px 0 rgb(0 0 0 / 20%), inset 0 1px 0px 0 rgb(0 0 0 / 20%);
}

.sd-classic-app-footer button {
    overflow       : hidden;
    justify-content: center;

    align-items  : center;
    white-space  : nowrap;
    flex         : 1;
    text-overflow: ellipsis;
}

form  [main].sd-classic-app-footer{
    overflow: auto;
    min-height: 45px;
    max-height: 45px;
}
form  [main].sd-classic-app-footer button{
    overflow: visible;
}
form  [main].sd-classic-app-footer button:nth-child(-n+2){
    min-width: 45vw;
}

@media (min-width: 576px){
    .sd-classic-app-footer  {
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button{
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button:nth-child(-n+2){
        min-width: auto;
    }
}
@media (min-width: 768px){
    .sd-classic-app-footer  {
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button{
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button:nth-child(-n+2){
        min-width: auto;
    }
}
@media (min-width: 992px){
    .sd-classic-app-footer  {
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button{
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button:nth-child(-n+2){
        min-width: auto;
    }
}
@media (min-width: 1200px){
    .sd-classic-app-footer  {
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button{
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button:nth-child(-n+2){
        min-width: auto;
    }
}
@media (min-width:1440px) {
    .sd-classic-app-footer  {
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button{
        overflow: hidden;
    }
    form  [main].sd-classic-app-footer button:nth-child(-n+2){
        min-width: auto;
    }
}




.sd-classic-modal {
    align-items    : center;
    bottom         : 0;
    display        : none;
    -ms-flex-align : center;
    justify-content: center;
    left           : 0;
    opacity        : 0;
    overflow       : hidden;
    padding        : .4rem;
    position       : fixed;
    right          : 0;
    top            : 0;
}

.sd-classic-modal:target,
.sd-classic-modal.sd-classic-modal-active {
    display: flex;
    opacity: 1;
    z-index: 400;
}

.sd-classic-modal:target .sd-classic-modal-overlay,
.sd-classic-modal.sd-classic-modal-active .sd-classic-modal-overlay {
    background             : rgba(247, 248, 249, .75);
    bottom                 : 0;
    cursor                 : default;
    display                : block;
    left                   : 0;
    position               : absolute;
    right                  : 0;
    top                    : 0;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter        : blur(2px);
}

.sd-classic-modal:target .sd-classic-modal-container,
.sd-classic-modal.sd-classic-modal-active .sd-classic-modal-container {
    -webkit-animation: slide-down .2s ease;
    animation        : slide-down .2s ease;
    z-index          : 4;
}

.sd-classic-modal.sd-classic-modal-sm .sd-classic-modal-container {
    max-width: 320px;
    padding  : 0 .4rem;
}

.sd-classic-modal.sd-classic-modal-lg .sd-classic-modal-overlay {
    background: #fff;
}

.sd-classic-modal.sd-classic-modal-lg .sd-classic-modal-container {
    box-shadow: none;
    max-width : 960px;
}

.sd-classic-modal.sd-classic-modal-full {
    width  : 100%;
    height : 100%;
    padding: 0;

}

.sd-classic-modal.sd-classic-modal-full {

    box-shadow: 0 .2rem .5rem rgba(48, 55, 66, .3);
}

.sd-classic-modal-container {
    background    : #fff;
    border-radius : .3rem;
    box-shadow    : 0 .2rem .5rem rgba(48, 55, 66, .3);
    display       : flex;
    flex-direction: column;
    max-height    : 75vh;
    max-width     : 640px;
    padding       : .6rem;
    width         : 100%;
}

.sd-classic-modal-content {
    font-size: 1rem;
    padding  : .6rem;

}

.sd-classic-modal.sd-classic-modal-full .sd-classic-modal-container {

    min-width : 100%;
    min-height: 100%;
    height    : 100%;
    width     : 100%;
    padding   : 0.313rem;

}


.sd-classic-modal-container.sd-classic-modal-fullheight {
    max-height: 100vh;
}

.sd-classic-modal-container .sd-classic-modal-header {
    color  : #303742;
    padding: .8rem;
}

.sd-classic-modal-container .sd-classic-modal-body {
    overflow-y: auto;
    padding   : .8rem;
    position  : relative;
}

.sd-classic-modal-container .sd-classic-modal-footer {
    padding   : .8rem;
    text-align: right;
}

.sd-full-loading {
    position        : fixed;
    top             : 0;
    right           : 0;
    bottom          : 0;
    left            : 0;
    background-color: #ffffff;
    display         : flex;
    align-items     : center;
    justify-content : center;
    z-index         : 9999999;
}

.sd-loading-bar {


    -webkit-animation-duration: 1.5s;


    animation-duration               : 1.5s;
    -webkit-animation-fill-mode      : forwards;
    animation-fill-mode              : forwards;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count        : infinite;
    -webkit-animation-name           : loading-bar;
    animation-name                   : loading-bar;
    -webkit-animation-timing-function: linear;
    animation-timing-function        : linear;
    background                       : rgb(255, 255, 255);

    background                 : linear-gradient(90deg, rgba(255, 255, 255, 0) 33%, #5755d9 35%, #5755d9 50%, rgba(255, 255, 255, 0) 52%);
    height                     : 5px;
    width                      : 100%;
    position                   : relative;
    -webkit-backface-visibility: hidden;
}

.sd-full-loading .sd-loading-bar {
    position: absolute;
    top     : 0;
}


@-webkit-keyframes loading-bar {
    0% {
        background-position: -30vw 0
    }

    100% {
        background-position: 70vw 0
    }
}


@keyframes loading-bar {
    0% {
        background-position: -30vw 0
    }

    100% {
        background-position: 70vw 0
    }
}

@-webkit-keyframes slide-down {
    0% {
        opacity  : 0;
        transform: translateY(-1.6rem);
    }

    100% {
        opacity  : 1;
        transform: translateY(0);
    }
}

@keyframes slide-down {
    0% {
        opacity  : 0;
        transform: translateY(-1.6rem);
    }

    100% {
        opacity  : 1;
        transform: translateY(0);
    }
}

[class*="sd-column"] {
    display: grid;
    gap    : .313rem .65rem;
    margin : .225rem 0px;
    width  : 100%;
}

[class*="sd-column"]>[class*="sd-column"] {
    margin: 0 0;
}

[class*="sd-row-span"] {
    align-items: normal;
}

.sd-flex-column {
    flex          : 1 1;
    display       : flex;
    flex-direction: column;
}

.sd-flex-row {
    flex          : 1 1;
    display       : flex;
    flex-direction: row;
}

.sd-flex-center {
    align-items    : center;
    justify-content: center;
}
.sd-flex-force-wrap{
    flex-wrap: wrap!important;
}

.sd-align-self-end {
    align-self: end;
}

.sd-align-self-start {
    align-self: start;
}

.sd-align-self-center {
    align-self: center;
}

.sd-align-self-baseline {
    align-self: baseline;
}

.sd-align-self-stretch {
    align-self: stretch;
}

.sd-column-auto {
    grid-template-columns: repeat(auto-fit, minmax(1px, 1fr));
}

.sd-column {
    grid-template-columns: minmax(-webkit-min-content, 1fr);
    grid-template-columns: minmax(min-content, 1fr);
}

.sd-column-2 {
    grid-template-columns: repeat(2, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(2, minmax(min-content, 1fr));
}

.sd-column-3 {
    grid-template-columns: repeat(3, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(3, minmax(min-content, 1fr));
}

.sd-column-4 {
    grid-template-columns: repeat(4, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(4, minmax(min-content, 1fr));
}

.sd-column-5 {
    grid-template-columns: repeat(5, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(5, minmax(min-content, 1fr));
}

.sd-column-6 {
    grid-template-columns: repeat(6, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(6, minmax(min-content, 1fr));
}

.sd-column-7 {
    grid-template-columns: repeat(7, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(7, minmax(min-content, 1fr));
}

.sd-column-8 {
    grid-template-columns: repeat(8, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(8, minmax(min-content, 1fr));
}

.sd-column-9 {
    grid-template-columns: repeat(9, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(9, minmax(min-content, 1fr));
}

.sd-column-10 {
    grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(10, minmax(min-content, 1fr));
}

.sd-column-11 {
    grid-template-columns: repeat(11, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(11, minmax(min-content, 1fr));
}

.sd-column-12 {
    grid-template-columns: repeat(12, minmax(-webkit-min-content, 1fr));
    grid-template-columns: repeat(12, minmax(min-content, 1fr));
}

.sd-col-span {
    grid-column: span 1;
}

.sd-col-span-start {
    grid-column-start: span 1;
}

.sd-col-start {
    grid-column-start: 1;
}

.sd-col-span-end {
    grid-column-end: span 1;
}

.sd-col-end {
    /* grid-column-end: calc(1 + 1); */
    grid-column-end: 1;
}

.sd-col-span-2 {
    grid-column: span 2;
}

.sd-col-span-start-2 {
    grid-column-start: span 2;
}

.sd-col-start-2 {
    grid-column-start: 2;
}

.sd-col-span-end-2 {
    grid-column-end: span 2;
}

.sd-col-end-2 {
    /* grid-column-end: calc(2 + 1); */
    grid-column-end: 2;
}

.sd-col-span-3 {
    grid-column: span 3;
}

.sd-col-span-start-3 {
    grid-column-start: span 3;
}

.sd-col-start-3 {
    grid-column-start: 3;
}

.sd-col-span-end-3 {
    grid-column-end: span 3;
}

.sd-col-end-3 {
    /* grid-column-end: calc(3 + 1); */
    grid-column-end: 3;
}

.sd-col-span-4 {
    grid-column: span 4;
}

.sd-col-span-start-4 {
    grid-column-start: span 4;
}

.sd-col-start-4 {
    grid-column-start: 4;
}

.sd-col-span-end-4 {
    grid-column-end: span 4;
}

.sd-col-end-4 {
    /* grid-column-end: calc(4 + 1); */
    grid-column-end: 4;
}

.sd-col-span-5 {
    grid-column: span 5;
}

.sd-col-span-start-5 {
    grid-column-start: span 5;
}

.sd-col-start-5 {
    grid-column-start: 5;
}

.sd-col-span-end-5 {
    grid-column-end: span 5;
}

.sd-col-end-5 {
    /* grid-column-end: calc(5 + 1); */
    grid-column-end: 5;
}

.sd-col-span-6 {
    grid-column: span 6;
}

.sd-col-span-start-6 {
    grid-column-start: span 6;
}

.sd-col-start-6 {
    grid-column-start: 6;
}

.sd-col-span-end-6 {
    grid-column-end: span 6;
}

.sd-col-end-6 {
    /* grid-column-end: calc(6 + 1); */
    grid-column-end: 6;
}

.sd-col-span-7 {
    grid-column: span 7;
}

.sd-col-span-start-7 {
    grid-column-start: span 7;
}

.sd-col-start-7 {
    grid-column-start: 7;
}

.sd-col-span-end-7 {
    grid-column-end: span 7;
}

.sd-col-end-7 {
    /* grid-column-end: calc(7 + 1); */
    grid-column-end: 7;
}

.sd-col-span-8 {
    grid-column: span 8;
}

.sd-col-span-start-8 {
    grid-column-start: span 8;
}

.sd-col-start-8 {
    grid-column-start: 8;
}

.sd-col-span-end-8 {
    grid-column-end: span 8;
}

.sd-col-end-8 {
    /* grid-column-end: calc(8 + 1); */
    grid-column-end: 8;
}

.sd-col-span-9 {
    grid-column: span 9;
}

.sd-col-span-start-9 {
    grid-column-start: span 9;
}

.sd-col-start-9 {
    grid-column-start: 9;
}

.sd-col-span-end-9 {
    grid-column-end: span 9;
}

.sd-col-end-9 {
    /* grid-column-end: calc(9 + 1); */
    grid-column-end: 9;
}

.sd-col-span-10 {
    grid-column: span 10;
}

.sd-col-span-start-10 {
    grid-column-start: span 10;
}

.sd-col-start-10 {
    grid-column-start: 10;
}

.sd-col-span-end-10 {
    grid-column-end: span 10;
}

.sd-col-end-10 {
    /* grid-column-end: calc(10 + 1); */
    grid-column-end: 10;
}

.sd-col-span-11 {
    grid-column: span 11;
}

.sd-col-span-start-11 {
    grid-column-start: span 11;
}

.sd-col-start-11 {
    grid-column-start: 11;
}

.sd-col-span-end-11 {
    grid-column-end: span 11;
}

.sd-col-end-11 {
    /* grid-column-end: calc(11 + 1); */
    grid-column-end: 11;
}

.sd-col-span-12 {
    grid-column: span 12;
}

.sd-col-span-start-12 {
    grid-column-start: span 12;
}

.sd-col-start-12 {
    grid-column-start: 12;
}

.sd-col-span-end-12 {
    grid-column-end: span 12;
}

.sd-col-end-12 {
    /* grid-column-end: calc(12 + 1); */
    grid-column-end: 12;
}

.sd-row-span {
    grid-row: span 1;
}

.sd-row-span-start {
    grid-row-start: span 1;
}

.sd-row-start {
    grid-row-start: 1;
}

.sd-row-span-end {
    grid-row-end: span 1;
}

.sd-row-end {
    grid-row-end: 1;
}

.sd-row-span-2 {
    grid-row: span 2;
}

.sd-row-span-start-2 {
    grid-row-start: span 2;
}

.sd-row-start-2 {
    grid-row-start: 2;
}

.sd-row-span-end-2 {
    grid-row-end: span 2;
}

.sd-row-end-2 {
    grid-row-end: 2;
}

.sd-row-span-3 {
    grid-row: span 3;
}

.sd-row-span-start-3 {
    grid-row-start: span 3;
}

.sd-row-start-3 {
    grid-row-start: 3;
}

.sd-row-span-end-3 {
    grid-row-end: span 3;
}

.sd-row-end-3 {
    grid-row-end: 3;
}

.sd-row-span-4 {
    grid-row: span 4;
}

.sd-row-span-start-4 {
    grid-row-start: span 4;
}

.sd-row-start-4 {
    grid-row-start: 4;
}

.sd-row-span-end-4 {
    grid-row-end: span 4;
}

.sd-row-end-4 {
    grid-row-end: 4;
}

.sd-row-span-5 {
    grid-row: span 5;
}

.sd-row-span-start-5 {
    grid-row-start: span 5;
}

.sd-row-start-5 {
    grid-row-start: 5;
}

.sd-row-span-end-5 {
    grid-row-end: span 5;
}

.sd-row-end-5 {
    grid-row-end: 5;
}

.sd-row-span-6 {
    grid-row: span 6;
}

.sd-row-span-start-6 {
    grid-row-start: span 6;
}

.sd-row-start-6 {
    grid-row-start: 6;
}

.sd-row-span-end-6 {
    grid-row-end: span 6;
}

.sd-row-end-6 {
    grid-row-end: 6;
}

.sd-row-span-7 {
    grid-row: span 7;
}

.sd-row-span-start-7 {
    grid-row-start: span 7;
}

.sd-row-start-7 {
    grid-row-start: 7;
}

.sd-row-span-end-7 {
    grid-row-end: span 7;
}

.sd-row-end-7 {
    grid-row-end: 7;
}

.sd-row-span-8 {
    grid-row: span 8;
}

.sd-row-span-start-8 {
    grid-row-start: span 8;
}

.sd-row-start-8 {
    grid-row-start: 8;
}

.sd-row-span-end-8 {
    grid-row-end: span 8;
}

.sd-row-end-8 {
    grid-row-end: 8;
}

.sd-row-span-9 {
    grid-row: span 9;
}

.sd-row-span-start-9 {
    grid-row-start: span 9;
}

.sd-row-start-9 {
    grid-row-start: 9;
}

.sd-row-span-end-9 {
    grid-row-end: span 9;
}

.sd-row-end-9 {
    grid-row-end: 9;
}

.sd-row-span-10 {
    grid-row: span 10;
}

.sd-row-span-start-10 {
    grid-row-start: span 10;
}

.sd-row-start-10 {
    grid-row-start: 10;
}

.sd-row-span-end-10 {
    grid-row-end: span 10;
}

.sd-row-end-10 {
    grid-row-end: 10;
}

.sd-row-span-11 {
    grid-row: span 11;
}

.sd-row-span-start-11 {
    grid-row-start: span 11;
}

.sd-row-start-11 {
    grid-row-start: 11;
}

.sd-row-span-end-11 {
    grid-row-end: span 11;
}

.sd-row-end-11 {
    grid-row-end: 11;
}

.sd-row-span-12 {
    grid-row: span 12;
}

.sd-row-span-start-12 {
    grid-row-start: span 12;
}

.sd-row-start-12 {
    grid-row-start: 12;
}

.sd-row-span-end-12 {
    grid-row-end: span 12;
}

.sd-row-end-12 {
    grid-row-end: 12;
}

/* .sd-column-auto{ grid-template-columns: repeat(auto-fill,minmax(min-content, 1fr)) } */


/*******************************
            Button
    *******************************/

.sd-classic-btn___ {
    cursor                     : pointer;
    /* display                 : inline-block; */
    overflow                   : hidden;
    display                    : flex;
    align-items                : center;
    justify-content            : center;
    gap                        : 0.225rem;
    min-height                 : 1em;
    outline                    : none !important;
    border                     : none;
    vertical-align             : baseline;
    background                 : #E0E1E2 none;
    color                      : rgba(0, 0, 0, 0.6);
    font-family                : 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
    margin                     : 0em 0.25em 0em 0em;
    padding                    : 0.325rem 0.48571429em;
    text-transform             : none;
    text-shadow                : none;
    font-weight                : bold;
    line-height                : 1em;
    font-style                 : normal;
    text-align                 : center;
    text-decoration            : none;
    border-radius              : 0.28571429rem;
    box-shadow                 : 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
    -webkit-user-select        : none;
    -moz-user-select           : none;
    -ms-user-select            : none;
    user-select                : none;
    transition                 : opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease;
    will-change                : '';
    -webkit-tap-highlight-color: transparent;
}


/*******************************
            States
    *******************************/


/*--------------
      Hover
    ---------------*/

.sd-classic-btn__:hover {
    background-color: #CACBCD;
    background-image: none;
    box-shadow      : 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
    color           : rgba(0, 0, 0, 0.8);
}

.sd-classic-btn__:hover .icon {
    opacity: 0.85;
}

/*--------------
      Focus
    ---------------*/

.sd-classic-btn__:focus {
    background-color: #CACBCD;
    color           : rgba(0, 0, 0, 0.8);
    background-image: '' !important;
    box-shadow      : '' !important;
}

.sd-classic-btn__:focus .icon {
    opacity: 0.85;
}

.sd-classic-btn__ {
    position    : relative;
    /* overflow : hidden; */
    transform   : translate3d(0, 0, 0)
}






/* new button set */

:root {
    --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
    --btn-font-size: 1em;
    --btn-radius   : 0.25em;

    /* main colors */
    /* --color-primary-light: color-mod(var(--color-primary) tint(15%));
    --color-primary-dark : color-mod(var(--color-primary) shade(15%));
    --color-primary-bg   : color-mod(var(--color-primary) alpha(20%)); */

    /* --color-accent      : #f5414f;
    --color-accent-light: color-mod(var(--color-accent) tint(15%));
    --color-accent-dark : color-mod(var(--color-accent) shade(10%));
    --color-accent-bg   : color-mod(var(--color-accent) alpha(20%)); */

    /* --color-primary      : #286bf4;
    --color-primary-rgb: 40,107,244;
    --color-primary-contrast: #ffffff;
    --color-primary-contrast-rgb: 255,255,255;
    --color-primary-shade: #235ed7;
    --color-primary-light: #6393f1;
    --color-primary-bg : #286bf4cc;
    --color-primary-dark : #1347b1;
    --color-primary-text-color : #071d49;
    
    
    
    --color-accent      : #f5414f;
    --color-accent-rgb: 245,65,79;
    --color-accent-contrast: #ffffff;
    --color-accent-contrast-rgb: 255,255,255;
    --color-accent-shade: #d83946;
    --color-accent-light: #e76f79;
    --color-accent-bg : #e96570cc;
    --color-accent-dark : #a7121b;
    --color-accent-text-color : #54060c;
    
    
    
    --color-warning      : #fbbd33;
    --color-warning-rgb: 237,156,40;
    --color-warning-contrast: #000000;
    --color-warning-contrast-rgb: 0,0,0;
    --color-warning-shade: #d18923;
    --color-warning-light: #e2b474;
    --color-warning-bg : #fbbd33cc;
    --color-warning-dark : #e0962e;
    --color-warning-text-color : #492f09;
    
    
    --color-danger      : #ed2626;
    --color-danger-rgb: 237,38,38;
    --color-danger-contrast: #ffffff;
    --color-danger-contrast-rgb: 255,255,255;
    --color-danger-shade: #d12121;
    --color-danger-light: #e27979;
    --color-danger-bg : #ed2626cc;
    --color-danger-dark : #b61414;
    --color-danger-text-color : #430606;
    

    --color-success      : #31dd53;
    --color-success-rgb:49,221,83;
    --color-success-contrast: #000000;
    --color-success-contrast-rgb: 0,0,0;
    --color-success-shade: #2bc249;
    --color-success-light: #8cd19a;
    --color-success-bg : #31dd53cc;
    --color-success-dark : #10b831;
    --color-success-text-color : #063f12;
     */

    --color-primary             : #286bf4;
    --color-primary-rgb         : 40, 107, 244;
    --color-primary-contrast    : #ffffff;
    --color-primary-contrast-rgb: 255, 255, 255;
    --color-primary-shade       : #235ed7;
    --color-primary-light       : #a3c2ee;
    --color-primary-bg          : #286bf4cc;
    --color-primary-dark        : #163574;
    --color-primary-hover       : #3e69c2;
    --color-primary-text-color  : #071d49;

    --color-accent             : #f5414f;
    --color-accent-rgb         : 245, 65, 79;
    --color-accent-contrast    : #ffffff;
    --color-accent-contrast-rgb: 255, 255, 255;
    --color-accent-shade       : #d83946;
    --color-accent-light       : #e76f79;
    --color-accent-bg          : #e96570cc;
    --color-accent-dark        : #630c12;
    --color-accent-hover       : #a7121b;
    --color-accent-text-color  : #54060c;

    --color-warning             : #fbbd33;
    --color-warning-rgb         : 237, 156, 40;
    --color-warning-contrast    : #000000;
    --color-warning-contrast-rgb: 0, 0, 0;
    --color-warning-shade       : #d18923;
    --color-warning-light       : #e2b474;
    --color-warning-bg          : #fbbd33cc;
    --color-warning-dark        : #6f460d;
    --color-warning-hover       : #e0962e;
    --color-warning-text-color  : #492f09;

    --color-danger             : #ed2626;
    --color-danger-rgb         : 237, 38, 38;
    --color-danger-contrast    : #ffffff;
    --color-danger-contrast-rgb: 255, 255, 255;
    --color-danger-shade       : #d12121;
    --color-danger-light       : #e27979;
    --color-danger-bg          : #ed2626cc;
    --color-danger-dark        : #8a1616;
    --color-danger-hover       : #d43c3c;
    --color-danger-text-color  : #430606;

    --color-success             : #31dd53;
    --color-success-rgb         : 49, 221, 83;
    --color-success-contrast    : #000000;
    --color-success-contrast-rgb: 0, 0, 0;
    --color-success-shade       : #2bc249;
    --color-success-light       : #8cd19a;
    --color-success-bg          : #31dd53cc;
    --color-success-dark        : #147227;
    --color-success-hover       : #4cc865;
    --color-success-text-color  : #063f12;






    /* shades - generated using chroma.js - 12 steps */
    --black  : #1d1d21;
    --gray-10: #2e2e31;
    --gray-6 : #7b7a7d;
    --gray-4 : #a5a5a6;
    --gray-3 : #bbbbbc;
    --gray-2 : #d1d0d2;
    --gray-1 : #e8e7e8;
    --white  : white;


    --btn-label : var(--black);
    --btn-hover : var(--gray-2);
    --btn-active: var(--gray-2);



    /* buttons */
    --btn-secondary-bg    : var(--gray-1);
    --btn-secondary-active: var(--gray-2);
    --btn-secondary-label : var(--gray-10);



    --btn-primary-bg              : var(--color-primary-light);
    --btn-primary-hover           : var(--color-primary-hover);
    --btn-primary-box-shadow-color: var(--color-primary-dark);
    --btn-primary-active          : var(--color-primary-dark);
    --btn-primary-label           : var(--color-primary-text-color);

    --btn-accent-bg              : var(--color-accent-light);
    --btn-accent-hover           : var(--color-accent-hover);
    --btn-accent-box-shadow-color: var(--color-accent-dark);
    --btn-accent-active          : var(--color-accent-dark);
    --btn-accent-label           : var(--color-accent-text-color);


    --btn-warning-bg              : var(--color-warning-light);
    --btn-warning-hover           : var(--color-warning-hover);
    --btn-warning-box-shadow-color: var(--color-warning-dark);
    --btn-warning-active          : var(--color-warning-dark);
    --btn-warning-label           : var(--color-warning-text-color);

    --btn-danger-bg              : var(--color-danger-light);
    --btn-danger-hover           : var(--color-danger-hover);
    --btn-danger-box-shadow-color: var(--color-danger-dark);
    --btn-danger-active          : var(--color-danger-dark);
    --btn-danger-label           : var(--color-danger-text-color);

    --btn-success-bg              : var(--color-success-light);
    --btn-success-hover           : var(--color-success-hover);
    --btn-success-box-shadow-color: var(--color-success-dark);
    --btn-success-active          : var(--color-success-dark);
    --btn-success-label           : var(--color-success-text-color);


    --btn-disabled-bg   : var(--gray-2);
    --btn-disabled-label: var(--gray-10);

    --btn-sm: calc(var(--btn-font-size) - 0.2em);
    --btn-md: calc(var(--btn-font-size) + 0.2em);
    --btn-lg: calc(var(--btn-font-size) + 0.4em);


}

/* button size */
.sd-classic-sm-btn {
    font-size: var(--btn-sm);
}

.sd-classic-md-btn {
    font-size: var(--btn-md);
}

.sd-classic-lg-btn {
    font-size: var(--btn-lg);
}



[class*=sd-classic-btn] {
    background: #f0f0f0;
    
    font-family: var(--font-family) !important;

    display        : flex;
    width          : 100%;
    justify-content: center;
    gap            : 0.25rem;
    align-items    : center;
    border         : none;

    position       : relative;
    white-space    : nowrap;
    text-decoration: none;
    /* line-height    : 1; */

    -webkit-user-select: none;
    -moz-user-select   : none;
    -ms-user-select    : none;
    user-select        : none;
    transition         : opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease, transform 0.1s ease;
    will-change        : '';

    padding      : var(--space-xs) var(--space-md);
    border-radius: var(--btn-radius);
    font-size    : var(--btn-font-size);
    color        : var(--color-link, #313036);
    cursor       : pointer;

    font-size     : .8rem !important;
    font-weight   : 600;
    /* letter-spacing: .030rem; */
    box-shadow    : inset 0 0 0 1px hsl(0deg 0% 85%), 0 0 0 1px hsl(0deg 0% 85%);

    /* max-width: fit-content;
    max-width: -moz-fit-content; */


}

[class*=sd-classic-btn].sd-classic-not-full-width-btn {
    display: inline-flex;
    width  : -webkit-max-content;
    width  : -moz-max-content;
    width  : max-content;
}

[class*=sd-classic-btn] .icon {
    /* icon inherits color of button label */
    color      : inherit;
    flex-shrink: 0;
}

[class*=sd-classic-btn] .sd-classic-icon {
    /* icon inherits color of button label */
    color      : inherit;
    flex-shrink: 0;
    width      : 1.2em;
}

[class*=sd-classic-btn]:visited {
    color: var(--btn-label);
}

[class*=sd-classic-btn]:hover,
[class*=sd-classic-btn]:focus {
    background-color: var(--btn-hover);
}

[class*=sd-classic-btn]:active {
    background-color: var(--btn-active);
}

/* [class*=sd-classic-btn]:not(:disabled):active {
    transform: translate(0px, 1px);
} */

.sd-classic-text-btn {

    overflow     : hidden;
    white-space  : nowrap;
    text-overflow: ellipsis;
    width        : 100%;
}

/* themes */
.sd-classic-btn--primary {
    background-color : var(--btn-primary-bg);
    color            : var(--btn-primary-label);
    /*     box-shadow: 0 0 0 1px var(--btn-primary-box-shadow-color); */
    /* box-shadow    : 0 0 0 1px var(--btn-primary-bg); */
    box-shadow       : none;

}

.sd-classic-btn--primary:visited {
    color: var(--btn-primary-label);

}

.sd-classic-btn--primary:hover,
.sd-classic-btn--primary:focus {
    color           : #fff;
    background-color: var(--btn-primary-hover);
}

.sd-classic-btn--primary:active {
    background-color: var(--btn-primary-active);
}


.sd-classic-btn--secondary {
    background-color: var(--btn-secondary-bg);
    color           : var(--btn-secondary-label);
    /* box-shadow   : 0 0 0 1px var(--btn-secondary-box-shadow-color); */
    /* box-shadow   : 0 0 0 1px var(--btn-secondary-bg); */
    box-shadow      : none;

}

.sd-classic-btn--secondary:visited {
    color: var(--btn-secondary-label);
}

.sd-classic-btn--secondary:active {
    background-color: var(--btn-secondary-active);
}

.sd-classic-btn--accent {
    background-color: var(--btn-accent-bg);
    color           : var(--btn-accent-label);
    /* box-shadow   : 0 0 0 1px var(--btn-accent-box-shadow-color); */
    /* box-shadow   : 0 0 0 1px var(--btn-accent-bg); */
    box-shadow      : none;

}

.sd-classic-btn--accent:visited {
    color: var(--btn-accent-label);
}

.sd-classic-btn--accent:hover,
.sd-classic-btn--accent:focus {
    background-color: var(--btn-accent-hover);
    color           : #fff
}

.sd-classic-btn--accent:active {
    background-color: var(--btn-accent-active);
}

.sd-classic-btn--warning {
    background-color: var(--btn-warning-bg);
    color           : var(--btn-warning-label);
    /* box-shadow   : 0 0 0 1px var(--btn-warning-box-shadow-color); */
    /* box-shadow   : 0 0 0 1px var(--btn-warning-bg); */
    box-shadow      : none;

}

.sd-classic-btn--warning:visited {
    color: var(--btn-warning-label);
}

.sd-classic-btn--warning:hover,
.sd-classic-btn--warning:focus {
    background-color: var(--btn-warning-hover);
    color           : #fff
}

.sd-classic-btn--warning:active {
    background-color: var(--btn-warning-active);
}

.sd-classic-btn--danger {
    background-color: var(--btn-danger-bg);
    color           : var(--btn-danger-label);
    /* box-shadow   : 0 0 0 1px var(--btn-danger-box-shadow-color); */
    /* box-shadow   : 0 0 0 1px var(--btn-danger-bg); */
    box-shadow      : none;

}

.sd-classic-btn--danger:visited {
    color: var(--btn-danger-label);
}

.sd-classic-btn--danger:hover,
.sd-classic-btn--danger:focus {
    background-color: var(--btn-danger-hover);
    color           : #fff
}

.sd-classic-btn--danger:active {
    background-color: var(--btn-danger-active);
}

.sd-classic-btn--success {
    background-color: var(--btn-success-bg);
    color           : var(--btn-success-label);
    /* box-shadow   : 0 0 0 1px var(--btn-success-box-shadow-color); */
    /* box-shadow   : 0 0 0 1px var(--btn-success-bg); */
    box-shadow      : none;

}

.sd-classic-btn--success:visited {
    color: var(--btn-success-label);
}

.sd-classic-btn--success:hover,
.sd-classic-btn--success:focus {
    background-color: var(--btn-success-hover);
    color           : #fff
}

.sd-classic-btn--success:active {
    background-color: var(--btn-success-active);
}



/* feedback */
[class*=sd-classic-btn][disabled] {
    cursor          : not-allowed;
    background-color: var(--btn-disabled-bg);
    color           : var(--btn-disabled-label);
    box-shadow      : none;
    opacity         : 0.4;
}

[class*=sd-classic-btn][disabled]:visited {
    color: var(--btn-disabled-label);
}

[class*=sd-classic-btn]:not(:disabled):after,
.sd-classic-ripple:after {
    content            : "";
    display            : block;
    position           : absolute;
    width              : 100%;
    height             : 100%;
    top                : 0;
    left               : 0;
    pointer-events     : none;
    background-position: 50%;
    background         : radial-gradient(circle, #000000 1%, transparent 1%) center/15000%;
    opacity            : 0;
    transition         : background 1s, opacity 1s;
}

[class*=sd-classic-btn]:not(:disabled):active:after,
.sd-classic-ripple:active:after {
    background: radial-gradient(circle, #000000 1%, transparent 1%) center/0%;
    opacity   : .2;
    transition: 0s
}

/*--------------
      Down
    ---------------*/

.sd-classic-btn__:active {
    background-color: #BABBBC;
    background-image: '';
    color           : rgba(0, 0, 0, 0.9);
    box-shadow      : 0px 0px 0px 1px transparent inset, none;
}



/*-------------------
      Disabled
    --------------------*/

.sd-classic-btns .disabled.button,
.sd-classic-btn__:disabled {
    cursor          : default;
    opacity         : 0.45 !important;
    background-image: none !important;
    box-shadow      : none !important;
    pointer-events  : none !important;
}

.sd-classic-inner-btn {
    display      : inline;
    min-height   : 0;
    overflow     : hidden;
    white-space  : nowrap;
    text-overflow: ellipsis;

    align-items    : stretch;
    justify-content: center;
    gap            : 0.3rem;
}





.sd-classic-switch {
    display    : block;
    line-height: 1.2rem;
    margin     : .2rem 0;
    min-height: 1rem;
    min-width: 2rem;
    /* padding    : .1rem .4rem .1rem 1.2rem; */
    position   : relative;
}

.sd-classic-switch .sd-classic-icon {
    background     : #bcc3ce;
    background-clip: padding-box;
    border-radius  : .45rem;
    height         :  100%;
    left           : 0;
    width          : 1.6rem;
}

.sd-classic-switch .sd-classic-icon::before {
    background: #fff;
    border-radius: 50%;
    content: "";
    display: block;
    height: .8rem;
    left: 0;
    transform: translate(0%, -50%);
    position: absolute;
    top: 50%;
    transition: background .2s, border .2s, box-shadow .2s, color .2s, left .2s, transform .2s;
    width: .8rem;
}

.sd-classic-switch input:checked+.sd-classic-icon::before {
    left: 100%;
    transform: translate(-100%, -50%);
}

.sd-classic-switch input:active+.sd-classic-icon::before {
    background: #f7f8f9;
}

.sd-classic-switch input:disabled+.sd-classic-icon::before,
.sd-classic-switch input.disabled+.sd-classic-icon::before {
    background: #fff;
}
.sd-classic-switch input:disabled+.sd-classic-icon,
.sd-classic-switch input.disabled+.sd-classic-icon {
    
    opacity: .5;
}

.sd-classic-switch input {
    clip    : rect(0, 0, 0, 0);
    height  : 1px;
    margin  : -1px;
    overflow: hidden;
    position: absolute;
    width   : 1px;
}
.sd-classic-switch input:focus+.sd-classic-icon {
    border-color: #5755d9;
    box-shadow  : 0 0 0 .1rem rgba(87, 85, 217, .2);
}
.sd-classic-switch input:checked+.sd-classic-icon {
    background  : #5755d9;
    border-color: #77767c;
}

.sd-classic-switch .sd-classic-icon {
    border    : .05rem solid #bcc3ce;
    cursor    : pointer;
    display   : inline-block;
    position  : absolute;
    transition: background .2s, border .2s, box-shadow .2s, color .2s;
}



.sd-padding {
    padding: .5em;
}

.sd-padding-x {
    padding: .5em 0;
}

.sd-padding-y {
    padding: 0 .5em;
}

/*
@media (max-width:576px){
     .sd-classic-label input,
    .sd-classic-label textarea,
    .sd-classic-label select,
    .sd-classic-label button,
    .sd-classic-group > [no-grow] {
        flex     : 1 1 auto;
        min-width: 0;
        width    : 100%;
    } 
}*/
[class^=sd-classic-input] input[size],
[class^=sd-classic-input] textarea[size],
[class^=sd-classic-input] select[size],
[class^=sd-classic-input] button[size],
.sd-classic-group>[no-grow] {
    min-width: unset;
    width    : min-content;
    flex     : unset;

}

.sd-classic-shown{ display:block!important; }
.sd-classic-flex-shown{ display:flex!important; }
.sd-classic-hidden{ display:none!important; }

@media (min-width: 576px) {
    
    .sd-classic-shown-sm{ display:block!important; }
    .sd-classic-flex-shown-sm{ display:flex!important; }
    .sd-classic-hidden-sm{ display:none!important; }
    
    .sd-classic-group,
    .sd-classic-label,
    .sd-classic-field {
        flex-wrap: wrap;
    }

    .sd-padding-sm {
        padding: .5em;
    }

    .sd-padding-x-sm {
        padding: .5em 0;
    }

    .sd-padding-y-sm {
        padding: 0 .5em;
    }

    .sd-padding-top-sm {
        padding-top: .5em;
    }

    .sd-padding-right-sm {
        padding-right: .5em;
    }

    .sd-padding-bottom-sm {
        padding-bottom: .5em;
    }

    .sd-padding-left-sm {
        padding-left: .5em;
    }

    .sd-margin-sm {
        margin: .5em;
    }

    .sd-margin-x-sm {
        margin: .5em 0;
    }

    .sd-margin-y-sm {
        margin: 0 .5em;
    }

    .sd-margin-top-sm {
        margin-top: .5em;
    }

    .sd-margin-right-sm {
        margin-right: .5em;
    }

    .sd-margin-bottom-sm {
        margin-bottom: .5em;
    }

    .sd-margin-left-sm {
        margin-left: .5em;
    }

    .sd-column-auto-sm {
        grid-template-columns: repeat(auto-fit, minmax(1px, 1fr));
    }

    .sd-column-sm {
        grid-template-columns: minmax(-webkit-min-content, 1fr);
        grid-template-columns: minmax(min-content, 1fr);
    }

    .sd-column-sm-2 {
        grid-template-columns: repeat(2, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(2, minmax(min-content, 1fr));
    }

    .sd-column-sm-3 {
        grid-template-columns: repeat(3, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(3, minmax(min-content, 1fr));
    }

    .sd-column-sm-4 {
        grid-template-columns: repeat(4, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(4, minmax(min-content, 1fr));
    }

    .sd-column-sm-5 {
        grid-template-columns: repeat(5, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(5, minmax(min-content, 1fr));
    }

    .sd-column-sm-6 {
        grid-template-columns: repeat(6, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(6, minmax(min-content, 1fr));
    }

    .sd-column-sm-7 {
        grid-template-columns: repeat(7, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(7, minmax(min-content, 1fr));
    }

    .sd-column-sm-8 {
        grid-template-columns: repeat(8, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(8, minmax(min-content, 1fr));
    }

    .sd-column-sm-9 {
        grid-template-columns: repeat(9, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(9, minmax(min-content, 1fr));
    }

    .sd-column-sm-10 {
        grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(10, minmax(min-content, 1fr));
    }

    .sd-column-sm-11 {
        grid-template-columns: repeat(11, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(11, minmax(min-content, 1fr));
    }

    .sd-column-sm-12 {
        grid-template-columns: repeat(12, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(12, minmax(min-content, 1fr));
    }

    .sd-column-sm-13 {
        grid-template-columns: repeat(13, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(13, minmax(min-content, 1fr));
    }

    .sd-column-sm-14 {
        grid-template-columns: repeat(14, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(14, minmax(min-content, 1fr));
    }

    .sd-column-sm-15 {
        grid-template-columns: repeat(15, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(15, minmax(min-content, 1fr));
    }

    .sd-column-sm-16 {
        grid-template-columns: repeat(16, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(16, minmax(min-content, 1fr));
    }

    .sd-col-span-sm {
        grid-column: span 1;
    }

    .sd-col-span-start-sm {
        grid-column-start: span 1;
    }

    .sd-col-start-sm {
        grid-column-start: 1;
    }

    .sd-col-span-end-sm {
        grid-column-end: span 1;
    }

    .sd-col-end-sm {
        /* grid-column-end: calc(1 + 1); */
        grid-column-end: 1;
    }

    .sd-col-span-sm-2 {
        grid-column: span 2;
    }

    .sd-col-span-start-sm-2 {
        grid-column-start: span 2;
    }

    .sd-col-start-sm-2 {
        grid-column-start: 2;
    }

    .sd-col-span-end-sm-2 {
        grid-column-end: span 2;
    }

    .sd-col-end-sm-2 {
        /* grid-column-end: calc(2 + 1); */
        grid-column-end: 2;
    }

    .sd-col-span-sm-3 {
        grid-column: span 3;
    }

    .sd-col-span-start-sm-3 {
        grid-column-start: span 3;
    }

    .sd-col-start-sm-3 {
        grid-column-start: 3;
    }

    .sd-col-span-end-sm-3 {
        grid-column-end: span 3;
    }

    .sd-col-end-sm-3 {
        /* grid-column-end: calc(3 + 1); */
        grid-column-end: 3;
    }

    .sd-col-span-sm-4 {
        grid-column: span 4;
    }

    .sd-col-span-start-sm-4 {
        grid-column-start: span 4;
    }

    .sd-col-start-sm-4 {
        grid-column-start: 4;
    }

    .sd-col-span-end-sm-4 {
        grid-column-end: span 4;
    }

    .sd-col-end-sm-4 {
        /* grid-column-end: calc(4 + 1); */
        grid-column-end: 4;
    }

    .sd-col-span-sm-5 {
        grid-column: span 5;
    }

    .sd-col-span-start-sm-5 {
        grid-column-start: span 5;
    }

    .sd-col-start-sm-5 {
        grid-column-start: 5;
    }

    .sd-col-span-end-sm-5 {
        grid-column-end: span 5;
    }

    .sd-col-end-sm-5 {
        /* grid-column-end: calc(5 + 1); */
        grid-column-end: 5;
    }

    .sd-col-span-sm-6 {
        grid-column: span 6;
    }

    .sd-col-span-start-sm-6 {
        grid-column-start: span 6;
    }

    .sd-col-start-sm-6 {
        grid-column-start: 6;
    }

    .sd-col-span-end-sm-6 {
        grid-column-end: span 6;
    }

    .sd-col-end-sm-6 {
        /* grid-column-end: calc(6 + 1); */
        grid-column-end: 6;
    }

    .sd-col-span-sm-7 {
        grid-column: span 7;
    }

    .sd-col-span-start-sm-7 {
        grid-column-start: span 7;
    }

    .sd-col-start-sm-7 {
        grid-column-start: 7;
    }

    .sd-col-span-end-sm-7 {
        grid-column-end: span 7;
    }

    .sd-col-end-sm-7 {
        /* grid-column-end: calc(7 + 1); */
        grid-column-end: 7;
    }

    .sd-col-span-sm-8 {
        grid-column: span 8;
    }

    .sd-col-span-start-sm-8 {
        grid-column-start: span 8;
    }

    .sd-col-start-sm-8 {
        grid-column-start: 8;
    }

    .sd-col-span-end-sm-8 {
        grid-column-end: span 8;
    }

    .sd-col-end-sm-8 {
        /* grid-column-end: calc(8 + 1); */
        grid-column-end: 8;
    }

    .sd-col-span-sm-9 {
        grid-column: span 9;
    }

    .sd-col-span-start-sm-9 {
        grid-column-start: span 9;
    }

    .sd-col-start-sm-9 {
        grid-column-start: 9;
    }

    .sd-col-span-end-sm-9 {
        grid-column-end: span 9;
    }

    .sd-col-end-sm-9 {
        /* grid-column-end: calc(9 + 1); */
        grid-column-end: 9;
    }

    .sd-col-span-sm-10 {
        grid-column: span 10;
    }

    .sd-col-span-start-sm-10 {
        grid-column-start: span 10;
    }

    .sd-col-start-sm-10 {
        grid-column-start: 10;
    }

    .sd-col-span-end-sm-10 {
        grid-column-end: span 10;
    }

    .sd-col-end-sm-10 {
        /* grid-column-end: calc(10 + 1); */
        grid-column-end: 10;
    }

    .sd-col-span-sm-11 {
        grid-column: span 11;
    }

    .sd-col-span-start-sm-11 {
        grid-column-start: span 11;
    }

    .sd-col-start-sm-11 {
        grid-column-start: 11;
    }

    .sd-col-span-end-sm-11 {
        grid-column-end: span 11;
    }

    .sd-col-end-sm-11 {
        /* grid-column-end: calc(11 + 1); */
        grid-column-end: 11;
    }

    .sd-col-span-sm-12 {
        grid-column: span 12;
    }

    .sd-col-span-start-sm-12 {
        grid-column-start: span 12;
    }

    .sd-col-start-sm-12 {
        grid-column-start: 12;
    }

    .sd-col-span-end-sm-12 {
        grid-column-end: span 12;
    }

    .sd-col-end-sm-12 {
        /* grid-column-end: calc(12 + 1); */
        grid-column-end: 12;
    }

    .sd-row-span-sm {
        grid-row: span 1;
    }

    .sd-row-span-start-sm {
        grid-row-start: span 1;
    }

    .sd-row-start-sm {
        grid-row-start: 1;
    }

    .sd-row-span-end-sm {
        grid-row-end: span 1;
    }

    .sd-row-end-sm {
        grid-row-end: 1;
    }

    .sd-row-span-sm-2 {
        grid-row: span 2;
    }

    .sd-row-span-start-sm-2 {
        grid-row-start: span 2;
    }

    .sd-row-start-sm-2 {
        grid-row-start: 2;
    }

    .sd-row-span-end-sm-2 {
        grid-row-end: span 2;
    }

    .sd-row-end-sm-2 {
        grid-row-end: 2;
    }

    .sd-row-span-sm-3 {
        grid-row: span 3;
    }

    .sd-row-span-start-sm-3 {
        grid-row-start: span 3;
    }

    .sd-row-start-sm-3 {
        grid-row-start: 3;
    }

    .sd-row-span-end-sm-3 {
        grid-row-end: span 3;
    }

    .sd-row-end-sm-3 {
        grid-row-end: 3;
    }

    .sd-row-span-sm-4 {
        grid-row: span 4;
    }

    .sd-row-span-start-sm-4 {
        grid-row-start: span 4;
    }

    .sd-row-start-sm-4 {
        grid-row-start: 4;
    }

    .sd-row-span-end-sm-4 {
        grid-row-end: span 4;
    }

    .sd-row-end-sm-4 {
        grid-row-end: 4;
    }

    .sd-row-span-sm-5 {
        grid-row: span 5;
    }

    .sd-row-span-start-sm-5 {
        grid-row-start: span 5;
    }

    .sd-row-start-sm-5 {
        grid-row-start: 5;
    }

    .sd-row-span-end-sm-5 {
        grid-row-end: span 5;
    }

    .sd-row-end-sm-5 {
        grid-row-end: 5;
    }

    .sd-row-span-sm-6 {
        grid-row: span 6;
    }

    .sd-row-span-start-sm-6 {
        grid-row-start: span 6;
    }

    .sd-row-start-sm-6 {
        grid-row-start: 6;
    }

    .sd-row-span-end-sm-6 {
        grid-row-end: span 6;
    }

    .sd-row-end-sm-6 {
        grid-row-end: 6;
    }

    .sd-row-span-sm-7 {
        grid-row: span 7;
    }

    .sd-row-span-start-sm-7 {
        grid-row-start: span 7;
    }

    .sd-row-start-sm-7 {
        grid-row-start: 7;
    }

    .sd-row-span-end-sm-7 {
        grid-row-end: span 7;
    }

    .sd-row-end-sm-7 {
        grid-row-end: 7;
    }

    .sd-row-span-sm-8 {
        grid-row: span 8;
    }

    .sd-row-span-start-sm-8 {
        grid-row-start: span 8;
    }

    .sd-row-start-sm-8 {
        grid-row-start: 8;
    }

    .sd-row-span-end-sm-8 {
        grid-row-end: span 8;
    }

    .sd-row-end-sm-8 {
        grid-row-end: 8;
    }

    .sd-row-span-sm-9 {
        grid-row: span 9;
    }

    .sd-row-span-start-sm-9 {
        grid-row-start: span 9;
    }

    .sd-row-start-sm-9 {
        grid-row-start: 9;
    }

    .sd-row-span-end-sm-9 {
        grid-row-end: span 9;
    }

    .sd-row-end-sm-9 {
        grid-row-end: 9;
    }

    .sd-row-span-sm-10 {
        grid-row: span 10;
    }

    .sd-row-span-start-sm-10 {
        grid-row-start: span 10;
    }

    .sd-row-start-sm-10 {
        grid-row-start: 10;
    }

    .sd-row-span-end-sm-10 {
        grid-row-end: span 10;
    }

    .sd-row-end-sm-10 {
        grid-row-end: 10;
    }

    .sd-row-span-sm-11 {
        grid-row: span 11;
    }

    .sd-row-span-start-sm-11 {
        grid-row-start: span 11;
    }

    .sd-row-start-sm-11 {
        grid-row-start: 11;
    }

    .sd-row-span-end-sm-11 {
        grid-row-end: span 11;
    }

    .sd-row-end-sm-11 {
        grid-row-end: 11;
    }

    .sd-row-span-sm-12 {
        grid-row: span 12;
    }

    .sd-row-span-start-sm-12 {
        grid-row-start: span 12;
    }

    .sd-row-start-sm-12 {
        grid-row-start: 12;
    }

    .sd-row-span-end-sm-12 {
        grid-row-end: span 12;
    }

    .sd-row-end-sm-12 {
        grid-row-end: 12;
    }

}


@media (min-width: 768px) {

    /*  */
    .sd-classic-shown-md{ display:block!important; }
    .sd-classic-flex-shown-md{ display:flex!important; }
    .sd-classic-hidden-md{ display:none!important; }
    
    .sd-classic-label .sd-classic-label-name,
    .sd-classic-field .sd-classic-label-name {
        min-width: 7.5rem;
        max-width: 7.5rem;
    }
    
    .sd-classic-label .sd-classic-label-name-md,
    .sd-classic-field .sd-classic-label-name-md {
        min-width: 13.5rem;
        max-width: 13.5rem;
    }
    .sd-classic-label .sd-classic-label-name-xl,
    .sd-classic-field .sd-classic-label-name-xl {
        min-width: 15.5rem;
        max-width: 15.5rem;
    }
    .sd-classic-label .sd-classic-label-name-xxl,
    .sd-classic-field .sd-classic-label-name-xxl {
        min-width: 17.5rem;
        max-width: 17.5rem;
    }
    
    


    .sd-classic-modal.sd-classic-modal-full .sd-classic-modal-container {
        min-width : 98%;
        min-height: 98%;
    }

    .sd-classic-group,
    .sd-classic-label,
    .sd-classic-field {
        flex-wrap: nowrap;
    }

    .sd-padding-md {
        padding: 1em;
    }

    .sd-padding-x-md {
        padding: 1em 0;
    }

    .sd-padding-y-md {
        padding: 0 1em;
    }

    .sd-padding-top-md {
        padding-top: 1em;
    }

    .sd-padding-right-md {
        padding-right: 1em;
    }

    .sd-padding-bottom-md {
        padding-bottom: 1em;
    }

    .sd-padding-left-md {
        padding-left: 1em;
    }

    .sd-margin-md {
        margin: 1em;
    }

    .sd-margin-x-md {
        margin: 1em 0;
    }

    .sd-margin-y-md {
        margin: 0 1em;
    }

    .sd-margin-top-md {
        margin-top: 1em;
    }

    .sd-margin-right-md {
        margin-right: 1em;
    }

    .sd-margin-bottom-md {
        margin-bottom: 1em;
    }

    .sd-margin-left-md {
        margin-left: 1em;
    }

    .sd-column-auto-md {
        grid-template-columns: repeat(auto-fit, minmax(1px, 1fr));
    }

    .sd-column-md {
        grid-template-columns: minmax(-webkit-min-content, 1fr);
        grid-template-columns: minmax(min-content, 1fr);
    }

    .sd-column-md-2 {
        grid-template-columns: repeat(2, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(2, minmax(min-content, 1fr));
    }

    .sd-column-md-3 {
        grid-template-columns: repeat(3, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(3, minmax(min-content, 1fr));
    }

    .sd-column-md-4 {
        grid-template-columns: repeat(4, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(4, minmax(min-content, 1fr));
    }

    .sd-column-md-5 {
        grid-template-columns: repeat(5, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(5, minmax(min-content, 1fr));
    }

    .sd-column-md-6 {
        grid-template-columns: repeat(6, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(6, minmax(min-content, 1fr));
    }

    .sd-column-md-7 {
        grid-template-columns: repeat(7, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(7, minmax(min-content, 1fr));
    }

    .sd-column-md-8 {
        grid-template-columns: repeat(8, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(8, minmax(min-content, 1fr));
    }

    .sd-column-md-9 {
        grid-template-columns: repeat(9, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(9, minmax(min-content, 1fr));
    }

    .sd-column-md-10 {
        grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(10, minmax(min-content, 1fr));
    }

    .sd-column-md-11 {
        grid-template-columns: repeat(11, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(11, minmax(min-content, 1fr));
    }

    .sd-column-md-12 {
        grid-template-columns: repeat(12, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(12, minmax(min-content, 1fr));
    }

    .sd-column-md-13 {
        grid-template-columns: repeat(13, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(13, minmax(min-content, 1fr));
    }

    .sd-column-md-14 {
        grid-template-columns: repeat(14, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(14, minmax(min-content, 1fr));
    }

    .sd-column-md-15 {
        grid-template-columns: repeat(15, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(15, minmax(min-content, 1fr));
    }

    .sd-column-md-16 {
        grid-template-columns: repeat(16, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(16, minmax(min-content, 1fr));
    }

    .sd-col-span-md {
        grid-column: span 1;
    }

    .sd-col-span-start-md {
        grid-column-start: span 1;
    }

    .sd-col-start-md {
        grid-column-start: 1;
    }

    .sd-col-span-end-md {
        grid-column-end: span 1;
    }

    .sd-col-end-md {
        /* grid-column-end: calc(1 + 1); */
        grid-column-end: 1;
    }

    .sd-col-span-md-2 {
        grid-column: span 2;
    }

    .sd-col-span-start-md-2 {
        grid-column-start: span 2;
    }

    .sd-col-start-md-2 {
        grid-column-start: 2;
    }

    .sd-col-span-end-md-2 {
        grid-column-end: span 2;
    }

    .sd-col-end-md-2 {
        /* grid-column-end: calc(2 + 1); */
        grid-column-end: 2;
    }

    .sd-col-span-md-3 {
        grid-column: span 3;
    }

    .sd-col-span-start-md-3 {
        grid-column-start: span 3;
    }

    .sd-col-start-md-3 {
        grid-column-start: 3;
    }

    .sd-col-span-end-md-3 {
        grid-column-end: span 3;
    }

    .sd-col-end-md-3 {
        /* grid-column-end: calc(3 + 1); */
        grid-column-end: 3;
    }

    .sd-col-span-md-4 {
        grid-column: span 4;
    }

    .sd-col-span-start-md-4 {
        grid-column-start: span 4;
    }

    .sd-col-start-md-4 {
        grid-column-start: 4;
    }

    .sd-col-span-end-md-4 {
        grid-column-end: span 4;
    }

    .sd-col-end-md-4 {
        /* grid-column-end: calc(4 + 1); */
        grid-column-end: 4;
    }

    .sd-col-span-md-5 {
        grid-column: span 5;
    }

    .sd-col-span-start-md-5 {
        grid-column-start: span 5;
    }

    .sd-col-start-md-5 {
        grid-column-start: 5;
    }

    .sd-col-span-end-md-5 {
        grid-column-end: span 5;
    }

    .sd-col-end-md-5 {
        /* grid-column-end: calc(5 + 1); */
        grid-column-end: 5;
    }

    .sd-col-span-md-6 {
        grid-column: span 6;
    }

    .sd-col-span-start-md-6 {
        grid-column-start: span 6;
    }

    .sd-col-start-md-6 {
        grid-column-start: 6;
    }

    .sd-col-span-end-md-6 {
        grid-column-end: span 6;
    }

    .sd-col-end-md-6 {
        /* grid-column-end: calc(6 + 1); */
        grid-column-end: 6;
    }

    .sd-col-span-md-7 {
        grid-column: span 7;
    }

    .sd-col-span-start-md-7 {
        grid-column-start: span 7;
    }

    .sd-col-start-md-7 {
        grid-column-start: 7;
    }

    .sd-col-span-end-md-7 {
        grid-column-end: span 7;
    }

    .sd-col-end-md-7 {
        /* grid-column-end: calc(7 + 1); */
        grid-column-end: 7;
    }

    .sd-col-span-md-8 {
        grid-column: span 8;
    }

    .sd-col-span-start-md-8 {
        grid-column-start: span 8;
    }

    .sd-col-start-md-8 {
        grid-column-start: 8;
    }

    .sd-col-span-end-md-8 {
        grid-column-end: span 8;
    }

    .sd-col-end-md-8 {
        /* grid-column-end: calc(8 + 1); */
        grid-column-end: 8;
    }

    .sd-col-span-md-9 {
        grid-column: span 9;
    }

    .sd-col-span-start-md-9 {
        grid-column-start: span 9;
    }

    .sd-col-start-md-9 {
        grid-column-start: 9;
    }

    .sd-col-span-end-md-9 {
        grid-column-end: span 9;
    }

    .sd-col-end-md-9 {
        /* grid-column-end: calc(9 + 1); */
        grid-column-end: 9;
    }

    .sd-col-span-md-10 {
        grid-column: span 10;
    }

    .sd-col-span-start-md-10 {
        grid-column-start: span 10;
    }

    .sd-col-start-md-10 {
        grid-column-start: 10;
    }

    .sd-col-span-end-md-10 {
        grid-column-end: span 10;
    }

    .sd-col-end-md-10 {
        /* grid-column-end: calc(10 + 1); */
        grid-column-end: 10;
    }

    .sd-col-span-md-11 {
        grid-column: span 11;
    }

    .sd-col-span-start-md-11 {
        grid-column-start: span 11;
    }

    .sd-col-start-md-11 {
        grid-column-start: 11;
    }

    .sd-col-span-end-md-11 {
        grid-column-end: span 11;
    }

    .sd-col-end-md-11 {
        /* grid-column-end: calc(11 + 1); */
        grid-column-end: 11;
    }

    .sd-col-span-md-12 {
        grid-column: span 12;
    }

    .sd-col-span-start-md-12 {
        grid-column-start: span 12;
    }

    .sd-col-start-md-12 {
        grid-column-start: 12;
    }

    .sd-col-span-end-md-12 {
        grid-column-end: span 12;
    }

    .sd-col-end-md-12 {
        /* grid-column-end: calc(12 + 1); */
        grid-column-end: 12;
    }

    .sd-row-span-md {
        grid-row: span 1;
    }

    .sd-row-span-start-md {
        grid-row-start: span 1;
    }

    .sd-row-start-md {
        grid-row-start: 1;
    }

    .sd-row-span-end-md {
        grid-row-end: span 1;
    }

    .sd-row-end-md {
        grid-row-end: 1;
    }

    .sd-row-span-md-2 {
        grid-row: span 2;
    }

    .sd-row-span-start-md-2 {
        grid-row-start: span 2;
    }

    .sd-row-start-md-2 {
        grid-row-start: 2;
    }

    .sd-row-span-end-md-2 {
        grid-row-end: span 2;
    }

    .sd-row-end-md-2 {
        grid-row-end: 2;
    }

    .sd-row-span-md-3 {
        grid-row: span 3;
    }

    .sd-row-span-start-md-3 {
        grid-row-start: span 3;
    }

    .sd-row-start-md-3 {
        grid-row-start: 3;
    }

    .sd-row-span-end-md-3 {
        grid-row-end: span 3;
    }

    .sd-row-end-md-3 {
        grid-row-end: 3;
    }

    .sd-row-span-md-4 {
        grid-row: span 4;
    }

    .sd-row-span-start-md-4 {
        grid-row-start: span 4;
    }

    .sd-row-start-md-4 {
        grid-row-start: 4;
    }

    .sd-row-span-end-md-4 {
        grid-row-end: span 4;
    }

    .sd-row-end-md-4 {
        grid-row-end: 4;
    }

    .sd-row-span-md-5 {
        grid-row: span 5;
    }

    .sd-row-span-start-md-5 {
        grid-row-start: span 5;
    }

    .sd-row-start-md-5 {
        grid-row-start: 5;
    }

    .sd-row-span-end-md-5 {
        grid-row-end: span 5;
    }

    .sd-row-end-md-5 {
        grid-row-end: 5;
    }

    .sd-row-span-md-6 {
        grid-row: span 6;
    }

    .sd-row-span-start-md-6 {
        grid-row-start: span 6;
    }

    .sd-row-start-md-6 {
        grid-row-start: 6;
    }

    .sd-row-span-end-md-6 {
        grid-row-end: span 6;
    }

    .sd-row-end-md-6 {
        grid-row-end: 6;
    }

    .sd-row-span-md-7 {
        grid-row: span 7;
    }

    .sd-row-span-start-md-7 {
        grid-row-start: span 7;
    }

    .sd-row-start-md-7 {
        grid-row-start: 7;
    }

    .sd-row-span-end-md-7 {
        grid-row-end: span 7;
    }

    .sd-row-end-md-7 {
        grid-row-end: 7;
    }

    .sd-row-span-md-8 {
        grid-row: span 8;
    }

    .sd-row-span-start-md-8 {
        grid-row-start: span 8;
    }

    .sd-row-start-md-8 {
        grid-row-start: 8;
    }

    .sd-row-span-end-md-8 {
        grid-row-end: span 8;
    }

    .sd-row-end-md-8 {
        grid-row-end: 8;
    }

    .sd-row-span-md-9 {
        grid-row: span 9;
    }

    .sd-row-span-start-md-9 {
        grid-row-start: span 9;
    }

    .sd-row-start-md-9 {
        grid-row-start: 9;
    }

    .sd-row-span-end-md-9 {
        grid-row-end: span 9;
    }

    .sd-row-end-md-9 {
        grid-row-end: 9;
    }

    .sd-row-span-md-10 {
        grid-row: span 10;
    }

    .sd-row-span-start-md-10 {
        grid-row-start: span 10;
    }

    .sd-row-start-md-10 {
        grid-row-start: 10;
    }

    .sd-row-span-end-md-10 {
        grid-row-end: span 10;
    }

    .sd-row-end-md-10 {
        grid-row-end: 10;
    }

    .sd-row-span-md-11 {
        grid-row: span 11;
    }

    .sd-row-span-start-md-11 {
        grid-row-start: span 11;
    }

    .sd-row-start-md-11 {
        grid-row-start: 11;
    }

    .sd-row-span-end-md-11 {
        grid-row-end: span 11;
    }

    .sd-row-end-md-11 {
        grid-row-end: 11;
    }

    .sd-row-span-md-12 {
        grid-row: span 12;
    }

    .sd-row-span-start-md-12 {
        grid-row-start: span 12;
    }

    .sd-row-start-md-12 {
        grid-row-start: 12;
    }

    .sd-row-span-end-md-12 {
        grid-row-end: span 12;
    }

    .sd-row-end-md-12 {
        grid-row-end: 12;
    }

}

@media (min-width: 992px) {
    
    .sd-classic-shown-lg{ display:block!important; }
    .sd-classic-flex-shown-lg{ display:flex!important; }
    .sd-classic-hidden-lg{ display:none!important; }
    
    .sd-classic-modal.sd-classic-modal-full .sd-classic-modal-container {
        min-width : 98%;
        min-height: 98%;
    }

    .sd-classic-group,
    .sd-classic-label,
    .sd-classic-field {
        flex-wrap: nowrap;
    }

    .sd-padding-lg {
        padding: 1.5em;
    }

    .sd-padding-x-lg {
        padding: 1.5em 0;
    }

    .sd-padding-y-lg {
        padding: 0 1.5em;
    }

    .sd-padding-top-lg {
        padding-top: 1.5em;
    }

    .sd-padding-right-lg {
        padding-right: 1.5em;
    }

    .sd-padding-bottom-lg {
        padding-bottom: 1.5em;
    }

    .sd-padding-left-lg {
        padding-left: 1.5em;
    }

    .sd-margin-lg {
        margin: 1.5em;
    }

    .sd-margin-x-lg {
        margin: 1.5em 0;
    }

    .sd-margin-y-lg {
        margin: 0 1.5em;
    }

    .sd-margin-top-lg {
        margin-top: 1.5em;
    }

    .sd-margin-right-lg {
        margin-right: 1.5em;
    }

    .sd-margin-bottom-lg {
        margin-bottom: 1.5em;
    }

    .sd-margin-left-lg {
        margin-left: 1.5em;
    }

    .sd-column-auto-lg {
        grid-template-columns: repeat(auto-fit, minmax(1px, 1fr));
    }

    .sd-column-lg {
        grid-template-columns: minmax(-webkit-min-content, 1fr);
        grid-template-columns: minmax(min-content, 1fr);
    }

    .sd-column-lg-2 {
        grid-template-columns: repeat(2, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(2, minmax(min-content, 1fr));
    }

    .sd-column-lg-3 {
        grid-template-columns: repeat(3, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(3, minmax(min-content, 1fr));
    }

    .sd-column-lg-4 {
        grid-template-columns: repeat(4, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(4, minmax(min-content, 1fr));
    }

    .sd-column-lg-5 {
        grid-template-columns: repeat(5, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(5, minmax(min-content, 1fr));
    }

    .sd-column-lg-6 {
        grid-template-columns: repeat(6, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(6, minmax(min-content, 1fr));
    }

    .sd-column-lg-7 {
        grid-template-columns: repeat(7, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(7, minmax(min-content, 1fr));
    }

    .sd-column-lg-8 {
        grid-template-columns: repeat(8, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(8, minmax(min-content, 1fr));
    }

    .sd-column-lg-9 {
        grid-template-columns: repeat(9, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(9, minmax(min-content, 1fr));
    }

    .sd-column-lg-10 {
        grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(10, minmax(min-content, 1fr));
    }

    .sd-column-lg-11 {
        grid-template-columns: repeat(11, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(11, minmax(min-content, 1fr));
    }

    .sd-column-lg-12 {
        grid-template-columns: repeat(12, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(12, minmax(min-content, 1fr));
    }

    .sd-column-lg-13 {
        grid-template-columns: repeat(13, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(13, minmax(min-content, 1fr));
    }

    .sd-column-lg-14 {
        grid-template-columns: repeat(14, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(14, minmax(min-content, 1fr));
    }

    .sd-column-lg-15 {
        grid-template-columns: repeat(15, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(15, minmax(min-content, 1fr));
    }

    .sd-column-lg-16 {
        grid-template-columns: repeat(16, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(16, minmax(min-content, 1fr));
    }

    .sd-col-span-lg {
        grid-column: span 1;
    }

    .sd-col-span-start-lg {
        grid-column-start: span 1;
    }

    .sd-col-start-lg {
        grid-column-start: 1;
    }

    .sd-col-span-end-lg {
        grid-column-end: span 1;
    }

    .sd-col-end-lg {
        /* grid-column-end: calc(1 + 1); */
        grid-column-end: 1;
    }

    .sd-col-span-lg-2 {
        grid-column: span 2;
    }

    .sd-col-span-start-lg-2 {
        grid-column-start: span 2;
    }

    .sd-col-start-lg-2 {
        grid-column-start: 2;
    }

    .sd-col-span-end-lg-2 {
        grid-column-end: span 2;
    }

    .sd-col-end-lg-2 {
        /* grid-column-end: calc(2 + 1); */
        grid-column-end: 2;
    }

    .sd-col-span-lg-3 {
        grid-column: span 3;
    }

    .sd-col-span-start-lg-3 {
        grid-column-start: span 3;
    }

    .sd-col-start-lg-3 {
        grid-column-start: 3;
    }

    .sd-col-span-end-lg-3 {
        grid-column-end: span 3;
    }

    .sd-col-end-lg-3 {
        /* grid-column-end: calc(3 + 1); */
        grid-column-end: 3;
    }

    .sd-col-span-lg-4 {
        grid-column: span 4;
    }

    .sd-col-span-start-lg-4 {
        grid-column-start: span 4;
    }

    .sd-col-start-lg-4 {
        grid-column-start: 4;
    }

    .sd-col-span-end-lg-4 {
        grid-column-end: span 4;
    }

    .sd-col-end-lg-4 {
        /* grid-column-end: calc(4 + 1); */
        grid-column-end: 4;
    }

    .sd-col-span-lg-5 {
        grid-column: span 5;
    }

    .sd-col-span-start-lg-5 {
        grid-column-start: span 5;
    }

    .sd-col-start-lg-5 {
        grid-column-start: 5;
    }

    .sd-col-span-end-lg-5 {
        grid-column-end: span 5;
    }

    .sd-col-end-lg-5 {
        /* grid-column-end: calc(5 + 1); */
        grid-column-end: 5;
    }

    .sd-col-span-lg-6 {
        grid-column: span 6;
    }

    .sd-col-span-start-lg-6 {
        grid-column-start: span 6;
    }

    .sd-col-start-lg-6 {
        grid-column-start: 6;
    }

    .sd-col-span-end-lg-6 {
        grid-column-end: span 6;
    }

    .sd-col-end-lg-6 {
        /* grid-column-end: calc(6 + 1); */
        grid-column-end: 6;
    }

    .sd-col-span-lg-7 {
        grid-column: span 7;
    }

    .sd-col-span-start-lg-7 {
        grid-column-start: span 7;
    }

    .sd-col-start-lg-7 {
        grid-column-start: 7;
    }

    .sd-col-span-end-lg-7 {
        grid-column-end: span 7;
    }

    .sd-col-end-lg-7 {
        /* grid-column-end: calc(7 + 1); */
        grid-column-end: 7;
    }

    .sd-col-span-lg-8 {
        grid-column: span 8;
    }

    .sd-col-span-start-lg-8 {
        grid-column-start: span 8;
    }

    .sd-col-start-lg-8 {
        grid-column-start: 8;
    }

    .sd-col-span-end-lg-8 {
        grid-column-end: span 8;
    }

    .sd-col-end-lg-8 {
        /* grid-column-end: calc(8 + 1); */
        grid-column-end: 8;
    }

    .sd-col-span-lg-9 {
        grid-column: span 9;
    }

    .sd-col-span-start-lg-9 {
        grid-column-start: span 9;
    }

    .sd-col-start-lg-9 {
        grid-column-start: 9;
    }

    .sd-col-span-end-lg-9 {
        grid-column-end: span 9;
    }

    .sd-col-end-lg-9 {
        /* grid-column-end: calc(9 + 1); */
        grid-column-end: 9;
    }

    .sd-col-span-lg-10 {
        grid-column: span 10;
    }

    .sd-col-span-start-lg-10 {
        grid-column-start: span 10;
    }

    .sd-col-start-lg-10 {
        grid-column-start: 10;
    }

    .sd-col-span-end-lg-10 {
        grid-column-end: span 10;
    }

    .sd-col-end-lg-10 {
        /* grid-column-end: calc(10 + 1); */
        grid-column-end: 10;
    }

    .sd-col-span-lg-11 {
        grid-column: span 11;
    }

    .sd-col-span-start-lg-11 {
        grid-column-start: span 11;
    }

    .sd-col-start-lg-11 {
        grid-column-start: 11;
    }

    .sd-col-span-end-lg-11 {
        grid-column-end: span 11;
    }

    .sd-col-end-lg-11 {
        /* grid-column-end: calc(11 + 1); */
        grid-column-end: 11;
    }

    .sd-col-span-lg-12 {
        grid-column: span 12;
    }

    .sd-col-span-start-lg-12 {
        grid-column-start: span 12;
    }

    .sd-col-start-lg-12 {
        grid-column-start: 12;
    }

    .sd-col-span-end-lg-12 {
        grid-column-end: span 12;
    }

    .sd-col-end-lg-12 {
        /* grid-column-end: calc(12 + 1); */
        grid-column-end: 12;
    }

    .sd-row-span-lg {
        grid-row: span 1;
    }

    .sd-row-span-start-lg {
        grid-row-start: span 1;
    }

    .sd-row-start-lg {
        grid-row-start: 1;
    }

    .sd-row-span-end-lg {
        grid-row-end: span 1;
    }

    .sd-row-end-lg {
        grid-row-end: 1;
    }

    .sd-row-span-lg-2 {
        grid-row: span 2;
    }

    .sd-row-span-start-lg-2 {
        grid-row-start: span 2;
    }

    .sd-row-start-lg-2 {
        grid-row-start: 2;
    }

    .sd-row-span-end-lg-2 {
        grid-row-end: span 2;
    }

    .sd-row-end-lg-2 {
        grid-row-end: 2;
    }

    .sd-row-span-lg-3 {
        grid-row: span 3;
    }

    .sd-row-span-start-lg-3 {
        grid-row-start: span 3;
    }

    .sd-row-start-lg-3 {
        grid-row-start: 3;
    }

    .sd-row-span-end-lg-3 {
        grid-row-end: span 3;
    }

    .sd-row-end-lg-3 {
        grid-row-end: 3;
    }

    .sd-row-span-lg-4 {
        grid-row: span 4;
    }

    .sd-row-span-start-lg-4 {
        grid-row-start: span 4;
    }

    .sd-row-start-lg-4 {
        grid-row-start: 4;
    }

    .sd-row-span-end-lg-4 {
        grid-row-end: span 4;
    }

    .sd-row-end-lg-4 {
        grid-row-end: 4;
    }

    .sd-row-span-lg-5 {
        grid-row: span 5;
    }

    .sd-row-span-start-lg-5 {
        grid-row-start: span 5;
    }

    .sd-row-start-lg-5 {
        grid-row-start: 5;
    }

    .sd-row-span-end-lg-5 {
        grid-row-end: span 5;
    }

    .sd-row-end-lg-5 {
        grid-row-end: 5;
    }

    .sd-row-span-lg-6 {
        grid-row: span 6;
    }

    .sd-row-span-start-lg-6 {
        grid-row-start: span 6;
    }

    .sd-row-start-lg-6 {
        grid-row-start: 6;
    }

    .sd-row-span-end-lg-6 {
        grid-row-end: span 6;
    }

    .sd-row-end-lg-6 {
        grid-row-end: 6;
    }

    .sd-row-span-lg-7 {
        grid-row: span 7;
    }

    .sd-row-span-start-lg-7 {
        grid-row-start: span 7;
    }

    .sd-row-start-lg-7 {
        grid-row-start: 7;
    }

    .sd-row-span-end-lg-7 {
        grid-row-end: span 7;
    }

    .sd-row-end-lg-7 {
        grid-row-end: 7;
    }

    .sd-row-span-lg-8 {
        grid-row: span 8;
    }

    .sd-row-span-start-lg-8 {
        grid-row-start: span 8;
    }

    .sd-row-start-lg-8 {
        grid-row-start: 8;
    }

    .sd-row-span-end-lg-8 {
        grid-row-end: span 8;
    }

    .sd-row-end-lg-8 {
        grid-row-end: 8;
    }

    .sd-row-span-lg-9 {
        grid-row: span 9;
    }

    .sd-row-span-start-lg-9 {
        grid-row-start: span 9;
    }

    .sd-row-start-lg-9 {
        grid-row-start: 9;
    }

    .sd-row-span-end-lg-9 {
        grid-row-end: span 9;
    }

    .sd-row-end-lg-9 {
        grid-row-end: 9;
    }

    .sd-row-span-lg-10 {
        grid-row: span 10;
    }

    .sd-row-span-start-lg-10 {
        grid-row-start: span 10;
    }

    .sd-row-start-lg-10 {
        grid-row-start: 10;
    }

    .sd-row-span-end-lg-10 {
        grid-row-end: span 10;
    }

    .sd-row-end-lg-10 {
        grid-row-end: 10;
    }

    .sd-row-span-lg-11 {
        grid-row: span 11;
    }

    .sd-row-span-start-lg-11 {
        grid-row-start: span 11;
    }

    .sd-row-start-lg-11 {
        grid-row-start: 11;
    }

    .sd-row-span-end-lg-11 {
        grid-row-end: span 11;
    }

    .sd-row-end-lg-11 {
        grid-row-end: 11;
    }

    .sd-row-span-lg-12 {
        grid-row: span 12;
    }

    .sd-row-span-start-lg-12 {
        grid-row-start: span 12;
    }

    .sd-row-start-lg-12 {
        grid-row-start: 12;
    }

    .sd-row-span-end-lg-12 {
        grid-row-end: span 12;
    }

    .sd-row-end-lg-12 {
        grid-row-end: 12;
    }
}

@media (min-width: 1200px) {
    .sd-classic-shown-xl{ display:block!important; }
    .sd-classic-flex-shown-xl{ display:flex!important; } 
    .sd-classic-hidden-xl{ display:none!important; }
    
    .sd-classic-modal.sd-classic-modal-full .sd-classic-modal-container {
        min-width : 98%;
        min-height: 98%;
    }

    .sd-classic-group,
    .sd-classic-label,
    .sd-classic-field {
        flex-wrap: nowrap;
    }

    .sd-padding-xl {
        padding: 3em;
    }

    .sd-padding-x-xl {
        padding: 3em 0;
    }

    .sd-padding-y-xl {
        padding: 0 3em;
    }

    .sd-padding-top-xl {
        padding-top: 3em;
    }

    .sd-padding-right-xl {
        padding-right: 3em;
    }

    .sd-padding-bottom-xl {
        padding-bottom: 3em;
    }

    .sd-padding-left-xl {
        padding-left: 3em;
    }

    .sd-margin-xl {
        margin: 3em;
    }

    .sd-margin-x-xl {
        margin: 3em 0;
    }

    .sd-margin-y-xl {
        margin: 0 3em;
    }

    .sd-margin-top-xl {
        margin-top: 3em;
    }

    .sd-margin-right-xl {
        margin-right: 3em;
    }

    .sd-margin-bottom-xl {
        margin-bottom: 3em;
    }

    .sd-margin-left-xl {
        margin-left: 3em;
    }

    .sd-column-auto-xl {
        grid-template-columns: repeat(auto-fit, minmax(1px, 1fr));
    }

    .sd-column-xl {
        grid-template-columns: minmax(-webkit-min-content, 1fr);
        grid-template-columns: minmax(min-content, 1fr);
    }

    .sd-column-xl-2 {
        grid-template-columns: repeat(2, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(2, minmax(min-content, 1fr));
    }

    .sd-column-xl-3 {
        grid-template-columns: repeat(3, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(3, minmax(min-content, 1fr));
    }

    .sd-column-xl-4 {
        grid-template-columns: repeat(4, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(4, minmax(min-content, 1fr));
    }

    .sd-column-xl-5 {
        grid-template-columns: repeat(5, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(5, minmax(min-content, 1fr));
    }

    .sd-column-xl-6 {
        grid-template-columns: repeat(6, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(6, minmax(min-content, 1fr));
    }

    .sd-column-xl-7 {
        grid-template-columns: repeat(7, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(7, minmax(min-content, 1fr));
    }

    .sd-column-xl-8 {
        grid-template-columns: repeat(8, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(8, minmax(min-content, 1fr));
    }

    .sd-column-xl-9 {
        grid-template-columns: repeat(9, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(9, minmax(min-content, 1fr));
    }

    .sd-column-xl-10 {
        grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(10, minmax(min-content, 1fr));
    }

    .sd-column-xl-11 {
        grid-template-columns: repeat(11, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(11, minmax(min-content, 1fr));
    }

    .sd-column-xl-12 {
        grid-template-columns: repeat(12, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(12, minmax(min-content, 1fr));
    }

    .sd-column-xl-13 {
        grid-template-columns: repeat(13, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(13, minmax(min-content, 1fr));
    }

    .sd-column-xl-14 {
        grid-template-columns: repeat(14, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(14, minmax(min-content, 1fr));
    }

    .sd-column-xl-15 {
        grid-template-columns: repeat(15, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(15, minmax(min-content, 1fr));
    }

    .sd-column-xl-16 {
        grid-template-columns: repeat(16, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(16, minmax(min-content, 1fr));
    }


    .sd-col-span-xl {
        grid-column: span 1;
    }

    .sd-col-span-start-xl {
        grid-column-start: span 1;
    }

    .sd-col-start-xl {
        grid-column-start: 1;
    }

    .sd-col-span-end-xl {
        grid-column-end: span 1;
    }

    .sd-col-end-xl {
        /* grid-column-end: calc(1 + 1); */
        grid-column-end: 1;
    }

    .sd-col-span-xl-2 {
        grid-column: span 2;
    }

    .sd-col-span-start-xl-2 {
        grid-column-start: span 2;
    }

    .sd-col-start-xl-2 {
        grid-column-start: 2;
    }

    .sd-col-span-end-xl-2 {
        grid-column-end: span 2;
    }

    .sd-col-end-xl-2 {
        /* grid-column-end: calc(2 + 1); */
        grid-column-end: 2;
    }

    .sd-col-span-xl-3 {
        grid-column: span 3;
    }

    .sd-col-span-start-xl-3 {
        grid-column-start: span 3;
    }

    .sd-col-start-xl-3 {
        grid-column-start: 3;
    }

    .sd-col-span-end-xl-3 {
        grid-column-end: span 3;
    }

    .sd-col-end-xl-3 {
        /* grid-column-end: calc(3 + 1); */
        grid-column-end: 3;
    }

    .sd-col-span-xl-4 {
        grid-column: span 4;
    }

    .sd-col-span-start-xl-4 {
        grid-column-start: span 4;
    }

    .sd-col-start-xl-4 {
        grid-column-start: 4;
    }

    .sd-col-span-end-xl-4 {
        grid-column-end: span 4;
    }

    .sd-col-end-xl-4 {
        /* grid-column-end: calc(4 + 1); */
        grid-column-end: 4;
    }

    .sd-col-span-xl-5 {
        grid-column: span 5;
    }

    .sd-col-span-start-xl-5 {
        grid-column-start: span 5;
    }

    .sd-col-start-xl-5 {
        grid-column-start: 5;
    }

    .sd-col-span-end-xl-5 {
        grid-column-end: span 5;
    }

    .sd-col-end-xl-5 {
        /* grid-column-end: calc(5 + 1); */
        grid-column-end: 5;
    }

    .sd-col-span-xl-6 {
        grid-column: span 6;
    }

    .sd-col-span-start-xl-6 {
        grid-column-start: span 6;
    }

    .sd-col-start-xl-6 {
        grid-column-start: 6;
    }

    .sd-col-span-end-xl-6 {
        grid-column-end: span 6;
    }

    .sd-col-end-xl-6 {
        /* grid-column-end: calc(6 + 1); */
        grid-column-end: 6;
    }

    .sd-col-span-xl-7 {
        grid-column: span 7;
    }

    .sd-col-span-start-xl-7 {
        grid-column-start: span 7;
    }

    .sd-col-start-xl-7 {
        grid-column-start: 7;
    }

    .sd-col-span-end-xl-7 {
        grid-column-end: span 7;
    }

    .sd-col-end-xl-7 {
        /* grid-column-end: calc(7 + 1); */
        grid-column-end: 7;
    }

    .sd-col-span-xl-8 {
        grid-column: span 8;
    }

    .sd-col-span-start-xl-8 {
        grid-column-start: span 8;
    }

    .sd-col-start-xl-8 {
        grid-column-start: 8;
    }

    .sd-col-span-end-xl-8 {
        grid-column-end: span 8;
    }

    .sd-col-end-xl-8 {
        /* grid-column-end: calc(8 + 1); */
        grid-column-end: 8;
    }

    .sd-col-span-xl-9 {
        grid-column: span 9;
    }

    .sd-col-span-start-xl-9 {
        grid-column-start: span 9;
    }

    .sd-col-start-xl-9 {
        grid-column-start: 9;
    }

    .sd-col-span-end-xl-9 {
        grid-column-end: span 9;
    }

    .sd-col-end-xl-9 {
        /* grid-column-end: calc(9 + 1); */
        grid-column-end: 9;
    }

    .sd-col-span-xl-10 {
        grid-column: span 10;
    }

    .sd-col-span-start-xl-10 {
        grid-column-start: span 10;
    }

    .sd-col-start-xl-10 {
        grid-column-start: 10;
    }

    .sd-col-span-end-xl-10 {
        grid-column-end: span 10;
    }

    .sd-col-end-xl-10 {
        /* grid-column-end: calc(10 + 1); */
        grid-column-end: 10;
    }

    .sd-col-span-xl-11 {
        grid-column: span 11;
    }

    .sd-col-span-start-xl-11 {
        grid-column-start: span 11;
    }

    .sd-col-start-xl-11 {
        grid-column-start: 11;
    }

    .sd-col-span-end-xl-11 {
        grid-column-end: span 11;
    }

    .sd-col-end-xl-11 {
        /* grid-column-end: calc(11 + 1); */
        grid-column-end: 11;
    }

    .sd-col-span-xl-12 {
        grid-column: span 12;
    }

    .sd-col-span-start-xl-12 {
        grid-column-start: span 12;
    }

    .sd-col-start-xl-12 {
        grid-column-start: 12;
    }

    .sd-col-span-end-xl-12 {
        grid-column-end: span 12;
    }

    .sd-col-end-xl-12 {
        /* grid-column-end: calc(12 + 1); */
        grid-column-end: 12;
    }


    .sd-row-span-xl {
        grid-row: span 1;
    }

    .sd-row-span-start-xl {
        grid-row-start: span 1;
    }

    .sd-row-start-xl {
        grid-row-start: 1;
    }

    .sd-row-span-end-xl {
        grid-row-end: span 1;
    }

    .sd-row-end-xl {
        grid-row-end: 1;
    }

    .sd-row-span-xl-2 {
        grid-row: span 2;
    }

    .sd-row-span-start-xl-2 {
        grid-row-start: span 2;
    }

    .sd-row-start-xl-2 {
        grid-row-start: 2;
    }

    .sd-row-span-end-xl-2 {
        grid-row-end: span 2;
    }

    .sd-row-end-xl-2 {
        grid-row-end: 2;
    }

    .sd-row-span-xl-3 {
        grid-row: span 3;
    }

    .sd-row-span-start-xl-3 {
        grid-row-start: span 3;
    }

    .sd-row-start-xl-3 {
        grid-row-start: 3;
    }

    .sd-row-span-end-xl-3 {
        grid-row-end: span 3;
    }

    .sd-row-end-xl-3 {
        grid-row-end: 3;
    }

    .sd-row-span-xl-4 {
        grid-row: span 4;
    }

    .sd-row-span-start-xl-4 {
        grid-row-start: span 4;
    }

    .sd-row-start-xl-4 {
        grid-row-start: 4;
    }

    .sd-row-span-end-xl-4 {
        grid-row-end: span 4;
    }

    .sd-row-end-xl-4 {
        grid-row-end: 4;
    }

    .sd-row-span-xl-5 {
        grid-row: span 5;
    }

    .sd-row-span-start-xl-5 {
        grid-row-start: span 5;
    }

    .sd-row-start-xl-5 {
        grid-row-start: 5;
    }

    .sd-row-span-end-xl-5 {
        grid-row-end: span 5;
    }

    .sd-row-end-xl-5 {
        grid-row-end: 5;
    }

    .sd-row-span-xl-6 {
        grid-row: span 6;
    }

    .sd-row-span-start-xl-6 {
        grid-row-start: span 6;
    }

    .sd-row-start-xl-6 {
        grid-row-start: 6;
    }

    .sd-row-span-end-xl-6 {
        grid-row-end: span 6;
    }

    .sd-row-end-xl-6 {
        grid-row-end: 6;
    }

    .sd-row-span-xl-7 {
        grid-row: span 7;
    }

    .sd-row-span-start-xl-7 {
        grid-row-start: span 7;
    }

    .sd-row-start-xl-7 {
        grid-row-start: 7;
    }

    .sd-row-span-end-xl-7 {
        grid-row-end: span 7;
    }

    .sd-row-end-xl-7 {
        grid-row-end: 7;
    }

    .sd-row-span-xl-8 {
        grid-row: span 8;
    }

    .sd-row-span-start-xl-8 {
        grid-row-start: span 8;
    }

    .sd-row-start-xl-8 {
        grid-row-start: 8;
    }

    .sd-row-span-end-xl-8 {
        grid-row-end: span 8;
    }

    .sd-row-end-xl-8 {
        grid-row-end: 8;
    }

    .sd-row-span-xl-9 {
        grid-row: span 9;
    }

    .sd-row-span-start-xl-9 {
        grid-row-start: span 9;
    }

    .sd-row-start-xl-9 {
        grid-row-start: 9;
    }

    .sd-row-span-end-xl-9 {
        grid-row-end: span 9;
    }

    .sd-row-end-xl-9 {
        grid-row-end: 9;
    }

    .sd-row-span-xl-10 {
        grid-row: span 10;
    }

    .sd-row-span-start-xl-10 {
        grid-row-start: span 10;
    }

    .sd-row-start-xl-10 {
        grid-row-start: 10;
    }

    .sd-row-span-end-xl-10 {
        grid-row-end: span 10;
    }

    .sd-row-end-xl-10 {
        grid-row-end: 10;
    }

    .sd-row-span-xl-11 {
        grid-row: span 11;
    }

    .sd-row-span-start-xl-11 {
        grid-row-start: span 11;
    }

    .sd-row-start-xl-11 {
        grid-row-start: 11;
    }

    .sd-row-span-end-xl-11 {
        grid-row-end: span 11;
    }

    .sd-row-end-xl-11 {
        grid-row-end: 11;
    }

    .sd-row-span-xl-12 {
        grid-row: span 12;
    }

    .sd-row-span-start-xl-12 {
        grid-row-start: span 12;
    }

    .sd-row-start-xl-12 {
        grid-row-start: 12;
    }

    .sd-row-span-end-xl-12 {
        grid-row-end: span 12;
    }

    .sd-row-end-xl-12 {
        grid-row-end: 12;
    }



}

@media (min-width:1440px) {
    .sd-classic-shown-xxl{ display:block!important; }
    .sd-classic-flex-shown-xxl{ display:flex!important; }
    .sd-classic-hidden-xxl{ display:none!important; }
    
    .sd-classic-modal.sd-classic-modal-full .sd-classic-modal-container {
        min-width : 98%;
        min-height: 98%;
    }

    .sd-classic-group,
    .sd-classic-label,
    .sd-classic-field {
        flex-wrap: nowrap;
    }

    .sd-padding-xxl {
        padding: 3em;
    }

    .sd-padding-x-xxl {
        padding: 3em 0;
    }

    .sd-padding-y-xxl {
        padding: 0 3em;
    }

    .sd-padding-top-xxl {
        padding-top: 3em;
    }

    .sd-padding-right-xxl {
        padding-right: 3em;
    }

    .sd-padding-bottom-xxl {
        padding-bottom: 3em;
    }

    .sd-padding-left-xxl {
        padding-left: 3em;
    }

    .sd-margin-xxl {
        margin: 3em;
    }

    .sd-margin-x-xxl {
        margin: 3em 0;
    }

    .sd-margin-y-xxl {
        margin: 0 3em;
    }

    .sd-margin-top-xxl {
        margin-top: 3em;
    }

    .sd-margin-right-xxl {
        margin-right: 3em;
    }

    .sd-margin-bottom-xxl {
        margin-bottom: 3em;
    }

    .sd-margin-left-xxl {
        margin-left: 3em;
    }

    .sd-column-auto-xxl {
        grid-template-columns: repeat(auto-fit, minmax(1px, 1fr));
    }

    .sd-column-xxl {
        grid-template-columns: minmax(-webkit-min-content, 1fr);
        grid-template-columns: minmax(min-content, 1fr);
    }

    .sd-column-xxl-2 {
        grid-template-columns: repeat(2, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(2, minmax(min-content, 1fr));
    }

    .sd-column-xxl-3 {
        grid-template-columns: repeat(3, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(3, minmax(min-content, 1fr));
    }

    .sd-column-xxl-4 {
        grid-template-columns: repeat(4, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(4, minmax(min-content, 1fr));
    }

    .sd-column-xxl-5 {
        grid-template-columns: repeat(5, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(5, minmax(min-content, 1fr));
    }

    .sd-column-xxl-6 {
        grid-template-columns: repeat(6, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(6, minmax(min-content, 1fr));
    }

    .sd-column-xxl-7 {
        grid-template-columns: repeat(7, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(7, minmax(min-content, 1fr));
    }

    .sd-column-xxl-8 {
        grid-template-columns: repeat(8, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(8, minmax(min-content, 1fr));
    }

    .sd-column-xxl-9 {
        grid-template-columns: repeat(9, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(9, minmax(min-content, 1fr));
    }

    .sd-column-xxl-10 {
        grid-template-columns: repeat(10, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(10, minmax(min-content, 1fr));
    }

    .sd-column-xxl-11 {
        grid-template-columns: repeat(11, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(11, minmax(min-content, 1fr));
    }

    .sd-column-xxl-12 {
        grid-template-columns: repeat(12, minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(12, minmax(min-content, 1fr));
    }

    .sd-column-xxl-13 {
        grid-template-columns: repeat(123 minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(123 minmax(min-content, 1fr));
    }

    .sd-column-xxl-14 {
        grid-template-columns: repeat(124 minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(124 minmax(min-content, 1fr));
    }

    .sd-column-xxl-15 {
        grid-template-columns: repeat(125 minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(125 minmax(min-content, 1fr));
    }

    .sd-column-xxl-16 {
        grid-template-columns: repeat(126 minmax(-webkit-min-content, 1fr));
        grid-template-columns: repeat(126 minmax(min-content, 1fr));
    }


    .sd-col-span-xxl {
        grid-column: span 1;
    }

    .sd-col-span-start-xxl {
        grid-column-start: span 1;
    }

    .sd-col-start-xxl {
        grid-column-start: 1;
    }

    .sd-col-span-end-xxl {
        grid-column-end: span 1;
    }

    .sd-col-end-xxl {
        /* grid-column-end: calc(1 + 1); */
        grid-column-end: 1;
    }

    .sd-col-span-xxl-2 {
        grid-column: span 2;
    }

    .sd-col-span-start-xxl-2 {
        grid-column-start: span 2;
    }

    .sd-col-start-xxl-2 {
        grid-column-start: 2;
    }

    .sd-col-span-end-xxl-2 {
        grid-column-end: span 2;
    }

    .sd-col-end-xxl-2 {
        /* grid-column-end: calc(2 + 1); */
        grid-column-end: 2;
    }

    .sd-col-span-xxl-3 {
        grid-column: span 3;
    }

    .sd-col-span-start-xxl-3 {
        grid-column-start: span 3;
    }

    .sd-col-start-xxl-3 {
        grid-column-start: 3;
    }

    .sd-col-span-end-xxl-3 {
        grid-column-end: span 3;
    }

    .sd-col-end-xxl-3 {
        /* grid-column-end: calc(3 + 1); */
        grid-column-end: 3;
    }

    .sd-col-span-xxl-4 {
        grid-column: span 4;
    }

    .sd-col-span-start-xxl-4 {
        grid-column-start: span 4;
    }

    .sd-col-start-xxl-4 {
        grid-column-start: 4;
    }

    .sd-col-span-end-xxl-4 {
        grid-column-end: span 4;
    }

    .sd-col-end-xxl-4 {
        /* grid-column-end: calc(4 + 1); */
        grid-column-end: 4;
    }

    .sd-col-span-xxl-5 {
        grid-column: span 5;
    }

    .sd-col-span-start-xxl-5 {
        grid-column-start: span 5;
    }

    .sd-col-start-xxl-5 {
        grid-column-start: 5;
    }

    .sd-col-span-end-xxl-5 {
        grid-column-end: span 5;
    }

    .sd-col-end-xxl-5 {
        /* grid-column-end: calc(5 + 1); */
        grid-column-end: 5;
    }

    .sd-col-span-xxl-6 {
        grid-column: span 6;
    }

    .sd-col-span-start-xxl-6 {
        grid-column-start: span 6;
    }

    .sd-col-start-xxl-6 {
        grid-column-start: 6;
    }

    .sd-col-span-end-xxl-6 {
        grid-column-end: span 6;
    }

    .sd-col-end-xxl-6 {
        /* grid-column-end: calc(6 + 1); */
        grid-column-end: 6;
    }

    .sd-col-span-xxl-7 {
        grid-column: span 7;
    }

    .sd-col-span-start-xxl-7 {
        grid-column-start: span 7;
    }

    .sd-col-start-xxl-7 {
        grid-column-start: 7;
    }

    .sd-col-span-end-xxl-7 {
        grid-column-end: span 7;
    }

    .sd-col-end-xxl-7 {
        /* grid-column-end: calc(7 + 1); */
        grid-column-end: 7;
    }

    .sd-col-span-xxl-8 {
        grid-column: span 8;
    }

    .sd-col-span-start-xxl-8 {
        grid-column-start: span 8;
    }

    .sd-col-start-xxl-8 {
        grid-column-start: 8;
    }

    .sd-col-span-end-xxl-8 {
        grid-column-end: span 8;
    }

    .sd-col-end-xxl-8 {
        /* grid-column-end: calc(8 + 1); */
        grid-column-end: 8;
    }

    .sd-col-span-xxl-9 {
        grid-column: span 9;
    }

    .sd-col-span-start-xxl-9 {
        grid-column-start: span 9;
    }

    .sd-col-start-xxl-9 {
        grid-column-start: 9;
    }

    .sd-col-span-end-xxl-9 {
        grid-column-end: span 9;
    }

    .sd-col-end-xxl-9 {
        /* grid-column-end: calc(9 + 1); */
        grid-column-end: 9;
    }

    .sd-col-span-xxl-10 {
        grid-column: span 10;
    }

    .sd-col-span-start-xxl-10 {
        grid-column-start: span 10;
    }

    .sd-col-start-xxl-10 {
        grid-column-start: 10;
    }

    .sd-col-span-end-xxl-10 {
        grid-column-end: span 10;
    }

    .sd-col-end-xxl-10 {
        /* grid-column-end: calc(10 + 1); */
        grid-column-end: 10;
    }

    .sd-col-span-xxl-11 {
        grid-column: span 11;
    }

    .sd-col-span-start-xxl-11 {
        grid-column-start: span 11;
    }

    .sd-col-start-xxl-11 {
        grid-column-start: 11;
    }

    .sd-col-span-end-xxl-11 {
        grid-column-end: span 11;
    }

    .sd-col-end-xxl-11 {
        /* grid-column-end: calc(11 + 1); */
        grid-column-end: 11;
    }

    .sd-col-span-xxl-12 {
        grid-column: span 12;
    }

    .sd-col-span-start-xxl-12 {
        grid-column-start: span 12;
    }

    .sd-col-start-xxl-12 {
        grid-column-start: 12;
    }

    .sd-col-span-end-xxl-12 {
        grid-column-end: span 12;
    }

    .sd-col-end-xxl-12 {
        /* grid-column-end: calc(12 + 1); */
        grid-column-end: 12;
    }


    .sd-row-span-xxl {
        grid-row: span 1;
    }

    .sd-row-span-start-xxl {
        grid-row-start: span 1;
    }

    .sd-row-start-xxl {
        grid-row-start: 1;
    }

    .sd-row-span-end-xxl {
        grid-row-end: span 1;
    }

    .sd-row-end-xxl {
        grid-row-end: 1;
    }

    .sd-row-span-xxl-2 {
        grid-row: span 2;
    }

    .sd-row-span-start-xxl-2 {
        grid-row-start: span 2;
    }

    .sd-row-start-xxl-2 {
        grid-row-start: 2;
    }

    .sd-row-span-end-xxl-2 {
        grid-row-end: span 2;
    }

    .sd-row-end-xxl-2 {
        grid-row-end: 2;
    }

    .sd-row-span-xxl-3 {
        grid-row: span 3;
    }

    .sd-row-span-start-xxl-3 {
        grid-row-start: span 3;
    }

    .sd-row-start-xxl-3 {
        grid-row-start: 3;
    }

    .sd-row-span-end-xxl-3 {
        grid-row-end: span 3;
    }

    .sd-row-end-xxl-3 {
        grid-row-end: 3;
    }

    .sd-row-span-xxl-4 {
        grid-row: span 4;
    }

    .sd-row-span-start-xxl-4 {
        grid-row-start: span 4;
    }

    .sd-row-start-xxl-4 {
        grid-row-start: 4;
    }

    .sd-row-span-end-xxl-4 {
        grid-row-end: span 4;
    }

    .sd-row-end-xxl-4 {
        grid-row-end: 4;
    }

    .sd-row-span-xxl-5 {
        grid-row: span 5;
    }

    .sd-row-span-start-xxl-5 {
        grid-row-start: span 5;
    }

    .sd-row-start-xxl-5 {
        grid-row-start: 5;
    }

    .sd-row-span-end-xxl-5 {
        grid-row-end: span 5;
    }

    .sd-row-end-xxl-5 {
        grid-row-end: 5;
    }

    .sd-row-span-xxl-6 {
        grid-row: span 6;
    }

    .sd-row-span-start-xxl-6 {
        grid-row-start: span 6;
    }

    .sd-row-start-xxl-6 {
        grid-row-start: 6;
    }

    .sd-row-span-end-xxl-6 {
        grid-row-end: span 6;
    }

    .sd-row-end-xxl-6 {
        grid-row-end: 6;
    }

    .sd-row-span-xxl-7 {
        grid-row: span 7;
    }

    .sd-row-span-start-xxl-7 {
        grid-row-start: span 7;
    }

    .sd-row-start-xxl-7 {
        grid-row-start: 7;
    }

    .sd-row-span-end-xxl-7 {
        grid-row-end: span 7;
    }

    .sd-row-end-xxl-7 {
        grid-row-end: 7;
    }

    .sd-row-span-xxl-8 {
        grid-row: span 8;
    }

    .sd-row-span-start-xxl-8 {
        grid-row-start: span 8;
    }

    .sd-row-start-xxl-8 {
        grid-row-start: 8;
    }

    .sd-row-span-end-xxl-8 {
        grid-row-end: span 8;
    }

    .sd-row-end-xxl-8 {
        grid-row-end: 8;
    }

    .sd-row-span-xxl-9 {
        grid-row: span 9;
    }

    .sd-row-span-start-xxl-9 {
        grid-row-start: span 9;
    }

    .sd-row-start-xxl-9 {
        grid-row-start: 9;
    }

    .sd-row-span-end-xxl-9 {
        grid-row-end: span 9;
    }

    .sd-row-end-xxl-9 {
        grid-row-end: 9;
    }

    .sd-row-span-xxl-10 {
        grid-row: span 10;
    }

    .sd-row-span-start-xxl-10 {
        grid-row-start: span 10;
    }

    .sd-row-start-xxl-10 {
        grid-row-start: 10;
    }

    .sd-row-span-end-xxl-10 {
        grid-row-end: span 10;
    }

    .sd-row-end-xxl-10 {
        grid-row-end: 10;
    }

    .sd-row-span-xxl-11 {
        grid-row: span 11;
    }

    .sd-row-span-start-xxl-11 {
        grid-row-start: span 11;
    }

    .sd-row-start-xxl-11 {
        grid-row-start: 11;
    }

    .sd-row-span-end-xxl-11 {
        grid-row-end: span 11;
    }

    .sd-row-end-xxl-11 {
        grid-row-end: 11;
    }

    .sd-row-span-xxl-12 {
        grid-row: span 12;
    }

    .sd-row-span-start-xxl-12 {
        grid-row-start: span 12;
    }

    .sd-row-start-xxl-12 {
        grid-row-start: 12;
    }

    .sd-row-span-end-xxl-12 {
        grid-row-end: span 12;
    }

    .sd-row-end-xxl-12 {
        grid-row-end: 12;
    }



}

.sd-occurs,
.sd-group-occurs {
    height: auto;
    flex  : 1;

}

.sd-occurs {
    min-height: 10rem;
}





.sd-classic-details {
    position          : relative;
    -webkit-appearance: none;
    margin            : 0.2rem 0;
}



.sd-classic-summary::-webkit-details-marker {
    display: none
}

.sd-classic-summary>div {
    width         : calc(100% - 50px);
    display       : inline-block;
    vertical-align: middle;
}



.sd-classic-summary {
    display            : block;
    position           : absolute;
    left               : 50%;
    bottom             : -5px;
    box-shadow         : inset 0px 1px 0px 0px #ffffff;
    background         : linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
    background-color   : #ededed;
    border-radius      : 42px;
    border             : 1px solid #dcdcdc;
    display            : inline-block;
    cursor             : pointer;
    color              : #777777;
    font-family        : Arial;
    font-size          : 15px;
    text-align         : center;
    font-weight        : bold;
    background-position: center;
    font-size          : 1.5rem;
    /* width           : 1.6rem; */
    height             : 1.6rem;
    padding            : 0 3rem;
    text-decoration    : none;
    text-shadow        : 0px 1px 0px #ffffff;
    transform          : translate(-50%, 50%);
    z-index            : 10;
    font-family: sans-serif;
}


.sd-classic-summary:hover {
    background      : linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
    background-color: #dfdfdf;
}

.sd-classic-summary:active {}

.sd-classic-summary:before {
    content: " + ";

}

.sd-classic-details[open] .sd-classic-summary:before {
    content: "- ";
}

.sd-classic-summary .sd-classic-summary-text {
    font-size: 14px;
    font-weight: 500;

}
.sd-classic-details--primary>.sd-classic-summary {
    transform: translate(-50%, 5%);
}

.sd-classic-details--primary[open]>.sd-classic-summary {
    transform: translate(-50%, 25%);
}

.sd-simple-details > summary {
    list-style: none;
  }
.sd-simple-details > summary::-webkit-details-marker {
    display: none;
}

.sd-simple-details{
    position: relative;
    
    
    
}
.sd-simple-details summary{
   
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    
}


.sd-simple-details summary .details-icon-plus,
.sd-simple-details summary .details-icon-minus {
    display: none;
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
}
.sd-simple-details summary .details-icon-minus{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23333' d='M352 232h-192C146.7 232 136 242.7 136 256c0 13.25 10.75 24 24 24h192C365.3 280 376 269.3 376 256C376 242.7 365.3 232 352 232zM256 0C114.6 0 0 114.6 0 256s114.6 256 256 256S512 397.4 512 256S397.4 0 256 0zM256 464c-114.7 0-208-93.31-208-208S141.3 48 256 48s208 93.31 208 208S370.7 464 256 464z'/%3E%3C/svg%3E");
}
.sd-simple-details summary .details-icon-plus{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23333' d='M352 232H280V160c0-13.26-10.74-24-23.1-24S232 146.7 232 160v72H160C146.7 232 136 242.7 136 256c0 13.25 10.75 24 24 24H232V352c0 13.25 10.75 24 24 24S280 365.3 280 352V280h72C365.3 280 376 269.3 376 256C376 242.7 365.3 232 352 232zM256 0C114.6 0 0 114.6 0 256s114.6 256 256 256S512 397.4 512 256S397.4 0 256 0zM256 464c-114.7 0-208-93.31-208-208S141.3 48 256 48s208 93.31 208 208S370.7 464 256 464z'/%3E%3C/svg%3E");
}

    .sd-simple-details[open] .details-icon-minus
,   .sd-simple-details:not([open]) .details-icon-plus{
        display: inline-block;
    }
    

    
    
    
    
    





:root {
    /** * THEME LIGHT */
    --main-bg-color-light          : rgb(248 249 251);
    /* tabs colors */
    --tabs-header-bg-color         : rgb(233 236 241);
    --tabs-bg-color                : rgb(185 195 213);
    --tabs-selected-bg-color       : var(--main-bg-color-light);
    --tabs-content-bg-color        : var(--main-bg-color-light);
    --tabs-hover-bg-color          : rgb(140 155 180);
    --tabs-text-color              : rgb(56 62 72);
    --tabs-hover-text-color        : rgb(7, 41, 67);
    --tabs-selected-text-color     : rgb(47, 48, 49);
    --tabs-text-disabled-color     : rgb(141 149 159);
    --tabs-bg-disabled-color       :rgb(216, 220, 226);
    
    --tabs-height                  : 35px;
    /** * THEME DARK */
    --main-bg-color-dark           : rgb(49, 53, 57);
    /* tabs colors */
    --dark-tabs-header-bg-color    : rgb(31, 32, 35);
    --dark-tabs-bg-color           : var(--main-bg-color-dark);
    --dark-tabs-selected-bg-color  : var(--dark-tabs-header-bg-color);
    --dark-tabs-hover-bg-color     : #25282b;
    --dark--tabs-content-bg-color  : rgb(31, 32, 35);
    --dark-tabs-text-color         : rgb(134, 136, 138);
    --dark-tabs-hover-text-color   : rgb(255, 255, 255);
    --dark-tabs-selected-text-color: rgb(221, 226, 231);
    --dark-tabs-text-disabled-color: rgba(221, 226, 231, 0.1);
    --dark-tabs-bg-disabled-color    :rgb(31, 32, 35);
}

/* .sd-tabs * {
    margin: 0
} */

.sd-tabs {
    min-height      : 300px;
    line-height     : normal;
    display         : flex;
    flex-direction  : column;
    flex-wrap       : nowrap;
    margin          : 0;
    background      : #e5e5e5;
    padding         : 0.2rem 0.1rem 0.1rem 0.1rem;
    position        : relative;
    background-color: var(--tabs-header-bg-color);
    height          : 100%;
    margin          : 2px 0;
    border-radius   : 3px;
    overflow: hidden;
    box-shadow: 0 0 0 1px var(--tabs-header-bg-color);
    overflow-y: auto;

}

.sd-tabs[auto-size] {
    height    : auto;
    min-height: 1px;
}

.sd-tabs[dark] {
    background-color: var(--dark-tabs-bg-color);
    box-shadow      : 0 0 0 1px var(--dark-tabs-bg-color);
    
}

.sd-tab-radio {
    position: absolute;
    opacity : 0;
    display : none;
}

.sd-tabs>.sd-tab-label {
    background-color: var(--tabs-bg-color);
    padding         : 3px 5px 5px 10px;
    display         : flex;
    align-items     : center;
    min-width       : 0;
    width           : 100%;
    border-radius   : 5px;
    position        : relative;
    z-index         : 2;
    max-height      : var(--tabs-height);
    /* transition   : background-color ease .2s, box-shadow ease .2s;
  */
    cursor          : pointer;
    flex            : 1;
}

.sd-tabs[dark]>.sd-tab-label {
    background-color: var(--dark-tabs-bg-color);
}

.sd-tabs>.sd-tab-label:hover {
    background-color: var(--tabs-hover-bg-color);
    color           : var(--tabs-hover-text-color);
    z-index         : 3;
}

.sd-tabs[dark]>.sd-tab-label:hover {
    background-color: var(--dark-tabs-hover-bg-color);
    color           : var(--dark-tabs-hover-text-color);
}


.sd-tabs>.sd-tab-radio:checked+.sd-tab-label {
    z-index: 4;
    border-radius: 5px 5px 0 0;
}

.sd-tabs>.sd-tab-label::after,
.sd-tabs>.sd-tab-label::before {
    content       : " ";
    pointer-events: none;
    position      : absolute;
    display       : block;
    height        : 80%;
    width         : 100%;
    bottom        : 0px;
    z-index       : 1;
    opacity       : 0;
}
.sd-tabs>.sd-tab-label::after{
    right        : -100%;
    border-radius: 0 0 0 10px;
    opacity      : 1;
    box-shadow: -14px 0.25rem 0 -4px var(--tabs-bg-color);
}
.sd-tabs>.sd-tab-label::before {
    left         : -100%;
    border-radius: 0 0 10px 0;
    opacity      : 1;
    box-shadow: 14px 0.25rem 0 -4px var(--tabs-bg-color);
}



/* .sd-tabs>.sd-tab-radio:not(:checked)+.sd-tab-label:not(:hover), 
.sd-tabs>.sd-tab-radio:disabled+.sd-tab-label {
    box-shadow: -8px 0px 0 -7px rgba(0, 0, 0, 0.25);
    color     : var(--tabs-text-color);
}*/

.sd-tabs[dark]>.sd-tab-radio:not(:checked)+.sd-tab-label:not(:hover) {
    color: var(--dark-tabs-text-color);
}

.sd-tabs>.sd-tab-radio:disabled+.sd-tab-label,
.sd-tabs>.sd-tab-radio:disabled+.sd-tab-label:not(:hover) {
    background-color: var(--tabs-bg-disabled-color);
    color           : var(--tabs-text-disabled-color);
}

.sd-tabs[dark]>.sd-tab-radio:disabled+.sd-tab-label,
.sd-tabs[dark]>.sd-tab-radio:disabled+.sd-tab-label:not(:hover) {
    background-color: var(--dark-tabs-bg-disabled-color);
    color           : var(--dark-tabs-text-disabled-color);
}

.sd-tabs>.sd-tab-radio:checked .sd-tab-label+.sd-tab-label,
.sd-tabs>.sd-tab-label:hover+.sd-tab-radio:not(:checked)+.sd-tab-label {
    box-shadow: -8px 0px 0 -7px rgba(0, 0, 0, 0);
}


/* .sd-tabs>.sd-tab-radio:last-of-type+.sd-tab-label:after{
   
    box-shadow: -14px 0.25rem 0 -4px var(--tabs-bg-color);
}
.sd-tabs>.sd-tab-radio:first-of-type+.sd-tab-label::before{
    
    box-shadow: 14px 0.25rem 0 -4px var(--tabs-bg-color);
} */



.sd-tabs[dark]>.sd-tab-radio:last-of-type+.sd-tab-label:after{

    box-shadow: -14px 0.25rem 0 -4px var(--dark-tabs-bg-color);
}
.sd-tabs[dark]>.sd-tab-radio:first-of-type+.sd-tab-label::before{
    box-shadow: 14px 0.25rem 0 -4px var(--dark-tabs-bg-color);
}



.sd-tabs>.sd-tab-radio:checked+.sd-tab-label:hover {
    /* transition: opacity ease .2s, box-shadow ease .2s;
  */
}

.sd-tabs>.sd-tab-radio+.sd-tab-label:hover::before,
.sd-tabs>.sd-tab-radio:checked+.sd-tab-label::before {
    left         : -100%;
    border-radius: 0 0 10px 0;
    opacity      : 1;
    /* transition: opacity ease .2s, box-shadow ease .2s;
  */
}

.sd-tabs>.sd-tab-radio:checked+.sd-tab-label::before {
    box-shadow: 14px 0.25rem 0 -4px var(--tabs-selected-bg-color);
}



.sd-tabs[dark]>.sd-tab-radio:checked+.sd-tab-label::before {
    box-shadow: 14px 0.25rem 0 -4px var(--dark-tabs-selected-bg-color);
}

.sd-tabs>.sd-tab-radio+.sd-tab-label:hover::after,
.sd-tabs>.sd-tab-radio:checked+.sd-tab-label::after {
    right        : -100%;
    border-radius: 0 0 0 10px;
    opacity      : 1;
    /* transition: opacity ease .2s, box-shadow ease .2s;
  */
}

.sd-tabs>.sd-tab-radio:checked+.sd-tab-label::after {
    box-shadow: -14px 0.25rem 0 -4px var(--tabs-selected-bg-color);
}

.sd-tabs[dark]>.sd-tab-radio:checked+.sd-tab-label::after {
    box-shadow: -14px 0.25rem 0 -4px var(--dark-tabs-selected-bg-color);
}

.sd-tabs>.sd-tab-radio:not(:disabled):checked+.sd-tab-label:hover,
.sd-tabs>.sd-tab-radio:not(:disabled):checked+.sd-tab-label {
    background-color: var(--tabs-selected-bg-color);
    color           : var(--tabs-selected-text-color);
    z-index         : 4;
}

.sd-tabs[dark]>.sd-tab-radio:not(:disabled):checked+.sd-tab-label:hover,
.sd-tabs[dark]>.sd-tab-radio:not(:disabled):checked+.sd-tab-label {
    background-color: var(--dark-tabs-selected-bg-color);
    color           : var(--dark-tabs-selected-text-color);
    z-index         : 4;
}


.sd-tabs>.sd-tab-radio:not(:checked):not(:disabled)+.sd-tab-label:hover::before {
    box-shadow   : 14px 0.25rem 0 -4px var(--tabs-hover-bg-color);
    opacity      : 1;
    /* transition: all .2s;
  */
}

.sd-tabs[dark]>.sd-tab-radio:not(:checked)+.sd-tab-label:hover::before {
    box-shadow: 14px 0.25rem 0 -4px var(--dark-tabs-hover-bg-color);
}

.sd-tabs>.sd-tab-radio:not(:checked):not(:disabled)+.sd-tab-label:hover::after {
    box-shadow   : -14px 0.25rem 0 -4px var(--tabs-hover-bg-color);
    /* transition: all .2s;
  */
}

.sd-tabs[dark]>.sd-tab-radio:not(:checked)+.sd-tab-label:hover::after {
    box-shadow: -14px 0.25rem 0 -4px var(--dark-tabs-hover-bg-color);
}



.sd-tabs>.sd-tab-radio:disabled+.sd-tab-label::before{
    box-shadow: 14px 0.25rem 0 -4px var(--tabs-bg-disabled-color);
    z-index       : 0;
}
.sd-tabs>.sd-tab-radio:disabled+.sd-tab-label::after {
    box-shadow   : -14px 0.25rem 0 -4px var(--tabs-bg-disabled-color);
    z-index       : 0;
}
.sd-tabs>.sd-tab-radio:disabled+.sd-tab-label {
    z-index       : 0;
}
.sd-tabs>.sd-tab-radio:disabled+.sd-tab-label+.sd-tab-content+.sd-tab-radio+.sd-tab-label{
    box-shadow: none;
}

.sd-tabs>.sd-tab-content {
    flex-basis         : 100%;
    display            : none !important;
    /* padding            : 0.255rem; */
    padding             : 0.2em 0.4em;
    background-color   : var(--tabs-content-bg-color);
    
    border-top         : solid 0.2rem var(--tabs-content-bg-color);
    box-shadow      : inset 0px 0px 0 1px var(--tabs-content-bg-color);
    flex-direction     : column;
    border-radius      : 0 0 5px 5px;
    width              : 100%;
    height             : calc(100% - var(--tabs-height));
    min-height         : 50vh;
    overflow           : auto;
}

/* .sd-tabs[auto-size]>.sd-tab-content{
 
    height             : 100%;
}  */

.sd-tabs>.break {
    background-color: aqua;
    flex-basis      : 100%;
}

.sd-tabs[dark]>.sd-tab-content {
    background-color   : var( --dark--tabs-content-bg-color);
    color              : var(--dark-tabs-text-color);
    border-top         : solid 0.2rem var( --dark--tabs-content-bg-color);
    box-shadow      : inset 0px 0px 0 1px var( --dark--tabs-content-bg-color);
}

.sd-tabs>.sd-tab-radio:checked+.sd-tab-label+.sd-tab-content {
    display: flex !important;
}

.sd-tabs>.sd-tab-label .sd-tab-desc {
    display      : block;
    margin       : 7px 5px 5px 2px;
    white-space  : nowrap;
    text-overflow: ellipsis;
    overflow     : hidden;
    position     : relative;
    font-size    : 0.75rem;
    flex         : 1 1 0%;
}

.sd-tabs>.sd-tab-label .sd-tab-icon {
    display        : flex;
    align-items    : center;
    justify-content: center;
    border-radius  : 2px;
    width          : 15px;
    padding        : 2px 3px;
}

.sd-tabs>.sd-tab-label .sd-tab-icon:not(.sd-tab-close) {
    width: 20px;
}

.sd-tabs>.sd-tab-label[icon-only] .sd-tab-icon:not(.sd-tab-close) {
    width : 24px;
    margin: 0 auto;
}

.sd-tabs>.sd-tab-label .sd-tab-close:hover {
    background-color: #4c4c4c33;
}

.sd-tabs>.sd-tab-label .sd-tab-close {
    margin-left: auto;
}

.sd-tabs>.sd-tab-label::after,
.sd-tabs>.sd-tab-label::before {
    visibility: hidden;
}

.sd-tabs >.sd-tab-radio:checked+.sd-tab-label{
        box-shadow: 0 12px 8px -14px #ccc;
}
.sd-tabs[dark]>.sd-tab-radio:checked+.sd-tab-label{
    box-shadow: 0 12px 8px -14px #000;
}

@media (min-width: 600px) {

    .sd-tabs {
        flex-direction: row;
        flex-wrap     : wrap;
    }
    .sd-tabs>.sd-tab-content {
        order: 999;
        min-height : 1px;
    }

    .sd-tabs>.sd-tab-label {
        max-width    : 150px;
        width        : 150px;
        border-radius: 5px 5px 0 0;
    }

    .sd-tabs>.sd-tab-label::after,
    .sd-tabs>.sd-tab-label::before {
        visibility: visible;
    }

    .sd-tabs>.sd-tab-label:first-of-type {
        margin-left: 14px;
    }

    .sd-tabs>.sd-tab-radio:not(:checked)+.sd-tab-label:not(:hover)  {
        box-shadow: -8px 0px 0 -7px var(--tabs-text-color);;
        color     : var(--tabs-text-color);
    }
    .sd-tabs>.sd-tab-radio:disabled+.sd-tab-label:not(:hover)  {
        box-shadow: -8px 0px 0 -7px var(--tabs-text-color);
        color     : var(--tabs-text-disabled-color);
    }
    
    :root .sd-tabs>.sd-tab-radio+.sd-tab-label:first-of-type {
        box-shadow: -8px 0px 0 -7px rgba(0, 0, 0, 0);
    }
    
    .sd-tabs >.sd-tab-radio:checked+.sd-tab-label,
    .sd-tabs[dark]>.sd-tab-radio:checked+.sd-tab-label{
        box-shadow: none;
        
    }
}

/* @media (max-width: 600px) {
    .sd-tabs .sd-tab-label {
        box-shadow: none !important;
    }

} */

* .sd-cards {
    width  : 100%;
    padding: .5rem;

}

.sd-cards .sd-wrap-cards {
    padding              : .5rem;
    display              : grid;
    width                : 100%;
    display              : grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap                  : 0.5rem;
}




.sd-card * {
    font-family     : var(--bs-font-sans-serif);
    font-size       : .9rem;
    /* box-shadow   : 0 0 .875rem 0 rgba(33, 37, 41, .05); 
    margin-bottom   : 24px*/
}

.sd-card-header {
    border-bottom-width: 1px
}

.sd-card-title {
    color      : #939ba2;
    font-size  : .925rem;
    font-weight: 600
}

.sd-card-subtitle {
    font-weight: 400
}

.sd-card-table {
    margin-bottom: 0
}

.sd-card-table tr td:first-child,
.sd-card-table tr th:first-child {
    padding-left: 1.25rem
}

.sd-card-table tr td:last-child,
.sd-card-table tr th:last-child {
    padding-right: 1.25rem
}

.sd-card-img,
.sd-card-img-bottom,
.sd-card-img-top {
    height   : auto;
    max-width: 100%
}

@media (-ms-high-contrast:none) {

    .sd-card-img,
    .sd-card-img-bottom,
    .sd-card-img-top {
        height: 100%
    }
}




.sd-card {
    position             : relative;
    display              : -webkit-box;
    display              : -ms-flexbox;
    display              : flex;
    -webkit-box-orient   : vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction   : column;
    flex-direction       : column;
    min-width            : 0;
    word-wrap            : break-word;
    background-color     : #fff;
    background-clip      : border-box;
    /* border            : 1px solid rgba(0,0,0,.125); */
    box-shadow           : 0 0 0 1px rgba(0, 0, 0, .125);
    border-radius        : 0.25rem;
}

.sd-card>hr {
    margin-left : 0;
    margin-right: 0
}

.sd-card>.sd-list-group {
    border-bottom: inherit;
    border-top   : inherit
}

.sd-card>.sd-list-group:first-child {
    border-top-left-radius : .25rem;
    border-top-right-radius: .25rem;
    border-top-width       : 0
}

.sd-card>.sd-list-group:last-child {
    border-bottom-left-radius : .25rem;
    border-bottom-right-radius: .25rem;
    border-bottom-width       : 0
}

.sd-card>.sd-card-header+.sd-list-group,
.sd-card>.sd-list-group+.sd-card-footer {
    border-top: 0
}

.sd-card-body {
    flex   : 1 1 auto;
    padding: 1.25rem
}

.sd-card-title {
    margin-bottom: .5rem
}

.sd-card-subtitle {
    margin-top: -.25rem
}

.sd-card-subtitle,
.sd-card-text:last-child {
    margin-bottom: 0
}

.sd-card-link:hover {
    text-decoration: none
}

.sd-card-link+.sd-card-link {
    margin-left: 1.25rem
}

.sd-card-header {
    padding         : 0.75rem 1.25rem;
    margin-bottom   : 0;
    background-color: rgba(0, 0, 0, .03);
    border-bottom   : 1px solid rgba(0, 0, 0, .125);
}

.sd-card-header:first-child {
    border-radius: .25rem .25rem 0 0
}

.sd-card-footer {
    background-color: #fff;
    border-top      : 0 solid transparent;
    padding         : 1rem 1.25rem
}

.sd-card-footer:last-child {
    border-radius: 0 0 .25rem .25rem
}

.sd-card-header-tabs {
    border-bottom: 0;
    margin-bottom: -1rem;
    margin-left  : -.625rem;
    margin-right : -.625rem
}

.sd-card-header-tabs .nav-link.active {
    background-color   : #fff;
    border-bottom-color: #fff
}

.sd-card-header-pills {
    margin-left : -.625rem;
    margin-right: -.625rem
}

.sd-card-img-overlay {
    border-radius: .25rem;
    bottom       : 0;
    left         : 0;
    padding      : 1rem;
    position     : absolute;
    right        : 0;
    top          : 0
}

.sd-card-img,
.sd-card-img-bottom,
.sd-card-img-top {
    width: 100%
}

.sd-card-img,
.sd-card-img-top {
    border-top-left-radius : .25rem;
    border-top-right-radius: .25rem
}

.sd-card-img,
.sd-card-img-bottom {
    border-bottom-left-radius : .25rem;
    border-bottom-right-radius: .25rem
}

.sd-card-group>.sd-card {
    margin-bottom: 12px
}

@media(min-width:576px) {
    .sd-card-group {
        display  : flex;
        flex-flow: row wrap
    }

    .sd-card-group>.sd-card {
        flex         : 1 0 0%;
        margin-bottom: 0
    }

    .sd-card-group>.sd-card+.sd-card {
        border-left: 0;
        margin-left: 0
    }

    .sd-card-group>.sd-card:not(:last-child) {
        border-bottom-right-radius: 0;
        border-top-right-radius   : 0
    }

    .sd-card-group>.sd-card:not(:last-child) .sd-card-header,
    .sd-card-group>.sd-card:not(:last-child) .sd-card-img-top {
        border-top-right-radius: 0
    }

    .sd-card-group>.sd-card:not(:last-child) .sd-card-footer,
    .sd-card-group>.sd-card:not(:last-child) .sd-card-img-bottom {
        border-bottom-right-radius: 0
    }

    .sd-card-group>.sd-card:not(:first-child) {
        border-bottom-left-radius: 0;
        border-top-left-radius   : 0
    }

    .sd-card-group>.sd-card:not(:first-child) .sd-card-header,
    .sd-card-group>.sd-card:not(:first-child) .sd-card-img-top {
        border-top-left-radius: 0
    }

    .sd-card-group>.sd-card:not(:first-child) .sd-card-footer,
    .sd-card-group>.sd-card:not(:first-child) .sd-card-img-bottom {
        border-bottom-left-radius: 0
    }
}

.sd-card-selected-action {

    color     : #495057;
    text-align: inherit;
    width     : 100%;
    transition: all ease .1s;
    box-shadow: 0 0 0 2px #066066, -2px 11px 11px -5px #0d333738;
    transform : scale(1.05);
    z-index   : 4;
}

.sd-card-action-action {
    color     : #495057;
    text-align: inherit;
    width     : 100%;

    animation: transform ease .2s, border ease .2s;

}

.sd-card-action-action:focus,
.sd-card-action-action:hover {
    /* border: solid 2px #f1c40f; */
    box-shadow     : 0 0 0 2px #f1c40f;
    color          : #495057;
    text-decoration: none;
    z-index        : 1
}

.sd-card-action-action:active {
    color: #495057
}

.sd-card-action-action.sd-card-selected-action:focus,
.sd-card-action-action.sd-card-selected-action:hover {
    box-shadow: 0 0 0 2px #f1c40f, -2px 11px 11px -5px #52440a38;
}

.sd-cards-footer {
    display              : grid;
    grid-template-columns: 1fr auto;
    grid-gap             : 10px;
    justify-content      : space-between;
    min-height           : 15px;
    border-radius        : 0 0 3px 3px;
    background           : rgb(236 236 236);
    position             : relative;
    align-items          : center;
    padding              : .3rem;
    margin-top           : 0.5rem;
    position             : sticky;
    bottom               : 0;
    z-index              : 5;
}

.sd-wrap-cards-buttons {
    overflow-y   : hidden !important;
    position     : relative;
    /* box-shadow: inset -20px 0px 10px -20px rgb(0 0 0 / 90%); */
    border-radius: 5px;

}

.sd-cards-buttons {
    display    : flex;
    align-items: flex-start;
    margin-left: 4px;
    padding    : 2px 0;
    position   : relative;
}

.sd-cards-buttons button {
    position        : relative;
    white-space     : nowrap;
    padding         : 6px 13px;
    border          : none;
    cursor          : pointer;
    white-space     : nowrap;
    background-color: #dfdfdf;
    align-items     : center;
    overflow        : hidden;
    white-space     : nowrap;
    text-overflow   : ellipsis;
    min-width       : max-content;
    display         : flex;
}

.sd-cards-buttons button~button {
    /* margin-left: 3px; */
    box-shadow: -6px 0 0 -5px #b9b9b9;
}

.sd-cards-buttons button:not([disabled]):hover {
    background-color: #b5b5b5;
    box-shadow      : none;
}

.sd-cards-buttons button:not([disabled]):focus {
    box-shadow: 0 0 0 3px rgba(185, 185, 185, 0.5);
    z-index   : 9;
}

.sd-cards-buttons button:first-child {
    border-radius: 3px 0 0 3px;
}

.sd-cards-buttons button:last-child {
    border-radius: 0 3px 3px 0;
}

.sd-cards-buttons button[disabled]:hover {
    cursor: not-allowed;
}

.sd-cards-buttons .sd-button-icon {
    width       : 1rem;
    margin-right: 3px
}



.sd-cards-counter-total {
    border-radius: 3px;
    background   : #b9cbd4;
    padding      : 6px;
    font-weight  : bold;
    text-align   : right;

}

.sd-item-value {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    gap            : 0.4rem;
    color          : #68686e;
    flex-wrap      : wrap;
}

.sd-item-value>*:first-child {
    font-weight: bold;
    font-size  : .8rem;
    color      : #00000057
}

.sd-item-value>*:last-child {
    margin-left: .3rem;
    font-size  : 1.2rem;
    color      : #000000f5
}



.sd-list-group {
    border-radius : .2rem;
    display       : flex;
    flex-direction: column;
    margin-bottom : 0;
    margin-top    : 0;
    padding-left  : 0;
    padding: 1px;
}

.sd-list-group-numbered {
    counter-reset  : section;
    list-style-type: none
}

.sd-list-group-numbered>li:before {
    content          : counters(section, ".") ". ";
    counter-increment: section
}

.sd-list-group-item-action {
    color     : #495057;
    text-align: inherit;
    width     : 100%
}

.sd-list-group-item-action:focus,
.sd-list-group-item-action:hover {
    background-color: #f8f9fa;
    color           : #495057;
    text-decoration : none;
    z-index         : 1
}

.sd-list-group-item-action:active {
    background-color: #e9ecef;
    color           : #495057
}



.sd-list-group-item {
    background-color: #fff;
    border          : 1px solid rgba(0, 0, 0, .125);
    color           : #212529;
    display         : block;
    padding         : .5rem 1rem;
    position        : relative
}

.sd-list-group-item:first-child {
    border-top-left-radius : inherit;
    border-top-right-radius: inherit
}

.sd-list-group-item:last-child {
    border-bottom-left-radius : inherit;
    border-bottom-right-radius: inherit
}

.sd-list-group-item.disabled,
.sd-list-group-item:disabled {
    background-color: #fff;
    color           : #6c757d;
    pointer-events  : none
}

.sd-list-group-item.active {
    background-color: #3b7ddd;
    border-color    : #3b7ddd;
    color           : #fff;
    z-index         : 2
}

.sd-list-group-item+.sd-list-group-item {
    border-top-width: 0
}

.sd-list-group-item+.sd-list-group-item.active {
    border-top-width: 1px;
    margin-top      : -1px
}

.sd-list-group-horizontal {
    flex-direction: row
}

.sd-list-group-horizontal>.sd-list-group-item:first-child {
    border-bottom-left-radius: .2rem;
    border-top-right-radius  : 0
}

.sd-list-group-horizontal>.sd-list-group-item:last-child {
    border-bottom-left-radius: 0;
    border-top-right-radius  : .2rem
}

.sd-list-group-horizontal>.sd-list-group-item.active {
    margin-top: 0
}

.sd-list-group-horizontal>.sd-list-group-item+.sd-list-group-item {
    border-left-width: 0;
    border-top-width : 1px
}

.sd-list-group-horizontal>.sd-list-group-item+.sd-list-group-item.active {
    border-left-width: 1px;
    margin-left      : -1px
}

@media(min-width:576px) {
    .sd-list-group-horizontal-sm {
        flex-direction: row
    }

    .sd-list-group-horizontal-sm>.sd-list-group-item:first-child {
        border-bottom-left-radius: .2rem;
        border-top-right-radius  : 0
    }

    .sd-list-group-horizontal-sm>.sd-list-group-item:last-child {
        border-bottom-left-radius: 0;
        border-top-right-radius  : .2rem
    }

    .sd-list-group-horizontal-sm>.sd-list-group-item.active {
        margin-top: 0
    }

    .sd-list-group-horizontal-sm>.sd-list-group-item+.sd-list-group-item {
        border-left-width: 0;
        border-top-width : 1px
    }

    .sd-list-group-horizontal-sm>.sd-list-group-item+.sd-list-group-item.active {
        border-left-width: 1px;
        margin-left      : -1px
    }
}

@media(min-width:768px) {
    .sd-list-group-horizontal-md {
        flex-direction: row
    }

    .sd-list-group-horizontal-md>.sd-list-group-item:first-child {
        border-bottom-left-radius: .2rem;
        border-top-right-radius  : 0
    }

    .sd-list-group-horizontal-md>.sd-list-group-item:last-child {
        border-bottom-left-radius: 0;
        border-top-right-radius  : .2rem
    }

    .sd-list-group-horizontal-md>.sd-list-group-item.active {
        margin-top: 0
    }

    .sd-list-group-horizontal-md>.sd-list-group-item+.sd-list-group-item {
        border-left-width: 0;
        border-top-width : 1px
    }

    .sd-list-group-horizontal-md>.sd-list-group-item+.sd-list-group-item.active {
        border-left-width: 1px;
        margin-left      : -1px
    }
}

@media(min-width:992px) {
    .sd-list-group-horizontal-lg {
        flex-direction: row
    }

    .sd-list-group-horizontal-lg>.sd-list-group-item:first-child {
        border-bottom-left-radius: .2rem;
        border-top-right-radius  : 0
    }

    .sd-list-group-horizontal-lg>.sd-list-group-item:last-child {
        border-bottom-left-radius: 0;
        border-top-right-radius  : .2rem
    }

    .sd-list-group-horizontal-lg>.sd-list-group-item.active {
        margin-top: 0
    }

    .sd-list-group-horizontal-lg>.sd-list-group-item+.sd-list-group-item {
        border-left-width: 0;
        border-top-width : 1px
    }

    .sd-list-group-horizontal-lg>.sd-list-group-item+.sd-list-group-item.active {
        border-left-width: 1px;
        margin-left      : -1px
    }
}

@media(min-width:1200px) {
    .sd-list-group-horizontal-xl {
        flex-direction: row
    }

    .sd-list-group-horizontal-xl>.sd-list-group-item:first-child {
        border-bottom-left-radius: .2rem;
        border-top-right-radius  : 0
    }

    .sd-list-group-horizontal-xl>.sd-list-group-item:last-child {
        border-bottom-left-radius: 0;
        border-top-right-radius  : .2rem
    }

    .sd-list-group-horizontal-xl>.sd-list-group-item.active {
        margin-top: 0
    }

    .sd-list-group-horizontal-xl>.sd-list-group-item+.sd-list-group-item {
        border-left-width: 0;
        border-top-width : 1px
    }

    .sd-list-group-horizontal-xl>.sd-list-group-item+.sd-list-group-item.active {
        border-left-width: 1px;
        margin-left      : -1px
    }
}

@media(min-width:1440px) {
    .sd-list-group-horizontal-xxl {
        flex-direction: row
    }

    .sd-list-group-horizontal-xxl>.sd-list-group-item:first-child {
        border-bottom-left-radius: .2rem;
        border-top-right-radius  : 0
    }

    .sd-list-group-horizontal-xxl>.sd-list-group-item:last-child {
        border-bottom-left-radius: 0;
        border-top-right-radius  : .2rem
    }

    .sd-list-group-horizontal-xxl>.sd-list-group-item.active {
        margin-top: 0
    }

    .sd-list-group-horizontal-xxl>.sd-list-group-item+.sd-list-group-item {
        border-left-width: 0;
        border-top-width : 1px
    }

    .sd-list-group-horizontal-xxl>.sd-list-group-item+.sd-list-group-item.active {
        border-left-width: 1px;
        margin-left      : -1px
    }
}

.sd-list-group-flush {
    border-radius: 0
}

.sd-list-group-flush>.sd-list-group-item {
    border-width: 0 0 1px
}

.sd-list-group-flush>.sd-list-group-item:last-child {
    border-bottom-width: 0
}

.sd-list-group-item-primary {
    background-color: #d8e5f8;
    color           : #234b85
}

.sd-list-group-item-primary.sd-list-group-item-action:focus,
.sd-list-group-item-primary.sd-list-group-item-action:hover {
    background-color: #c2cedf;
    color           : #234b85
}

.sd-list-group-item-primary.sd-list-group-item-action.active {
    background-color: #234b85;
    border-color    : #234b85;
    color           : #fff
}

.sd-list-group-item-secondary {
    background-color: #e2e3e5;
    color           : #41464b
}

.sd-list-group-item-secondary.sd-list-group-item-action:focus,
.sd-list-group-item-secondary.sd-list-group-item-action:hover {
    background-color: #cbccce;
    color           : #41464b
}

.sd-list-group-item-secondary.sd-list-group-item-action.active {
    background-color: #41464b;
    border-color    : #41464b;
    color           : #fff
}

.sd-list-group-item-success {
    background-color: #d2f1e8;
    color           : #117054
}

.sd-list-group-item-success.sd-list-group-item-action:focus,
.sd-list-group-item-success.sd-list-group-item-action:hover {
    background-color: #bdd9d1;
    color           : #117054
}

.sd-list-group-item-success.sd-list-group-item-action.active {
    background-color: #117054;
    border-color    : #117054;
    color           : #fff
}

.sd-list-group-item-info {
    background-color: #d1ecf1;
    color           : #0e616e
}

.sd-list-group-item-info.sd-list-group-item-action:focus,
.sd-list-group-item-info.sd-list-group-item-action:hover {
    background-color: #bcd4d9;
    color           : #0e616e
}

.sd-list-group-item-info.sd-list-group-item-action.active {
    background-color: #0e616e;
    border-color    : #0e616e;
    color           : #fff
}

.sd-list-group-item-warning {
    background-color: #fef1d5;
    color           : #976f1a
}

.sd-list-group-item-warning.sd-list-group-item-action:focus,
.sd-list-group-item-warning.sd-list-group-item-action:hover {
    background-color: #e5d9c0;
    color           : #976f1a
}

.sd-list-group-item-warning.sd-list-group-item-action.active {
    background-color: #976f1a;
    border-color    : #976f1a;
    color           : #fff
}

.sd-list-group-item-danger {
    background-color: #f8d7da;
    color           : #842029
}

.sd-list-group-item-danger.sd-list-group-item-action:focus,
.sd-list-group-item-danger.sd-list-group-item-action:hover {
    background-color: #dfc2c4;
    color           : #842029
}

.sd-list-group-item-danger.sd-list-group-item-action.active {
    background-color: #842029;
    border-color    : #842029;
    color           : #fff
}

.sd-list-group-item-light {
    background-color: #fdfdfe;
    color           : #626364
}

.sd-list-group-item-light.sd-list-group-item-action:focus,
.sd-list-group-item-light.sd-list-group-item-action:hover {
    background-color: #e4e4e5;
    color           : #626364
}

.sd-list-group-item-light.sd-list-group-item-action.active {
    background-color: #626364;
    border-color    : #626364;
    color           : #fff
}

.sd-list-group-item-dark {
    background-color: #d3d3d4;
    color           : #141619
}

.sd-list-group-item-dark.sd-list-group-item-action:focus,
.sd-list-group-item-dark.sd-list-group-item-action:hover {
    background-color: #bebebf;
    color           : #141619
}

.sd-list-group-item-dark.sd-list-group-item-action.active {
    background-color: #141619;
    border-color    : #141619;
    color           : #fff
}




.sd-tutorial-movie {
    z-index: 99999;
}

.sd-tutorial-movie,
.sd-tutorial-movie-overlay {
    height         : 100vh;
    width          : 100vw;
    position       : fixed;
    top            : 0;
    left           : 0;
    justify-content: center;
    align-items    : center;
    display        : none;

}

.sd-tutorial-movie-overlay {
    background-color: rgba(0, 0, 0, 0.2);
    display         : flex;

}

.sd-tutorial-movie-wrap {
    height: 75vh;
    width : 75vw;

    border-radius   : 4px;
    background-color: #ffffff;
    z-index         : 2;
    box-shadow      : 0px 0px 5px rgba(0, 0, 0, 0.2);
    overflow        : auto;
    display         : flex;
    flex-direction  : column;
}

.sd-tutorial-movie__header {
    padding         : 15px 25px;
    display         : flex;
    position        : sticky;
    background-color: #ffffff;
    z-index         : 3;
    align-items     : center;


}

.sd-tutorial-movie__header {
    top       : 0;
    box-shadow: 0px 4px 15px rgba(150, 150, 150, .2);
}

.sd-tutorial-movie__header-control {
    margin-left: auto;
}

.sd-tutorial-movie__header .sd-tutorial-movie__header-close {
    width        : 1.9rem;
    font-size    : 15px;
    border-radius: 50%;
    color        : #0000005d;
    font-family  : cursive;
    float        : right;
    padding      : 5px 8px;
    text-align   : center;
    font-weight  : bold;
    cursor       : pointer;
    user-select  : none;
    transition   : background-color ease .05s, color ease .05s;
}

.sd-tutorial-movie__header-close:hover {
    background-color: rgba(0, 0, 0, 0.1);
    color           : #000000a1
}

.sd-tutorial-movie__header-close:active {
    background-color: rgba(0, 0, 0, 0.2);
}

.sd-tutorial-movie__content {

    display       : flex;
    flex-direction: column;
    gap           : 0.6rem;
    overflow      : auto;

}

.sd-tutorial-movie__content video {
    border-radius: 1.5rem;
    height       : 100%;
    box-shadow   : 0 0px 0 4px #5e5e5e47;
}

.sd-tutorial-movie-custom-content {
    padding: 0 1.5rem;
}

.sd-tutorial-video {

    display: flex;

    align-items    : center;
    justify-content: center;
    padding        : 1rem;

}



.bg-primary {
    --bs-primary-rgb: 13, 110, 253;
    --bs-bg-opacity : 1;
    background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;
}

.badge {
    display       : inline-block;
    padding       : 0.35em 0.65em;
    font-size     : .75em;
    font-weight   : 700;
    line-height   : 1;
    color         : #fff;
    text-align    : center;
    white-space   : nowrap;
    vertical-align: baseline;
    border-radius : 0.25rem;
}

/* .sd-classic-error{
    display: block
} */
.sd-simple-table {
    display        : block;
    max-width      : 100%;
    overflow       : auto;
    color          : #666;
    border-collapse: collapse;
    border-spacing : 0;
    margin         : 0;
    padding        : 0;
    border         : 0;
    outline        : 0;
}

.sd-simple-table tbody {
    width  : 99%;
    display: table;
}

.sd-simple-table th,
.sd-simple-table td {
    border : .0625rem solid #a9acaa;
    padding: .75rem .25rem
}

.sd-simple-table th {
    background-color: #e3e3e3
}

.sd-simple-table tr:nth-of-type(2n) td {
    background-color  : #ffffff;
    border-right-color: #a9acaa
}

.sd-simple-table td {
    background-color: #f2f2f2;
    border-color    : #a9acaa
}

.sd-simple-table .no-stripes {
    background-color: #ffffff
}

.sd-simple-table.no-stripes td {
    background-color: #ffffff
}

/*Animação status SFAZ*/
/*ativo*/
@keyframes mudaCorcircleGreen {
    0%,49% {
        fill: green;
    }
    50%,100% {
        fill: #8cd19a
    }
}
.circleGreen {
    animation: mudaCorcircleGreen 3s linear infinite;
}

/*ativo*/
@keyframes mudaCorcircleRed {
    0%,49% {
        fill: red;
    }
    50%,100% {
        fill: #e76f79
    }
}
.circleRed {
    animation: mudaCorcircleRed 3s linear infinite;
}

/* 
    @Ticket 109031
    
    Funcionalidade onde verifica se existe um checkbox dentro de um label,
    se existir ele ajusta o tamanho do label para o minimo possível para 
    o usuário não clicar fora e ativar o checkbox
*/

.sd-classic-label:has(input[type="checkbox"]) .sd-classic-input-group {
    max-width: min-content;
}

.sd-classic-label:has(input[type="checkbox"]) {
    cursor: default;
}

.sd-classic-label:has(input[type="checkbox"]) > span {
    cursor: pointer;
}

.sd-classic-label:has(input[type="checkbox"]) > .sd-classic-input-group,
.sd-classic-label:has(input[type="checkbox"]) .sd-classic-switch {
    cursor: pointer;
}

/* ----------------------------------------------------------------------- */