:root {
    --white: #FFFFFF;
    --beige: #EFEBE3;/*FAF9F6*/
    --dark: #060614;
    --yellow: #FFFD77;
    --green-1: #F1FFFA;
    --green-2: #CCFCEC;
    --green-3: #00EF9F;
    --red-1: #FFF3EF;
    --red-2: #FEDACF;
    --red-3: #FEB49F;
    --violet-1: #EBEBF6;
    --violet-2: #E0D9FF;
    --violet-3: #8566FE;

    --status-green: #0a875a;
    --status-yellow: #FAC300;
    --status-red: #FF4B33;
}
/* ---------------------------------------------- */
* {-webkit-font-smoothing:antialiased; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} html,body,body div,span,object,iframe,h1,h2,h3,h4,h5,h6,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,figure,footer,header,hgroup,menu,nav,section,time,mark,audio,video,details,summary{margin:0;padding:0;border:0;vertical-align:baseline;background:transparent;} html{ /*overflow: auto;*/ } body { position: relative; } article,aside,figure,footer,header,hgroup,nav,section,details,summary{display:block; }object,embed{max-width:100%}img{-ms-interpolation-mode:bicubic;vertical-align:top}ul,li { margin: 0px; padding: 0px; list-style: none; }h1,h2,h3,h4,h5,h6{font-weight:normal !important;line-height:inherit !important;margin:0px;padding:0px}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;text-decoration:none;cursor: pointer;} p{padding:0;border:0;vertical-align:baseline;background:transparent;} del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted var(--dark);cursor:help}table{border-collapse:collapse;border-spacing:0}th{font-weight:bold;vertical-align:bottom}td{font-weight:normal;vertical-align:top}hr{display:block;width:100%;height:1px;border:0;padding:0;margin:0;}input,select{vertical-align:middle; margin: 0;}pre{white-space:pre;white-space:pre-wrap;white-space:pre-line;word-wrap:break-word}input[type="radio"]{vertical-align:text-bottom}input[type="checkbox"]{vertical-align:bottom} select,input,textarea{font:99% sans-serif}table{font-size:inherit;font:100%}small{font-size:85%}strong{font-weight:bold}td,td img{vertical-align:top}sub,sup{font-size:75%;line-height:0;position:relative}sup{top:-0.5em}sub{bottom:-0.25em}pre,code,kbd,samp{font-family:monospace, sans-serif}.clickable,label,input[type=button],input[type=submit],input[type=file],button{cursor:pointer}button,input,option,textarea{padding:0px;margin:0px}button{width:auto;overflow:visible;height:auto; background: transparent; border: none;}.clearfix:before,.clearfix:after{content:".";display:block;height:0;overflow:hidden}.clearfix:after{clear:both}.clearfix{zoom:1}html,body{margin:0px;padding:0px}.left{float:left}.right{float:right}.both{clear:both} textarea{resize: vertical;} body button:focus, body input:focus, body select:focus, body textarea:focus, body [contenteditable] { outline: none; } .prevent-select { -webkit-user-select: none; -ms-user-select: none; user-select: none; } .active-select { -webkit-user-select: text; -ms-user-select: text; user-select: text; }
/* ---------------------------------------------- */
.material-symbols-outlined { vertical-align: middle; font-size: 24px; line-height: 0px; font-variation-settings: 'FILL' 0, 'wght' 100, 'GRAD' 0, 'opsz' 24 }
.material-symbols-outlined.fill { vertical-align: middle; font-size: 24px; line-height: 0px; font-variation-settings: 'FILL' 1, 'wght' 100, 'GRAD' 0, 'opsz' 24 }
.material-symbols-outlined.green { color: #0a875a; }
.material-symbols-outlined.red { color: #ff4b33; }
.material-symbols-outlined.yellow { color: #FAC300; }
.material-symbols-outlined.lime { color: #84EB34; }
.material-symbols-outlined.blue { color: #2D60FD; }

/* ---------------------------------------------- */
/*::-webkit-scrollbar { display: none; }*/
::-moz-selection { background: var(--dark); color: var(--yellow);	text-shadow:none; }
::selection { background: var(--dark); color: var(--yellow); }
/* ---------------------------------------------- */
body, ul, li, p, input, select, textarea, button, h1, h2, h3, h4, h5, h6, table { font-size: 14px; line-height: 28px; font-family: 'Poppins', sans-serif !important; color: var(--dark); padding: 0; }
table { font-size: 14px; line-height: normal; }
select { /*-webkit-appearance: none; -moz-appearance: none; appearance: none;*/ }
select::-ms-expand { display: none; }
select::after { content: '▼'; position: absolute; top: 50%; right: 16px; transform: translateY(-50%); pointer-events: none; }
select::-webkit-dropdown {  }
select optgroup { color: #999999; font-style: italic; font-weight: 200; }
select option { font-style: normal; color: var(--dark); font-size: 14px; line-height: 24px; }
a { color: var(--dark); }
a:hover { text-decoration: none; color: var(--dark); }
b, strong { font-weight: 500; }
li { padding: 8px 0 7px 0; }
body, ul, li, p, label, table, td { font-weight: 200; }
input, select, textarea, button, th { font-weight: 200; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
input, select { line-height: 1em; }


input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active { font-size: 14px; line-height: 28px; font-family: 'Poppins', sans-serif !important;
    -webkit-box-shadow: 0 0 0 1000px var(--white) inset !important;
    -webkit-text-fill-color: var(--dark) !important;
    transition: background-color 9999s ease-out 0s !important;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}


input:focus { outline: none; box-shadow: none; }
p { line-height: normal; }
html { touch-action: manipulation; }
body { background-color: var(--dark); color: var(--dark); overflow: hidden; overflow-y: hidden !important; overflow-x: auto; zoom: 100%; }
body > .wrap { overflow: hidden; }


h1, .h1 { font-size: 32px; font-weight: 600 !important; }
h2, .h2 { font-weight: 700; }
h3, .h3 { font-size: 12px; height: 40px; }
h4, .h4 { height: 40px; font-weight: 500; }
h5, .h5 { height: 40px; font-weight: 500; }
h6, .h6 { font-size: 12px; font-weight: 400; color: #757575; line-height: normal; }




.width-12 { width: 100%; }
.width-9 { width: calc(75% - (39px / 2)); }
.width-8 { width: calc(66.66% - (39px / 2)); }
.width-6 { width: calc(50% - (39px / 2)); }
.width-4 { width: calc(33.33% - (39px / 2)); }
.width-3 { width: calc(25% - (39px / 2)); }
.width-min { width: min-content; }
.width-max { width: max-content; }
.width-auto { width: auto; }

.col-auto { width: auto; flex: auto; }
.col-full { width: 100%;  }
.col-1-2 { width: 130px; }
.col-1 { width: 300px; }
.col-2 { width: 640px; }
.col-3 { width: 980px; }
.col-4 { width: 1320px; }
.col-5 { width: 1400px; }

.padding-top-1 { padding-top: 40px !important; }
.padding-top-2 { padding-top: 80px; }
.padding-top-3 { padding-top: 120px; }
.padding-top-4 { padding-top: 160px; }
.padding-top-5 { padding-top: 200px; }
.padding-top-6 { padding-top: 240px; }
.padding-top-7 { padding-top: 280px; }
.padding-top-8 { padding-top: 320px; }

.padding-bottom-1 { padding-bottom: 40px !important; }
.padding-bottom-2 { padding-bottom: 80px; }

.margin-top-1 { margin-top: 40px; }
.margin-top-2 { margin-top: 80px; }
.margin-top-3 { margin-top: 120px; }
.margin-top-4 { margin-top: 160px; }
.margin-top-5 { margin-top: 200px; }
.margin-top-6 { margin-top: 240px; }
.margin-top-7 { margin-top: 280px; }
.margin-top-8 { margin-top: 320px; }

.margin-right-1 { margin-right: 40px; }
.margin-right-2 { margin-right: 80px; }

.margin-bottom-1 { margin-bottom: 40px !important; }
.margin-bottom-2 { margin-bottom: 80px; }
.margin-bottom-3 { margin-bottom: 120px; }
.margin-bottom-4 { margin-bottom: 160px; }
.margin-bottom-5 { margin-bottom: 200px; }
.margin-bottom-6 { margin-bottom: 240px; }
.margin-bottom-7 { margin-bottom: 280px; }
.margin-bottom-8 { margin-bottom: 320px; }

.font-weight-200 { font-weight: 200; }
.font-weight-400 { font-weight: 400; }
.font-weight-500 { font-weight: 500; }
.font-weight-600 { font-weight: 600; }
.font-weight-700 { font-weight: 700; }

.hide { display: none; }
.opacity {opacity:0.3;}




.badge { background-color: #FFFFFF; font-size: 10px; line-height: 18px; text-align: center; display: inline-block; height: 16px; width: 16px; border-radius: 8px; font-weight: 600; position: absolute; left:20px; top:15px; }
.badge span.material-symbols-outlined { margin: 0; font-weight: 400; font-size: 10px; line-height: 16px; }
.badge.info { background-color: #ff4b33; color: var(--dark); }
.badge.bad { background-color: #ff4b33; color: #FFFFFF; }
.badge.good { background-color: #0a875a; color: #FFFFFF; }





[data-action-show-hide] {  }
[data-action-show-hide] .show { display: block; }
[data-action-show-hide] .hide { display: none; }
[data-action-show-hide].actived { background: var(--dark); color: #FFFFFF; }
[data-action-show-hide].actived .show { display: none; }
[data-action-show-hide].actived .hide { display: block; }






.alert { /*margin-bottom: 1px; height: 40px; background-color: var(--beige); color: var(--dark);*/ margin-top: 1px; height: 40px; background-color: var(--beige); color: var(--dark); position: fixed; bottom: 0px; left: 0; width: 100%; }
.alert > button { color: var(--dark); width: 40px; height: 40px; }
.alert-info { background-color: #FFC700; color: var(--dark); }
.alert-bad { background-color: #ff4b33; color: var(--dark); }
.alert-warning { background-color: #FFC700; color: var(--dark); }
.alert-good { background-color: #0a875a; color: var(--dark); }

.wrapper { display: flex; justify-content: space-between; align-items: center; }





hr.solid.dark { height: 1px; background-color: var(--dark); }
hr.solid.green-1 { height: 1px; background-color: var(--green-1); }
hr.solid.green-2 { height: 1px; background-color: var(--green-2); }
hr.solid.green-3 { height: 1px; background-color: var(--green-3); }
hr.dashed.dark { background-image: repeating-linear-gradient( to right, var(--dark) 0, var(--dark) 20px, transparent 20px, transparent 40px ); }
hr.dashed.green-1 { background-image: repeating-linear-gradient( to right, var(--green-1) 0, var(--green-1) 20px, transparent 20px, transparent 40px ); }
hr.dashed.green-2 { background-image: repeating-linear-gradient( to right, var(--green-2) 0, var(--green-2) 20px, transparent 20px, transparent 40px ); }
hr.dashed.green-3 { background-image: repeating-linear-gradient( to right, var(--green-3) 0, var(--green-3) 20px, transparent 20px, transparent 40px ); }




[clipboard],
[clipboard-text],
[clipboard-html] { cursor: pointer; }






/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section .row { display: flex; gap: 40px; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; align-content: flex-start; padding: 0 40px; clear: both; }
section .row.col-2 { width: inherit; display: flex; gap: inherit; }

section .row.half { width: calc(50% - 20px); clear: none !important; }
section .row.half:nth-child(even) { padding: 0 0 0 40px; float: left; }
section .row.half:nth-child(odd) { padding: 0 40px 0 0; float: right; }

section .row [class*='col-'] { align-self: auto; flex: 0 0 auto; }
section .row [class*="section-"] { border-radius: 20px; }
section .row [class*="section-"] > .wrap { padding: 8px 8px 16px 8px; position: relative; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section .row [class*="section-"] .line { padding: 31px 0 8px 0; }
section .row [class*="section-"] .line hr { height: 1px; }
section .row [class*="section-"] .line.solid hr { background-color: var(--dark); }
section .row [class*="section-"] .line.dashed hr { background-image: repeating-linear-gradient( to right, var(--dark) 0, var(--dark) 20px, transparent 20px, transparent 40px ); }
/* ---------------------------------------------- */
section .row [class*="section-"] .title { font-weight: 600; font-size: 16px; line-height: normal; }
/* ---------------------------------------------- */
section .row [class*="section-"] .supertitle { font-weight: 600; font-size: 32px; line-height: normal; }
/* ---------------------------------------------- */
section .row [class*="section-"] .subtitle { line-height: inherit; }
/* ---------------------------------------------- */
section .row [class*="section-"] .intro { margin: 16px 0px; font-size: 12px; line-height: normal; font-style: italic; }
section .row [class*="section-"] .intro a,
section .row [class*="section-"] .intro button { font-size: 12px; line-height: normal; font-style: italic; text-decoration: underline; }
/* ---------------------------------------------- */
section .row [class*="section-"] .text { margin: 16px 0px; line-height: normal !important; }
section .row [class*="section-"] .text h1,
section .row [class*="section-"] .text h2,
section .row [class*="section-"] .text h3,
section .row [class*="section-"] .text h4,
section .row [class*="section-"] .text h5,
section .row [class*="section-"] .text h6 { line-height: 120% !important; margin-bottom: 32px; }
section .row [class*="section-"] .text a:hover { text-decoration: underline; }
section .row [class*="section-"] .text [clipboard]:hover { text-decoration: underline; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section .row [class*="section-"] .label { font-weight: 200; font-size: 14px; text-transform: capitalize; font-style: italic; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section .row [class*="section-"] .actions {  }
section .row [class*="section-"] .actions > .wrap { padding: 8px 0; }
section .row [class*="section-"] .actions a,
section .row [class*="section-"] .actions button,
section .row [class*="section-"] .actions select { margin: 3px 8px 3px 0px; line-height: 24px; display: inline-block; border-radius: 16px; min-width: 38px;  padding: 4px 8px; text-align: center; font-size: 14px; font-weight: 300; vertical-align: middle; border: 1px solid var(--dark); text-align: left; }
section .row [class*="section-"] .actions input { width: 100%; max-width: 400px; line-height: 38px; display: inline-block; border: 1px solid #DFE0E1; border-radius: 20px; padding: 8px; text-align: left; background-color: #FFFFFF; color: var(--dark); font-size: 16px; line-height: 24px; font-weight: 200; }
section .row [class*="section-"] .actions a:hover,
section .row [class*="section-"] .actions button:hover/*,
section .row [class*="section-"] .actions select:hover*/ { background-color: var(--dark) !important; border-color: var(--dark) !important; color: var(--white) !important; }
section .row [class*="section-"] .actions a.primary,
section .row [class*="section-"] .actions button.primary,
section .row [class*="section-"] .actions select.primary {background: var(--dark); border-color: var(--dark); color: var(--white); }
section .row [class*="section-"] .actions a.secondary,
section .row [class*="section-"] .actions button.secondary,
section .row [class*="section-"] .actions select.secondary {  }
section .row [class*="section-"] .actions button[disabled] { opacity: .4; }
section .row [class*="section-"] .actions a.selected,
section .row [class*="section-"] .actions button.selected/*,
section .row [class*="section-"] .actions select:hover*/ { background-color: var(--dark) !important; border-color: var(--dark) !important; color: var(--white) !important; }
/* ---------------------------------------------- */
section .row [class*="section-"] .actions.top-right { position: absolute; top: 8px; right: 16px; }
section .row [class*="section-"] .actions.top-right > .wrap {   }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/*section .row [class*="section-"] input[type="checkbox"] { display: none; }
section .row [class*="section-"] input[type="checkbox"] + label { margin: 3px 0; font-size: 0px; line-height: 0px; display: block; position: relative; width: 48px; height: 26px; border-radius: 16px; cursor: pointer; border: 1px solid var(--dark); }
section .row [class*="section-"] input[type="checkbox"] + label::before { content: ""; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; background-color: var(--dark); border-radius: 50%; transition: 0.4s; }
section .row [class*="section-"] input[type="checkbox"]:checked + label {  }
section .row [class*="section-"] input[type="checkbox"]:checked + label::before { transform: translateX(22px); }
section .row [class*="section-"] [type="checkbox"]:focus + label { box-shadow: 0 0 1px #FFC700; }


section .row [class*="section-"] input[type="checkbox"].template-002 { display: none; }*/





/*section .row [class*="section-"] button[type="radio"] { border: 1px solid #EEEEEE; margin-right: 0; border-radius: 0; }
section .row [class*="section-"] button[type="radio"][checked] { background: var(--dark); color: #FFFFFF; }*/
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section .row [class*="section-"] .content table { width: 100%; line-height: normal< }
section .row [class*="section-"] .content table tr.border-bottom-dashed { position: relative; }
section .row [class*="section-"] .content table tr.border-bottom-dashed::after { content: ""; position: absolute; bottom: 0; left: 0; height: 1px; width: 100%; background-image: linear-gradient(to right, black 8px, transparent 8px); background-size: 16px 100%; background-repeat: repeat-x; }
section .row [class*="section-"] .content table tr.border-bottom-dashed:last-child::after { content: ""; background: none; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section .row [class*="section-"].beige { background: var(--beige); }
section .row [class*="section-"].beige .actions a.primary,
section .row [class*="section-"].beige .actions button.primary,
section .row [class*="section-"].beige .actions select.primary { background: var(--dark); border-color: var(--dark); color: var(--white); }
section .row [class*="section-"].beige .actions a.secondary,
section .row [class*="section-"].beige .actions button.secondary,
section .row [class*="section-"].beige .actions select.secondary { border-color: var(--dark); border-color: var(--dark); color: var(--dark); }
section .row [class*="section-"].yellow { background: var(--yellow); }
section .row [class*="section-"].yellow .actions a.primary,
section .row [class*="section-"].yellow .actions button.primary,
section .row [class*="section-"].yellow .actions select.primary { background: var(--dark); border-color: var(--dark); color: var(--white); }
section .row [class*="section-"].yellow .actions a.secondary,
section .row [class*="section-"].yellow .actions button.secondary,
section .row [class*="section-"].yellow .actions select.secondary { border-color: var(--dark); border-color: var(--dark); color: var(--dark); }
section .row [class*="section-"].green-1 { background: var(--green-1); }
section .row [class*="section-"].green-1 input[type="checkbox"] + label { background-color: var(--green-1); border-color: var(--green-3); }
section .row [class*="section-"].green-1 input[type="checkbox"] + label::before { background-color: var(--dark); }
section .row [class*="section-"].green-1 input[type="checkbox"]:checked + label { background-color: var(--green-2); }
section .row [class*="section-"].green-1 input[type="checkbox"]:checked + label::before  { background-color: var(--green-3); }
section .row [class*="section-"].green-1 .actions a.primary,
section .row [class*="section-"].green-1 .actions button.primary,
section .row [class*="section-"].green-1 .actions select.primary { background: var(--green-3); border-color: var(--green-3); color: var(--dark); }
section .row [class*="section-"].green-1 .actions a.secondary,
section .row [class*="section-"].green-1 .actions button.secondary,
section .row [class*="section-"].green-1 .actions select.secondary { background-color: var(--green-2); border-color: var(--green-3); }
section .row [class*="section-"].green-1 .line.solid hr { background-color: var(--green-2); }
section .row [class*="section-"].green-1 .line.dashed hr { background-image: repeating-linear-gradient( to right, var(--green-2) 0, var(--green-2) 20px, transparent 20px, transparent 40px ); }
section .row [class*="section-"].red-1 { background: var(--red-1); }
section .row [class*="section-"].red-1 input[type="checkbox"] + label { background-color: var(--red-1); /*border-color: var(--red-3);*/ }
section .row [class*="section-"].red-1 input[type="checkbox"] + label::before { background-color: var(--dark); }
section .row [class*="section-"].red-1 input[type="checkbox"]:checked + label { background-color: var(--red-2); }
section .row [class*="section-"].red-1 input[type="checkbox"]:checked + label::before  { background-color: var(--red-3); }
section .row [class*="section-"].red-1 .actions a.primary,
section .row [class*="section-"].red-1 .actions button.primary,
section .row [class*="section-"].red-1 .actions select.primary { background: var(--red-3); border-color: var(--red-3); color: var(--dark); }
section .row [class*="section-"].red-1 .actions a.secondary,
section .row [class*="section-"].red-1 .actions button.secondary,
section .row [class*="section-"].red-1 .actions select.secondary { background-color: var(--red-2); border-color: var(--red-3); }
section .row [class*="section-"].red-1 .line.solid hr { background-color: var(--red-2); }
section .row [class*="section-"].red-1 .line.dashed hr { background-image: repeating-linear-gradient( to right, var(--red-2) 0, var(--red-2) 20px, transparent 20px, transparent 40px ); }
section .row [class*="section-"].violet-1 { background: var(--violet-1); }
section .row [class*="section-"].violet-1 input[type="checkbox"] + label { background-color: var(--violet-1); border-color: var(--violet-3); }
section .row [class*="section-"].violet-1 input[type="checkbox"] + label::before { background-color: var(--dark); }
section .row [class*="section-"].violet-1 input[type="checkbox"]:checked + label { background-color: var(--violet-2); }
section .row [class*="section-"].violet-1 input[type="checkbox"]:checked + label::before  { background-color: var(--violet-3); }
section .row [class*="section-"].violet-1 .actions a.primary,
section .row [class*="section-"].violet-1 .actions button.primary,
section .row [class*="section-"].violet-1 .actions select.primary { background: var(--violet-3); border-color: var(--violet-3); color: var(--dark); }
section .row [class*="section-"].violet-1 .actions a.secondary,
section .row [class*="section-"].violet-1 .actions button.secondary,
section .row [class*="section-"].violet-1 .actions select.secondary { background-color: var(--violet-2); border-color: var(--violet-3); }
section .row [class*="section-"].violet-1 .line.solid hr { background-color: var(--violet-2); }
section .row [class*="section-"].violet-1 .line.dashed hr { background-image: repeating-linear-gradient( to right, var(--violet-2) 0, var(--violet-2) 20px, transparent 20px, transparent 40px ); }
/* ---------------------------------------------- */
section .row [class*="section-"] .actions a.primary.green-3,
section .row [class*="section-"] .actions button.primary.green-3,
section .row [class*="section-"] .actions select.primary.green-3 { background: var(--green-3); border-color: var(--green-3); color: var(--dark); }
section .row [class*="section-"] .actions a.secondary.green-3,
section .row [class*="section-"] .actions button.secondary.green-3,
section .row [class*="section-"] .actions select.secondary.green-3 { background: var(--green-2); border-color: var(--green-3); }
section .row [class*="section-"] .actions a.primary.red-3,
section .row [class*="section-"] .actions button.primary.red-3,
section .row [class*="section-"] .actions select.primary.red-3 { background: var(--red-3); border-color: var(--red-3); color: var(--dark); }
section .row [class*="section-"] .actions a.secondary.red-3,
section .row [class*="section-"] .actions button.secondary.red-3,
section .row [class*="section-"] .actions select.secondary.red-3 { background: var(--red-2); border-color: var(--red-3); }
section .row [class*="section-"] .actions a.primary.violet-3,
section .row [class*="section-"] .actions button.primary.violet-3,
section .row [class*="section-"] .actions select.primary.violet-3 { background: var(--violet-3); border-color: var(--violet-3); color: var(--dark); }
section .row [class*="section-"] .actions a.secondary.violet-3,
section .row [class*="section-"] .actions button.secondary.violet-3,
section .row [class*="section-"] .actions select.secondary.violet-3 { background: var(--violet-2); border-color: var(--violet-3); }
section .row [class*="section-"] .actions a.primary.yellow,
section .row [class*="section-"] .actions button.primary.yellow,
section .row [class*="section-"] .actions select.primary.yellow { background: var(--yellow); border-color: var(--yellow); color: var(--dark); }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
































section > .row.white { background-color: var(--white); }
section > .row.dark { background-color: var(--dark); }

section > .row.green-2 { background-color: var(--green-2); }
section > .row.red-2 { background-color: var(--red-2); }
section > .row.violet-2 { background-color: var(--violet-2); }

section > .row [class*='section-'].white { background-color: var(--white); }
section > .row [class*='section-'].dark { background-color: var(--dark); }




/* ---------------------------------------------- */








/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-title {  }
.section-title > .wrap { padding: 8px 16px 16px 16px !important; }
.section-title .breadcrump { font-size: 14px; line-height: 40px; font-weight: 200; display: block; font-style: italic; }
.section-title .breadcrump a { border-bottom: 1px dashed var(--dark); }
.section-title .breadcrump a:hover { border-bottom: 1px solid var(--dark); }
.section-title .breadcrump button { border-bottom: 1px dashed var(--dark); font-weight: 200; }
.section-title .breadcrump button:hover { border-bottom: 1px solid var(--dark); }
.section-title .title { font-size: 22px !important; }
.section-title .subtitle {  }
.section-title .actions { font-size: 0; vertical-align: middle; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-title.template-001 {  }
.section-title.template-001 .title,
.section-title.template-001 .subtitle,
.section-title.template-001 .actions { display: inline-block; }
.section-title.template-002 .subtitle { display: block; line-height: inherit; }
.section-title.template-002 .actions {  margin-top: 8px !important; }
.section-title.template-002 .actions a:first-child,
.section-title.template-002 .actions button:first-child,
.section-title.template-002 .actions select:first-child { margin-left: 0; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section > .row.green-2 .section-title .actions a.primary,
section > .row.green-2 .section-title .actions button.primary,
section > .row.green-2 .section-title .actions select.primary { background: var(--green-3); border-color: var(--green-3); color: var(--dark); }
section > .row.green-2 .section-title .actions a.secondary,
section > .row.green-2 .section-title .actions button.secondary,
section > .row.green-2 .section-title .actions select.secondary { background: var(--green-2); border-color: var(--green-3); color: var(--dark); }
/* ---------------------------------------------- */
section > .row.red-2 .section-title .actions a.primary,
section > .row.red-2 .section-title .actions button.primary,
section > .row.red-2 .section-title .actions select.primary { background: var(--red-3); border-color: var(--red-3); color: var(--dark); }
section > .row.red-2 .section-title .actions a.secondary,
section > .row.red-2 .section-title .actions button.secondary,
section > .row.red-2 .section-title .actions select.secondary { background: var(--red-2); border-color: var(--red-3); color: var(--dark); }
/* ---------------------------------------------- */
section > .row.violet-2 .section-title .actions a.primary,
section > .row.violet-2 .section-title .actions button.primary,
section > .row.violet-2 .section-title .actions select.primary { background: var(--violet-3); border-color: var(--violet-3); color: var(--dark); }
section > .row.violet-2 .section-title .actions a.secondary,
section > .row.violet-2 .section-title .actions button.secondary,
section > .row.violet-2 .section-title .actions select.secondary { background: var(--violet-2); border-color: var(--violet-3); color: var(--dark); }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */








/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-actions {  }
.section-actions > .wrap { padding: 8px 16px 16px 16px !important; }
.section-actions .label { vertical-align: middle; }
.section-actions .actions a,
.section-actions .actions button,
.section-actions .actions select,
.section-actions .actions input {  }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-actions.template-001 {  }
.section-actions.template-001 .label,
.section-actions.template-001 .actions { display: inline-block; }
.section-actions.template-002 {  }
.section-actions.template-002 .actions {  }
.section-actions.template-002 .actions a:first-child,
.section-actions.template-002 .actions button:first-child,
.section-actions.template-002 .actions select:first-child { margin-left: 0; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-actions .actions a.primary.green-3,
.section-actions .actions button.primary.green-3,
.section-actions .actions select.primary.green-3 { background: var(--green-3); }
.section-actions .actions a.secondary.green-3,
.section-actions .actions button.secondary.green-3,
.section-actions .actions select.secondary.green-3 { background: var(--green-2); border-color: var(--green-3); }
.section-actions .actions a.primary.red-3,
.section-actions .actions button.primary.red-3,
.section-actions .actions select.primary.red-3 { background: var(--red-3); }
.section-actions .actions a.secondary.red-3,
.section-actions .actions button.secondary.red-3,
.section-actions .actions select.secondary.red-3 { background: var(--red-2); border-color: var(--red-3); }
.section-actions .actions a.primary.violet-3,
.section-actions .actions button.primary.violet-3,
.section-actions .actions select.primary.violet-3 { background: var(--violet-3); }
.section-actions .actions a.secondary.violet-3,
.section-actions .actions button.secondary.violet-3,
.section-actions .actions select.secondary.violet-3 { background: var(--violet-2); border-color: var(--violet-3); }
.section-actions .actions a.primary.beige,
.section-actions .actions button.primary.beige,
.section-actions .actions select.primary.beige { background: var(--beige) !important; color: var(--dark) !important; }
.section-actions .actions a.primary.yellow,
.section-actions .actions button.primary.yellow,
.section-actions .actions select.primary.yellow { background: var(--yellow); }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */









/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-tab { font-size: 0px; line-height: 24px; border-radius: 0 !important; position: relative; }
.section-tab > .wrap { white-space: nowrap; overflow-x: auto; display: flex; flex-direction: row; flex-wrap: nowrap; column-gap: 4px; }
.section-tab .label { display: inline-block; padding: 0 16px 0 0;  }
/*.section-tab .label > .wrap { padding: 0 0 8px 0; }*/
.section-tab button { background-color: var(--beige); line-height: 24px; font-weight: 200; padding: 8px 16px; text-transform: uppercase; display: inline-block; vertical-align: middle; border-radius: 8px 8px 0 0; }
.section-tab button span.material-symbols-outlined { vertical-align: middle; line-height: 16px; font-variation-settings: 'FILL' 0, 'wght' 100, 'GRAD' 0, 'opsz' 16; }
.section-tab button:last-child { margin-right: 0; }
.section-tab button:hover {  }
.section-tab button.selected { background-color: var(--white) !important; border: 1px solid var(--dark); border-bottom: none; font-weight: 600; z-index: 1; position: relative; }
.section-tab hr { left: 0px; bottom: 16px; width: 100%; background-color: var(--dark); position: absolute; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section > .row.green-2 .section-tab > .wrap  { padding: 0px 8px !important; }
section > .row.green-2 .section-tab button { background: var(--green-1); color: var(--dark); }
section > .row.green-2 .section-tab button:hover { background: var(--white); }
section > .row.green-2 .section-tab button.selected { border: none; }
section > .row.red-2 .section-tab > .wrap  { padding: 0px 8px !important; }
section > .row.red-2 .section-tab button { background: var(--red-1); color: var(--dark); }
section > .row.red-2 .section-tab button:hover { background: var(--white); }
section > .row.red-2 .section-tab button.selected { border: none; }
section > .row.violet-2 .section-tab > .wrap  { padding: 0px 8px !important; }
section > .row.violet-2 .section-tab button { background: var(--violet-1); color: var(--dark); }
section > .row.violet-2 .section-tab button:hover { background: var(--white); }
section > .row.violet-2 .section-tab button.selected { border: none; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */









/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-steps {  }
.section-steps > .wrap { position: relative; }


.section-steps hr { position: absolute; top: 27px; left: 8px; width: calc(100% - 16px); margin: 0; z-index: 0; border: none; border: 1px solid transparent; }
.section-steps button { margin: 3px 20px 3px 0px; height: 34px; padding: 0 16px 0 8px; border-radius: 20px; border: 1px solid var(--dark); z-index: 1; cursor: default; position: relative; line-height: normal; font-size: 12px; }
.section-steps button span { margin-right: 8px; }
.section-steps button.selected { background: #AAAAAA; }
.section-steps button.closed { background: #FFC700; }
.section-steps button[data-href] { background: #FFC700; color: var(--dark); cursor: pointer; }
.section-steps button[data-href]:hover { background: var(--dark); color: #EEEEEE; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section > .row .section-steps.red-1 hr { border-bottom-color: var(--red-2); }
section > .row .section-steps.red-1 button { background: var(--red-1); border-color: var(--red-2); }
section > .row .section-steps.red-1 button.selected { background: var(--red-2); }
section > .row .section-steps.red-1 button.closed { background: var(--red-3); }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */









/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-table { overflow: auto; }
.section-table > .wrap { padding: 8px; }

.section-table .title { padding: 0 8px; font-weight: 600; }
.section-table .subtitle { padding: 0 8px; }
.section-table .content { /*overflow: auto;*/ }
.section-table .content .wrap { /*overflow: auto;*/ }
.section-table .content table { width: 100%; }
.section-table .content table thead tr.filter { border-bottom: 1px dashed var(--dark) !important; border-top-color: transparent !important; }
.section-table .content table thead tr.filter input { background-color: transparent; padding: 0; border: none; font-weight: 200; width: -webkit-fill-available; width: -moz-available; line-height: 40px; color: var(--dark); opacity: .4; font-size: 12px; }
.section-table .content table thead tr.filter input::-webkit-input-placeholder { color: var(--dark); }
.section-table .content table thead tr.filter input:-moz-placeholder { color: var(--dark); }
.section-table .content table thead tr.filter input::-moz-placeholder { color: var(--dark); }
.section-table .content table thead tr.filter input:-ms-input-placeholder { color: var(--dark) }
.section-table .content table thead tr.labels { border-bottom: 1px dashed var(--dark); }
.section-table .content table thead tr.labels th { font-weight: 400; }
.section-table .content table thead tr.labels th[action-sort] { cursor: pointer; }
.section-table .content table thead tr.labels th[action-sort]::after { content: 'swap_vert'; font-family: 'Material Symbols Outlined'; font-weight: 400; font-style: normal; font-size: 16px; vertical-align: middle; margin-left: 4px; display: inline-block; }
.section-table .content table tbody tr { border-bottom: 1px solid transparent; }
/*.section-table .content table tbody tr:first-child { border-top: 1px solid transparent; }*/
.section-table .content table tbody tr td input[type="checkbox"] { display: none; }
.section-table .content table tbody tr td input[type="checkbox"] + label { margin: 3px 0; font-size: 0px; line-height: 0px; display: block; position: relative; width: 48px; height: 26px; border-radius: 16px; cursor: pointer; border: 1px solid var(--dark); }
.section-table .content table tbody tr td input[type="checkbox"] + label::before { content: ""; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; background-color: var(--dark); border-radius: 50%; transition: 0.4s; }
.section-table .content table tbody tr td input[type="checkbox"]:checked + label {  }
.section-table .content table tbody tr td input[type="checkbox"]:checked + label::before { transform: translateX(22px); }
.section-table .content table tbody tr td [type="checkbox"]:focus + label { box-shadow: 0 0 1px #FFC700; }


.section-table .content table tr { height: 40px; }
.section-table .content table tr td,
.section-table .content table tr th { padding: 0px 8px; text-align: left; vertical-align: middle; }
/*.section-table .content table tr input { padding: 8px; line-height: 24px; border: none; width: 100%; font-size: 12px; background: transparent; }*/






.section-table .content table tr td.handle { width: 40px; cursor: pointer; }
.section-table .content table tr td.active { width: 64px; }
.section-table .content table tr td.actions { font-weight: 600; font-size: 0; vertical-align: middle; text-align: right; }
.section-table .content table tr td.actions a,
.section-table .content table tr td.actions button,
.section-table .content table tr td.actions select { margin: 3px 0px 3px 8px !important; line-height: 16px; display: inline-block; border: 1px solid transparent; border-radius: 20px; padding: 4px 8px; text-align: center; color: var(--dark); font-size: 12px; font-weight: 300; vertical-align: middle; }
.section-table .content table tr td.actions select { width: auto; height: 40px; background-color: #F7F7F7; text-align: left; }
.section-table .content table tr td.actions input { margin-left: 16px; width: 100%; max-width: 400px; line-height: 38px; display: inline-block; border: 1px solid #DFE0E1; border-radius: 20px; padding: 0 8px; text-align: left; background-color: #FFFFFF; color: var(--dark); font-size: 16px; font-weight: 300; }
.section-table .content table tr td.actions a:hover,
.section-table .content table tr td.actions button:hover,
.section-table .content table tr td.actions select:hover { background: var(--dark) !important; border: 1px solid var(--dark) !important; color: var(--white); }

.section-table .content table tr td:first-child.actions {  text-align: left; }
.section-table .content table tr td:first-child.actions a,
.section-table .content table tr td:first-child.actions button,
.section-table .content table tr td:first-child.actions select { margin-left: 0px; margin-right: 8px; }

.section-table.template-001 .content table tr td,
.section-table.template-001 .content table tr th {  }

.section-table.template-002 .content table tr td,
.section-table.template-002 .content table tr th { border-left: 1px dashed var(--dark); }
.section-table.template-002 .content table tr td:first-child,
.section-table.template-002 .content table tr th:first-child { border-left: none; }






/* ---------------------------------------------- */
/* ---------------------------------------------- */
section > .row .section-table.green-1 { background: var(--green-1); }
section > .row .section-table.green-1 .content table tr td.actions a.primary,
section > .row .section-table.green-1 .content table tr td.actions button.primary,
section > .row .section-table.green-1 .content table tr td.actions select.primary { background: var(--green-3); }
section > .row .section-table.green-1 .content table tr td.actions a.secondary,
section > .row .section-table.green-1 .content table tr td.actions button.secondary,
section > .row .section-table.green-1 .content table tr td.actions select.secondary { background: var(--green-1); border-color: var(--green-3); }
section > .row .section-table.green-1 .content table tr:hover { background: var(--green-2); }
section > .row .section-table.green-1 .content table tbody tr { border-bottom-color: var(--green-2); }
section > .row .section-table.green-1 .content table tbody tr td input[type="checkbox"] + label { background-color: var(--green-1); border-color: var(--green-3); }
section > .row .section-table.green-1 .content table tbody tr td input[type="checkbox"] + label::before { background-color: var(--dark); }
section > .row .section-table.green-1 .content table tbody tr td input[type="checkbox"]:checked + label { background-color: var(--green-2); }
section > .row .section-table.green-1 .content table tbody tr td input[type="checkbox"]:checked + label::before  { background-color: var(--green-3); }
/*section > .row .section-table.green-1 .content table tbody tr:first-child { border-top-color: var(--green-2); }*/
/* ---------------------------------------------- */
section > .row .section-table.red-1 { background: var(--red-1); }
section > .row .section-table.red-1 .content table tr td.actions a.primary,
section > .row .section-table.red-1 .content table tr td.actions button.primary,
section > .row .section-table.red-1 .content table tr td.actions select.primary { background: var(--red-3); }
section > .row .section-table.red-1 .content table tr td.actions a.secondary,
section > .row .section-table.red-1 .content table tr td.actions button.secondary,
section > .row .section-table.red-1 .content table tr td.actions select.secondary { background: var(--red-1); border-color: var(--red-3); }
section > .row .section-table.red-1 .content table tr:hover { background: var(--red-2); }
section > .row .section-table.red-1 .content table tbody tr { border-bottom: 1px solid var(--red-2); }
section > .row .section-table.red-1 .content table tbody tr td input[type="checkbox"] + label { background-color: var(--red-1); border-color: var(--red-3); }
section > .row .section-table.red-1 .content table tbody tr td input[type="checkbox"] + label::before { background-color: var(--dark); }
section > .row .section-table.red-1 .content table tbody tr td input[type="checkbox"]:checked + label { background-color: var(--red-2); }
section > .row .section-table.red-1 .content table tbody tr td input[type="checkbox"]:checked + label::before  { background-color: var(--red-3); }
/*section > .row .section-table.red-1 .content table tbody tr:first-child { border-top-color: var(--red-2); }*/
/* ---------------------------------------------- */
section > .row .section-table.violet-1 { background: var(--violet-1); }
section > .row .section-table.violet-1 .content table tr td.actions a.primary,
section > .row .section-table.violet-1 .content table tr td.actions button.primary,
section > .row .section-table.violet-1 .content table tr td.actions select.primary { background: var(--violet-3); border-color: var(--violet-3); color: var(--dark); }
section > .row .section-table.violet-1 .content table tr td.actions a.secondary,
section > .row .section-table.violet-1 .content table tr td.actions button.secondary,
section > .row .section-table.violet-1 .content table tr td.actions select.secondary { background: var(--violet-1); border-color: var(--violet-3); }
section > .row .section-table.violet-1 .content table tr:hover { background: var(--violet-2); }
section > .row .section-table.violet-1 .content table tbody tr { border-bottom: 1px solid var(--violet-2); }
section > .row .section-table.violet-1 .content table tbody tr td input[type="checkbox"] + label { background-color: var(--violet-1); border-color: var(--violet-3); }
section > .row .section-table.violet-1 .content table tbody tr td input[type="checkbox"] + label::before { background-color: var(--dark); }
section > .row .section-table.violet-1 .content table tbody tr td input[type="checkbox"]:checked + label { background-color: var(--violet-2); }
section > .row .section-table.violet-1 .content table tbody tr td input[type="checkbox"]:checked + label::before  { background-color: var(--violet-3); }
/*section > .row .section-table.violet-1 .content table tbody tr:first-child { border-top-color: var(--violet-2); }*/
/* ---------------------------------------------- */
section > .row .section-table.yellow { background: var(--yellow); }
section > .row .section-table.yellow .content table tr td.actions a.primary,
section > .row .section-table.yellow .content table tr td.actions button.primary,
section > .row .section-table.yellow .content table tr td.actions select.primary { background: var(--dark); color: var(--white); }
section > .row .section-table.yellow .content table tr td.actions a.secondary,
section > .row .section-table.yellow .content table tr td.actions button.secondary,
section > .row .section-table.yellow .content table tr td.actions select.secondary { background: var(--yellow); border-color: var(--dark); }
section > .row .section-table.yellow .content table tr:hover { background: var(--beige); }
section > .row .section-table.yellow .content table tbody tr { border-bottom: 1px solid var(--dark); }
/*section > .row .section-table.yellow .content table tbody tr:first-child { border-top-color: var(--dark); }*/
/* ---------------------------------------------- */
section > .row .section-table .content table tr td.actions a.primary.yellow,
section > .row .section-table .content table tr td.actions button.primary.yellow,
section > .row .section-table .content table tr td.actions select.primary.yellow { background: var(--yellow); border-color: var(--yellow); color: var(--dark); }
section > .row .section-table .content table tr td.actions a.secondary.yellow,
section > .row .section-table .content table tr td.actions button.secondary.yellow,
section > .row .section-table .content table tr td.actions select.secondary.yellow { /*background: var(--yellow);*/ border-color: var(--yellow); }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */








/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-form {  }
.section-form > .wrap { padding: 8px 16px 16px 16px !important; }

.section-form .actions {  }
.section-form .actions a:first-child,
.section-form .actions button:first-child,
.section-form .actions select:first-child { margin-left: 0px !important; }


.section-form .form-row { width: 100%; font-size: 0; line-height: 0; display: flex; gap: 0px 16px; flex-wrap: wrap; justify-content: flex-start; }
.section-form .form-row .form-group { margin: 0; margin-top: 0px; padding: 0; align-self: auto; flex: 0 0 auto; }

.section-form .form-row .form-group label { padding-top: 24px; padding-bottom: 4px; font-size: 12px; line-height: 12px; font-weight: 300; display: block; width: 100%; }
.section-form .form-row .form-group input,
.section-form .form-row .form-group select,
.section-form .form-row .form-group textarea { display: block; border: 0; border-radius: 0; font-size: 16px; line-height: 16px; padding: 0 4px; height: 38px; width: 100%; border: 1px solid var(--dark); }
.section-form .form-row .form-group select { padding: 0px; }
.section-form .form-row .form-group textarea { height: 161px; padding: 8px; line-height: 24px;  }


/*.section-form .form-row .form-group input[type="checkbox"] { display: none; }
.section-form .form-row .form-group input[type="checkbox"] + label { font-size: 0px; line-height: 0px; position: relative; cursor: pointer; var(--dark); }
.section-form .form-row .form-group input[type="checkbox"] + label::before { content: ""; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; background-color: var(--dark); border-radius: 50%; transition: 0.4s; }
.section-form .form-row .form-group input[type="checkbox"]:checked + label {  }
.section-form .form-row .form-group input[type="checkbox"]:checked + label::before { transform: translateX(22px); }


.section-form .form-row .form-group input[type="checkbox"] + label { margin: 0px; margin-top: 38px; margin-right: 16px; height: 38px; width: 80px; border-radius: 19px; display: inline-block; background-color: var(--white) !important; border: 1px solid var(--dark) !important; }
.section-form .form-row .form-group input[type="checkbox"] + label::before { width: 32px; height: 32px; border-radius: 19px; background-color: var(--dark) !important; }
.section-form .form-row .form-group input[type="checkbox"] + label::after { content: attr(content); position: absolute; top: inherit; bottom: 42px; font-size: 12px; line-height: 12px; font-weight: 300; width: max-content; }
.section-form .form-row .form-group input[type="checkbox"]:checked + label::before { transform: translateX(42px); }*/

.section-form .form-row .form-group input[type="checkbox"] { display: none; }
.section-form .form-row .form-group input[type="checkbox"] + label { font-size: 0px; line-height: 0px; position: relative; cursor: pointer; color: var(--dark); margin: 0px; margin-top: 38px; margin-right: 16px; height: 38px; width: 80px; border-radius: 19px; display: inline-block; background-color: var(--white) !important; border: 1px solid var(--dark) !important; }
.section-form .form-row .form-group input[type="checkbox"] + label::before { content: ""; position: absolute; top: 2px; left: 2px; width: 32px; height: 32px; border-radius: 19px; background-color: var(--beige) !important; transition: 0.4s; }
.section-form .form-row .form-group input[type="checkbox"] + label::after { content: attr(content); position: absolute; top: inherit; bottom: 42px; font-size: 12px; line-height: 12px; font-weight: 300; width: max-content; }
.section-form .form-row .form-group input[type="checkbox"]:checked + label { }
.section-form .form-row .form-group input[type="checkbox"]:checked + label::before { transform: translateX(42px); background-color: var(--dark) !important; }


.section-form .form-row .form-group button[type="checkbox"] { background-color: var(--white); border: 1px solid var(--dark); font-size: 16px; line-height: 16px; padding: 0 8px; height: 38px; margin: 0 2px 2px 0; }
.section-form .form-row .form-group button[type="checkbox"]:not([input-value="ALL"]).checked { background-color: var(--dark); color: var(--white); }
.section-form .form-row .form-group button[type="checkbox"][input-value="ALL"]{ background-color: transparent; border-color: transparent; font-style: italic; }
.section-form .form-row .form-group button[type="checkbox"].first-checkbox { border-radius: 16px 0 0 16px; }
.section-form .form-row .form-group button[type="checkbox"].last-checkbox { border-radius: 0 16px 16px 0; }


.section-form .form-row .form-group input[type="file"] { padding: 0px; }
.section-form .form-row .form-group input[type="file"]::file-selector-button {
    /*background-color: #007bff;
    color: white;*/
    border: none;
    padding: 10px 20px;
    border-radius: 0px;
    cursor: pointer;
    transition: 0.3s;
}






.section-form .form-row .form-group button[type="radio"] { border: 1px solid var(--dark); padding: 0 8px; background: var(--white); margin: 0 8px 8px 0px; height: 38px; }
.section-form .form-row .form-group button[type="radio"][checked] { background: var(--dark); color: var(--white); }




.section-form .form-row .form-group input[required].error,
.section-form .form-row .form-group select[required].error,
.section-form .form-row .form-group textarea[required].error { /*background-color: #FFC700;*/ }
.section-form .form-row .form-group .title { width: 100%; font-size: 14px; font-weight: 600; line-height: normal; margin: 24px 0 8px 0; }
.section-form .form-row .form-group .subtitle { width: 100%; font-size: 12px; line-height: normal; margin: 0 0 8px 0; }
.section-form .form-row .form-group .text { width: 100%; font-size: 12px; line-height: normal; margin: 24px 0 8px 0; }
.section-form .form-row .form-group .textsmall { width: 100%; font-size: 10px; padding: 8px 0; }
.section-form .form-row .form-group hr { width: 100%; margin: 24px 0px 0px 0px; border: 0; border-bottom: 1px solid var(--dark); }

.section-form .form-row .form-group.width-12 { width: 100%; }
.section-form .form-row .form-group.width-9 { width: calc(75% - (16px / 2)); }
.section-form .form-row .form-group.width-8 { width: calc(66.66% - (16px / 2)); }
.section-form .form-row .form-group.width-6 { width: calc(50% - (16px / 2)); }
.section-form .form-row .form-group.width-4 { width: calc(33.33% - (16px / 2)); }
.section-form .form-row .form-group.width-3 { width: calc((100% - (16px * 3)) / 4); }

.section-form .form-row .form-group .tox.tox-tinymce { border: 1px solid var(--dark) !important; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section > .row .section-form.beige { background: var(--beige); }
/* ---------------------------------------------- */
section > .row .section-form.green-1 { background: var(--green-1); }
section > .row .section-form.green-1 .form-row .form-group input[type="file"]::file-selector-button { background-color: var(--green-2); }
section > .row .section-form.green-1 .form-row .form-group input[required].error,
section > .row .section-form.green-1 .form-row .form-group select[required].error,
section > .row .section-form.green-1 .form-row .form-group textarea[required].error,
section > .row .section-form.green-1 .form-row .form-group input[required].error + label { background-color: var(--green-2) !important; }
/* ---------------------------------------------- */
section > .row .section-form.red-1 { background: var(--red-1); }
section > .row .section-form.red-1 .form-row .form-group input[type="file"]::file-selector-button { background-color: var(--red-2); }
section > .row .section-form.red-1 .form-row .form-group input[required].error,
section > .row .section-form.red-1 .form-row .form-group select[required].error,
section > .row .section-form.red-1 .form-row .form-group textarea[required].error,
section > .row .section-form.red-1 .form-row .form-group input[required].error + label { background-color: var(--red-2) !important; }
/* ---------------------------------------------- */
section > .row .section-form.violet-1 { background: var(--violet-1); }
section > .row .section-form.violet-1 .form-row .form-group input[required].error,
section > .row .section-form.violet-1 .form-row .form-group select[required].error,
section > .row .section-form.violet-1 .form-row .form-group textarea[required].error,
section > .row .section-form.violet-1 .form-row .form-group input[required].error + label { background-color: var(--violet-2) !important; }
/* ---------------------------------------------- */
section > .row .section-form.yellow { background: var(--yellow); }
section > .row .section-form.yellow input[type="checkbox"]:checked + label { background-color: var(--yellow) !important; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */








/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-text {  }
.section-text > .wrap { padding: 8px 16px 16px 16px !important; }
.section-text .title {  }
.section-text .subtitle {  }
.section-text .content {  }
.section-text .content p { margin-top: 16px; }
.section-text .content span.label { font-size: 10px; font-weight: 600; display: block; }
.section-text .actions {  }
.section-text .actions a:first-child,
.section-text .actions button:first-child,
.section-text .actions select:first-child { margin-left: 0px !important; }
.section-text .table table { width: 100%; }
.section-text .table table tr { border-bottom: 1px solid var(--beige); }
.section-text .table table tr td { padding: 4px 0; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */








/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-list {  }
.section-list > .wrap {  }
.section-list .content span.actions { position: absolute; top: 3px; right: 0px; }
/*.section-list div.actions a,
.section-list div.actions button,
.section-list div.actions input,
.section-list div.actions select { }*/

.section-list {  }
.section-list > .wrap {  }
.section-list .title { padding: 0 8px; }
.section-list .title .image { float: left; }
.section-list .title .image span { padding: 0 8px; }
.section-list .title .image span img { height: 40px; }
.section-list .filter { padding: 8px; }
.section-list .filter input { background-color: transparent; padding: 0; border: none; font-weight: 200; width: -webkit-fill-available; width: -moz-available; line-height: 40px; border-bottom: 1px dashed var(--dark); color: var(--dark); opacity: .4; font-size: 12px; }
.section-list .filter input::-webkit-input-placeholder { color: var(--dark); }
.section-list .filter input:-moz-placeholder { color: var(--dark); }
.section-list .filter input::-moz-placeholder { color: var(--dark); }
.section-list .filter input:-ms-input-placeholder { color: var(--dark) }
.section-list .content {  }
.section-list .content ul li { position: relative; padding: 8px 8px 8px 8px; border-bottom: 1px solid; }
.section-list .content ul li .actions { right: 8px; }
.section-list .content ul li:last-child { border-bottom: none; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section > .row .section-list.beige { background: var(--beige); }
/* ---------------------------------------------- */
section > .row .section-list.green-1 { background: var(--green-1); }
section > .row .section-list.green-1 .content ul li { border-bottom-color: var(--green-2); }

section > .row .section-list.green-1 .content ul li:hover { background-color: var(--green-2); }
/*section > .row .section-form.green-1 .form-row .form-group input[required].error,
section > .row .section-form.green-1 .form-row .form-group select[required].error,
section > .row .section-form.green-1 .form-row .form-group textarea[required].error,
section > .row .section-form.green-1 .form-row .form-group input[required].error + label { background-color: var(--green-2) !important; }*/
/* ---------------------------------------------- */
section > .row .section-list.red-1 { background: var(--red-1); }
section > .row .section-list.red-1 .content ul li { border-bottom-color: var(--red-2); }
section > .row .section-list.red-1 .content ul li:hover { background-color: var(--red-2); }
/*section > .row .section-form.red-1 .form-row .form-group input[required].error,
section > .row .section-form.red-1 .form-row .form-group select[required].error,
section > .row .section-form.red-1 .form-row .form-group textarea[required].error,
section > .row .section-form.red-1 .form-row .form-group input[required].error + label { background-color: var(--red-2) !important; }*/
/* ---------------------------------------------- */
section > .row .section-list.violet-1 { background: var(--violet-1); }
section > .row .section-list.violet-1 .content ul li { border-bottom-color: var(--violet-2); }
section > .row .section-list.violet-1 .content ul li:hover { background-color: var(--violet-2); }
/*section > .row .section-form.violet-1 .form-row .form-group input[required].error,
section > .row .section-form.violet-1 .form-row .form-group select[required].error,
section > .row .section-form.violet-1 .form-row .form-group textarea[required].error,
section > .row .section-form.violet-1 .form-row .form-group input[required].error + label { background-color: var(--violet-2) !important; }*/
/* ---------------------------------------------- */
section > .row .section-list-form.yellow { background: var(--yellow); }
section > .row .section-list.yellow input[type="checkbox"]:checked + label { background-color: var(--yellow) !important; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */








/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-top { padding-bottom: 40px; }
.section-top > .wrap { border-bottom: 1px solid var(--dark); padding: 16px 8px 8px 8px !important; }
.section-bottom { padding-top: 40px; }
.section-bottom > .wrap { border-top: 1px solid var(--dark); }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */








/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/*.section-head > .wrap { display: flex; justify-content: space-between; align-items: flex-start; }
.section-head .left .title { font-size: 24px !important; }
.section-head .right { text-align: right; }
.section-head .right .logo {  }
.section-head .right .logo img,
.section-head .right .logo svg { width: 64px; }*/
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */








/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
.section-line {  }
.section-line > .wrap {  }
.section-line hr { height: 1px; }
.section-line.solid hr { background-color: var(--dark); }
.section-line.dashed hr { background-image: repeating-linear-gradient( to right, var(--dark) 0, var(--dark) 20px, transparent 20px, transparent 40px ); }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */








/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
section.footer { font-weight: 400; margin-top: 320px; margin-bottom: 40px; }
section.footer .row { gap: inherit !important; }
section.footer .row [class*="section-"] { position: relative; }
section.footer .row [class*="section-"] > .wrap { padding: 8px 8px 8px 8px; }
section.footer .row [class*="section-"] > hr { background-color: var(--dark); position: absolute; bottom: 0px; left: 0; width: 100%; }

section.footer .section-annualProgressStats { font-size: 8px; line-height: normal; }
section.footer .section-annualProgressStats > .wrap { padding-bottom: 0px !important; }
section.footer .section-annualProgressStats .stats { display: flex; gap: 32px; justify-content: space-between; }
section.footer .section-annualProgressStats .progress-bar { height: 4px; background: var(--green-3); overflow: hidden; }

section.footer .section-columns > .wrap { display: flex; gap: 40px; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; flex-direction: row;
    flex-wrap: wrap; }
section.footer .section-columns .column { align-self: auto; flex: 1; }
section.footer .section-columns .column .menu label { display: block; font-size: 14px; font-weight: 600; cursor: inherit; }
section.footer .section-columns .column .menu ul li { padding: 0; }
section.footer .section-columns .column .menu ul li a,
section.footer .section-columns .column .menu ul li button { font-size: 14px; }
section.footer .section-columns .column .menu ul li a:hover,
section.footer .section-columns .column .menu ul li button:hover { border-bottom: .5px solid var(--dark); }
section.footer .section-columns .column .menu ul li.info { font-size: 10px; line-height: normal; text-transform: lowercase; }

section.footer .section-row > .wrap { display: flex; gap: inherit; column-gap: 40px; overflow: hidden; flex-wrap: wrap; flex-direction: row; }
section.footer .section-row img,
section.footer .section-row svg { height: 80px; width: auto; }
section.footer .section-row .bold { font-weight: 700; }

section.footer .section-scroll > .wrap { display: flex; gap: inherit; column-gap: 40px; overflow: hidden; }
section.footer .section-scroll .bold { font-weight: 700; }
section.footer .section-scroll img,
section.footer .section-scroll svg { height: 80px; width: auto; }
section.footer .section-scroll .scroll-track { display: flex; column-gap: 32px; width: max-content; animation: scroll 40s linear infinite; animation-timing-function: linear; will-change: transform; }
section.footer .section-scroll .scroll-track .scroll-chunk { display: flex; column-gap: 32px; flex-wrap: nowrap; flex-direction: row;}
section.footer .section-scroll .scroll-track .scroll-chunk span { white-space: nowrap; text-transform: uppercase; }
section.footer .section-scroll:nth-child(odd) .scroll-track { animation-direction: normal; }
section.footer .section-scroll:nth-child(even) .scroll-track { animation-direction: reverse; }
@keyframes scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); }}
section.footer .section-scroll .scroll-track:hover { animation-play-state: paused; }

section.footer .section-logo { font-size: 0px; line-height: 0px; border-radius: 0px !important; overflow: hidden; }
section.footer .section-logo > .wrap {  }
section.footer .section-logo img,
section.footer .section-logo svg { height: auto; width: 100%; }
section.footer .section-logo.width-50 img,
section.footer .section-logo.width-50 svg { height: auto; width: 50%; }
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */
/* ---------------------------------------------- */









/* CONTENT ****************/
#contentLAYOUT { margin: 40px 0 0 40px !important; overflow-y: scroll; position: relative; background: var(--white); }
#contentLAYOUT > .wrap {  }








/* CONTENT ****************/
#loadingLAYOUT { position: absolute; top:0px; left: 0px; margin: 40px 0 0 40px !important; overflow-y: auto; display: none; z-index: 9; width: -webkit-fill-available; }
#loadingLAYOUT > .wrap { padding: 39px 39px 39px 39px; background: var(--dark); color: #FFFFFF; }









/* HEADER *****************/
#headerLAYOUT { position: fixed; top: 0px; left: 40px; height: 40px; width: calc(100% - 40px); background: var(--dark); }
#headerLAYOUT > .wrap { overflow-x: auto; width: 100%; }
#headerLAYOUT ul { display: flex; gap: 24px; flex-direction: row; flex-wrap: nowrap; align-items: center; height: 40px; padding: 0px 24px; }
#headerLAYOUT ul li { display: flex; gap: 24px; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; padding: 0px; }
#headerLAYOUT ul li span.material-symbols-outlined { margin-right: 4px; font-weight: 300; }
#headerLAYOUT ul li a,
#headerLAYOUT ul li button { white-space: nowrap; color: var(--beige); text-transform: uppercase; font-weight: 300; }
#headerLAYOUT ul li a:hover,
#headerLAYOUT ul li button:hover { text-decoration: none; color: var(--white); }
#headerLAYOUT ul li hr { background-color: var(--white); height: 32px; width: 1px; }

#headerLAYOUT ul li.menu-button a { color: var(--white); }
#headerLAYOUT ul li.menu-button a#menu-button-close { display: none; }






/* ASIDE ******************/
#asideLAYOUT { position: fixed; top: 40px; left: 0px; width: 40px; height: calc(100% - 40px); background: var(--dark); }
#asideLAYOUT > .wrap { overflow-y: auto; height: 100%; }
#asideLAYOUT ul { display: flex; gap: 24px;flex-direction: column; flex-wrap: nowrap; align-items: center; padding: 24px 0px; }
#asideLAYOUT ul li { display: flex; gap: 24px; flex-direction: row; padding: 0px; text-orientation: mixed; flex-wrap: nowrap; text-align: center; align-items: center; writing-mode: vertical-rl; }
#asideLAYOUT ul li span.material-symbols-outlined { font-weight: 300; height: 24px; width: 22px; line-height: 24px; writing-mode: horizontal-tb; margin-left: -8px; }
#asideLAYOUT ul li a,
#asideLAYOUT ul li button { color: var(--white); text-transform: uppercase; font-weight: 300; position: relative; }
#asideLAYOUT ul li a .badge,
#asideLAYOUT ul li button .badge { left: inherit; top: inherit; right: -4px; bottom: -4px; writing-mode: horizontal-tb; background: var(--white); color: var(--dark); }
#asideLAYOUT ul li a:hover,
#asideLAYOUT ul li button:hover { text-decoration: none; color: #FFFFFF; }
#asideLAYOUT ul li hr { background-color: var(--white); height: 1px; width: 32px; }






/* FOOTER *****************/
#footerLAYOUT { display: none; }
#footerLAYOUT > .wrap {  }






/* MENU *******************/
#menuLAYOUT { position: absolute; top:0px; left: 0px; margin: 40px 0 0 40px !important; overflow-y: auto; display: none; z-index: 9; width: -webkit-fill-available; width: calc(100% - 40px); }
#menuLAYOUT > .wrap { padding: 40px 0;  background: var(--dark); color: var(--white); }
#menuLAYOUT .row { margin-bottom: 40px; display: flex; gap: 39px; flex-wrap: wrap; justify-content: flex-start; }
#menuLAYOUT .row [class*='col-'] { align-self: auto; flex: 0 0 auto; }



#menuLAYOUT .section-list .subtitle { padding: 0 8px; }
#menuLAYOUT .section-list .content { margin-top: 8px; }

#menuLAYOUT .section-list .content ul li { padding: 4px 8px; border-bottom: 1px dashed var(--white); }
#menuLAYOUT .section-list .content ul li .actions a { line-height: 16px; display: inline-block; border: 1px solid var(--white); border-radius: 20px; padding: 4px 8px; text-align: center; color: var(--dark); background: var(--white); font-size: 12px; font-weight: 300; vertical-align: middle; }
#menuLAYOUT .section-list .content ul li .actions a:hover { background: var(--yellow) !important; border: 1px solid var(--yellow) !important; color: var(--dark) !important; }
#menuLAYOUT .section-list .content ul li .actions a:first-child { margin-left: 0; }


































#tooltip { position: fixed; pointer-events: none; background: var(--beige); color: var(--dark); padding: 6px 10px; border-radius: 4px; font-size: 14px; white-space: nowrap; opacity: 0; transition: opacity 0.15s ease; z-index: 9999; }

.pulsate { animation: pulse 0.5s infinite; }
@keyframes pulse { 0% { opacity: 1; } 50% { opacity: 0.8; } 100% { opacity: 1; } }

.vibrate { animation: vibrateX 0.3s linear infinite; }
@keyframes vibrateX { 0% { transform: translateX(0) rotate(0deg) scale(1); } 10% { transform: translateX(-2px) rotate(-2deg) scale(1.2); } 20% { transform: translateX(2px) rotate(2deg) scale(1.2); } 30% { transform: translateX(-2px) rotate(-2deg) scale(1.2); } 40% { transform: translateX(2px) rotate(2deg) scale(1.2); } 50% { transform: translateX(-2px) rotate(-2deg) scale(1.2); } 60% { transform: translateX(2px) rotate(2deg) scale(1.2); } 70% { transform: translateX(-2px) rotate(-2deg) scale(1.2); } 80% { transform: translateX(2px) rotate(2deg) scale(1.2); } 90% { transform: translateX(-2px) rotate(-2deg) scale(1.2); } 100% { transform: translateX(0) rotate(0deg) scale(1); } }

.tox-tinymce { border-radius: 0 !important; }
.tox:not(.tox-tinymce-inline).tox-tinymce--toolbar-bottom .tox-editor-header { border-top: 1px solid var(--dark) !important; }
.tox:not(.tox-tinymce-inline) .tox-editor-header { padding: 0 !important; }
.tox .tox-toolbar__group { padding: 0 11px 0 0 !important; }
.tox.tox-edit-focus .tox-edit-area::before { border: 0 !important; }
















@media screen and (max-width: 1023px) { /* 768 */

    #contentLAYOUT .main-footer .footer-row .column { flex: 1 0 calc((100% - 80px) / 3); }

}

@media screen and (max-width: 767px) { /* 414 */

    section .row { gap: 24px; padding: 0 24px; }

    section .row.half { width: 100%; }
    section .row.half:nth-child(even) { padding: 0 24px; float: inherit; }
    section .row.half:nth-child(odd) { padding: 0 24px; float: inherit; }

    .form-row .form-group[class*="width-"] { width: 100%; }

    section .row [class*="section-"] .content table { font-size: 12px; }

    #contentLAYOUT .main-footer .footer-row .column { flex: 1 0 calc((100% - 80px) / 2); }

}











@media screen and (max-width: 1794px) { /* 1366 */


}
@media screen and (max-width: 1454px) { /* 1455 */

    .col-4 { width: 100%; }

}
@media screen and (max-width: 1114px) { /* 1115 */

    .col-3 { width: 100%; }

}
@media screen and (max-width: 774px) { /* 775 */

    section .row { gap: 24px; padding: 0 24px; }
    .col-1 { width: 281px; }
    .col-2 { width: 100%; }


    .padding-top-1 { padding-top: 24px !important; }
    .padding-top-2 { padding-top: 48px; }
    .padding-top-3 { padding-top: 72px; }
    .padding-top-4 { padding-top: 96px; }
    .padding-top-5 { padding-top: 120px; }
    .padding-top-6 { padding-top: 144px; }
    .padding-top-7 { padding-top: 168px; }
    .padding-top-8 { padding-top: 192px; }

    .padding-bottom-1 { padding-bottom: 24px !important; }
    .padding-bottom-2 { padding-bottom: 48px; }

    .margin-top-1 { margin-top: 24px; }
    .margin-top-2 { margin-top: 48px; }
    .margin-top-3 { margin-top: 72px; }
    .margin-top-4 { margin-top: 96px; }
    .margin-top-5 { margin-top: 120px; }
    .margin-top-6 { margin-top: 144px; }
    .margin-top-7 { margin-top: 168px; }
    .margin-top-8 { margin-top: 192px; }

    .margin-right-1 { margin-right: 24px; }
    .margin-right-2 { margin-right: 48px; }

    .margin-bottom-1 { margin-bottom: 24px !important; }
    .margin-bottom-2 { margin-bottom: 48px; }
    .margin-bottom-3 { margin-bottom: 72px; }
    .margin-bottom-4 { margin-bottom: 96px; }
    .margin-bottom-5 { margin-bottom: 120px; }
    .margin-bottom-6 { margin-bottom: 144px; }
    .margin-bottom-7 { margin-bottom: 168px; }
    .margin-bottom-8 { margin-bottom: 192px; }




}
@media screen and (max-width: 688px) { /* 689 */

    .col-1 { width: 100%; }

}




@media print {

    .no-print { display: none !important; }
    .no-break { /*display: block !important;*/ page-break-inside: avoid !important; break-inside: avoid !important; }
    .page-break {
        page-break-before: always; /* vecchio ma molto compatibile */
        break-before: page;        /* standard moderno */
    }

}