/*
 * Legacy custom styles for OS2BorgerPC
 *
 * REFER TO /nodejs/CSS_CUSTOMIZATION.md FOR CSS CUSTOMIZATION GUIDELINES
 */


/* TODO: The contents of this file should be merged to the custom Bootstrap build
 or their related templates */


/* Headers */
div.runscriptdialogheader {display: none;}


/* Navigation */
.nav.utils>li>a {text-shadow: none;}
.nav.utils>li>a:hover, .nav.utils>li>a:focus {background: var(--bs-gray-dark); border-radius: 5px;}
.nav.utils .nav-header {text-shadow: none; color: var(--bs-white); text-transform: uppercase; font-weight: bold;}
/* Delete button on lists */
.inertnav {background: var(--bs-gray-dark); border-radius: 5px; padding: 15px 20px;}
.inertnav li {padding: 2px 0; color: var(--bs-gray-dark);}
.inertnav li:hover {background: var(--bs-gray);}

ul.nav li ul { color: var(--bs-white); list-style: none; padding: 0; margin: 0 0 0 1em; }
ul.nav li ul a, ul.nav li ul a:hover, ul.nav li ul a:focus { color: var(--bs-white); text-decoration: none; }
ul.nav li ul li.active { font-style: italic; }


/* Misc */

.profile {font-size: 14px; margin-right: 20px;}
.profile a.dropdown-toggle {color: var(--bs-white);}
.dark a.dropdown-toggle {color: var(--bs-dark);}
.accordion {margin-top: 20px;}
.accordion-group {border: none; padding: 0;}
.accordion-toggle {text-align: left;}
.searchfilter .btn {display: block; text-align: left;}
.popover {max-width: 75em;}
.job-output-pre {overflow: scroll; max-height: 450px;}
.popover.bottom .arrow {left: auto; right: 30px;}
.popover.bottom {margin: 5px 20px 0 0;}
.popover.top .arrow {left: auto; right: 30px;}
.popover.top {margin: 0 20px 5px 0;}
.disable-select { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

#jobinfo-popover {position: absolute; display: none; z-index: 10000; width: auto; min-width: 20em; max-width: 60em;}

#group_configuration, #pc_config {margin-bottom: 0;}
.script-list { list-style-type:none; margin-left:0; }
.script-list li:hover { cursor:pointer; background-color: var(--bs-gray); }

.selected > td{ background-color: var(--bs-cyan); }

.batch:not(:empty)::before { content: "(" }
.batch:not(:empty)::after { content: ")" }

#scriptform textarea {
  min-width: 90vh;
  height: 40vh;
}

/* Forms */

input.phantom { display: none; }
input.invalid { border: 1px solid var(--bs-danger); }
#job-list .btn-secondary { border: none; background: none; }
#job-list tr { vertical-align: middle; }
#securityevent-list .btn-secondary { border: none; background: none; }
#securityevent-list tr { vertical-align: middle; }

/* Lists */

.itemlist .btn-group {margin: 0 10px 10px 0;}
.actionlist {padding: 5px;}
.actionlist a {border-top: solid 1px var(--bs-gray); padding: 10px; display: block;}
.actionlist > li:first-child a {border: none;}
.actionlist .btn-group {display: block;}
.actionlist a:hover {background: var(--bs-primary); color: var(--bs-white); text-decoration: none; border-radius: 5px;}
.actionlist .profile {margin-right: 0;}
ul.addlist {min-width: 80%; box-shadow: 0 10px 10px var(--bs-gray-dark); padding: 0; z-index: 100;}
ul.addgrouplist {display: none; max-height: 300px; overflow-y: auto; position: absolute; background-color: var(--bs-white);}
ul.addgrouplist li {cursor: pointer;}
ul.addlist li a {border-top: solid 1px var(--bs-gray) !important;}
li.addgrouptrigger {position: relative;}
li.addgrouptrigger:hover ul.addgrouplist {display: block}
ul.adduserlist {display: none; max-height: 300px; overflow-y: auto; position: absolute; background-color: var(--bs-white);}
ul.adduserlist li {cursor: pointer;}
li.addusertrigger {position: relative;}
li.addusertrigger:hover ul.adduserlist {display: block}
li.selected {background-color: var(--bs-gray);}

/* Picklist.html */

/* checkbox */
.li-checkbox { margin-left: 10px; margin-right: 10px;}

/* picklist */
.pick-list-available {
  max-height: 400px; 
  background-color: var(--bs-white);
  padding-bottom: 0px;
  overflow: auto;
}
/* accept and cancel buttons */
.dropdown-buttons {
  padding: 5px;
  bottom: 0;
  background-color: var(--bs-white);
}

.alert {
  position: static;
}

.list-group-item {
  position: static;
}

.translate-toast {
  right: 10%;
} 

/* Documentation */

div.docscontainer {padding-bottom: 20px;}
div.docscontainer * {max-width: 600px;}
div.docscontainer p, div.docscontainer h1, div.docscontainer h2, div.docscontainer h3, div.docscontainer h4 {margin-top: 0.75em; margin-bottom: 0.25em;}
div.docscontainer h1 {font-size: 1.75em; line-height: inherit;}
div.docscontainer h2 {font-size: 1.25em; line-height: inherit;}
div.docscontainer h3 {font-size: 1.1em; line-height: inherit;}
div.docscontainer h4 {font-size: 1em; line-height: inherit;}
div.docscontainer pre {max-width: 100%;}
div.docscontainer .nav-list {list-style: none; padding: 0; margin: 20px 0;}
div.docscontainer .nav-list>li>a {margin: 0; display: inline-block; padding: 3px 6px; border-radius: 5px;}
div.docscontainer .nav-list>li>a:hover {background: var(--bs-gray-dark); text-decoration: none; color: var(--bs-white); text-shadow: none;}

/* Layout helpers */
.inline {display: inline}


/* Media queries / Responsiveness */

@media screen and (max-width: 1735px) {
  /* Make jobs and computer -> jobs look decent down until around 1080px width */
  #jobsearchnav { width: 9rem; }
  .jobtable th, .jobtable td { padding: .75rem .75rem!important; }

  /* Make images look better at a lower res too */
  .images .sublevelnav {
    width: 170px;
  }

  .images th {
    word-wrap: anywhere;
  }
}

@media screen and (max-width: 1535px) {
  /* Hide computer description from status page at lower resolution */
  #site-status-table th:nth-of-type(3),  #site-status-table th:nth-of-type(4),
  #site-status-table td:nth-of-type(3), #site-status-table td:nth-of-type(4) { display: none; }
}