/* user css */

:root {
  
  --body-color-rgb: 34, 38, 42;
  --body-bg-rgb: 255, 255, 255;  
  --body-color: #02488f;
  --body-bg: #dbe0e3;
  
}

.site {background-color: #eef2f3;}

.navbar-toggler {    background-color: #f5af3a;}
.brand-logo img {width:50%}
.container-header {
    background-color: #78cef3;
    background-image: linear-gradient(135deg,#effaff 0,#0a8edf 100%);
    box-shadow: inset 0 5px 5px rgb(0 0 0 / 3%);
    position: relative;
    z-index: 10;}
.container-header nav {
    margin-top: 0.2em;
    padding: 0;
}

/* Top Menu definitions */
.metismenu.mod-menu .metismenu-item {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    font-size: 1.0rem;
    line-height: 1.2;
    padding: 0.5em 1em;
    text-decoration: none;   
}
ul .mm-collapse .mm-show {
    background-color:transparent;
}
.metismenu.mod-menu .mm-collapse {
    background-color:transparent;
}

li.metismenu-item > button {font-size:1.7rem} 

.metismenu.mod-menu .mm-collapse>li.parent>ul {
    position: absolute;
    left: 90%;
    top: 10px;
}
/* navbar --> Menu Link class */ 
.navbar {max-width:250px;}
.navbar .top-menu li {
    border: 1px solid #92bcf7f5;
    background-color: #c9dffff5;
    border-radius: 3px;
    color: #0b5d7c;
    cursor: pointer;
    font-weight: 500;
    box-shadow: 1px 1px #a0a4a9f5;
    margin-right: 3px;
}

.navbar .top-menu li.current {background-color: #9de0ff;}
.navbar .top-menu > li > ul > li.current {background-color: #9de0ff;}
.navbar .top-menu li:hover {background-color: #9de0ff;}
.navbar .top-menu li.active {background-color: #9de0ff;}

/*--   login button ---- */
li.metismenu-item:has(a.login)      {background-color: yellow;}
.metismenu-item.active:has(a.login) {background-color: yellow;}
li.metismenu-item:has(a.login):hover {background-color: #f3f300;}
li.current:has(a.login) {background-color: yellow;}

/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}
@media (max-width: 900px) {
    body {
        font-size: 0.8rem;}
    .sticky {
        position: relative;
        top: 0;
        width: 100%;
    }
}


.container-header .mod-menu {
    color: #266a8b;
}
.btn {    
    margin: 1px 1px;
    border-radius: 3.25pt;
    cursor: pointer;
    display: inline-block;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6rem;
    padding: 1px 8px;
    text-align: center;
}    

.btn-menu {
    background-color: #ffc107;
    border-color: #ffd63c;
    color: #fff;
}
/* button bar */
.js-stools-container-bar {
    padding: 0px 0px;
}
.login-button{
	margin-bottom:0px;
	border: 1px solid #92bcf7f5;
    background-color: #c9dffff5;
    border-radius: 3px;
    color: #0b5d7c;
    cursor: pointer;
    font-weight: 500;
    box-shadow: 1px 1px #a0a4a9f5;
    margin-right: 3px;
	font-size: 1.0rem;
    line-height: 1.2;
    padding: 0.5em 1em;
} 
/*---- login button ----*/
.login-button:hover {
	background-color: #9de0ff;
	border: 1px solid #92bcf7f5;
	color: #0b5d7c;
}


.filter-search-bar button {height:1.88rem; font-size:0.9rem; }
.filter-search-bar input  {height:1.88rem; font-size:0.9rem}
.filter-search-actions button {height:1.88rem; font-size:0.9rem; }
.field-calendar button {height:1.88rem; font-size:0.9rem; }

div.mod-languages ul li.lang-active {
    background-color: #28b2ff;
}

a:not([class]) {text-decoration: none;}
a {text-decoration: none;}



.container-header .grid-child {
        padding-top: 0.0em; 
    }
@media (min-width: 1200px) {  
    .container-component {
        margin-top:10px;
        background-color: #f1f1f1;
        padding: 10px;
        box-shadow: 2px 2px 8px 2px #a0a4a9f5;
    }
}    
.table>:not(caption)>*>* {
    padding: 3px;
}
.tbody-icon [class^=icon-] {
    border-radius: 50%;
    font-size: 0.8rem;
    height: 24px;
    line-height: 18px;
    width: 25px;
}
.tbody-icon .icon-unpublish  {
    border: 2px solid #adbac7;
    border-radius: 50%;
    color: #d37979;
}    

.col-form-label {
    line-height: 1.2em;
}
/* ----------- Modal  --------------- */ 
.modal-header {
  background-color: #d3dfe0;
}
/* registration form */
.modal-dialog.modal-registration{max-width: 40rem }
.com-users-registration * .control-label {width: 15rem}
.com-users-registration {        
    .form-control{margin: 2px};    
}
#password-0 {font-size: 0.8rem;
             width: 100%;
}
.modal-form { padding:1rem}

/* --------- form layout  -------------- */
.control-group {
    margin: 0px!important;
}
.form-control {
    padding: 4px 6px;
}

.kdnr_abfragen > .control-label {width: 15rem;}
.kdnr_abfragen > .controls {width: 25rem;}

/* kunden artikel layout */
.editKundenArtikel > .control-label {width: 10rem;}
.editKundenArtikel > .controls {width: 35rem;}

/* kunden  layout */
.editKunde > .control-label {width: 10rem;}
.editKunde > .controls {width: 35rem;}

/* cashregister */
.editCashregister > .control-label {width: 20rem;}
.editCashregister > .controls {width: 20rem;}

/* boerse */
.editBoerse > .control-label {width: 20rem;}
.editBoerse > .controls {width: 20rem;}

/* mailing */
.editMailing > .control-label {width: 12rem;}
.editMailing > .controls {width: 55rem; padding-bottom:5px}

/* helerinnen */
textarea.form-control.infoHelferinnen  {width: 100%; }

/* access right */
.editAccessRight > .control-label {width:0rem;}
.editAccessRight.checkBox-sm {max-width:5rem;}
.form-check  {margin-top:0.5rem;}
.editAccessRight1 > .controls .checkBox-sm {width: 2rem; padding-bottom:1px}
.editAccessRight1 > .controls {width: 20rem; padding-bottom:1px}

/* benutzer profil */
@media (min-width: 700px) {  
    dl {
      width: 100%;
      overflow: hidden;
      padding: 0;
      margin: 0
    }
    dt {
      float: left;
      width: 40%;
      padding: 0;
      margin: 0
    }
    dd {
      float: left;
      width: 60%;
      padding: 0;
      margin: 0
    }
}    

/* --------------  Action Buttons ------------------ */
.btn-primary {
    background-color: #0a8707;
    border-color: #0e730e;
}
.btn-primary:hover {
    background-color: #066703;
    border-color: #0e730e;
}
.btn-primary:disabled {
    background-color: #669b61;
 }        

.btn-info {
    background-color: #1d79c5;
    border-color: #30638d;
    color: #fff;
}
/* ----- form specific */
.artikel-verkauft {
  background-color: #f7e6e6;
}
/* Custom specific */
.artikel-verkauft {
  background-color: #f7e6e6;
}
#adminForm input[type="checkbox"] {
  margin: 0px;
}

/* -------- master detail ------------- */
.master_record {
  background-color: #c5d4c2;
}
.master_record > .arrow-button{    
    padding: 5px;
    box-shadow: 2px 2px 1px #788d79;
    box-sizing: content-box;
    background-color: #4ec961;
}
td.arrow-button{    
    padding: 5px;
    box-shadow: 2px 2px 1px #788d79;
    box-sizing: content-box;
    background-color: #4ec961;
}
.detail_record_hidden {
  background-color: #e2e8e2;
  display:none;
}

.detail_record_show {
    background-color: #ccd9d5;
    display:table-row;
}




/* ------------------   Table definitions --------------- */

tr {height:10px;}


/* ------------ check box -------------*/
.icon-publish {
    border-radius: 0.2rem;
    height: 1.5rem;
    width: 1.5rem;
    background-color: green;
}
.icon-publish:before {
    line-height: 1.5rem;
    padding-left: 2px;
    color: white;
    font-size: 1.2rem;
    content: "\f00c";
}
.icon-unpublish{
    border-radius: 0.2rem;
    height: 1.5rem;
    width: 1.5rem;
    background-color: red;
}
.icon-unpublish:before {
    line-height: 1.5rem;
    padding-left: 2px;
    color: white;
    font-size: 1rem;
    content: "\f4fd";
}