@import url(../../admin/css/base.css);

@font-face {font-family: Exo2; font-weight:normal; src: url('/static/core/fonts/Exo2-Regular.woff2');}
@font-face {font-family: Exo2; font-weight:bold; src: url('/static/core/fonts/Exo2-Bold.woff2');}
@font-face {font-family: Exo2; font-style:italic; src: url('/static/core/fonts/Exo2-Italic.woff2');}
@font-face {font-family: Exo2; font-weight:bold; font-style:italic; src: url('/static/core/fonts/Exo2-BoldItalic.woff2');}
@font-face {font-family: Exo2Light; src: url('/static/core/fonts/Exo2-Light.woff2');}
@font-face {font-family: Exo2Light; font-style:italic; src: url('/static/core/fonts/Exo2-LightItalic.woff2');}

:root {
    --header-height: 43px;
    --footer-height: 26px;
    --nav-bar-width: 54px;
}

body {
    background: var(--body-bg);
}

ul, ul li {
    list-style-type:none;
}

ul.dNDT-link-list li a {
    font-weight: bold;
}

ul.dNDT-link-list li a:hover {
    text-decoration: underline;
}

#content-main-change-form {
    padding-right: 25px;
}

#changelist .actions {
    padding: 0px;
    border-top: none;
    border-bottom: none;
    line-height: 24px;
    color: #999;
}

#changelist .actions select {
    height: 40px;
    background-color: var(--body-bg);
    border-radius: 0px;
    font-size: 14px;
    padding: 0px;
    margin-left: 0px;
}

#changelist .actions span.all,
#changelist .actions span.action-counter,
#changelist .actions span.clear,
#changelist .actions span.question {
    font-size: 14px;
}

#changelist td, th {
    vertical-align: middle;
}

#searchbar {
    color: var(--body-quiet-color);
    background: var(--darkened-bg);
}

.object-tools a {
    border-radius: 5px;
}

.aligned label + p, .aligned label + div.help, .aligned label + div.readonly {
    margin-left: 0px;
    padding: 0px;
}

.aligned label + div.readonly {
    margin-left: 0px;
}

.help::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f05a";
  display: inline-block;
  margin-right: 0.5em;
}

.required label::after,
label.required::after {
    content: "*" !important;
    color: red;
    vertical-align: baseline !important;
}

.aligned p.file-upload {
    margin-left: 0px;
}

.login #container {
    width: 30em;
    min-width: 100px;
    margin: 100px auto;
}

#client-container {
    width: 30em;
    min-width: 100px;
    margin: 100px auto;
}

.client-select {
    width: 100%;
}

.paginator {
    font-size: 14px;
    display: block;
}

.paginator a:link, .paginator a:visited {
    background: lightgrey;
}

.paginator a:focus, .paginator a:hover {
    color: white;
    background: grey;
}

.paginator a.showall, a.showall:focus, .paginator a.showall:hover {
    background: none;
}

.paginator .this-page {
    font-size: 14px;
}

/* MODULES */

.module {
    background: var(--body-bg);
}

.module p, .module ul, .module h3, .module h4, .module dl, .module pre {
    padding-left: 0px;
}

.module h2, .module caption, .inline-group h2 {
    color: var(--body-fg);
    background-color:var(--body-bg);
    margin-top: 5px;
}

.calendarbox caption {
    text-align: center;
    background: #9e9e9e;
}

.back-to-top {
    position: fixed;
    right:20px;
    bottom:30px;
}

 /*---      FontAwesome Enhancement       ---*/
/*--- CSS for changing fa-icons on hover ---*/

* > .fas.fa-hover-show,
*:hover > .fas.fa-hover-hidden {
  display: none;
}

*:hover > .fas.fa-hover-show {
  display: inline-block;
}

div.breadcrumbs {
    padding: 10px 20px;
}

input[type=text], input[type=password], input[type=email], input[type=url],
input[type=number], input[type=tel], textarea, select, .vTextField {
    background-color: var(--darkened-bg);
}

input[readonly], textarea[readonly], select[readonly] {
    background-color: #aaa;
    cursor: not-allowed;
}

fieldset {
    /* FIXED: reverted min-width of django3 base.css */
    min-width: revert !important;
}

/* SUBMIT ICON BAR */

