/*--------------------------------------------------------------
# Set Custom Tag Property
--------------------------------------------------------------*/
legend {
  line-height: 0;
  margin-bottom: 0;
}

/*--------------------------------------------------------------
# Custom  Useful Class
--------------------------------------------------------------*/
.td-none {
  text-decoration: none;
}
.no-padding {
  padding: 0px; 
}
.no-margin {
  margin: 0px; 
}
.hide {
  display: none; 
}
.show {
  display: block;
}
.horizontal-scrollable {
  overflow: auto;
  white-space: nowrap;
}
.vertical-scrollable {
  overflow-y: scroll;
}

/*--------------------------------------------------------------
# Custom Text Color
--------------------------------------------------------------*/
.text-navy {
  color: #000080 !important;
}
.text-teal {
  color: #008080 !important;
}
.text-maroon {
  color: #800000 !important;
}
.text-indigo {
  color: #4b0082 !important;
}
.text-tomato {
  color: #ff6347 !important;
}

/*--------------------------------------------------------------
# Custom Background Color
--------------------------------------------------------------*/
.bg-navy {
  background-color: #000080 !important;
}
.bg-teal {
  background-color: #008080 !important;
}
.bg-maroon {
  background-color: #800000 !important;
}
.bg-indigo {
  background-color: #4b0082 !important;
}
.bg-tomato {
  background-color: #ff6347 !important;
}
.bg-light-red {
  background-color: #ffcfcf !important;
}

/*--------------------------------------------------------------
# Custom Button
--------------------------------------------------------------*/
/* Custom styles for indigo button (Bootstrap) */
.btn-indigo {
    color: #fff;
    background-color: #6610f2;
    border-color: #6610f2;
}
.btn-indigo:hover {
    color: #fff;
    background-color: #560df2;
    border-color: #560df2;
}
.btn-check:focus + .btn-indigo, .btn-indigo:focus {
    color: #fff;
    background-color: #560df2;
    border-color: #560df2;
    box-shadow: 0 0 0 0.25rem rgba(86, 13, 242, 0.5);
}
.btn-check:checked + .btn-indigo, .btn-check:active + .btn-indigo, .btn-indigo:active, .btn-indigo.active, .show > .btn-indigo.dropdown-toggle {
    color: #fff;
    background-color: #4e09e2;
    border-color: #4e09e2;
}
.btn-check:checked + .btn-indigo:focus, .btn-check:active + .btn-indigo:focus, .btn-indigo:active:focus, .btn-indigo.active:focus, .show > .btn-indigo.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.25rem rgba(86, 13, 242, 0.5);
}
.btn-indigo:disabled, .btn-indigo.disabled {
    color: #fff;
    background-color: #6610f2;
    border-color: #6610f2;
}

/* Custom styles for tomato button (bootstrap) */
.btn-tomato {
    color: #fff;
    background-color: #ff6347; /* Tomato color */
    border-color: #ff6347; /* Tomato color */
}
.btn-tomato:hover {
    color: #fff;
    background-color: #ff4500; /* Darker shade of tomato color */
    border-color: #ff4500; /* Darker shade of tomato color */
}
.btn-check:focus + .btn-tomato, .btn-tomato:focus {
    color: #fff;
    background-color: #ff4500; /* Darker shade of tomato color */
    border-color: #ff4500; /* Darker shade of tomato color */
    box-shadow: 0 0 0 0.25rem rgba(255, 69, 0, 0.5); /* Darker shade of tomato color */
}
.btn-check:checked + .btn-tomato, .btn-check:active + .btn-tomato, .btn-tomato:active, .btn-tomato.active, .show > .btn-tomato.dropdown-toggle {
    color: #fff;
    background-color: #d14836; /* Darker shade of tomato color */
    border-color: #d14836; /* Darker shade of tomato color */
}
.btn-check:checked + .btn-tomato:focus, .btn-check:active + .btn-tomato:focus, .btn-tomato:active:focus, .btn-tomato.active:focus, .show > .btn-tomato.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.25rem rgba(255, 69, 0, 0.5); /* Darker shade of tomato color */
}
.btn-tomato:disabled, .btn-tomato.disabled {
    color: #fff;
    background-color: #ff6347; /* Tomato color */
    border-color: #ff6347; /* Tomato color */
}

/*--------------------------------------------------------------
# Custom Form
--------------------------------------------------------------*/
form .error, .help-inline-error {
  color: red;
  width:  100%;
}

/* indigo-form  */
.indigo-form .form-control:focus {
  box-shadow: none;
  border-color: #4B0082 !important;
}
.indigo-form .form-select:focus {
  box-shadow: none;
  border-color: #4B0082 !important;
}
.indigo-form .input-group .input-group-text {
  background-color: #FFF;
  border-right: 0px; 
}
.indigo-form .input-group .input-group-text i {
  font-size: 13px; 
}
.indigo-form .form-label {
    font-size: 11px
}

