body{background-color: #F1F5F9; font-family: Inter,sans-serif !important; font-size: 14px; font-weight: 500; line-height: 1.8;color: #212529;}
.q-header .logo{ float: left; margin-right: 24px;}


header{display: flex !important; align-items: center;}

.q-header .logo img{width:200px}

.page_header{background-color: #fff;}

.page_header h1{font-size: 26px;
line-height: normal;
margin-top: 15px;
font-weight: 700;}

.top_btn{float: right;}

.filters{display: flex; gap: 0px; width: 100%;align-items: center; }

.filters label {display: inline-block; vertical-align: middle; margin-right: 12px; font-weight: 600;}

.filters .q-checkbox__label{font-size: 14px;}

.q-table tbody td, .q-table tbody th, .q-table th{font-size: 14px !important;}

.q-table th{font-weight:600 !important;}

.q-table th, .q-table td{padding: 6px 10px !important;}

.product_line .q-table th, .product_line .q-table td{padding: 6px 4px !important;}

.form_row {margin: 0 -15px;}

.form_row .col-6  ,  .form_row .col-12{padding: 15px; padding-bottom: 0;}

.pl-0{padding-left: 0 !important;}

.pr-0{padding-right: 0 !important;}

/* .form_row .col-12 .col-6, .form_row .col-12 .col-12{padding: 0;} */

.form_row label {margin-bottom: 5px; display: block; color: #1e293b !important; }

.card_title{font-size: 16px !important;
line-height: normal !important;
font-weight: 600;
color: #000 !important;}

.card_title a{font-size: 14px; font-weight: normal; color: blue; text-decoration: underline;}

[type="text"]:focus, [type="email"]:focus, [type="url"]:focus, [type="password"]:focus, [type="number"]:focus, [type="date"]:focus, [type="datetime-local"]:focus, [type="month"]:focus, [type="search"]:focus, [type="tel"]:focus, [type="time"]:focus, [type="week"]:focus, [multiple]:focus, textarea:focus, select:focus {box-shadow: none !important;}

.pt-0{padding-top: 0 !important;}

.action_div{position: absolute; right:0px}

.footer_card{position: fixed !important; width: 100%; bottom: 0;}

.q-chip{padding-bottom: 9px;}


.top_navigation ul{float: left; margin: 0; padding: 0;}
.top_navigation ul li{float: left; margin: 0; padding:12px 6px; list-style: none;}

.top_navigation ul li a{display: block; height: 100%; padding: 0 10px; color: #fff; opacity: 0.7; }

.top_navigation ul li a:hover{opacity:1 ;}

.top_navigation ul li a span{vertical-align: bottom; margin-right: 6px; font-size: 20px;}

.logout_btn{position: absolute; right: 12px;}

.top_navigation ul li.has_submenu ul{position: absolute; width: 200px; z-index: 999;-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.06);
  -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.06); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.06); background-color: #fff; padding: 5px 0; border-radius: 5px;margin-left: 12px; margin-top: 12px; display: none;}
.top_navigation ul li.has_submenu ul li{position: relative; float: none;margin: 0; padding: 0;}

.top_navigation ul li.has_submenu ul li a{color: #000; display: block; padding-left: 1rem;   padding-right: 1rem;padding-top: 0.5rem;
  padding-bottom: 0.5rem; opacity: 1;}

  .top_navigation ul li.has_submenu ul li a:hover{background-color: #F9FAFB;}

  .top_navigation ul li.has_submenu:hover ul{display: block;}

  .top_navigation ul li.has_submenu{position: relative; margin-right: 12px}

  .top_navigation ul li.has_submenu:before {
    font-family: 'Material Icons Outlined';
    content: "expand_more";
    -webkit-font-feature-settings: 'liga';
    position: absolute; font-size: 20px; right: -10px;margin-top: -4px;opacity: 0.7;
  }
  .top_navigation ul li.has_submenu:hover:before {opacity: 1;}

  .mobile_menu_icon{display: none;}


  .q-chip{padding-bottom: 9px !important;}

  .view_grid_padding{padding: 20px;}

  .view_grid_padding .q-table__top{padding: 0;}

  .table-striped table tbody tr:nth-child(odd) {
  background-color: #f8fafb !important;
  }

  .q-table--vertical-separator td:first-child, .q-table--vertical-separator th:first-child, .q-table--cell-separator td:first-child, .q-table--cell-separator th:first-child{border-left: 1px solid rgba(0, 0, 0, 0.12) !important;}


  .q-table--vertical-separator td:last-child, .q-table--vertical-separator th:last-child, .q-table--cell-separator td:last-child, .q-table--cell-separator th:last-child{border-right: 1px solid rgba(0, 0, 0, 0.12) !important;}

/* new header ends */
.equal_width{align-items: flex-start;}
.equal_width > div{flex: 1 1 0px; }

.tbl_ftr_label label{display: inline-block; margin: 0;}

.tbl_ftr_label .q-field__native, .tbl_ftr_label  .q-field__input{text-align: right;}

.view_items .card_title{}

.my-sticky-header-table {
    /* height or max-height is important */
    max-height: 80vh;
    /* this is when the loading indicator appears */
    /* prevent scrolling behind sticky top row on focus */ }
    .my-sticky-header-table .q-table__top,
    .my-sticky-header-table .q-table__bottom,
    .my-sticky-header-table thead tr:first-child th {
      /* bg color is important for th; just specify one */
       }
    .my-sticky-header-table thead tr th {
      position: sticky;
      z-index: 1; background-color: #fff; }
    .my-sticky-header-table thead tr:first-child th {
      top: 0; }
    .my-sticky-header-table.q-table--loading thead tr:last-child th {
      /* height of all previous header rows */
      top: 48px; }
    .my-sticky-header-table tbody {
      /* height of all previous header rows */
      scroll-margin-top: 48px; }

.view_table{width: 100%;}


.view_table tr td,
.view_table tr th {
  padding: 10px; border: 1px solid rgba(0, 0, 0, 0.12) !important; text-align: left;
}

.view_table.h_border {border: 1px solid rgba(0, 0, 0, 0.12) !important;border-bottom: 0 !important; }

.view_table.h_border tr td,
.view_table.h_border tr th{border: 0 !important; border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;}

.view_table.h_border tr th{background-color: #eee !important;}

.view_table tr td.text-right,
.view_table tr th.text-right {
  text-align: right;
}
.table-striped tr:nth-child(even) {
  background-color: #f8fafb;
}

.total_font{font-size: 16px;}

.sticky_div{position: sticky; top: 150px;}

/* MENU */

.sidebar_menu ul {
    padding: 15px;
  }

  .sidebar_menu ul li ul{
      padding: 0 15px;
    }

  aside .material-icons-outlined {
    margin-right: 1rem;
    font-size: 26px;
    vertical-align: top;
    font-weight: 300;
    height: 26px;
    width: 26px;
  }

  .sidebar_menu ul li a {
    color: #fff;
    font-weight: 500;
    font-size: 16px;
    vertical-align: middle;
    padding: 0.55rem 0.75rem;
    border-radius: 0.5rem;
    display: flex;
    margin-bottom: 4px;
    text-decoration: none;
    margin-bottom: 12px;
  }

  .sidebar_menu ul li.current_menu_item a,
  .sidebar_menu ul li a:hover {
    color: #fff;
    background-color: #C0151B;
  }

  .has_sub_menu .sub_menu li a {
    padding-left: 39px !important;
  }

  .has_sub_menu .sub_menu {
    display: none;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
  }

  .has_sub_menu {
    position: relative;
  }

  .has_sub_menu:after {
    font-family: "Material Icons Round";
    content: "chevron_right";
    -webkit-font-feature-settings: "liga";
    float: left;
    font-size: 24px;
    color: #000;
    position: absolute;
    right: 6px;
    top: 4px;
    color: #fff;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    pointer-events: none;
  }

  .has_sub_menu.open_menu:after {
    transform: rotate(90deg);
  }

  .has_sub_menu.open_menu .sub_menu {
    display: block;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
  }


  #body_id .q-layout__section--marginal {
    background-color: #fff;
    color: #323232;
  }

  #body_id .q-drawer {
    background-color: #242424;
  }

  #body_id .page_header {
    background-color: #fff;
  }

  #body_id .page_header h1 {
    padding-bottom: 12px;
  }

  .side_table tr td:last-child{white-space: nowrap;}

.menu_open {margin-left: 12px; cursor: pointer;}

.menu_open div{ width: 35px;
    height: 3px;
    background-color: #323232;
    margin: 6px 0; border-radius: 4px;}

    .menu_open div:last-child{ width: 25px;}


    .gen_list li{margin: 4px 0;}

.icon_item{display: flex; gap: 14px;}

.icon_item {font-weight:400; font-size: 16px;}

.icon_item .material-icons-outlined{font-size: 40px; color: #A5A5A5;}
.icon_item .icon_val{font-weight: 600;}

.items_text{font-size: 18px !important;}

.eq_ht{height: 90%;}
.eq_ht .q-card{height: 100%;}

.q-field--with-bottom {
    padding-bottom: 10px !important;
  }


  .q-field--outlined.q-field--readonly .q-field__control::before {
    border-style: solid !important;
  }

  .dashboard_boxes h5{font-weight: 600; font-size: 20px !important; margin-bottom: 0; color: #000;}

.dashboard_boxes .date_text{font-size: 12px;}

.dashboard_boxes.brdr1 .date_text{color: #22c55e ;}

.brdr2{border-left: 4px #ef4444 solid !important;}

.dashboard_boxes.brdr2 .date_text{color: #ef4444 ;}

.count_value{display: block; font-size: 25px; line-height: normal; margin-top: 15px;}

.brdr3{border-left: 4px #473FCE solid !important;}

.dashboard_boxes.brdr3 .date_text{color: #473FCE ;}

  .dashboard_section.row{margin: 0 -12px;}

  .dashboard_section .cols-12 {padding: 0 12px}

  .dash_status_list{padding: 0 !important; margin: 0; margin-top: 24px; font-size: 16px;}
.dash_status_list li{padding: 0; margin: 0; list-style: none; padding-bottom: 10px; margin-bottom: 10px; border-bottom: #F1F5F9 1px solid; width: 45%; float: left; margin-right: 24px;}
.dash_status_list li span{font-weight: 600; color: #000; float: right;}

.dash_status_list li:nth-child(even){margin-right: 0; float: right;}

.chart_legend {float: right; margin-top: -15px;}
.chart_legend span {display: block;}
.chart_legend span.line1{color: #3CA3F4;}
.chart_legend span.line2{color: red;}

.dashboard_boxes{height: 100%;}

.dash_status_list.full_width li{float: none; width: 100%;}

body.desktop .q-focus-helper::after {
    background: #000 !important;
  }

  body.desktop .q-expansion-item .q-hoverable > div.q-focus-helper
  {
    background-color: #f6f7f7 !important;
    opacity: 1 !important;
    outline: 1px solid #dcdcde !important;

  }

  body.desktop .q-expansion-item .q-hoverable:hover > .q-focus-helper { background-color: #fff !important;opacity: 0.3 !important;}

  .nav_item_drag{margin:0px; list-style: none !important; left: 24px; position: relative;}

  .nav_item_drag .q-expansion-item {margin-bottom: 5px; width: 50%;}

  body .q-expansion-item [disabled] {cursor: pointer !important;opacity:1 !important}

.q-item__section{position: relative !important;}

  body [disabled] {
    opacity: 1 !important;
  }

  .w-100{width: 100% ;}

  body.desktop .q-expansion-item .remove_btn.q-hoverable > .q-focus-helper
  {
    opacity: 0 !important;
  }

  .q-card.nav_drag_section{ background-color: #f6f7f7 !important;
    opacity: 1 !important;
    box-shadow: -1px 1px 0px 0px #dcdcde, 1px 1px 0px 0px #dcdcde !important;
  }

  .sticky_top{position: sticky; top:100px; z-index: 99;}
  .sticky_left{position: sticky; top:180px; z-index: 99;}

  .sticky_last_column table th:last-child,
  .sticky_last_column table td:last-child{
    position: sticky;
    right: 0;background-color: #F8FAFB;

  }

  .sticky_last_column table th:last-child{background-color: #fff;}

.v-hidden{visibility: hidden;}

@media (max-width: 1400px) {

  .top_navigation ul li a{padding: 0 5px;}
  .w-48 {
    width: 11rem !important;
  }

}

@media (max-width: 1200px) {

  .mobile_menu_icon{display: block;}

  .mobile_menu_icon span{font-size: 40px;line-height: 24px;}

  .top_navigation ul{float: none;}

  .top_navigation ul li{padding:12px 0;}

  .top_navigation.top_menu{position: fixed; right: -200px;

    width: 200px;
    height: 100%;
    top: 60px;
    background-color: #0F172A;
    z-index: 9;-webkit-transition-duration: 0.1s;-moz-transition-duration: 0.1s;transition-duration: 0.1s; transition-delay: 0.1s;}

    .top_navigation.top_menu.show_menu{right: 0;-webkit-transition-duration: 0.1s;-moz-transition-duration: 0.1s;transition-duration: 0.1s; transition-delay: 0.1s;}


    .top_navigation.top_menu li{float: none;}

    .top_navigation ul li.has_submenu ul{position: relative;margin-left: 0px; border-radius: 0; }

     .top_navigation ul li.show_sub_menu ul{position: relative;margin-left: 0px; border-radius: 0; }



     .top_navigation ul li.has_submenu:hover ul{display: none;}

     .top_navigation ul li.has_submenu.show_sub_menu ul{display: block;}
     li.has_submenu > a{pointer-events: none;}

     .top_navigation ul li.mobile_menu_icon a span {
        font-size: 34px;
        line-height: 24px;
      }

}

@media (max-width: 768px) {
    .q-header .logo img {
        width: 90px;
      }

      .filters{flex-direction: column;}

      .filters > div {display: block; width: 100%;}

      .filters .w-48 {
        width: 100% !important; margin-top: 8px;
      }

      .filters .mr-2{margin-right: 0 !important;}

      .filters label{margin-top: 6px; margin-right: 0;}

      /* .w-48 {
        width: 8.3rem !important;
      } */

      .nav_item_drag .q-expansion-item {
        width: 70%;
      }

      .mar_lt_xs_0{margin-left: 0 !important;}
}

.sm-text-box {
  font-size: 12px;
}

.q-dialog__inner .q-table--no-wrap td{white-space: wrap !important;}

.state_list li{margin-bottom: 8px; padding-bottom: 8px; border-bottom: #F0F0F0 1px solid;}


.popup_dialog .card__actions:first-child{color: red !important;}

.order-timeline .text-primary{
  color  : unset !important;
}

.auto-complete .q-field__native span {
  display: none;
}

.font_normal{font-size: 16px; color: rgba(0, 0, 0, 0.6); }

.card_item .text-h6{font-weight: 600 !important; font-size: 24px;}

.q-markup-table thead th {background-color:#dcdcde;}

.order-timeline .q-timeline__subtitle { color : #000 !important; opacity: 0.6;}
.order-timeline .q-timeline__content { color : #000 !important;}

.stock-planner-alert-qty {
    position: absolute !important;
    z-index: 99;
    margin-top: -10px;
}

.bg-red.tooltip {
    background: red;
}


.chip_cnt .q-chip.q-chip--dense{padding: 0.5em 0.9em !important;}

.q-table .text-left.black--text.font-weight-bold{background-color: #eee; padding: 14px !important;}

.grey_out{background-color: #f8f9fa !important;}

.red_hint .q-field--disabled .q-field__messages.col{color: #C0151B !important;}

.received_data_table .q-field__bottom--animated{padding-top: 2px !important; min-height: 15px; }

.flex_div .flex_div_item{ align-items: center; gap: 12px; padding: 0 12px;}

.address_popup_window.fullscreen{ position: relative !important;}
.pac-container{z-index: 6001 !important;}
#body_id{top: 0 !important;}

.q-card__actions.justify-start.q-card__actions--horiz.row {left: 0;
  width: 100%;
  z-index: 9;
  position: fixed;
  bottom: 0;
  background-color: #fff;
  border-top: 1px solid #cdcdcd;

}

.q-card.mb-5{margin-bottom: 60px !important;}

.custom_option_style .q-radio{
    width: 100%;
  background-color: #fff;
  border-radius: 0.5rem;
  padding: 0.5rem 1rem;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
}

.item_completed{background-color: #1724A8; color: #fff;}

.status_bar{border-radius: 5px; overflow: hidden;}

.status_bar ul{display: table; width: 100%;}
.status_bar ul li{display: table-cell; text-align: center; position: relative; padding: 12px;
    font-size: 16px;}

.status_bar ul li span{position: absolute;
    right: 0;
    font-size: 28px;
  }

.download_link_item{display: inline-flex;
    padding: 8px 14px;
    justify-content: center;
    align-items: center;
    gap: 5px;border-radius: 10px; margin-left: 17px;}

.download_link_item span{font-size: 20px;}

.color1{ background: #F5E6FD;}
.color1 span{color: #BD69F5;}

.color2{ background: #E6EEFD;}
.color2 span{color: #3C7BEA;}

.order_header_right{float: right;}
.price_item{display: flex;
    padding: 10px 14px 10px 142px;
    justify-content: center;
    align-items: center;color: #000;
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-family: Inter;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 100% */
    gap: 5px;background: #F5F5F5; margin-bottom: 8px;}

.detail_item{border-right: rgba(0,0,0,0.1) 1px solid; line-height: 1.8; height: 100%;}

.no_brdr{border: 0 !important;}