.submit-iconbar {
    position: fixed;
    top: 50%;
    right: -310px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    transition: 0.4s;
    z-index: 99;
}

.submit-iconbar button {
    display: block;
    text-align: left;
    padding: 10px;
    font-size: 18px;
    width: 350px;
    text-transform: uppercase;
}

.submit-iconbar button i {
    margin-right: 4px;
}

.submit-iconbar span {
    cursor: pointer;
    display: inline-block;
    position: relative;
    transition: 0.4s;
}

.submit-iconbar span:hover {
    padding-right: 265px;
}

@media (max-width: 767px) {
    .submit-iconbar {
        position: static; /* Reset the position */
        transform: none;  /* Remove any transformations */
        z-index: auto;    /* Reset z-index */
    }

    .submit-iconbar button, .submit-iconbar button {
        font-size: 16px;
        width: 100%;
    }

    .submit-iconbar span {
        display: inline;      /* Adjust display */
    }

    .submit-iconbar span:hover {
        padding-right: 0;     /* Reset padding */
    }
}

/* INLINES */

.inline-group .tabular td.original p {
    font-family: Exo2;
    overflow: visible;
    font-size: 12px;
}

.inline-group {
    overflow-x: scroll;
    overflow-y: hidden;
    margin: 0px;
    padding-bottom: 15px;
}

.related-widget-wrapper {
    overflow: visible;
}

.inline-related h3 {
    padding-left:10px;
    background: inherit;
    border-top: 0px;
    border-bottom: 0px;
}

.inline-related fieldset.module h3 {
    font-weight: normal;
    font-size: 13px;
    background: inherit;
    color: #666;
    margin: 0px 0px 8px 0px;
    padding: 2px 5px 3px 0px;
}

.inline-related fieldset.module td {
    border: 0px;
}

.aligned label {
    float: none;
    width: 250px;
}

.inline-group[data-inline-type="stacked"], .inline-group[data-inline-type="tabular"] {
	border-radius: 4px;
}

.errors .select2-selection {
  border: 1px solid var(--error-fg) !important;
}

/* FORM ROWS */

input:disabled,
select:disabled,
textarea:disabled {
    color: var(--body-fg);
    background-color: #aaa;
    opacity: 60%;
    border: 1px solid var(--body-fg);
}

form fieldset legend {
    border-radius: 4px;
    font-size: 0.80rem;
    font-weight: 400;
    letter-spacing: 0.5px;
    min-width: 500px;
	padding: 4px 8px;
	margin: 5px 0px 5px 0px;
	text-transform: uppercase;
}

.form-row {
    border-bottom: none;
}

.form-row label input[type="checkbox"] {
    vertical-align: middle;
}

/* FORMS */

form .wide p,
form .wide ul.errorlist,
form .wide input + p.help,
form .wide input + div.help {
	margin-left: 0px;
}

form .aligned p.help,
form .aligned div.help {
    margin-left: 2px;
    padding-left: 0px;
}

form .aligned input + p.help,
form .aligned textarea + p.help,
form .aligned select + p.help,
form .aligned input + div.help,
form .aligned textarea + div.help,
form .aligned select + div.help {
    margin-left: 2px;
    padding-left: 0px;
}

form .aligned ul {
    margin-left: 0px;
    padding-left: 0px;
}

.aligned .vCheckboxLabel {
    margin-top: 20px;
}

fieldset.collapsed {
    border: 0px;
    border-radius: 0px;
}

fieldset .fieldBox {
    float: left;
}

form .aligned div.help {
    clear: left;
}

.custom-upload-button {
    text-transform: uppercase;
    min-width: 260px;
    min-height: 36px;
    border-radius: 5px;
}

.custom-upload-filename {
    background-color: var(--body-bg);
    min-width: 260px;
}

.inline-column-title th {
    font-weight: normal;
    font-size: 11px;
    padding: 5px 10px;
    line-height: normal;
    text-transform: uppercase;
    color: var(--body-quiet-color);
    background: var(--body-bg);
    border: none;
    border-top: 1px solid var(--hairline-color);
    border-bottom: 1px solid var(--hairline-color);
}

.inline-column-title th.required {
    color: var(--body-loud-color);
    font-weight: 600;
}

.hidden {
    visibility: hidden; /* fix for safari browser */
}

