/* port from old*/
.uline { text-decoration:line-through;}
.st-paid, .st-due, .st-partial, .st-canceled,.st-rejected,.st-pending,.st-accepted .st-Recurring,.st-Stopped
{
text-transform: capitalize;
    color: #fff;
    padding: 4px;
    border-radius: 11px;
    font-size: 10px;
}

.st-paid,.st-accepted
{
 background-color: #5ed45e;
}

.st-due,.st-Stopped
{
 background-color: #ff6262;
}

.st-partial,.st-pending,.st-Recurring
{
 background-color: #5da6fb;
}
.st-customer_approved
{
 background-color: #845dfb;
}
.st-canceled,.st-rejected
{
 background-color: #848030;
}
.task_Progress, .task_Due, .task_Done
{
text-transform: capitalize;
    color: #fff;
    padding: 4px;
    border-radius: 11px;
    font-size: 10px;
}
.task_Done
{
 background-color: #5ed45e;
}
.task_Due
{
 background-color: #d45e7f;
}
.task_Progress
{
 background-color: #848030;
}
.quantity {
  position: relative;
    padding: 2px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button
{
  -webkit-appearance: none;
  margin: 0;
}

input[type=number]
{
  -moz-appearance: textfield;
}

.quantity input {
    width: 70px;
    height: 34px;
    line-height: 1.45;
    float: left;
    display: block;
    padding: 0;
    margin-top: 3px;
    padding-left: 2px;
    border: 1px solid #eee;
}

.quantity input:focus {
  outline: 0;
}

.quantity-nav {
  float: left;
  position: relative;
  height: 42px;
}

.quantity-button {
  position: relative;
  cursor: pointer;
  border-left: 1px solid #eee;
  width: 20px;
  text-align: center;
  color: #333;
  font-size: 13px;
  font-family: "Trebuchet MS", Helvetica, sans-serif !important;
  line-height: 1.7;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

.quantity-button.quantity-up {
  position: absolute;
  height: 50%;
  top: 0;
  border-bottom: 1px solid #eee;
    background: #81ffa2;
}

.quantity-button.quantity-down {
  position: absolute;
  bottom: -1px;
  height: 50%;
    background: #ff9e9e;
}
.horizontal-layout.chat-application .app-content{
        min-height: calc(100% - 65px) !important;
}
.pos_stripe tbody tr:nth-child(4n+1),.pos_stripe tbody tr:nth-child(4n+2){
       background-repeat: repeat-x;
    background-image: linear-gradient(45deg, #3cb4f5, #b5e1f5);
}
.tfr td {
    padding: 10px;
}

ballsWaveG{
    position:relative;
    width:144px;
    height:34px;
    margin: 10px auto;
}

.ballsWaveG{
    position:absolute;
    top:0;
    background-color:rgb(4,162,219);
    width:18px;
    height:18px;
    animation-name:ballsWaveG;
    -o-animation-name:ballsWaveG;
    -ms-animation-name:ballsWaveG;
    -webkit-animation-name:ballsWaveG;
    -moz-animation-name:ballsWaveG;
    animation-duration:1.3s;
    -o-animation-duration:1.3s;
    -ms-animation-duration:1.3s;
    -webkit-animation-duration:1.3s;
    -moz-animation-duration:1.3s;
    animation-iteration-count:infinite;
    -o-animation-iteration-count:infinite;
    -ms-animation-iteration-count:infinite;
    -webkit-animation-iteration-count:infinite;
    -moz-animation-iteration-count:infinite;
    animation-direction:normal;
    -o-animation-direction:normal;
    -ms-animation-direction:normal;
    -webkit-animation-direction:normal;
    -moz-animation-direction:normal;
    border-radius:9px;
    -o-border-radius:9px;
    -ms-border-radius:9px;
    -webkit-border-radius:9px;
    -moz-border-radius:9px;
}

#ballsWaveG_1{
    left:0;
    animation-delay:0.52s;
    -o-animation-delay:0.52s;
    -ms-animation-delay:0.52s;
    -webkit-animation-delay:0.52s;
    -moz-animation-delay:0.52s;
}

#ballsWaveG_2{
    left:18px;
    animation-delay:0.65s;
    -o-animation-delay:0.65s;
    -ms-animation-delay:0.65s;
    -webkit-animation-delay:0.65s;
    -moz-animation-delay:0.65s;
}

#ballsWaveG_3{
    left:36px;
    animation-delay:0.78s;
    -o-animation-delay:0.78s;
    -ms-animation-delay:0.78s;
    -webkit-animation-delay:0.78s;
    -moz-animation-delay:0.78s;
}

#ballsWaveG_4{
    left:54px;
    animation-delay:0.91s;
    -o-animation-delay:0.91s;
    -ms-animation-delay:0.91s;
    -webkit-animation-delay:0.91s;
    -moz-animation-delay:0.91s;
}

