:root {
  --qt-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --qt-font-family-mono: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --qt-font-size-base: 13px;
  --qt-font-size-dense: 12px;
  --qt-font-size-caption: 11px;
  --qt-line-height: 1.5;
  font-family: var(--qt-font-family);
}

html {
  font-size: 16px;
}

body {
  /** background: silver; **/
  background: #494C50;
  font-family: var(--qt-font-family);
  font-size: var(--qt-font-size-base);
  line-height: var(--qt-line-height);
  min-width: 320px; 
}

.ow-app,
.ow-lpr-app,
.gid-app {
  font-family: var(--qt-font-family) !important;
  line-height: var(--qt-line-height) !important;
}

body,
table,
select,
input,
textarea,
button,
label {
  font-family: var(--qt-font-family);
}

select,
input,
textarea,
button {
  font: inherit;
}

.ow-app select,
.ow-app input,
.ow-app textarea,
.ow-app button,
.ow-lpr-app select,
.ow-lpr-app input,
.ow-lpr-app textarea,
.ow-lpr-app button,
.gid-app select,
.gid-app input,
.gid-app textarea,
.gid-app button {
  font: inherit;
}

code,
pre,
kbd,
samp,
.ow-code,
.gid-code {
  font-family: var(--qt-font-family-mono) !important;
}

table,
label {
  font-size: inherit;
  line-height: inherit;
}

small,
.small {
  font-size: var(--qt-font-size-caption);
}

.ow-action-label,
.ow-match-type,
.ow-flag,
.ow-token,
.ow-pill,
.ow-mini-stat span,
.ow-template-cell,
.ow-template-preview-row span,
.ow-edit-preview-cell,
.ow-edit-preview-row-label {
  font-size: var(--qt-font-size-caption) !important;
  line-height: 1.2 !important;
}

.ow-action-label,
.ow-template-preview-row span,
.ow-edit-preview-row-label {
  letter-spacing:0 !important;
}

.ow-table th,
.ow-table td,
.gid-table th,
.gid-table td {
  line-height: 1.42 !important;
  padding-bottom: 8px;
  padding-top: 8px;
}

.ow-field input,
.ow-field select,
.ow-field textarea,
.ow-filters input,
.ow-filters select,
.ow-form input,
.ow-form select,
.ow-form textarea,
.ow-registry-tools input,
.ow-template-options input[type="number"],
.ow-edit-options input[type="number"],
.gid-field input,
.gid-field select,
.gid-field textarea {
  line-height: 1.35 !important;
  min-height: 34px;
}

h1,
h2,
h3 {
  font-family: var(--qt-font-family);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.1;
}

h4,
h5,
h6 {
  font-family: var(--qt-font-family);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.16;
}

.ow-title,
.ow-stat-value,
.ow-kpi-value,
.ow-insight-headline,
.ow-lpr-title,
.ow-lpr-stat-value,
.ow-brand-mark {
  letter-spacing: 0 !important;
}

.ow-app *,
.ow-lpr-app *,
.gid-app * {
  box-sizing: border-box;
}

.ow-panel,
.ow-actionbar,
.ow-action-form,
.ow-inline-form,
.ow-site-history,
.ow-client-site-tab,
.ow-site-tab {
  max-width: 100%;
}

.ow-actionbar,
.ow-action-group,
.ow-field,
.ow-inline-form,
.ow-action-form,
.ow-client-site-tab,
.ow-site-tab {
  min-width: 0;
}

.ow-field input,
.ow-field select,
.ow-field textarea,
.ow-inline-form input,
.ow-inline-form select,
.ow-inline-form textarea,
.ow-action-form input,
.ow-action-form select,
.ow-action-form textarea,
.ow-search-input {
  max-width: 100%;
}

.ow-search-input {
  width: 100%;
}

.ow-alert,
.ow-warning,
.ow-ok {
  border-radius: 8px;
  line-height: var(--qt-line-height);
  padding: 10px 12px;
}

.ow-alert {
  background: #f8fafc;
  border: 1px solid #dbe3ea;
  color: #334155;
}

.ow-warning {
  background: #fff8e6;
  border: 1px solid #f4d58b;
  color: #8a5a00;
}

.ow-ok {
  background: #f4fbdc;
  border: 1px solid #cde681;
  color: #3d5900;
}

.ow-chip,
.ow-status {
  align-items: center;
  border: 1px solid #dbe3ea;
  border-radius: 999px;
  display: inline-flex;
  gap: 4px;
  line-height: 1.2;
  max-width: 100%;
  padding: 3px 8px;
  vertical-align: middle;
  white-space: nowrap;
}