/*--------------------------------------------------------------
# Auto Complete Suggestion
--------------------------------------------------------------*/
.autocomplete-suggestions {
    position: absolute;
    border: 1px solid #ddd;
    background-color: white;
    max-height: 150px; /* Max height to show 5 items */
    overflow-y: auto;   /* Enable vertical scrolling */
    width: 100%;
    z-index: 1050; /* Ensure it's above other modal elements */
    display: none; /* Hidden by default */
}
.autocomplete-suggestion {
    padding: 8px 10px;
    cursor: pointer;
}
.autocomplete-suggestion:hover {
    background-color: #f8f9fa;
}

/*--------------------------------------------------------------
# Loader Style
--------------------------------------------------------------*/
/* Loader Styles start here */
.loader-wrapper {
  --line-width: 5px;
  --curtain-color: #f1faee;
  --outer-line-color: #a8dadc;
  --middle-line-color: #457b9d;
  --inner-line-color: #1d3557;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:1000;
}

.loader {
  display:block;
  position: relative;
  top:50%;
  left:50%;
/*   transform: translate(-50%, -50%); */
  width:150px;
  height:150px;
  margin:-75px 0 0 -75px;
  border:var(--line-width) solid transparent;
  border-top-color: var(--outer-line-color);
  border-radius:100%;
  -webkit-animation: spin 2s linear infinite;
          animation: spin 2s linear infinite;
  z-index:1001;
}

.loader:before {
  content:"";
  position: absolute;
  top:4px;
  left:4px;
  right:4px;
  bottom:4px;
  border:var(--line-width) solid transparent;
  border-top-color: var(--inner-line-color);
  border-radius:100%;
  -webkit-animation: spin 3s linear infinite;
          animation: spin 3s linear infinite;
}

.loader:after {
  content:"";
  position: absolute;
  top:14px;
  left:14px;
  right:14px;
  bottom:14px;
  border:var(--line-width) solid transparent;
  border-top-color: var(--middle-line-color);
  border-radius:100%;
  -webkit-animation: spin 1.5s linear infinite;
          animation: spin 1.5s linear infinite;
}

@-webkit-keyframes spin {
  0%   { 
    -webkit-transform: rotate(0deg); 
      -ms-transform: rotate(0deg); 
          transform: rotate(0deg);
  }
  100% { 
    -webkit-transform: rotate(360deg); 
      -ms-transform: rotate(360deg); 
          transform: rotate(360deg);
  }
}
@keyframes spin {
  0%   { 
    -webkit-transform: rotate(0deg); 
      -ms-transform: rotate(0deg); 
          transform: rotate(0deg);
  }
  100% { 
    -webkit-transform: rotate(360deg); 
      -ms-transform: rotate(360deg); 
          transform: rotate(360deg);
  }
}

.loader-wrapper .loader-section {
  position:fixed;
  top:0;
  background:var(--curtain-color);
  width:51%;
  height:100%;
  z-index:1000;
}

.loader-wrapper .loader-section.section-left {
  left:0
}
.loader-wrapper .loader-section.section-right {
  right:0;
}

/* Loaded Styles */ 
.loaded .loader-wrapper .loader-section.section-left {
  transform: translateX(-100%);
  transition: all 0.7s 0.3s cubic-bezier(0.645,0.045,0.355,1.000);
}
.loaded .loader-wrapper .loader-section.section-right {
  transform: translateX(100%);
  transition: all 0.7s 0.3s cubic-bezier(0.645,0.045,0.355,1.000);
}
.loaded .loader {
  opacity: 0;
  transition: all 0.3s ease-out;
}
.loaded .loader-wrapper {
  visibility: hidden;
  transform:translateY(-100%);
  transition: all .3s 1s ease-out;
}

/*--------------------------------------------------------------
# Cursor
--------------------------------------------------------------*/
.alias {cursor: alias;}
.all-scroll {cursor: all-scroll;}
.auto {cursor: auto;}
.cell {cursor: cell;}
.col-resize {cursor: col-resize;}
.context-menu {cursor: context-menu;}
.copy {cursor: copy;}
.crosshair {cursor: crosshair;}
.default {cursor: default;}
.e-resize {cursor: e-resize;}
.ew-resize {cursor: ew-resize;}
.grab {cursor: -webkit-grab; cursor: grab;}
.grabbing {cursor: -webkit-grabbing; cursor: grabbing;}
.help {cursor: help;}
.move {cursor: move;}
.n-resize {cursor: n-resize;}
.ne-resize {cursor: ne-resize;}
.nesw-resize {cursor: nesw-resize;}
.ns-resize {cursor: ns-resize;}
.nw-resize {cursor: nw-resize;}
.nwse-resize {cursor: nwse-resize;}
.no-drop {cursor: no-drop;}
.none {cursor: none;}
.not-allowed {cursor: not-allowed;}
.pointer {cursor: pointer;}
.progress {cursor: progress;}
.row-resize {cursor: row-resize;}
.s-resize {cursor: s-resize;}
.se-resize {cursor: se-resize;}
.sw-resize {cursor: sw-resize;}
.text {cursor: text;}
.url {cursor: url(myBall.cur),auto;}
.w-resize {cursor: w-resize;}
.wait {cursor: wait;}
.zoom-in {cursor: zoom-in;}
.zoom-out {cursor: zoom-out;}

