/**
 * Styles for RB Invoice Printing Tool
 * @author: Jiguzman
 */

@font-face { font-family:KiteDisplay; src:url(../fonts/KiteDisplay.otf); }
@font-face { font-family:KiteDisplayLight; src:url(../fonts/KiteDisplayLight.otf); }

body { overflow-y:scroll; }
body::-webkit-scrollbar, .overflow-auto::-webkit-scrollbar { width:10px; height:10px; }
body::-webkit-scrollbar-track, .overflow-auto::-webkit-scrollbar-track { background:rgba(65, 90, 108, 0.5); box-shadow:inset 0 0 9px rgba(0,0,0,0.3); }
body::-webkit-scrollbar-thumb, .overflow-auto::-webkit-scrollbar-thumb { background:#e6e8ed; box-shadow:inset 0 0 9px rgba(0,0,0,0.3); }
 
html, body { font-size:13px; }

h1, h2, h3, h4, h5 { font-family:KiteDisplayLight, Nunito, sans-serif; color:#415a6c; }
h1 { font-size:1.8rem; }
h2 { font-size:1.575rem; }
h3 { font-size:1.35rem; }

.wrap { position:relative; min-height:100vh; background:#e6e8ed; }
.wrap > main { padding-top:1.5rem; padding-bottom:3.5rem; }



/* Nav */
.navbar { background:linear-gradient(45deg, #ea3592 30%, #415a6c 30%); color:#e6e8ed; font-family:KiteDisplayLight, Nunito, sans-serif; padding:0 1rem; }
.navbar-brand { text-transform:uppercase; }
.navbar-brand .fa { padding-right:5px; }
.nav-item { position:relative; padding:.5rem 7px; }
.nav-item:after { content:''; position:absolute; right:0; top:25%; height:50%; width:1px; background:#fff; opacity:0.3;  }
.nav-item:last-child:after { display:none; }
.nav-item:before { content:''; position:absolute; right:0; bottom:0; height:0; width:100%; background:#e6e8ed; opacity:0.5; pointer-events:none; transition:height 0.15s ease; }
.nav-item:hover:before, .nav-item.show:before { height:100%; }
.nav-item.active { background:#e6e8ed; }
.nav-link { position:relative; }
.navbar .nav-item.active > .nav-link { color:#415a6c; }
.dropdown-item { padding:.5rem 1rem; border-bottom:1px solid rgba(65,90,108,0.15); }
.dropdown-item .fa { padding-right:5px; }
.dropdown-item.active, .dropdown-item:active { background-color:#415a6c; }
.logout-item { border-bottom:none; }



/* Status Response */
.status-message > .container:empty { display:none; }
.status-message > .container { padding:5px; color:#fff; text-align:center; }
.status-message { background-color:#000; }
.status-message.status-success { background:#96d22d; }
.status-message.status-success > .container:before { content:'\f058'; font-family:FontAwesome; color:#e6e8ed; padding-right:5px; }
.status-message.status-fail { background:#e3342f; }
.status-message.status-fail > .container:before { content:'\f06a'; font-family:FontAwesome; color:#e6e8ed; padding-right:5px; }




/* Section */
.section { background:#fff; padding:10px; margin-top:1rem; box-shadow:0 0 20px rgba(0,0,0,0.15) }



/* Filter Fields */
.filter-fld-group { display:flex; justify-content:flex-end; }
.filter-fld { padding:5px; max-width:140px; }
.fliter-fld:last-child { padding-right:0; }
.filter-date { display:flex; align-items:center; max-width:100%; }
.datepicker { width:auto; }
.ui-datepicker .ui-widget-header .ui-icon { background-image:none; }



/* Table */
.table thead { background:#415a6c; color:#e6e8ed; }
.table td { vertical-align:middle; }
.table-head-nowrap th { white-space:nowrap; }
.user-date-time-at { font-size:0.82em; }
tr.novoice, tr.novoice .print_status_8 { font-style:italic; color:#999; }



/* Table Item Action */
.item-actions { text-align:right; }
.item-actions a { padding:0 5px; }
.item-actions a[data-action="delete"] { color:#e3342f; display:inline-block; width:69.44px; text-align:left; }
.item-actions a[data-action="archive"], .item-actions a[data-action="void"] { color:#ff6428; }



/* Sort Link */
.sort-link { color:#fff; }
.sort-link:hover { text-decoration:none; color:#e6e8ed; }
.sort-link:after { content:"\f0dc"; font-family:FontAwesome; font-weight:normal; padding-left:5px; }
.sort-link[data-sort="asc"]:after { content:"\f0de"; }
.sort-link[data-sort="desc"]:after { content:"\f0dd"; }



/* Label Checkbox */
th.checkall-cell { padding-top:0; padding-bottom:0; }
label.checkbox.checkall { margin-bottom:2px; }
label.checkbox.checkall:before { color:#fff; font-weight:normal; }
label.checkbox.checkall.is-checked:before { color:#fff; }
label.checkbox { margin-bottom:0; }
label.checkbox:before { content:"\f096"; font-family:FontAwesome; display:inline-block; font-size:20px; width:20px; margin-bottom:0; color:#415a6c; cursor:pointer; vertical-align:middle; }
label.checkbox.is-checked:before { content:"\f046"; color:#96d22d; }
label.checkbox input[type="checkbox"] { display:none; }



/* Select Field Group */
.select-fld-group { padding:5px 10px; border:1px solid rgba(65,90,108,0.25); background:#e6e8ed; max-height:300px; overflow:auto; }
.select-fld-group label { margin-bottom:0; }



/* Pagination */
nav ul.pagination { justify-content:center; padding-top:0.5rem; }
.page-item.active .page-link { background-color:#415a6c; border-color:#415a6c; }



/* Template Editor */
#template_editor { height:70vh; width:100%; }
.template-options { display:flex; align-items:center; padding-bottom:10px; }
.template-options label { color:#415a6c; margin-bottom:0; }
.template-option-fld { padding-left:5px; padding-right:20px; color:#415a6c; }
.template-option-fld:last-child { padding-right:0;;}
.paper-size-fld { width:50px; display:inline-block; text-align:center; }
.paper-margin-fld { width:50px; display:inline-block; text-align:center; }
.paper-margin-fld[name="paper_margin_top"] { box-shadow:inset 0px 3px 0 #415a6c; }
.paper-margin-fld[name="paper_margin_right"] { box-shadow:inset -3px 0px 0 #415a6c; }
.paper-margin-fld[name="paper_margin_bottom"] { box-shadow:inset 0px -3px 0 #415a6c; }
.paper-margin-fld[name="paper_margin_left"] { box-shadow:inset 3px 0px 0 #415a6c; }
.template-options-unit { width:65px; display:inline-block; }

.template-option-fld input::-webkit-outer-spin-button,
.template-option-fld input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.template-option-fld input[type="number"] { -moz-appearance:textfield; }



/* Template Name Header */
.template_name_layer { position:relative; }
.template_name_layer:after { content:'\f044'; font-family:FontAwesome; color:#415a6c; position:absolute; bottom:5px; right:0; }
.template_name_header { font-size:1.8rem; width:100%; position:absolute; color:#415a6c; border:none; border-bottom:1px dashed transparent; background:none; padding:0; }
.template_name_header:focus, .template_name_header:hover { outline:none; border-bottom:1px dashed #415a6c; }
.template_name_span { font-size:1.8rem; display:block; padding-right:35px; visibility:hidden; }



/* Template Invoice Field List */
.invoice-field-group { display:none; width:20%; padding-left:20px; }
.invoice-field-group h4 { color:#415a6c; padding-bottom:10px; }
.invoice-field-list { height:calc(70vh - 40px); overflow:auto; font-size:0.9em; }
.invoice-field { position:relative; cursor:pointer; margin-bottom:5px; border-bottom:1px solid #e6e8ed; white-space:nowrap; transition:padding-left 0.2s ease; }
.invoice-field:hover { background:#e6e8ed; padding-left:20px; }
.invoice-field:hover:before { content:"\f053"; font-family:FontAwesome; position:absolute; left:3px; opacity:0.5; }




/* Buttons */
.btn-primary { background-color:#415a6c; border-color:#415a6c; }
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active { background-color:#344856; border-color:#344856; }
.btn-primary:focus { box-shadow:0 0 0 0.2rem rgb(65, 90, 108, 0.5) !important; }
.btn-primary.disabled, .btn-primary:disabled { background-color:#f8f9fa; border-color:#f8f9fa; color:#212529; }

.btn-success { background-color:#96d22d; border-color:#96d22d; }
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success:not(:disabled):not(.disabled):active { background-color:#78a824; border-color:#78a824; }
.btn-success:focus { box-shadow:0 0 0 0.2rem rgba(150, 210, 45, 0.5) !important; }
.btn-success.disabled, .btn-success:disabled { background-color:#f8f9fa; border-color:#f8f9fa; color:#212529; }

.btn-alt { background-color:#ea3592; border-color:#ea3592; color:#fff; }
.btn-alt:hover,
.btn-alt:focus,
.btn-alt:active,
.btn-alt:not(:disabled):not(.disabled):active { background-color:#ce2e81; border-color:#ce2e81; color:#fff; }
.btn-alt:focus { box-shadow:0 0 0 0.2rem rgba(150, 210, 45, 0.5) !important; }
.btn-alt.disabled, .btn-alt:disabled { background-color:#f8f9fa; border-color:#f8f9fa; color:#212529; }

.btn-light { color:#415a6c; }

.btn:disabled { cursor:default; }
.btn > .fa { padding-right:5px; }



/* Modal */
.modal-header { background-color:#415a6c; }
.modal-title { color:#e6e8ed; }
.modal-open { padding-right:10px !important; }



/* Loading */
.loading-cover { position:fixed; top:0; left:0; z-index:9999; width:100vw; height:100vh; background:rgba(0,0,0,0.5); display:flex; justify-content:center; align-items:center; }
.loading-group { background:#e6e8ed; border-radius:5px; border:1px solid #415a6c; text-align:center; padding:10px 30px; box-shadow:0 0 20px rgba(0,0,0,0.3); }
.loading-text { font-weight:600; padding-top:5px; }
.spinner-border { color:#96d22d; }



/* Type Status */
.text-status-active, .text-status-active-no-hover { color:#96d22d; padding:0 5px; border-radius:5px; }
.text-status-active:hover { background:#96d22d; color:#fff; text-decoration:none; }
.text-status-inactive, .text-status-inactive-no-hover { color:#415a6c; font-style:italic; padding:0 5px; }
.text-status-inactive:hover { background:#415a6c; color:#fff; text-decoration:none; border-radius:5px;  }



/* Text Status */
.text-green, .print_status_6 { color:#96d22d; }
.text-red, .print_status_7, .print_status_8 { color:#e3342f; }
.text-orange, .print_status_5 { color:#ff6428; }



/* Footer */
footer { position:absolute; bottom:0; width:100%; background:linear-gradient(45deg, #415a6c 87%, #e6e8ed 87%);; box-shadow:0 0 15px rgba(0,0,0,0.3); }
.footer-contents > div { padding:5px 20px; }
.footer-contents img { height:20px; }



/* Text Select File */
.txt-select-file { display:block; border:1px dashed #e6e8ed; background:rgba(65,90,108,0.15); padding:5px 10px; text-overflow:ellipsis; overflow:hidden; }
.txt-select-file:before { content:'\f1c6'; font-family:FontAwesome; padding-right:5px; color:#415a6c; }
.txt-select-file:empty:after { content:'No file selected.' }



/* Forms */
.form-group.required .control-label:after{ color: #e3342f; content:"*"; padding-left:5px; }
.confirmation-status p{ margin:0; padding:0; color:#e3342f; line-height: 1;}



/* Table Custom Scrollbar */
.table-scrollbar-custom { position: relative; height: 350px; overflow: auto; } 
.table-wrapper-scroll-y { display: block; }



/* IE */
input::-ms-clear { display:none; } /* Remove X input firlds */
input[type="password"]::-ms-reveal, input[type="password"]::-ms-clear { display:none; } /* Remove eye password firlds */