.ow-chip {
  background: #f8fafc;
  color: #475569;
}

.ow-chip-active,
.ow-status-approved,
.ow-status-ok,
.ow-status-open {
  background: #eef8c5;
  border-color: #cde681;
  color: #3d5900;
}

.ow-status-pending,
.ow-status-review {
  background: #fff4d6;
  border-color: #f4d58b;
  color: #8a5a00;
}

.ow-status-rejected,
.ow-status-bad,
.ow-status-overdue {
  background: #ffe8e8;
  border-color: #f4a9a9;
  color: #a11212;
}

.ow-call-button {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.ow-client-site-tab span,
.ow-client-site-tab small,
.ow-site-tab span,
.ow-site-tab small {
  min-width: 0;
}
/** Structure */
#header {
  padding: 20px;
  background: var(--main_color, #080);
  color: var(--main_text_color, #ffffff);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom: 4px solid var(--main_color, #080);
  font-size: var(--qt-font-size-base);
  line-height: var(--qt-line-height);
    
}



#content {
    background: var(--main_text_color, #ffffff);
    font-size: var(--qt-font-size-base);
    line-height: var(--qt-line-height);
    padding: 20px;
}



#footer {
  background: var(--main_color, #080);
  color: var(--main_text_color, #ffffff);
  font-size: var(--qt-font-size-dense);
  line-height: var(--qt-line-height);
  padding: 20px;
  border-top: 4px solid var(--main_color, #080);
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}



.autoModal.modal .modal-body{
    max-height: 100%;
}

.modal-dialog{
    max-height: 100%;
}

.ui-autocomplete-loading {
  background: url(data:image/gif;base64,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) right center no-repeat;
}
.ui-autocomplete { 
  overflow-y: scroll; 
  overflow-x: hidden;
}


.blueflash {
    font: 700 var(--qt-font-size-caption)/var(--qt-line-height) var(--qt-font-family);
    position: relative;
  
    animation-duration: 1s;
    animation-name: blueflash;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
}
@keyframes blueflash {
    from {
        color:red;
    }
    to {
        color:blue;
    }
}





.full_table {
  border: 0px;
  width: 100%;
}





/*////////////////////////////// sign in form /////////////////// sign in form //////////////////////////////*/

.form-signin {
  max-width: 350px;
  padding: 15px;
  margin: 0 auto;
}

.form-control,
.custom-select,
.dynatable-search input,
.dynatable-per-page select {
  font-family: var(--qt-font-family);
  font-size: var(--qt-font-size-base);
  line-height: 1.35;
}

.table,
.dynatable {
  font-size: var(--qt-font-size-dense);
  line-height: 1.4;
}

.btn {
  font-family: var(--qt-font-family);
  font-size: 0.8125rem;
  line-height: 1.35;
}

.form-signin .form-signin-heading,

.form-signin .form-control {
  position: relative;
  height: auto;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 10px;
  font-size: 16px;
}
.form-signin .form-control:focus {
  z-index: 2;
}
.form-signin input[type="text"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

/*////////////////////////////////////////////////////////////////////////////////////////////////////////////*/


.form-normal {
  max-width: 800px;
  margin: 0 auto;
}

    
.table-hover > tbody > tr:hover {
  background-color: var(--table_hover_color, #00a);
  color: var(--main_text_color, #ffffff);
  font-weight:bold;
}


/*.table-hover > tbody > tr div.butbox {*/
.table-hover > tbody > tr div.butcol {
  display:none;
  /*overflow: hidden;*/
}


/*.table-hover > tbody > tr:hover div.butbox{*/
.table-hover > tbody > tr:hover div.butcol{
  /*display:inline-block;*/
  display:block;
  text-align: center;
  max-height: 38px;
}

.butcol > a.btn {
  width: 100%;
  margin-bottom: 1px;
}



.image-preview-input {
    position: relative;
	  overflow: hidden;
	  margin: 0px;    
    color: #333;
    background-color: var(--main_text_color, #ffffff);
    border-color: #ccc;    
}
.image-preview-input input[type=file] {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	padding: 0;
	font-size: 20px;
	cursor: pointer;
	opacity: 0;
	filter: alpha(opacity=0);
}
.image-preview-input-title {
    margin-left:2px;
}

.btn-sm, .btn-group-sm > .btn {
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
  line-height: 1.5;
  border-radius: 0.2rem;
}


.btn-xs, .btn-group-xs > .btn {
  padding: 0.18rem 0.3rem;
  font-size: 0.6875rem;
  line-height: 1.35;
  border-radius: 0.2rem;
}