#ballsWaveG_5{
    left:72px;
    animation-delay:1.04s;
    -o-animation-delay:1.04s;
    -ms-animation-delay:1.04s;
    -webkit-animation-delay:1.04s;
    -moz-animation-delay:1.04s;
}

@media (min-width: 768px) {
html[data-textdirection="ltr"] body.vertical-layout.vertical-menu-modern.menu-expanded > .app-content.content{
    margin-left: 240px !important;
}
html[data-textdirection="ltr"] body.vertical-layout.vertical-menu-modern.menu-collapsed > .app-content.content{
    margin-left: 60px !important;
}
html[data-textdirection="ltr"] body.vertical-layout.vertical-menu-modern.menu-hidden > .app-content.content,
html[data-textdirection="ltr"] body.vertical-layout.vertical-menu-modern.menu-hide > .app-content.content{
    margin-left: 0 !important;
}
}

html body.vertical-layout.vertical-menu-modern .main-menu .main-menu-content > #main-menu-navigation{
    margin-top: 3px;
}

#ballsWaveG_6{
    left:90px;
    animation-delay:1.17s;
    -o-animation-delay:1.17s;
    -ms-animation-delay:1.17s;
    -webkit-animation-delay:1.17s;
    -moz-animation-delay:1.17s;
}

#ballsWaveG_7{
    left:108px;
    animation-delay:1.3s;
    -o-animation-delay:1.3s;
    -ms-animation-delay:1.3s;
    -webkit-animation-delay:1.3s;
    -moz-animation-delay:1.3s;
}

#ballsWaveG_8{
    left:126px;
    animation-delay:1.43s;
    -o-animation-delay:1.43s;
    -ms-animation-delay:1.43s;
    -webkit-animation-delay:1.43s;
    -moz-animation-delay:1.43s;
}
.my_stripe tbody tr:nth-child(4n+1), .my_stripe tbody tr:nth-child(4n+2) {
    background-color: #ededed;
}
#productstable th, #productstable td,
#invoices th, #invoices td,
#quotes th, #quotes td {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#productstable, #invoices, #quotes { table-layout: fixed; }
#productstable th:nth-child(1), #productstable td:nth-child(1) { width: 60px; }
#productstable th:nth-child(2), #productstable td:nth-child(2) { width: 220px; }
#productstable th:nth-child(3), #productstable td:nth-child(3) { width: 120px; }
#productstable th:nth-child(4), #productstable td:nth-child(4) { width: 140px; }
#productstable th:nth-child(5), #productstable td:nth-child(5) { width: 80px; }
#productstable th:nth-child(6), #productstable td:nth-child(6) { width: 110px; }
#productstable th:nth-child(7), #productstable td:nth-child(7) { width: 110px; }
#productstable th:nth-child(8), #productstable td:nth-child(8) { width: 170px; }
#productstable td:nth-child(5), #productstable td:nth-child(6), #productstable td:nth-child(7) { text-align: right; }
#productstable td:nth-child(8) { text-align: center; overflow: visible; }
#invoices th:nth-child(1), #invoices td:nth-child(1) { width: 60px; }
#invoices th:nth-child(2), #invoices td:nth-child(2) { width: 76px; }
#invoices th:nth-child(3), #invoices td:nth-child(3) { width: 157px; }
#invoices th:nth-child(4), #invoices td:nth-child(4) { width: 77px; }
#invoices th:nth-child(5), #invoices td:nth-child(5) { width: 120px; }
#invoices th:nth-child(6), #invoices td:nth-child(6) { width: 74px; }
#invoices th:nth-child(7), #invoices td:nth-child(7) { width: 119px; }
#invoices th:nth-child(8), #invoices td:nth-child(8) { width: 170px; }
#invoices td:nth-child(8) { overflow: visible; }

/* Stock Return Tables */
#invoices_st th:nth-child(2), #invoices_st td:nth-child(2),
#invoices_stc th:nth-child(2), #invoices_stc td:nth-child(2),
#invoices_st_items th:nth-child(2), #invoices_st_items td:nth-child(2) { width: 76px; } /* SRN */

#invoices_st th:nth-child(3), #invoices_st td:nth-child(3),
#invoices_stc th:nth-child(3), #invoices_stc td:nth-child(3),
#invoices_st_items th:nth-child(3), #invoices_st_items td:nth-child(3) { width: 77px; } /* Date */

#invoices_st th:nth-child(4), #invoices_st td:nth-child(4),
#invoices_stc th:nth-child(4), #invoices_stc td:nth-child(4),
#invoices_st_items th:nth-child(4), #invoices_st_items td:nth-child(4) { width: 157px; } /* Supplier/Customer */