.fieldBox p {
    font-family: Exo2;
}

#content {
    padding: 0px;
}

#breadcrumb {
    z-index:9999;
    max-height: var(--header-height);
}

#driveMain {
    padding-top: var(--header-height);
    padding-bottom: var(--footer-height);
    margin-left: var(--nav-bar-width);
}


.dNDT-sidebar-pinned #driveMain {
    margin-left: 220px;
}

#navigation-sidebar {
    z-index:999;
    max-width: var(--nav-bar-width);
    margin-top: var(--header-height);
    padding-bottom:68px;
}

#navigation-sidebar-button {
    max-width: var(--nav-bar-width);
}

#language-sidebar {
    z-index:999;
    display:none;
    min-width:100px;
    right:0;
    padding-bottom:25px;
    margin-top: var(--header-height);
    -webkit-overflow-scrolling:touch;
}

#client-sidebar {
    z-index:999;
    display:none;
    min-width:250px;
    right:0;
    padding-bottom:25px;
    margin-top: var(--header-height);
    -webkit-overflow-scrolling:touch;
}

#content-overlay {
    cursor:pointer;
}

#spinner {
    display: none;
}

.dNDT-chart {
    height: 500px;
}

.dNDT-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 30em;
}

.dNDT-changelist-title {
    background-color: var(--darkened-bg) !important;
}

.dNDT-object-tools-items-dropdown {
    max-height: 500px !important;
    overflow: auto !important;
    overflow-x: hidden !important;
    z-index: 2 !important;
}

.dNDT-nav-dropdown {
    position: fixed !important;
    margin-left:50px !important;
    min-width:180px !important;
    overflow: auto !important;
}

.dNDT-action-dropdown {
    background-color: var(--body-bg) !important;
}

.w3-sidebar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.w3-sidebar::-webkit-scrollbar {
    display: none;
}

.dNDT-nav-item {
    padding-left:10px;
    display:none;
}

.dNDT-applist {
    margin-bottom: var(--footer-height);
}

.dNDT-object-hover:hover {
    cursor: pointer;
    background: var(--selected-bg);
}

.dNDT-list-object {
    height: 40px;
}

.dNDT-list-object-archived {
    font-style:italic;
    opacity: 0.5;
}

.dNDT-without-original td, th {
    vertical-align: middle;
}

.dNDT-toggle-bookmark {
    cursor: pointer;
    padding-left:10px;
}

.dNDT-footer {
    z-index:999 !important;
    position:fixed;
    width:100%;
    bottom:0;
    height: var(--footer-height);
}

.dNDT-toggle-content-collapse, .dNDT-toggle-content-finished {
    cursor: pointer;
}

.dNDT-multiupload-template-card{
    width: 350px;
    min-width: 350px;
}

.dNDT-multiupload-template-new-input-div {
    float: left;
}

.dNDT-multiupload-template-upload-input-div {
    overflow: hidden;
    float: left;
}

.dNDT-multiupload-template-upload-input-div img {
    max-width: 200px;
    max-height: 200px;
}

.dNDT-multiupload-template-icons {
    max-width: 200px;
    float: right;
    clear: right;
}

.dNDT-multiupload-template-full-input {
    width: 100%;
}

.dNDT-multiupload-template-number-input {
    width: 20%;
}

.dNDT-multiupload-template-new-input-div i{
    vertical-align: middle;
}

.dNDT-multiupload-template-div {
    max-height: 410px;
    min-height: 410px;
}

.dNDT-multiupload-template-div-small {
    max-height: 410px;
    min-height: 280px;
}

.dNDT-multiupload-template-new-error {
    position: relative;
    top: -240px;
    margin: 15px;
}

.dNDT-multiupload-template-image-modal{
    max-width: 600px;
    max-height: 600px;
}

td.djn-td {
    line-height: revert !important;
}

.dNDT-preview-iframe {
    width: 100%;
    max-height: 960px;
    overflow: hidden;
}

.dNDT-preview-iframe iframe {
    width: 100%;
    height: 960px;
    border: 1px solid #ccc;
}

.dNDT-dropdown-horizontal {
    display: flex;
    flex-direction: row;
    white-space: nowrap;
}

.dNDT-dropdown-horizontal .dNDT-dropdown-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    text-decoration: none;
    transition: background-color 0.2s;
}