html {
  box-sizing: border-box;
}


body {
    margin: 0;
    padding: 0;
    background: #fefefe;
    font-weight: 400;
    line-height: 1.5;
    /*color: #173B6E;*/
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

*, *:before, *:after {
  box-sizing: inherit;
}

.w33 {width: 33.333%;float:left}
.w25 {width: 25%;float:left}
.w50 {width: 50%;float:left}
.bold {font-weight:bold}
.invalid {border-color: #F00}

.app_message {margin:1em 5em;padding:1em;background:#FDD;color:#F00;border:1px solid #F00;font-weight:bold}

@media print{  /*Regola dedicata alla visualizzazione su carta*/
  .container{
      margin:10px;
      padding:10px;
  }
  .noprint {display:none;}
  body {font-size: 9pt;}
  td {padding-top:0; padding-bottom:0;}
  table tbody td {padding-top:0; padding-bottom:0;}
  .top-bar {display:none;}
}

/*label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}*/



.only_print {display:none;}
.row {background-color: #FAFAFA;border-right:1px solid #DDD;border-left:1px solid #DDD;max-width: 100rem}
/*a[href]:after {content: none;}*/
div#app {height: 95vh;position: relative}
div[role=main] {min-height: calc(100% - 75px - 3rem - 2px);}
div#menubar {height: calc(100% - 75px - 3rem - 2px);position: relative;width:25rem;border-right:1px solid #DDD;background-color: #FAFAFA;}

.top-bar {padding:0;border-bottom:1px solid #F00;background-color:#FFF;}
.top-bar-title {margin: 0;padding: 0;min-height:70px;float: left}
.top-bar-logo {padding-left: 0;background-color:#FFF;width: 25rem;max-width: 100%; border-right: 1px solid #DDD}
.top-bar-title h1 {padding-left: 1rem; font-family: Verdana, Arial, Helvetica, sans-serif;font-size:1.2em;font-weight:bold;margin-top:1rem;color:#666;}

.top-bar ul {
    background-color: #FFF;
}

.conpds-pin {font-size: 1.5rem; text-align: center;font-weight: bold; margin: 3rem auto;width: 32rem;line-height: 1; }
.conpds-pin span {font-size: 4rem; font-family: monospace; font-weight: bold; display: inline-block; margin: 0.2rem; border: 2px solid #CCC; padding: 1rem;box-shadow: 5px 10px 8px #888}

footer {margin:1rem 0 0 0;border-top:1px solid #aabcfe;font-size: 0.8rem; font-weight: bold;text-align: right;clear:both;background-color:#41525E;color:#FAFAFA; padding-right:1rem}
footer a {color:#FAFAFA;font-size: 1rem;}
footer a:hover {color:#f60}

.multilevel-accordion-menu .is-accordion-submenu-parent a {
  background: #F3F3F3;
  color:#41525E;
}

.multilevel-accordion-menu .is-accordion-submenu a {
  background: #FAFAFA;
  box-shadow: none;
}

.multilevel-accordion-menu .sublevel li {
  margin-left: 2rem;
}

.multilevel-accordion-menu a {
  color: #fefefe;
  box-shadow: inset 0 -1px #DDD;
}

.multilevel-accordion-menu a::after {
  border-color: #fefefe transparent transparent;
}

.multilevel-accordion-menu .menu > li:not(.menu-text) > a {
  padding: 1.2rem 1rem;
}

.multilevel-accordion-menu .is-accordion-submenu-parent[aria-expanded="true"] a.subitem::before {
  content: "\e1cf";
  font-family: "Font Awesome 6 Pro";
  margin-right: 1rem;
}

.multilevel-accordion-menu .is-accordion-submenu-parent[aria-expanded="true"] a::before {
  content: "\f105";
  font-family: "Font Awesome 6 Pro";
  margin-right: 1rem;
}

.multilevel-accordion-menu .is-accordion-submenu-parent[aria-expanded="false"] a::before {
  content: "\f107";
  font-family: "Font Awesome 6 Pro";
  margin-right: 1rem;
}

.tag,.notes,.actions {font-size: 0.9rem;padding: 1.25rem 1.5rem;font-weight: bold;background-color: #FFF;color: #173B6E;display: inline-block;padding: 5px 9px;border-radius: 0px;border: 1px solid #96C4D5;margin: 0 2px 2px 0;text-decoration: none;}
.tag:before,.notes:before,.actions:before {width: 9px;height: 9px;content: "";display: inline-block;border-radius: 10px;margin: 0 5px 0 0;}

.tag:before {background: #59879F};
.notes:before {background: #FF879F}
.actions:before {background: #CC0C32}


/*td {border: 1px solid #CCC;}*/
tr.error td{ color: #FFF;background-color: #A00;}
tr.nodate td { color: #FFF;background-color: #880;}

table.estimate_list td button {display:block;width:100%;}

table.stats {margin-left:10%; margin-right:10%;width:80%}
table.stats td, table.stats th {font-size:0.9rem;}
table.stats th {border: 1px solid #CCC}
table.stats td {border-right: 1px solid #CCC}
table.stats td:first-of-type {border-left: 1px solid #CCC}

.stats-list-caption {margin: 0 auto 10px auto;  padding: 0;  text-align: center;  width: 25rem;border-bottom:1px solid #cacaca;}
.stats-list {list-style-type: none;  clear: left;  margin: 0;  padding: 0;  text-align: center;  margin-bottom: 30px;}
.stats-list .total {color: #01618C;}
.stats-list .positive {color: #228948;}
.stats-list .negative {color: #aa3e2e;}
.stats-list .positive50 {color: #228948; opacity:0.5;}
.stats-list .negative50 {color: #aa3e2e; opacity:0.5;}
.stats-list .total50 {color: #01618C; opacity:0.5;}
.stats-list > li {display: inline-block;  padding-top: 1.2rem; margin-right: 10px;  padding-right: 10px;  border-right: 1px solid #cacaca;  text-align: center;  font-size: 1.1em;  font-weight: bold;font-size: 1.5rem}
.stats-list > li:last-child {border: none;  margin: 0;  padding: 0;}
.stats-list > li .stats-list-label {display: block;  margin-top: 2px;  font-size: 0.9rem;  font-weight: normal;}


.number {text-align: right;}

.menu {
  text-align: left;
}


.dropdown.menu > li.is-dropdown-submenu-parent > a {
  color: #41525E;
  background-color:  #FFF;
  position: relative;
  margin-left: 0;
}

li.is-dropdown-submenu-item > a {
  color: #41525E;
  background-color:  #FFF;
  position: relative;
  margin-left: 0;
}

.dropdown.menu > li.is-dropdown-submenu-parent > a::after {
   color: #41525E;
   border-color: #41525E transparent transparent
}
.dropdown.menu > li.is-active > a,
.is-dropdown-submenu-parent li a:hover,
.menu li a:hover {
  background-color:  #41525E;
  color: #FFF;
}

.selector-container, .selector-container input {
    margin-bottom: 1rem;
}

form.login {margin:5rem auto; width:20rem; padding: 1rem;background-color:#EEE;border:1px solid #CCC;}

form.params {margin:1rem auto; width:35rem; padding: 1rem;background-color:#EEE;border:1px solid #CCC;}

.smallmenu {font-size:0.8rem;}

.no-margin {margin:0;}
button.no-margin {padding:0.5rem;}
.button-group .button:not(.alert):not(.secondary), .button {
  background-color: #657f91;
}
.button.empty-minheight { min-height: 41px; line-height: 1.25; }

table.report {font-family:"Lucida Sans Unicode", "Lucida Grande", Sans-Serif;font-size:12px;text-align:center;border-collapse:collapse;border-top:7px solid #9baff1;border-bottom:7px solid #9baff1;margin:20px;width: 1000px}
table.report th { font-size:13px; font-weight:bold; background:#e8edff; border-right:1px solid #9baff1; border-left:1px solid #9baff1;  color:#039; padding:8px;}
table.report td { background:#e8edff; border-right:1px solid #aabcfe; border-left:1px solid #aabcfe;  color:#669; padding:8px;}
.card {background-color:#222;box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);position: relative}
.card-section {background-color:#FFF;}

.hiddenpic:before{
    content: 'hidden';
    color: #FFF;
    position: absolute;
    opacity: 0.50;
    font-size: 2em;
    font-weight: bold;
    width: 100%;
    top: 1em;
    text-align: center;
    transform: rotate(-45deg);
    z-index: 1000;
    pointer-events: none;
}

.hiddenpic {
  opacity: 70%;
}

.postrepair:before{
    content: 'post';
    color: #000;
    text-shadow: 0 0 6px #fff;
    position: absolute;
    opacity: 0.50;
    font-size: 2em;
    font-weight: bold;
    width: 100%;
    top: 1em;
    text-align: center;
    transform: rotate(-45deg);
    z-index: 1000;
}


.imgbutton{
  border-style: none;
  color: #1779ba;
  background-color: transparent;
  display: inline-block;
  vertical-align: middle;
  margin: 0;
  padding: .85em .5em;
  -webkit-transition: background-color .25s ease-out,color .25s ease-out;
  transition: background-color .25s ease-out,color .25s ease-out;
  font-size: .9rem;
  -webkit-appearance: none;
  line-height: 1;
  text-align: center;
  cursor: pointer;
}

.imgbutton:hover, .imgbutton:focus {
    color: #0c3d5d;
    text-decoration: none;
}

.hiddenpic .card-section{
  background-color:#EEE;
}


#coparn_form {width:20%; min-width:10em; height: 26rem; padding:1rem; overflow-y:scroll;float:left;}
#coparn_list {width:auto; height: 26rem; padding:1rem; overflow-y:scroll;}
#coparn_details {clear:both;}

.isEmpty {background-color: #FCC;}

/* Gate */
.gate {
  background-color: #FAFAFA;
  border-right: 1px solid #DDD;
  border-left: 1px solid #DDD;
  max-width: 100rem;
  margin-right: auto;
  margin-left: auto;
  padding:  1rem;
}

.gate .text-center {justify-content: center}
:required,
[data-xchoices-validation="required"] .choices__inner {border: 1px solid #FF305D}
.choices__item {white-space: nowrap; overflow:clip}


/*.gate [type=date], .gate [type=datetime], .gate [type=email],  .gate [type=number],  .gate [type=text], .gate textarea {margin-bottom: 0.5rem}*/


/* Query */
.tabs-title > a {padding: 0.8rem;}
.tabs-panel {padding: 0}
div#sql {display:none; margin: 1em; padding:1em; border: 1px solid #ccc;background-color:#EFEFEF}
table.query td div.input-group {margin:0;padding:0}
table.query td div.column {margin:0;padding:0}
table.query td div.input-group-button .fas{width:1rem}
table.query {width:100%; border:1px solid #ccc; margin-top:0;margin-left:0; border-collapse: collapse;}
table.query th {font-size:0.7em}
table.query tr:hover {background-color:#fff;}
table.query tr:hover {background-color:#eee;}
table.query td {padding:0;}
table.query td {background-color: transparent;font-size:0.8rem}
table.query td select {font-size:0.8rem; margin:0;height:1.8rem;padding: 0 1.5rem 0 0;}
table.query td label {font-size:0.8rem}
table.query td input[type=text],table.query td input[type=date],table.query td input[type=time],table.query td textarea {font-size:0.8rem; padding:0.1em;margin:0}
table.query td input[type=text],table.query td input[type=date],table.query td input[type=time]{height:1.8rem;}
table.query td input[type=date], table.query td input[type=time]  {font-size:0.8rem;width:8rem;display:inline;}
table.query td * {vertical-align:top}
table.query td.number {text-align: right}
table.query td a.button {vertical-align:middle;height:1.8rem;}
table.query td.checkbox {vertical-align:middle;text-align:center;}
table.query td input[type=checkbox] {vertical-align:middle;margin:0;}

table.query td input.order {width:2em}
table.query td input.date {width:8em}
.tabs-panel {padding:0}
/*****/

@media only screen {
  div#workshop_print {border-top:2px solid #9baff1;border-bottom:7px solid #9baff1;margin:auto;max-width: 100rem;; background:#e8edff;}
  div#workshop_print table {font-family:"Verdana", "Arial", Sans-Serif;font-size:0.8rem;border-collapse:collapse;border:0;}
  div#workshop_print caption {text-align:center; font-size:0.8rem;  padding:2px; color:#039;  border:0; border-top:1px solid #aabcfe; border-bottom:1px solid #aabcfe; }
  div#workshop_print table th,
  div#workshop_print table td {text-align:left; font-size:0.8rem;  padding:2px; background:#e8edff; border-right:1px solid #aabcfe; }
  div#workshop_print table th {color:#039}
  div#workshop_print table td {color:#669;}
  div#workshop_print table tr.h th {border:0; border-top:1px solid #aabcfe; border-bottom:1px solid #aabcfe;text-align: center}
  div#workshop_print table th:last-child,
  div#workshop_print table td:last-child {border-right:0;}
  div#workshop_print table td.largetext {font-size: 1.2rem;font-weight: bold}
}

.waiting-box, .dialog-box  {
    display: block;
    text-align: center;
    position: fixed; /* fixed position so it doesn't scroll */
    z-index: 9999; /* on top of everything else */
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.dialog-box {
    border: 1px solid #000;
    background-color:rgba(13, 13, 13, 0.5);
}

.waiting-box div {position: fixed;top: 50%;left:50%;margin-top:-1rem;margin-left:-10rem;height:2rem; width:20rem; background-color:#FFF;}
.dialog-box div.dialog_content {position: fixed;top: 50%;left:50%;margin-top:-25rem;margin-left:-50rem;height:50rem; width:100rem; padding: 1rem;background-color:#FFF;overflow: scroll}

.list_dialog-content {position: fixed;top: 10%;left:10%;margin-top:0;margin-left:0;height:80%; width:80%; padding: 1rem;background-color:#FFF;}
.listgrid {height:75%;overflow-y:scroll;}
.listgrid_header {margin-bottom: 0;}
.listgrid_header th {text-align:left;background-color:#EEE;}

.appform {background-color:#F5F5F5}
.appform td {background-color:#F5F5F5}
.appform tr {border:1px solid #EFEFEF}



.button-group input["checkbox"], .button-group input["radio"]{
  display: none;
}

.button-group input:checked + label,
.button-group input:checked + label:active {
  background-color: #FA8072;
}

.button.blue {
 background-color:#2ba6cb;
 color:#0a0a0a
}
.button.blue:focus,.button.blue:hover {
 background-color:#2285a2;
 color:#0a0a0a
}
.button.gray {
 background-color:#e9e9e9;
 color:#0a0a0a
}
.button.gray:focus,.button.gray:hover {
 background-color:#bababa;
 color:#0a0a0a
}
.button.red {
 background-color:#c60f13;
 color:#fefefe
}
.button.red:focus,.button.red:hover {
 background-color:#9e0c0f;
 color:#fefefe
}
.button.green {
 background-color:#5da423;
 color:#0a0a0a
}
.button.green:focus,.button.green:hover {
 background-color:#4a831c;
 color:#0a0a0a
}
.button.yellow {
 background-color:#ffae00;
 color:#0a0a0a
}
.button.yellow:focus,.button.yellow:hover {
 background-color:#cc8b00;
 color:#0a0a0a
}


.label.blue {
 background-color:#2ba6cb;
 color:#0a0a0a
}

.label.gray {
 background-color:#e9e9e9;
 color:#0a0a0a
}

.label.red {
 background-color:#c60f13;
 color:#fefefe
}

.label.green {
 background-color:#5da423;
 color:#0a0a0a
}

.label.yellow {
 background-color:#ffae00;
 color:#0a0a0a
}

.blue {
 color:#16277c;
}

.gray {
 color:#e9e9e9;
}

.red {
 color:#872c3a;
}

.green {
 color:#2b4f1d;
}

.yellow {
 color:#b;
}

p.warning, td.warning{
 background-color:#c60f13;
 color:#fefefe;
 font-weight:bold;
 text-align:center;
}

button.showkey:hover::after,
button.showkey:focus::after {
    content: " [" attr(accesskey) "] ";
}

/* Damage report */
.both::after {
   content: '?!';
   display: block;
   width: 1rem;
   height: inherit;
}

.download::after {
   content: '!';
   display: block;
   width: 1rem;
   height: inherit;
}

/* Pickup sheet */
.bignum {min-height:138mm;}
.bignum table {width:100%; font-size:14pt;border:0;border-spacing:0.5em; border-collapse: separate;}
.bignum th {text-align:left; border:0;}
.bignum td {padding:0.5em; border:1px solid #CCC;}
.bignum h1 {font-weight:400; font-size:200pt;text-align:center;margin:0;padding:0;line-height:1;}
.bignum h2 {font-weight:400; font-size:150pt;text-align:center;margin:0;padding:0;line-height:1;}
.smallnum h2 {font-weight:bold; font-size:50pt;text-align:left;margin:0;padding:0;line-height:1;}

.picture_list_header {font-size: 1.2rem;font-weight: bold;border-bottom:1px solid #CCC;}


/* Show container */
/*.view_cnt table {border: 1px solid #EEE}
.view_cnt table td {font-size:0.9rem; border: 1px solid #EEE}
.view_cnt table th {font-size:0.8rem; border: 1px solid #EEE}*/


.view_cnt table {
    color: #333;
    font-family: Helvetica, Arial, sans-serif;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #000;
}

.view_cnt table td, t.view_cnt table th {
    border: 1px solid transparent;
    transition: all 0.3s;
}


.view_cnt table th {
    background: #6b6b9b;
    font-weight: bold;
    font-size:0.8rem;
    height: 0.9rem;
    padding:0.2rem;
    color:white;
}

.view_cnt table td {
    font-size: 0.9rem;
    padding: 0.2rem;
}

.view_cnt table.unstriped td {
    text-align: center;
}



.view_cnt table tr:hover { background: #ddddff; }
.view_cnt table.estimate td {font-size:0.8rem;}
.view_cnt table.estimate th {font-size:0.7rem;}
.view_cnt table.estimate tr:nth-child(even) td { background: #EFEFEF; }
.view_cnt table.estimate tr:nth-child(odd) td { background: #FEFEFE; }



.today {font-weight: bold}

.ie {font-family: Georgia, Times, serif; font-size: 1.5em; width:80%;margin:2em auto; padding-top:120px; text-align: center; background-image:url("/images/sorry.gif");background-repeat: no-repeat; background-position:top center; }

table.dm_item_list {border-collapse: separate; font-size: 0.9rem}


table.result td, table.result th {
     line-height:1;
     font-size: 0.9rem;
}


/* Generate invoice */
table.inv_recap {
    font-size: 0.9rem;
    line-height:1;
}

table.inv_recap caption {
     border: 1px solid #f1f1f1;
}

.inv_waiting-box, .inv_dialog-box {
    display: block;
    text-align: center;
    position: fixed; /* fixed position so it doesn't scroll */
    z-index: 9999; /* on top of everything else */
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.inv_dialog-box {
    border: 1px solid #000;
    background-color:rgba(13, 13, 13, 0.5);
}

.inv_waiting-box div {position: fixed;top: 50%;left:50%;margin-top:-1rem;margin-left:-10rem;height:2rem; width:20rem; background-color:#FFF;}

.inv_dialog-box div {position: fixed;top: 50%;left:50%;margin-top:-21rem;margin-left:-10rem;height:36rem; width:26rem; padding: 1rem;background-color:#FFF;}

.inv_dialog-box  table.list{
   width: 90%;
   padding:0;
   margin: 5px auto;
   border: 1px solid #039;
   overflow-y: scroll;
   height: 24rem;
   display: block;
}


.invoicing h3 {
    font-size: 1.3rem;
}

table.inv_result td, table.inv_result th {
     padding:0;
}

form.inv_params input[type="checkbox"] {margin-right: 0;}

form.inv_params fieldset legend {font-size: .875rem}

form.inv_params [type="checkbox"] + label, form.inv_params [type="radio"] + label {
    margin-left: .2rem;
    margin-right: .5rem;
}

.two_l {width:50%;float:left;padding-right:0.5rem;}
.two_r {width:50%;float:left;padding-left:0.5rem;}


.callout {
  width: 100%;
  background: #f8f8f8;
  color: #333;
  border: 0;
  border-left: 0.3125rem solid #8a8a8a;
  box-shadow: 0 5px 8px -6px rgba(0, 0, 0, 0.2);
}

.callout.success {
  color: #333;
  border-left: 0.3125rem solid #3adb76;
}

.callout.alert {
  color: #333;
  border-left: 0.3125rem solid #cc4b37;
}

.callout.warning {
  color: #333;
  border-left: 0.3125rem solid #ffae00;
}

.callout.primary {
  color: #333;
  border-left: 0.3125rem solid #1779ba;
}


.tabs-title > a {
  padding: .25rem .5rem;
}

#popupdiv
{
    margin: 0 10px;
    padding: 0;
    background-color: #FFF;
    height: 100%;
}
#popupdiv #searchform {height: 2rem;}

#popupdiv #listform {
  height: calc(100% - 6rem);
}

#popupdiv table#list{
   width: 90%;
   padding:0;
   margin: 5px auto;
   border: 1px solid #039;
   overflow-y: scroll;
   height: 100%;
   display: block;
}



#popupdiv ul.buttonlist {height: 2rem;margin:5px auto 0 auto;padding:10px 0 0 0;text-align:center;}
#popupdiv ul.buttonlist li {list-style: none; display: inline;}
#popupdiv ul.buttonlist li input{width:100px;}
#popupdiv #listcontainer {
  height: calc(100% - 3em);
}

/**
 * Custom styling for AlpineJS listing
 */

    /* Sorting tables */
    table th.sorting-enabled { cursor: pointer; }
    table th.sorting-enabled.sorting-active { color: #00618d; }
    table th.sorting-enabled.sorting-active:not(.desc)::after { content: ' \2191'; }
    table th.sorting-enabled.sorting-active.desc::after { content: ' \2193'; }

    table.grouped-results {width:100%}
    table.grouped-results table {width:100%}
    /* Tables with multiple <tbody> elements grouping rows */
    /*
    table.grouped-results.hover:not(.unstriped) tbody tr:nth-child(odd):hover { background-color: #f9f9f9; }
    table.grouped-results.hover:not(.unstriped) tbody tr:nth-child(even):hover { background-color: #ececec; }
    table.grouped-results tbody > tr:first-child { background-color: #d7dde6; }
    table.grouped-results.hover:not(.unstriped) tbody > tr:first-child:hover { background-color: #cad9ef; }
*/

    /*
    table.grouped-results tbody:nth-child(even) { background-color: #f1f1f1; }
    table.grouped-results tbody tr:nth-child(even) { background-color: transparent; }


     */

/* SearchTable */
tr.notvalidated td {color: #F00}

/**
 * Custom styling for AlpineJS forms
 */
    /* x-cloak directive */
    [x-cloak] { display: none !important; }

    /* Hidden input for required xchoices element */
    input.xchoices-hidden-required { display: block; opacity: 0; width: 0; height: 0 !important; padding: 0 !important; margin: 0 !important; position: relative; top: -20px; border: 0; z-index: -1; }

    /* Uppercase inputs */
    input.ttu { text-transform: uppercase; }

    /* Make x-choices fields same height as other inputs */
    div.choices div.choices__inner { min-height: 39px; padding-bottom: 0; }
    div.choices div.choices__inner .choices__list--single { padding-top: 0; padding-bottom: 0; }
    div.choices[data-type*=select-one] div.choices__inner { padding-bottom: 4.5px; }
    div.choices[data-type*=select-one] > .choices__list > .choices__list > .choices__item--selectable {padding-right: 0px;}
    div.choices[data-type*=select-one] > .choices__list > .choices__list > .choices__item--selectable::after{display: none;}

    div.choices[data-type*=select-multiple] div.choices__inner { padding-top: 2px; padding-bottom: 2px; }
    div.choices[data-type*=select-multiple] div.choices__inner input.choices__input { margin-top: 2px; height: 29px; margin-bottom: 2px; width: 1ch; }
    div.choices[data-type*=select-multiple] div.choices__inner .choices__list--multiple .choices__item { margin-top: 1px; margin-bottom: 2px; height: 29px; }

    /* Give x-choices extra border and shadow same as other fields when active */
    div.choices, div.choices:last-child { transition: box-shadow .5s; margin-bottom: 1rem; }
    div.choices > .choices__inner { transition: border-color .25s ease-in-out; }
    div.choices.is-focused { box-shadow: 0 0 5px #cacaca; }
    div.choices.is-focused > .choices__inner { outline: 0; border-color: #8a8a8a !important; }

    /* xchoices multiselect more contrast */
    div.choices__list--multiple div.choices__item { background-color: #14679E; border-color: #14679E; }
    div.choices__list--multiple div.choices__item.is-highlighted { background-color: #143f51; border-color: #222; }

    /* checkbox with description wrapped in label */
    label.builder-checkbox { line-height: 1.2; }
    label.builder-checkbox > input[type="checkbox"] { margin-bottom: 0; }

    /* fieldset wrapping checkboxes */
    fieldset.checkboxes-fieldset > legend { font-size: .875rem; color: #0a0a0a; }
    fieldset.checkboxes-fieldset > label { display: inline-block; }
    fieldset.checkboxes-fieldset > label:not(:last-child) { margin-right: 1em; }
    fieldset.checkboxes-fieldset > label > input { margin-right: .3em; }

    /* invisible checkbox to be used with labels and custom icons */
    input[type="checkbox"].invisible-checkbox { position: absolute; z-index: -1; opacity: 0; visibility: hidden; }

    /* non-native modal dialogs */
    div[x-data].non-native-dialog-open::before { content: ''; display: block; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.3); z-index: 1000; }
    div[x-data].non-native-dialog-open dialog { position: fixed; inset-block-start: 0; inset-block-end: 0; max-width: calc((100% - 6px) - 2em); max-height: calc((100% - 6px) - 2em); user-select: text; visibility: visible; overflow: auto; z-index: 2000; }

    /* single file upload showing items inline besides button and fitting into grid */
    div[x-data^="fileUploadComponent("] { display: flex; align-items: flex-end; padding-bottom: 1rem;
        & > .button { margin-right: .2rem; margin-bottom: 0; }
        .inner { overflow: hidden;
            .preview { overflow: hidden;
                .image-preview { max-width: 150px; }
                .callout { display: flex; padding-top: .25rem; padding-bottom: .25rem;  padding-right: 0; min-height: 40px; margin-bottom: 0;
                    button.linklike { overflow: hidden; text-overflow: ellipsis; }
                    .text-file-name { overflow: hidden; text-overflow: ellipsis; display: block; align-self: center; }
                }
            }
            .text-alert { line-height: 1.25rem; margin-bottom: 0; min-height: 40px; display: flex; align-items: center; }
            .preview + .text-alert { min-height: 0; margin-top: .5rem; }
        }
    }

    /* multi file upload components not stretch file input field */
    div[x-data^="fileUploadComponentMultiple("] > input[type="file"] { overflow: hidden; text-overflow: ellipsis; max-width: 230px; }

    /* very invalid red field */
    input.strong-red-warning { background: red; }

    /* prepared spinner icon on buttons */
    .button-spinner-hidden { position: absolute; opacity: 0; z-index: -1; }

/**
* Utility classes
*/
    .cursor-pointer { cursor: pointer; }
    .\!cursor-pointer { cursor: pointer !important; }
    .relative { position: relative; }
    .inline-block { display: inline-block; }
    .inline-flex { display: inline-flex; }

    .text-alert { color: #c60f13; }
    .mx-4 { margin-left: 1rem; margin-right: 1rem;}
    .\!my-0 { margin-top: 0 !important; margin-bottom: 0 !important;}
    .my-1 { margin-top: .25rem; margin-bottom: .25rem;}
    .mb-0 { margin-bottom: 0; }
    .\!mb-0 { margin-bottom: 0 !important; }
    .mb-1 { margin-bottom: .25rem; }
    .mb-2 { margin-bottom: .5rem; }
    .mb-4 { margin-bottom: 1rem; }
    .mb-6 { margin-bottom: 1.5rem; }
    .ml-1 { margin-left: .25rem; }
    .ml-2 { margin-left: .5rem; }
    .mr-\.5 { margin-right: .125rem }
    .mr-1 { margin-right: .25rem; }
    .mr-2 { margin-right: .5rem; }
    .mr-3 { margin-right: .75rem; }
    .mr-4 { margin-right: 1rem; }
    .mr-8 { margin-right: 2rem; }
    .mt-0 { margin-top: 0; }
    .mt-1 { margin-top: .25rem; }
    .mt-2 { margin-top: .5rem; }

    .p-1 { padding: .25rem; }
    .p-2 { padding: .5rem; }
    .px-0 { padding-left: 0; padding-right: 0; }
    .px-1 { padding-left: .25rem; padding-right: .25rem; }
    .px-2 { padding-left: .5rem; padding-right: .5rem; }
    .px-4 { padding-left: 1rem; padding-right: 1rem; }
    .pt-label-height { padding-top: 25px; }
    .pt-2 { padding-top: .5rem; }
    .pt-3 { padding-top: .75rem; }
    .pt-4 { padding-top: 1rem; }
    .pt-7 { padding-top: 1.75rem; }
    .pr-0 { padding-right: 0;}
    .pr-1 { padding-right: .25rem;}
    .pr-8 { padding-right: 2rem; }
    .pl-0 { padding-left: 0; }
    .pl-1 { padding-left: .25rem; }
    .pl-2 { padding-left: .5rem; }
    .\!pb-2 { padding-bottom: .5rem !important; }

    .w-fit { width: fit-content; }
    .w-full { width: 100%; }
    .w-4 { width: 1rem; }
    .w-36 { width: 9rem; }
    .max-w-fit { max-width: fit-content; }

    .fz-0 { font-size: 0; }
    .text-sm { font-size: 0.875rem; line-height: 1.25rem; }
    .text-base { font-size: 1rem; line-height: 1.5rem; }
    .font-bold { font-weight: 700; }

    .leading-none { line-height: 1; }

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

    .whitespace-nowrap { white-space: nowrap; }
    .pointer-events-none { pointer-events: none; }

    /* responsive variants */
    @media(min-width: 40em) {
        .md\:mt-8 { margin-top: 2rem; }
    }
    @media(max-width: 39.9em) {
        .sm-only\:mb-0 { margin-bottom: 0; }
    }

/**
* Edit box
*/
    #edit-box {display: none;position: fixed;width: 100%;height: 100%;left: 0;top: 0;z-index: 1001}
    #edit-box  {border: 1px solid #000;background-color: rgba(13, 13, 13, 0.5);}
    #edit-box div#edit-frame {display: flex;  height: 98vh; flex-direction: column;}
    #edit-box div#edit-frame {position: fixed;top: 5%;left: 5%;margin:0;padding:0;height: 90%;width: 90%;background-color: #FFF;border: 1px solid #000;box-shadow: 5px 5px 20px 0px rgba(0, 0, 0, 0.75);}

/**
* Wrapped switch element https://get.foundation/sites/docs/switch.html
*/
    .switch.wrapped .switch-paddle { height: 1.4rem; }
    .switch.wrapped .switch-paddle::after { height: .9rem; width: 1.4rem; }
    .switch.wrapped .switch-paddle .switch-active,
        .switch.wrapped .switch-paddle .switch-inactive { top: auto; bottom: 0; left: 0; right: 0; text-align: center; color: #0a0a0a; transform: translateY(100%); line-height: 1.2; }

[type="date"], [type="datetime-local"], [type="datetime"], [type="time"] {padding: 0.5rem .2rem;}

/* styles for iBi Revenues */
table result th {border: 1px #EEE}
table result td {border: 1px #EEE}

/**
* Animations
*/
    .animate.ping {
        animation: ping 1s cubic-bezier(0, 0, 0.2, 1);
    }
    @keyframes ping {
        0% {
            outline: 1px solid rgba(102, 191, 217, .7);
        }
        100% {
            outline: 20px solid rgba(102, 191, 217, 0);
        }
    }

/**
 * Import modules
 */
.import-module {
    .row { max-width: none; }
    .step1 { border-bottom: 1px solid #ddd; }
    td {
        &.validation-warning { color: #b17900; border: 1px solid #fff; border-left: 4px solid #ffae00; background-color: #fff3d9; }
        &.validation-alert { color: #dd0000; border: 1px solid #fff; border-left: 4px solid #A00; background-color: #f7e4e1; }
        &.validation-warning, &.validation-alert {
            small { font-weight: bold; }
        }
    }
}