#invoices_st th:nth-child(12), #invoices_st td:nth-child(12),
#invoices_stc th:nth-child(12), #invoices_stc td:nth-child(12) { width: 74px; } /* Status */

#invoices_st th:nth-child(13), #invoices_st td:nth-child(13),
#invoices_stc th:nth-child(13), #invoices_stc td:nth-child(13) { width: 119px; } /* Settings */

#invoices_st_items th:nth-child(12), #invoices_st_items td:nth-child(12) { width: 119px; } /* Settings for Items Report */
#quotes th:nth-child(1), #quotes td:nth-child(1) { width: 60px; }
#quotes th:nth-child(2), #quotes td:nth-child(2) { width: 120px; }
#quotes th:nth-child(3), #quotes td:nth-child(3) { width: 220px; }
#quotes th:nth-child(4), #quotes td:nth-child(4) { width: 140px; }
#quotes th:nth-child(5), #quotes td:nth-child(5) { width: 120px; }
#quotes th:nth-child(6), #quotes td:nth-child(6) { width: 120px; }
#quotes th:nth-child(7), #quotes td:nth-child(7) { width: 120px; }
#quotes th:nth-child(8), #quotes td:nth-child(8) { width: 170px; }
#quotes td:nth-child(8) { overflow: visible; }
#productstable .dropdown-menu, #invoices .dropdown-menu, #quotes .dropdown-menu { z-index: 2000; }
#productstable thead th, #invoices thead th, #quotes thead th { background-color: #f8f9fa; font-weight: 600; }
#productstable tbody tr:hover, #invoices tbody tr:hover, #quotes tbody tr:hover { background-color: #f1f3f5; }
#productstable th, #productstable td, #invoices th, #invoices td, #quotes th, #quotes td { padding: 0.4rem 0.6rem; }
#productstable td:nth-child(6), #productstable td:nth-child(7), #productstable td:nth-child(8) { text-align: right; }
#productstable td:nth-child(9) { text-align: center; }
#invoices td:nth-child(4) { text-align: left; }
#invoices td:nth-child(5) { text-align: right; }
#invoices td:nth-child(7), #invoices td:nth-child(8) { text-align: center; }
#quotes td:nth-child(5) { text-align: left; }
#quotes td:nth-child(6) { text-align: right; }
#quotes td:nth-child(8) { text-align: center; }
.sub_c {
    background-color: #fff !important;
}
#customer-box-result ol,#supplier-box-result ol {
  color: #ccc;
  list-style-type: none;
}
#customer-box-result ol li,#supplier-box-result ol li  {
  position: relative;
  font-size:16px;
  font-weight:600;
  margin-top: 10px;
  margin-bottom: 5px;
}

#customer-box-result p,#supplier-box-result p {
  font-size: 14px;
  padding-left: 14px;
  color: #555;
}

#customer-box-result span,#supplier-box-result span {
  position: absolute;
}
.ui-front li {
    list-style: none;
    margin-left: -40px;
}
.ui-menu-item-wrapper {
    background-color: #b3d8e4;
    max-width: 60%;
    border-bottom: 1px solid #ddd;
    padding: 4px;
}
.st-sub2
{
 background-color: #5ed45e;
 padding:4pt;
 border-radius:2pt;
 color:#fff;
}
.st-sub3
{
 background-color: #5da6fb;
  padding:4pt;
 border-radius:2pt;
 color:#fff;
}
.st-sub4
{
 background-color: #fb5de8;
 padding:4pt;
 border-radius:2pt;
 color:#fff;
}
.has-error {
    color: #ff2a2a;
    border: 1px solid !important;
    padding: 0px;
}
.ui-helper-hidden-accessible { display:none; }
.project_Progress, .project_Pending, .project_Finished, .project_Waiting,.project_Terminated
{
text-transform: capitalize;
    color: #fff;
    padding: 4px;
    border-radius: 11px;
    font-size: 10px;
}
.project_Progress
{
 background-color: #4979d0;
}
.project_Finished
{
 background-color: #5ed45e;
}
.project_Waiting
{
 background-color: #d45e7f;
}
.project_Pending
{
 background-color: #49d0b7;
}
.project_Terminated
{
 background-color: #848030;
}
.timeline {
    list-style: none;
    padding: 20px 0 20px;
    position: relative;
}
.timeline:before {
    top: 0;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 3px;
    background-color: #eeeeee;
    left: 50%;
    margin-left: -1.5px;
}
.timeline > li {
    margin-bottom: 20px;
    position: relative;
}
.timeline > li:before,
.timeline > li:after {
    content: " ";
    display: table;
}
.timeline > li:after {
    clear: both;
}
.timeline > li:before,
.timeline > li:after {
    content: " ";
    display: table;
}
.timeline > li:after {
    clear: both;
}
.timeline > li > .timeline-panel {
    width: 50%;
    float: left;
    border: 1px solid #d4d4d4;
    border-radius: 2px;
    padding: 20px;
    position: relative;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
}
.timeline > li.timeline-inverted + li:not(.timeline-inverted),
.timeline > li:not(.timeline-inverted) + li.timeline-inverted {
    margin-top: -60px;
}

