/* =================================================================
   Responsive Style Centralization
   This file manages all media queries and responsive behaviors.
   Load this file last to ensure its rules take precedence.
   ================================================================= */
.sidebar{
   background: #006666 !important;
}
.sidebar li.profile .designation{
   color:#fff!important;
}
.sidebar .nav-title{
   color:#ffffffd5!important;
   font-size:12px!important;
   font-weight:600!important;
}
.todo-modal-header i.bx.bx-x{
   background:transparent!important;
}
.leads-table .bg-alert{
   background-color: #ffe1e1 !important;
}
.leads-table .bg-alert:hover{
   background-color: #ffcece !important;
}
table.dataTable tbody tr:hover td{
   color:#000!important;
}
#leadslists.leads-table td:nth-child(2) strong{
   font-weight:500!important;
}
.leads-table th:last-child,.leads-table td:last-child{
   background:#f1f1f1!important;
}
@media(max-width:768px){
   .header-left{
      gap:6px!important;
   }
   .header-menu-btn{
      margin-right:0!important;
   }
   .header-page-title{
      font-size:15px!important;
   }
   .header-action-btn{
      padding:6px 8px!important;
   }
   .header-user-btn{
      gap:2px!important;
      padding:0!important;
   }
   .header-avatar{
      width:36px!important;
      height:36px!important;
   }
   .db-hero{
      border-radius:10px!important;
      padding:10px!important;
   }
   .db-kpi-card{
      border-radius:8px!important;
      padding:10px!important;
      gap:5px!important;
   }
   .db-kpi-icon{
      border-radius:5px!important;
      width:30px!important;
      height:30px!important;
   }
   .db-kpi-val{
      font-size:14px!important;
   }
   .db-kpi-label{
      font-size:10px!important;
   }
   .db-kpi-meta{
      padding:2px!important;
      font-size:10px!important;
   }
   .db-card{
      border-radius:10px!important;
   }
   .db-card-head{
      padding:10px!important;
   }
   .db-qa-grid{
      padding:10px!important;
   }
   .db-qa-btn{
      padding:8px 5px!important;
      font-size:10px!important;
      gap:5px!important;
      border-radius:5px!important;
   }
   .db-chart-wrap,.db-donut-wrap,.db-alert-row,.db-feed-item{
      padding:10px!important;
   }
   .select2-container--default .select2-selection--single .select2-selection__placeholder{
      font-size:14px!important;
   }
   .select2-container--default .select2-selection--single .select2-selection__arrow{
      height:35px!important;
   }
   .lb-select{
      max-width:100%!important;
   }
   .leads-toolbar-right{
      justify-content:space-between!important;
   }
   table.dataTable thead th,table.dataTable tbody td{
      padding:5px!important;
   }
   .lead-cb{
      width:12px!important;
      height:12px!important;
   }
   .cl-stat-card{
      border-radius:10px!important;
      padding:10px!important;
      gap:5px!important;
   }
   .cl-stat-icon{
      border-radius:5px!important;
      width:30px!important;
      height:30px!important;
   }
   .cl-stat-num{
      font-size:14px!important;
   }
   .pj-stat-row{
      grid-template-columns: 1fr 1fr!important;
   }
   .pj-stat-card{
      padding:10px!important;
      gap:5px!important;
      border-radius:10px!important;
   }
   .pj-stat-icon{
      width:30px!important;
      height:30px!important;
      border-radius:5px!important;
   }
   .pj-stat-num{
      font-size:14px!important;
   }
   div#lists_wrapper .row:first-child{
      padding:0!important;
      margin:0!important;
   }
   div#lists_wrapper .row:nth-child(1) [class*="col-"]:nth-child(1){
      width: 35% !important;
   }
   div#lists_wrapper .row:nth-child(1) [class*="col-"]:nth-child(2){
      width: 65% !important;
   }
   div#lists_wrapper .row:nth-child(1) [class*="col-"] label{
      display:block!important;
   }
   div#lists_wrapper .row:nth-child(1) [class*="col-"] label select.form-select.form-select-sm{
      width: 20% !important;
      position: absolute;
      left: 22px;
   }
   div#lists_wrapper .row:nth-child(1) [class*="col-"] label input.form-control.form-control-sm{
      position: absolute;
      right: 22px;
      width: 60% !important;
      border-radius:10px!important;
   }
   .dataTables_wrapper .dataTables_filter input{
      border-radius:10px!important;
   }
   .pr-stat-card,.inv-stat-card,.rv-stat-card{
      border-radius:10px!important;
      padding:10px!important;
      gap:5px!important;
   }
   .pr-stat-icon,.inv-stat-icon,.rv-stat-icon{
      width:36px!important;
      height:36px!important;
      border-radius:5px!important;
   }
   .pr-stat-count,.inv-stat-num,.rv-stat-num{
      font-size:14px!important;
   }
   #leadModal .ld-tab-nav{
      overflow:auto!important;
   }
   .leads-toolbar-left .form-select{
      border-radius:10px!important;
   }
   .table-btn{
      min-width:100%;
      max-width:100%;
      justify-content:space-around;
   }
   .modal-content{
      border-radius:10px!important;
   }
   .cf-modal-header,.modal-body{
      padding:10px!important;
      border-radius:0px!important;
   }
   .cf-nav-tabs .nav-link{
      padding:5px!important;
      font-size:14px!important;
   }
   .todo-modal-header,.todo-filters,.todo-list-wrap,.todo-footer{
      padding:10px!important;
   }
   .todo-progress-wrap{
      padding:5px 10px!important;
   }
   .m-none{
      display:none!important;
   }
   .leads-toolbar-left{
      flex-direction:row!important;
   }
   .leads-toolbar-left form,.lb-page-count{
      width:50%!important;
   }
   .ok-pipeline-total{
      border-radius:10px!important;
   }
   .create-label .lb-page-count{
      width:100%!important;
   }
   .leads-toolbar-right button{
      width:48%;
   }
   /* ── Invoice mp-steps stepper ── */
   .mp-steps{
      gap:4px!important;
      flex-wrap:nowrap!important;
      overflow-x:auto!important;
      padding-bottom:6px!important;
      justify-content:flex-start!important;
   }
   .mp-step{
      gap:4px!important;
      flex-shrink:0!important;
   }
   .mp-step-label{
      font-size:0.7rem!important;
      white-space:nowrap!important;
   }
   .mp-step-num{
      width:20px!important;
      height:20px!important;
      font-size:0.65rem!important;
   }
   .mp-step-line{
      width:20px!important;
      flex-shrink:0!important;
   }
   /* ── Invoice toolbar buttons ── */
   .leads-toolbar-right .inv-btn-draft,
   .leads-toolbar-right .inv-btn-save,
   .leads-toolbar-right .inv-btn-send{
      padding:6px 10px!important;
      font-size:0.75rem!important;
   }
}

/* ── Extra-small screens (≤480px) ── */
@media(max-width:480px){
   .mp-steps{
      justify-content:center!important;
      gap:6px!important;
   }
   .mp-step-label{
      display:none!important;
   }
   .mp-step-line{
      width:16px!important;
   }
   .leads-toolbar-right .inv-btn-draft,
   .leads-toolbar-right .inv-btn-save,
   .leads-toolbar-right .inv-btn-send{
      font-size:0.7rem!important;
      padding:5px 8px!important;
   }
}