/*--------------------------------------------------------------
# Card Utility
--------------------------------------------------------------*/
.body-content .sec-1{ width:100%; margin:10px auto; overflow:hidden;}
.body-content .sec-1 .box{ width:100%; margin:10px auto; padding:30px 20px; min-height:150px; max-height:150px; border-radius:10px; position:relative; overflow:hidden;}
.body-content .sec-1 .box .caption{ width:100%; padding:30px; position:absolute; top:0; left:0; z-index:2;}
.body-content .sec-1 .box .caption h4{ font-family: 'Roboto', sans-serif; font-size:22px; font-weight:300; text-align:left; color:#fff; line-height:30px; margin:0 0 20px 0;}
.body-content .sec-1 .box .caption p{ font-family: 'Roboto', sans-serif; font-size:14px; font-weight:300; text-align:left; color:#fff; line-height:24px; margin:0 0 10px 0;}
.body-content .sec-1 .box .shape{width:100%; position:absolute; top:0; left:0; z-index:1;}
.body-content .sec-1 .box .shape img{width:100%; margin:0 auto; display:block;}

.body-content .sec-1 .bg1{ background-image: linear-gradient(to right, #f09b0c , #f06915);}
.body-content .sec-1 .bg2{ background-image: linear-gradient(to right, #eb4d0f , #fc48c5);}
.body-content .sec-1 .bg3{ background-image: linear-gradient(to right, #3e2cda , #fd2013);}
.body-content .sec-1 .bg4{ background-image: linear-gradient(to right, #087d6a , #69bb1a);}
.body-content .sec-1 .bg5{ background-image: linear-gradient(to right, #03a5f2 , #2e3af7);}
.body-content .sec-1 .bg6{ background-image: linear-gradient(to right, #3d3adb , #7e12e2);}

/*--------------------------------------------------------------
# Card Radio Input
--------------------------------------------------------------*/
.card-radio label {
    width: 100%;
}
.card-input-element {
    display: none;
}
.card-input {
    margin: 10px;
    padding: 0px;
}
.card-input:hover {
    cursor: pointer;
}
.card-input-element:checked + .card-input {
    box-sizing: border-box;
    box-shadow: 0 0 2px 2px #FA0C25;
}
/*--------------------------------------------------------------
# Data Table
--------------------------------------------------------------*/
table, th, td {
/*  border: 1px solid Silver;*/
  border-collapse: collapse;
  font-size: 0.9rem;
}
.table tr {
  vertical-align: middle;
}
.table tbody tr:nth-child(even) {
  color: #000000;
  background-color: #FFFFFF;
}
.table tbody tr:nth-child(odd) {
  color: #000000;
  background-color: #F7F9F9;
}
.table tbody tr:hover {
  background-color: #D4F1E8;
}
.ledger-table thead th {
/*  background-color: #40E0D0;*/
  color: #000000;
}
.voucher-table thead th {
/*  background-color: #FFBF00;*/
  color: #000000;
}
.table-border-left {
  border-left: .5px solid Silver;
}
.table-border-right {
  border-right: .5px solid Silver;
}
.table-border-top {
  border-top: .5px solid Silver;
}
.table-border-bottom {
  border-bottom: .5px solid Silver;
}.table-border {
  border: .5px solid Silver;
}
.receipt {
/*  background-color: #E8F6F3 !important;*/
  color: #008000 !important;
  font-weight: bold;
}
.payment {
/*  background-color: #FDEDEC !important;*/
  color: #FF0000 !important;
  font-weight: bold;
}

/*--------------------------------------------------------------
# Virtual Print Page style
--------------------------------------------------------------*/
page[size="A4"] {
  background: white;
  width: 21cm;
  min-height: 29.7cm;
  display: block;
  margin: 0 auto;
  margin-bottom: 0.5cm;
  box-shadow: 0 0 0.5cm rgba(0,0,0,0.5);
}
@media print {
  body, page[size="A4"] {
    margin: 0;
    box-shadow: 0;
  }
}
/*--------------------------------------------------------------
# select2 Custom utility
--------------------------------------------------------------*/
/* Remove arrow from Select2 {.select2-no-arrow} */
.select2-no-arrow .select2-selection__arrow b{
  display:none !important;
}
/* Remove border from Select2 {.select2-no-border} */
.select2-no-border .select2-container .select2-selection--single {
  border: none;
  outline: none;
  box-shadow: none;
}
/* Optional: Remove the focus border {.select2-no-border} */
.select2-no-border .select2-container--default .select2-selection--single:focus {
  border: none;
  outline: none;
  box-shadow: none;
}
/* Set line-height or padding on select2 {.select2-fieldset} */
.select2-fieldset .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 0.5;
  padding: .375rem .3rem;
}