.timeline > li:not(.timeline-inverted) {
    padding-right:90px;
}

.timeline > li.timeline-inverted {
    padding-left:90px;
}
.timeline > li > .timeline-panel:before {
    position: absolute;
    top: 26px;
    right: -15px;
    display: inline-block;
    border-top: 15px solid transparent;
    border-left: 15px solid #ccc;
    border-right: 0 solid #ccc;
    border-bottom: 15px solid transparent;
    content: " ";
}
.timeline > li > .timeline-panel:after {
    position: absolute;
    top: 27px;
    right: -14px;
    display: inline-block;
    border-top: 14px solid transparent;
    border-left: 14px solid #fff;
    border-right: 0 solid #fff;
    border-bottom: 14px solid transparent;
    content: " ";
}
.timeline > li > .timeline-badge {
    color: #fff !important;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 1.4em;
    text-align: center;
    position: absolute;
    top: 16px;
    left: 50%;
    margin-left: -25px;
    background-color: #999999;
    z-index: 100;
    border-top-right-radius: 50%;
    border-top-left-radius: 50%;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
}
.timeline > li.timeline-inverted > .timeline-panel {
    float: right;
}
.timeline > li.timeline-inverted > .timeline-panel:before {
    border-left-width: 0;
    border-right-width: 15px;
    left: -15px;
    right: auto;
}
.timeline > li.timeline-inverted > .timeline-panel:after {
    border-left-width: 0;
    border-right-width: 14px;
    left: -14px;
    right: auto;
}
.timeline-badge.primary {
    background-color: #2e6da4 !important;
}
.timeline-badge.success {
    background-color: #3f903f !important;
}
.timeline-badge.warning {
    background-color: #f0ad4e !important;
}
.timeline-badge.danger {
    background-color: #d9534f !important;
}
.timeline-badge.info {
    background-color: #5bc0de !important;
}
.timeline-title {
    margin-top: 0;
    color: inherit;
}
.timeline-body > p,
.timeline-body > ul {
    margin-bottom: 0;
}
.timeline-body > p + p {
    margin-top: 5px;
}

.sbox-result ol {
  color: #ccc;
  list-style-type: none;
}
.sbox-result  p {
  font-size: 14px;
  padding-left: 14px;
  color: #555;
}

.sbox-result  span {
  position: absolute;
}
/* port from old end*/
.brand-logo {max-height: 2.5rem;}

@media (min-width: 992px) {
    .sidebar {
        vertical-align: top;
        width: 600px !important;
    }
    body .content-right {
    width: -webkit-calc(100% - 600px) !important;
    width: -moz-calc(100% - 600px) !important;
    width: calc(100% - 600px) !important;
    float: right;
}
.chat-application .chat-fixed-search {
    width: 600px !important;
}
.chat-application .chat-fixed-search input {
    width: 300px !important;
}
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .sidebar {
        vertical-align: top;
        width: 330px !important;
    }
    body .content-right {
    width: -webkit-calc(100% - 330px) !important;
    width: -moz-calc(100% - 330px) !important;
    width: calc(100% - 330px) !important;
    float: right;
}
.chat-application .chat-fixed-search {
    width: 330px !important;
}
}
@media (max-width: 767.98px) and (max-width: 576px) {
    .sidebar {
        vertical-align: top;
        width: 280px !important;
    }
    body .content-right {
    width: -webkit-calc(100% - 280px) !important;
    width: -moz-calc(100% - 280px) !important;
    width: calc(100% - 280px) !important;
    float: right;
}
.chat-application .chat-fixed-search {
    width: 280px !important;
}
}

#pos_items .row:nth-child(2n) {
    background-repeat: repeat-x;
    background-image:  linear-gradient(45deg, #e0eaf0, #f3f5f6);
}
.error{
    color:#CC0000;
}
.st-Waiting, .st-Solved, .st-Processing
{
text-transform: capitalize;
    color: #fff;
    padding: 4px;
    border-radius: 11px;
    font-size: 10px;
}
.st-Solved
{
 background-color: #5ed45e;
}
.st-Waiting
{
 background-color: #5da6fb;
}
.st-Processing
{
 background-color: #848030;
}

.navbar-wrapper {
    max-height: 8rem;
}
@media (min-width: 576px) {
    .navbar-expand-sm .navbar-nav .dropdown-menu {
        margin: 0;
    }
}
.dt-buttons {
   display: inline;
    margin-right: 1rem;
}
.dataTables_length{
    display: inline;
     margin-right: 1rem;
}
.dataTables_filter{
     display: inline;
    float: right;
}
.buttons-html5{
    padding: .2rem;
    background: #28b9ff;
}
/* Ensure modals display dropdowns properly */
.modal .dropdown-menu { z-index: 2050; }
#view_model .modal-body { overflow: visible; }
   .p-mobile {
        padding: 0.3rem !important;
    }
@media (max-width: 968px) {
    .p-mobile {
        padding: 0.3rem !important;
    }
    .p-width {
            width: 145% !important;
    }
}

.form-control-sm {
    height: -webkit-calc(1.375rem + 2px);
    height: -moz-calc(1.375rem + 2px);
    height: calc(1.375rem + 2px);
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1;
    border-radius: 0.21rem;
}

.dataTables_length select {
    padding-right: 15px;
}
.reverse_align {
    text-align: right;
}
.select2{
        min-width: 14rem;
}

/* Global template refresh */
:root{
    --so-accent:#2dd4bf;
    --so-accent-dark:#0f766e;
    --so-accent-soft:#5eead4;
    --so-gold:#1e3a8a;
    --so-bg:#f3f4f6;
    --so-bg-2:#f8fafc;
    --so-panel:#ffffff;
    --so-panel-soft:#f1f5f9;
    --so-border:rgba(30,58,138,.18);
    --so-text:#0f172a;
    --so-muted:#64748b;
    --so-sidebar:#0f172a;
    --so-sidebar-2:#1e293b;
    --so-shadow:0 12px 28px rgba(15,23,42,.12);
    --so-radius:14px;
    --so-font-body:"Manrope",sans-serif;
    --so-font-heading:"Sora",sans-serif;
}
html body.fixed-navbar{padding-top:0rem;}
body{
    background:linear-gradient(135deg,var(--so-bg),var(--so-bg-2));
    color:var(--so-text);
    font-family:var(--so-font-body);
}
h1,h2,h3,h4,h5,h6,.card-title,.content-header-title,.navbar-brand h2,.brand-text{
    font-family:var(--so-font-heading);
    letter-spacing:.2px;
}
a{color:var(--so-accent-dark);}
a:hover{color:var(--so-accent);}

/* Header */
.header-navbar,.header-navbar.navbar-semi-dark .navbar-header,.header-navbar.navbar-semi-dark .navbar-container{
    background:linear-gradient(180deg,var(--so-sidebar),var(--so-sidebar-2))!important;
    color:#e7f1f1!important;
    box-shadow:0 8px 24px rgba(5,15,18,.35);
    border-bottom:1px solid rgba(255,255,255,.08);
}
.header-navbar .navbar-brand,.header-navbar .navbar-brand h2,.header-navbar .nav-link,.header-navbar .nav-link i{
    color:#dbe7e7!important;
}
.header-navbar .nav-link:hover{
    color:#ffffff!important;
    background:rgba(255,255,255,.08);
    border-radius:12px;
}
.header-navbar .nav-item.active>.nav-link,.header-navbar .nav-link.active{
    background:linear-gradient(135deg,var(--so-gold),var(--so-accent))!important;
    color:#f8fafc!important;
    box-shadow:0 10px 22px rgba(30,58,138,.35);
    border-radius:12px;
}

/* Sidebar */
.main-menu{
    background:linear-gradient(180deg,var(--so-sidebar),var(--so-sidebar-2))!important;
    color:#e4f0ef!important;
    border-right:1px solid rgba(255,255,255,.06);
    box-shadow:6px 0 22px rgba(5,15,18,.35);
}
.main-menu .navigation>li>a{
    color:rgba(227,239,238,.7)!important;
    background:rgba(255,255,255,.02);
    margin:6px 10px;
    padding:12px 16px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,.04);
    transition:all .2s ease;
}
.main-menu .navigation>li>a:hover{
    background:rgba(255,255,255,.08);
    color:#ffffff!important;
}
.main-menu .navigation>li.active>a,.main-menu .navigation>li>a.active{
    background-color:#FFD700 !important
    color: #0c0b0b !important;
    box-shadow:0 10px 26px rgba(30,58,138,.35);
    border:1px solid rgba(30,58,138,.35);
}
.main-menu ul.menu-content{
    background:rgba(13,34,39,.75)!important;
    border:1px solid rgba(255,255,255,.08);
    border-radius:14px;
    margin:6px 14px 10px;
    padding:6px;
}
.main-menu ul.menu-content>li>a{
    color:rgba(227,239,238,.85)!important;
    border-radius:10px;
    padding:8px 14px 8px 28px;
    margin:6px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.05);
    transition:all .18s ease;
}
.main-menu ul.menu-content>li>a:hover{
    background:rgba(255,255,255,.1)!important;
    color:#ffffff!important;
    transform:translateX(2px);
}
.main-menu ul.menu-content>li.active>a, .main-menu ul.menu-content>li>a.active {
    background-color: #ffec85 !important;
    color: #0c0b0b !important;
    box-shadow: 0 10px 26px rgba(30, 58, 138, .35);
    border: 1px solid rgba(30, 58, 138, .35);
}

/* Cards */
.card{
    
    background:var(--so-panel);
    border:1px solid rgba(30,58,138,.12);
    border-radius:var(--so-radius);
    box-shadow:var(--so-shadow);
    transition:box-shadow .2s ease,transform .2s ease;
}
.card:hover{
    box-shadow:0 18px 40px rgba(7,20,24,.18);
    transform:translateY(-2px);
}
.card-header{
    background:linear-gradient(180deg,#ffffff,var(--so-panel-soft));
    border-bottom:1px solid rgba(30,58,138,.12);
    border-radius:var(--so-radius) var(--so-radius) 0 0!important;
    padding:1.2rem 1.5rem;
}
.card-title{color:var(--so-text);font-weight:700;}

/* Buttons */
.btn-primary,.btn-outline-primary{
    background-color: #FFD700 !important;
    border:1px solid var(--so-accent-dark);
    color:#ffffff;
    box-shadow:0 10px 24px rgba(30,58,138,.35);
    transition:all .2s ease;
}
.btn-primary:hover,.btn-primary:focus,.btn-outline-primary:hover,.btn-outline-primary:focus{
    background:linear-gradient(135deg,var(--so-accent-dark),#1e3a8a)!important;
    border-color:#1e3a8a!important;
    color:#ffffff!important;
    box-shadow:0 14px 30px rgba(30,58,138,.4);
}
.btn-secondary{
    background:var(--so-gold);
    border-color:var(--so-gold);
    color:#ffffff;
    box-shadow:0 10px 22px rgba(30,58,138,.3);
}
.btn-secondary:hover{
    background:#172b6b;
    border-color:#172b6b;
    color:#ffffff;
}

/* Forms */
.form-control{
    border:1px solid var(--so-border);
    border-radius:10px;
    padding:.7rem 1rem;
    background:#ffffff;
    color:var(--so-text);
    transition:box-shadow .2s ease,border-color .2s ease;
}
.form-control:focus{
    border-color:var(--so-accent)!important;
    box-shadow:0 0 0 3px rgba(45,212,191,.2)!important;
    outline:none;
}
.form-control::placeholder{color:#9aa6a8;}

/* Tables */
.table{background:transparent;border-collapse:separate;border-spacing:0 10px;border:none;}
.table thead th{
    background:linear-gradient(135deg,#f7f9fb,#f8fafc);
    color:#000000;
    font-weight:700;
    text-transform:uppercase;
    font-size:1rem;
    letter-spacing:.8px;
    border:none;
    padding:1rem 1.4rem;
}
.table tbody tr{
    background:#ffffff;
    box-shadow:0 8px 22px rgba(7,20,24,.08);
    /* transition:transform .2s ease,box-shadow .2s ease; */
}
.table tbody tr:hover{
    /* transform:translateY(-2px); */
    box-shadow:0 12px 28px rgba(7,20,24,.14);
    z-index: 100;
}
 .table tbody td{
     padding:1rem 1.4rem;
     vertical-align:middle;
     color:var(--so-text);
     border:none;
 }
 .table tbody td:last-child {
     white-space: nowrap;
 }
 .dropdown-menu {
     z-index: 1050;
 }
 .btn{
     border-radius:12px;
     transition:box-shadow .15s ease, transform .15s ease;
 }
 .btn:hover{
     transform:translateY(-1px);
     box-shadow:0 10px 22px rgba(15,23,42,.12);
 }
 .btn-sm{
     padding:.35rem .6rem;
     line-height:1.1;
     border-radius:10px;
 }
 .btn-success{
     background:#16a34a;
     border:none;
 }
 .btn-success:hover{
     background:#15803d;
 }
 .btn-primary{
     background:#2563eb;
     border:none;
 }
 .btn-primary:hover{
     background:#1d4ed8;
 }
 .btn-pink{
     background:#ec4899;
     border:none;
     color:#ffffff;
 }
 .btn-pink:hover{
     background:#db2777;
 }
 .btn-indigo{
     background:#4f46e5;
     border:none;
     color:#ffffff;
 }
 .btn-indigo:hover{
     background:#4338ca;
 }
 .dropdown-menu{
     border-radius:12px;
     border:1px solid var(--so-border);
     box-shadow:0 18px 40px rgba(15,23,42,.16);
     overflow:hidden;
 }
 .dropdown-item{
     padding:.6rem 1rem;
 }
 .dropdown-item:hover{
     background:#f1f5f9;
     color:#0f172a;
 }
 .modal {
     z-index: 1060 !important;
 }
 .modal-backdrop {
     z-index: 1055 !important;
 }
 .modal.fade{opacity:1!important;}
 .modal.show .modal-dialog{transform:none!important;}
 .modal.fade .modal-dialog{transition:none!important;}
 .modal-backdrop.fade{opacity:.35!important;}
 .modal.delete-confirmation .modal-dialog{
     max-width: 420px;
 }
 .modal.delete-confirmation .modal-content{
     border-radius: var(--so-radius);
     box-shadow: var(--so-shadow);
     border:1px solid var(--so-border);
     overflow:hidden;
 }
 .modal.delete-confirmation .modal-header{
     background:linear-gradient(135deg,var(--so-gold),var(--so-accent));
     color:#ffffff;
     border-bottom:none;
 }
 .modal.delete-confirmation .modal-title{
     font-weight:700;
 }
 .modal.delete-confirmation .modal-body{
     background:var(--so-panel);
     color:var(--so-text);
     font-size:1rem;
 }
 .modal.delete-confirmation .modal-footer{
     background:var(--so-panel-soft);
     border-top:1px solid var(--so-border);
 }
 .modal.delete-confirmation .btn-danger{
     background:#dc3545;
     border:none;
     box-shadow:0 8px 20px rgba(220,53,69,.35);
 }
 .modal.delete-confirmation .btn-secondary{
     background:#e2e8f0;
     color:#0f172a;
     border:none;
 }
 .modal.view-modal .modal-content{
     border-radius: var(--so-radius);
     box-shadow: var(--so-shadow);
     border:1px solid var(--so-border);
 }
 .modal.view-modal .modal-header{
     background:linear-gradient(135deg,#0f766e,#2dd4bf);
     color:#ffffff;
     border-bottom:none;
 }
 .modal.view-modal .modal-title{
     font-weight:700;
 }
 .modal.view-modal .modal-body{
     background:var(--so-panel);
     color:var(--so-text);
 }
 .modal.view-modal .modal-footer{
     background:var(--so-panel-soft);
     border-top:1px solid var(--so-border);
 }
#productstable,#po,#invoices,#quotes{
     border-collapse:separate;
     border-spacing:0 12px;
 }
#productstable tbody td:last-child,#po tbody td:last-child,#invoices tbody td:last-child,#quotes tbody td:last-child{
     display:flex;
     align-items:center;
     gap:8px;
 }
#productstable .btn,#po .btn,#invoices .btn,#quotes .btn{
     border-radius:10px;
 }
#productstable .btn-group,#po .btn-group,#invoices .btn-group,#quotes .btn-group{
     margin:0 2px;
 }
 .dataTables_wrapper .dataTables_filter input{
     border:1px solid var(--so-border);
     border-radius:12px;
     padding:8px 12px;
     background:#ffffff;
 }
 .dataTables_wrapper .dataTables_length select{
     border:1px solid var(--so-border);
     border-radius:10px;
     background:#ffffff;
 }
 .dataTables_wrapper .dt-buttons .btn{
     border-radius:8px;
     background:var(--so-accent);
     color:#ffffff;
     border:none;
 }
 .dataTables_wrapper .dataTables_paginate .paginate_button{
     border-radius:8px;
     background:#ffffff;
     border:1px solid var(--so-border);
     margin:0 2px;
 }
 .dataTables_wrapper .dataTables_paginate .paginate_button.current{
     background:var(--so-accent);
     color:#ffffff !important;
 }
 
 /* Badges */
.badge-primary{background:var(--so-accent);color:#ffffff;}
.badge-secondary{background:#e9f0ef;color:var(--so-text);}
.badge-warning{background:var(--so-gold);color:#ffffff;}

/* Login area to match global palette */
.login-page-container{
    background:linear-gradient(210deg,rgba(8,12,17,.82),rgba(8,12,17,.78)),var(--login-bg-image,none);
}
.login-card{
    background:linear-gradient(180deg,rgba(17,44,50,.92),rgba(9,28,33,.95));
    border:1px solid rgba(255,255,255,.12);
    box-shadow:0 24px 52px rgba(0,0,0,.55);
}
.login-input-group:focus-within{
    border-color:var(--so-accent);
    box-shadow:0 14px 30px rgba(45,212,191,.28);
}
.login-btn-primary{
    background:linear-gradient(120deg,var(--so-gold),var(--so-accent));
    box-shadow:0 16px 36px rgba(30,58,138,.35);
}

/* Dashboard layout */
.dp-stats-card{
    display:flex;
    align-items:center;
    gap:16px;
    padding:18px 20px;
    border-radius:16px;
    background:linear-gradient(160deg,#ffffff,var(--so-panel-soft));
    border:1px solid rgba(30,58,138,.12);
    box-shadow:0 12px 26px rgba(12,20,22,.08);
    min-height:96px;
}
.dp-stats-icon{
    width: 54px;
    height: 54px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(255 215 0);
    color: #ffffff;
    font-size: 20px;
}
.dp-stats-icon-warning{    background: rgb(252 212 0);
    color: #ffffff;}
.dp-stats-icon-info{    background: rgb(252 212 0);
    color: #ffffff;}
.dp-stats-icon-amber{    background: rgb(252 212 0);
    color: #ffffff;}
.dp-stats-meta{flex:1;min-width:0;}
.dp-stats-label{
    margin:0 0 6px;
    color:var(--so-muted);
    font-size:.85rem;
    text-transform:uppercase;
    letter-spacing:.6px;
    font-weight:600;
}
.dp-stats-value{
    margin:0;
    font-weight:700;
    color:var(--so-text);
    display:flex;
    align-items:center;
    gap:8px;
    font-size:1.15rem;
}
.dp-panel{
    border-radius:16px;
    overflow:hidden;
}
.dp-top-row{
    margin-top:0%;
}
@media (min-width: 1200px){
    .col-xl-4{
       
        -webkit-box-flex:0;
        -webkit-flex:0 0 33.33333%;
        -moz-box-flex:0;
        -ms-flex:0 0 33.33333%;
        flex:0 0 33.33333%;
        max-width:33.33333%;
    }
}
.dp-card-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:18px 20px;
    background:linear-gradient(180deg,#ffffff,var(--so-panel-soft));
    border-bottom:1px solid rgba(30,58,138,.12);
}
.dp-section-label{
    margin:0 0 6px;
    font-size:.75rem;
    color:var(--so-muted);
    text-transform:uppercase;
    letter-spacing:.7px;
    font-weight:700;
}
.dp-header-actions{
    display:flex;
    align-items:center;
    gap:10px;
}
.dp-toggle-group .btn{
    border-radius:12px;
    padding:.4rem .75rem;
    font-weight:600;
}
.dp-toggle-group .btn.active{
    background:linear-gradient(135deg,var(--so-gold),var(--so-accent));
    border-color:transparent;
    color:#f8fafc;
    box-shadow:0 8px 18px rgba(30,58,138,.35);
}
#dashboard-product-sales-chart{
    min-height:300px;
}
.dashboard-metric{
    padding:10px;
    border-radius:12px;
    background:var(--so-panel-soft);
    border:1px solid rgba(30,58,138,.12);
}
@media (max-width: 991.98px){
    .dp-card-header{
        flex-direction:column;
        align-items:flex-start;
    }
}
/* Quote create polish */
.inner-cmp-pnl{
    padding:14px 16px;
    border-radius:12px;
    background:var(--so-panel);
    border:1px solid rgba(30,58,138,.12);
}
.item_header{
    background:linear-gradient(135deg,#e0f2fe,#f8fafc)!important;
    color:#0f172a!important;
}
.tfr.my_stripe{
    width:100%;
}
.tfr.my_stripe thead th{
    padding:.8rem 1rem;
    font-weight:700;
    border:none;
}
.tfr.my_stripe tbody td{
    padding:.6rem .8rem;
    border:none;
}
.dp-panel .card-body .form-group .form-control[disabled]{
    background:#f8fafc;
    color:#334155;
}
/* Global add-form card polish */
.content-body .card{
    border-radius:16px;
    background:linear-gradient(160deg,#ffffff,var(--so-panel-soft));
    border:1px solid rgba(30,58,138,.12);
    box-shadow:0 12px 26px rgba(12,20,22,.08);
    overflow:hidden;
}
.content-body .card .card-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:18px 20px;
    background:linear-gradient(180deg,#ffffff,var(--so-panel-soft));
    border-bottom:1px solid rgba(30,58,138,.12);
}
.content-body .card .card-header .card-title,
.content-body .card .card-header h5{
    margin:0;
    font-size:1.1rem;
    font-weight:700;
    color:var(--so-text);
}
.content-body .card .card-body{
    padding:18px 20px;
}
.form-subtext{
    display:block;
    margin-top:4px;
    color:var(--so-muted);
    font-size:.85rem;
}
.nav-tabs{
    border-bottom:1px solid var(--so-border);
}
.nav-tabs .nav-link{
    border:none!important;
    border-radius:10px 10px 0 0;
    color:var(--so-text);
    padding:.5rem .9rem;
    margin-right:4px;
    background:#eef2f7;
}
.nav-tabs .nav-link.active{
    background:linear-gradient(135deg,#e0f2fe,#f8fafc);
    color:#0f172a;
    box-shadow:0 8px 18px rgba(30,58,138,.14);
}
.input-group-addon, .input-group-text{
    background:#f1f5f9;
    border:1px solid var(--so-border);
    color:#0f172a;
    border-radius:10px;
}
.sub-btn{
    border-radius:12px;
    padding:.55rem 1.1rem;
    font-weight:700;
}