/* =================== Max Width Media Query =================== */
@media only screen and (max-width: 1679.98px) {
  .filter .filter-left.left-20, .filter .filter-right.left-20 , .filter .center-col.left-20 { width: calc(33.333% - 20px); }
}

@media only screen and (max-width: 1599.98px) {
  /* Login Content */
  .login-content .login-left .login-wrap { padding: 60px 30px 40px 30px; }
  .login-content .login-left .login-middle { margin: 40px 0 30px 0; }
  .login-content .login-right-centered { max-width: 700px; }
   /* Work Crew */
   .crew-card{ padding: 24px 16px; }
   .crew-card .crew-image{ width: 60px; height: 60px; }
   .crew-card .crew-details{  width:calc(100% - 60px); padding-left: 10px;}
   .crew-card .crew-name{font-size: 16px;}
   .crew-card .crew-subtitle{font-size: 14px; }
}

@media only screen and (max-width: 1499.98px) {
  /* Bootstrap Select Dropdown */
  .with-number .c-code { width: 80px; }
  /* Header */
  header .logo a { width: 280px; }
  /* Card */
  .card .card-head, .card .card-body { padding: 20px; }
  /* Avtar */
  .avatar-upload { max-width: 370px; }
  .avatar-upload .avatar-preview { width: 120px; height: 120px; }
  /* Circuits Card */
  .circuits-row > div { flex: 0 0 50%; max-width: 50%; }
  /* Sidebar */
  #sidebar { min-width: 280px; max-width: 280px; padding: 20px 0 0 20px; }
  #sidebar ul li a .svg-icon { min-width: 42px; }
  /* Filter */
  .filter .cate-dropdown { margin-inline-start: 15px; }
  .filter .cate-dropdown .nice-select { padding-inline-start: 18px; }
  .filter .filter-button .btn + .btn { margin-inline-start: 15px; }
  /* Table Responsive */
  .table-responsive .table thead th:first-child { padding-inline-start: 20px; }
  .table-responsive .table thead th:last-child { padding-inline-end: 20px; }
  .table-responsive .table td:first-child { padding-inline-start: 20px; }
  .table-responsive .table td:last-child { padding-inline-end: 20px; }
  .table-responsive .table tbody td:last-of-type { padding-inline-end: 20px; }
  .table-responsive.users-list thead th:first-child { padding-inline-start: 83px; }
  /* Users SWMS Table */
  .table-responsive.users-swms-list thead th:first-child { min-width: 420px; }
  /* Subscribe Plan Table */
  .table-responsive.subsc-plan thead th:nth-child(5) { min-width: 400px; }
  /* Action Dropdown */
  .action-dropdown .dropdown-menu { left: -40px !important; }
  .action-dropdown .dropdown-menu::before { left: auto; right: -6px; transform: rotate(180deg); margin-top: -7px; }
  /* Contact Us */
  .contact-us .c-column { width: 34%; margin-inline-end: 2.9%; }
  .contact-us .c-column.phone-column { width: 22%; }
  /* Chart Card */
  .custom-pagination{padding: 0 20px;}
}

@media only screen and (max-width: 1439.98px) {
  /* Permit Chart Row */
  .card-header-inner  { flex-wrap: wrap; }
  .document-photos-wrapper { gap: 20px;}
  .document-photo { width: calc(20% - 16px);}
  /* Import Data */
  .import-data-inner { margin-top: 70px; }
  .smartphone { width: 320px; height: 600px; }
  .smartphone .content {max-height: 480px;}
  .rounded-corners-background-details {height: 120px; width: 120px;}
}

@media only screen and (max-width: 1399.98px) {
  .handover-header-info{ max-width: 100%; }
}

@media only screen and (max-width: 1199.98px) {
  .dash-card{padding: 20px;}
  .dash-card-row .col {margin-bottom: 24px;}
  .dash-card .dash-icon {width: 50px; height: 50px;}
  .dash-card .dash-icon svg {width: 22px; height: 22px;}
  /* Form Control */
  .form-control { padding: 0 15px; }
  textarea.form-control { padding: 12px 15px; }
  .spin-button::before, .spin-button::after {right: 15px;}
  /* Nice Select */
  .nice-select { padding: 0 15px; }
  /* Bootstrap Select Dropdown */
  .bootstrap-select.dropdown .dropdown-toggle {padding-inline-start: 15px;}
  .with-number .c-code { width: 50px; padding: 0 10px;}
  /* Custom Checkbox */
  .radio-check [type="radio"] + label::after { top: 6px !important;}
  /* Content Box */
  .content-box { width: 100%; padding: 22px 15px 15px 70px !important; }
  .sidebar-hidden .content-box { padding: 22px 15px 15px 70px !important; }
  /* Card */
  .card .card-head { gap: 17px; }
  /* Circuits Card */
  .circuits-row > div { flex: 0 0 100%; max-width: 100%; }
  /* Notification */
  .notification .notify-row { padding: 14px 20px; }
  /* Header */
  header .logo a { width: 240px; }
  header .header-right {padding-inline-end: 20px;}
  .breadcrumb-group {margin-inline-start: 20px;}
  /* User Details */
  .user-detail { gap: 12px; margin-bottom: 15px;}
  .user-detail .user-image { width: 55px; height: 55px; border-width: 4px; }
  /* Sidebar */
  #sidebar { min-width: 240px; max-width: 240px; padding: 20px 0 0 16px; }
  .filter .filter-left.left-25,.center-col{width: 49% !important;}
  .filter .center-col .worklot-col{width: 100%;}
  .avatar-upload .avatar-content{width: 100%;}
  .my-profile .avatar-upload .avatar-content{width: calc(100% - 136px);}
  .update-itc{margin-top: 15px;}
  .update-itc button{float: none !important;}
  .project-admin-form .upload-photo .card-body .avatar-upload{width: 300px;}
  .project-admin-form .upload-photo .card-body .avatar-upload .avatar-content {padding-inline-start: 0px;margin-top: 20px;}
  #sidebar ul li .dropdown-toggle::after { right: 20px; }
  #sidebar ul li a .svg-icon { min-width: 38px; }
  #sidebar ul li a .svg-icon svg { width: 22px; height: 22px; }
  #sidebar ul ul { padding-inline-start: 25px; }
  /* Search Box */
  .search-box .search-icon { left: 16px; }
  .search-box .dataTables_filter input { padding: 0 15px; padding-inline-start: 40px; }
  /* Filter */
  .filter .filter-left.left-20 , .filter .center-col.left-20 { width: calc(50% - 11px); }
  .filter .filter-left { width: 33.33333%; }
  .filter .cate-dropdown { margin-inline-start: 18px; }
  .filter .filter-button .btn { padding: 5px 14px; }
  /* My Profile */
  .my-profile .profile-left { width: 120px; }
  .my-profile .profile-image { width: 120px; height: 120px; }
  .my-profile .profile-right { width: calc(100% - 120px); padding-inline-start: 30px; }
  /* Contact Us */
  .contact-us .c-column { width: 44%; }
  .contact-us .c-column.phone-column { width: 44%; }
  /* Dash Card */
  .dash-card-row > div { flex: 0 0 50%; max-width: 50%; }
  .inspection-items-wrapper { flex-wrap: wrap; gap: 20px; }
  .hot-work-table .custom-head { font-size: 18px; }
  .hot-work-table .task-title h3 { font-size: 16px; }
  .drawing_inner { height: 600px !important; }
  .user-guide-banner{ margin-left: -15px; width: calc(100% + 30px);padding: 100px 60px;}
  .handover-topbar{width: calc(100% + 8px + 15px);margin: -21px 0 16px -8px;}
}

@media only screen and (max-width: 1023.98px) {
   /* Data Table Wrapper */
  .custom-pagination { justify-content: center; }
  .filter-totalbox {width: 70px;}
  .auth-page-wrapper .auth-aside { display: none; }
  .auth-page-wrapper .auth-body{ width: 100%;padding: 24px;}
  .form-control.form-control-lg{ height: 42px;font-size: 14px; }
  .select-lg .bootstrap-select.dropdown .dropdown-toggle{ height: 42px; line-height: 42px; font-size: 14px; }
  .btn-md { height: 42px;font-size: 14px; }
  .custom-radiobox .radio-label{font-size: 14px;}
}

@media only screen and (max-width: 991.98px) {
  .breadcrumb-group {margin-inline-start: 15px;}
  header .header-right {padding-inline-end: 15px;}
  /* Multi Select Wrapper */
  .all-widget-area-sec .ui-state-default,.all-widget-area-sec .submit-widget {margin-top: 15px;}
  .import-data-inner { margin-top: 50px; }
  .import-data-inner .form-container {margin: 30px 0;}
  /* Custom CheckBox */
  .custom-checkbox.control-check, .endorsements .check-wrap { width: 100%; }
  /* Form Builder */
  .inspection-items-wrapper .row-elment:first-of-type{padding-top: 0;}
  .row-elment{ padding: 30px 30px 30px 0;border-bottom: 1px solid var(--bs-border-table);position: relative;}
  .remove-row-btn{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: auto; padding: 0; margin: 0;}
  /* User Card */
  .user-card-outer .card {width: 100%;}
  /* Custom fileinput */
  .custom-fileinput .custom-fileinput-label{ width: 80px; height: 80px;font-size: 34px; }
  .btn-min-150{ min-width: auto; }
  .login-tabs .nav-link{ font-size: 14px; }
  /* .title-block-left{ width: 100%; } */
  /* .title-block-right{ width: 100%; } */
  .permit-row .iso-row{ flex-basis: 50%; }
  .iso-row.punch-details-block{ flex-basis: 100% !important; }
  .user-guide-banner .shape{border-width: 80px 200vw 0 0; }
  .iso-content.punch-photo{
    grid-template-columns: repeat(3, 1fr);
  }
  .auth-page-wrapper .auth-body{ padding: 24px 16px; }
}

@media only screen and (max-width: 767.98px) {
  *::-webkit-scrollbar {width: 5px; height: 5px; }
  .text-body-emphasis {font-size: 20px;}
  .card .card-head, .card .card-body {padding: 15px;}
  .card .card-head {gap: 14px;}
  .form-group {margin-bottom: 15px;}
  .form-group label, .worklot-col label {margin-bottom: 4px;font-size: 11px; line-height: 16px;}
  .dash-card {flex-wrap: wrap;}
  .dash-card .dash-icon {width: 44px; height: 44px;}
  .dash-card .dash-icon svg {width: 20px; height: 20px;}
  .dash-card-row > div { flex: 0 0 100%; max-width: 100%; }
  .title-block {margin-bottom: 10px;}
  /* Button */
  .btn.btn-sm, .btn-group-sm > .btn { padding: 10px 14px; }
  .dash-card .counter-co { font-size: 16px;}
  .permit-btn-wrapper {gap: 10px;}
  .permit-btn-wrapper .btn {padding: 8px 12px;}
  /* Form Group */
  .form-control { height: 36px; font-size: 12px;}
  .form-group .with-icon .input-icon img{max-width: 16px;}
  .extra-filter label{font-size: 11px; line-height: 16px;}
  .nice-select {line-height: 34px;}
  textarea.form-control { height: 70px; }
  .login-content .login-left .form-control{height: 44px;}
  /* Bootstrap Select Dropdown */
  .bootstrap-select.dropdown .dropdown-toggle { height: 36px; line-height: 36px; font-size: 12px;}
  .bootstrap-select.dropdown .dropdown-menu .dropdown-item{ font-size: 12px; padding: 4px 12px; }
  .first-table .bootstrap-select.dropdown, .cable-itr .bootstrap-select.dropdown, .select-container.bootstrap-select.dropdown, .parent-child-select-container.bootstrap-select.dropdown {width: 250px !important;}
  .select-project-container.bootstrap-select.dropdown {width: 150px !important;}
  /* Custom Checkbox */
  .custom-selectbox [type="checkbox"] + label span {width: 22px; height: 22px;}
  .custom-selectbox [type="checkbox"] + label span::before { width: 22px; height: 22px; }
  .custom-selectbox [type="checkbox"] + label span::after { width: 14px; height: 14px; }
  .custom-checkbox.control-check .control-input { width: 60px; }
  .custom-checkbox.control-check [type="checkbox"] + label::after { width: 16px; height: 16px; }
  /* Permit Checkboxes */
  .permit-checkboxes .custom-checkbox label { padding-top: 0; }
  /* Notification */
  .notification .notify-row .notify-content { max-width: 800px; width: 100%; }
  .notification .notify-row .notify-date { font-size: 0.875rem; margin-top: 10px; }
  .required-margin { margin-top: 10px; }
  /* Isolation */
  .iso-row .iso-lable { width: 100%; }
  .iso-row .iso-content { width: 100%; padding-inline-start: 0; }
  /* Step Card */
  .step-card .card-body { flex-wrap: wrap; }
  .step-card .step-title, .step-card .step-content, .step-card .step-access, .step-card .step-status { width: 100%; margin-bottom: 10px; }
  /* Header */
  header .user-right .dropdown-menu { top: 50px !important; }
  /* Search Box */
  .search-box .search-icon {max-width: 15px; }
  .search-box .dataTables_filter input { height: 36px; font-size: 12px; }
  /* Filter */
  .filter .card-head { padding: 15px; }
  .filter .filter-right { width: 100%;}
  .filter .filter-button .btn { padding: 5px 10px; height: 36px; font-size: 12px;}
  /* Table Responsive */
  .table-responsive .table thead th:first-child { padding-inline-start: 15px; }
  .table-responsive .table thead th:last-child { padding-inline-end: 15px; }
  .table-responsive .table td { padding: 12px; }
  .table-responsive .table td:first-child { padding-inline-start: 15px; }
  .table-responsive .table td:last-child { padding-inline-end: 15px; }
  .nav-tabs .nav-item, .data-table-tabs-sec .nav-tabs .nav-item .nav-link {height: 35px;}
  .data-table-tabs-sec .nav-tabs .nav-item .nav-link {padding: 6px 14px;}
  .nav-tabs::-webkit-scrollbar {height: 3px;}
  /* Data Table Wrapper */
  .custom-pagination { padding: 0 10px; gap: 10px; }
  .custom-pagination .left { text-align: center;}
  /* Contact Us */
  .contact-us .c-column { width: 100%; margin-inline-end: 0; }
  .contact-us .c-column.phone-column { width: 100%; }
  /* Permit Chart Row */
  .card-header-inner  .permit-type-title { text-align: start;}
  /* Form Template */
  .modal.cmn-modal .modal-header{padding: 10px 20px;}
  .modal.cmn-modal .modal-body{padding:20px;}
  /* Multi Select Wrapper */
  .multi-select-wrapper { gap: 10px; }
  .multi-select-wrapper .multi-field .remove-field {width: 36px;}
  .multi-select-wrapper .multi-field .remove-field img {max-width: 12px}
  .multi-select-wrapper .add-btn-right .add-field {height: 36px; width: 36px;}
  /* Main Menu CSS */
  .completions-chart.chart-card .chart-text .c-t-right { width: 100%; }
  header .header-right{padding: 0px 15px 0px 0px;}
  header .logo{height: 50px;}
  header .logo a{min-height: 50px;}
  header .user-right{margin-inline-start:10px;}
  header .notifications .notifi-icon{padding: 10px 10px;}
  header .notifications .notifi-icon img{max-width: 18px;}
  header .full-screen{display: none !important;}
  .dark-light-mode a{padding: 10px;}
  #sidebar {top: 50px;min-width: 260px; max-width: 260px;}
  #sidebar.open {height: calc(100% - 50px); }
  /* User Page CSS */
  .filter .filter-left.left-25, .center-col,.worklot-col,.filter .filter-left, .filter .filter-right.left-20 {width: 100% !important;}
  .filter .center-col .select-col{margin-inline-end: 0px;}
  .paginate_button.previous,.paginate_button.next{background-size: 10px 10px; width: 24px; height: 24px;}
  .paginate_button{margin: 0px 5px;}
  .modal.import-modal .modal-dialog {max-width: 100%;}
  .avatar-upload,.update-itc{width: 100% !important;}
  .progress-bar-sec{width: 100%; overflow-x: auto;}
  /* My Profile Page CSS */
  .my-profile{padding: 30px 15px 15px;}
  .my-profile .profile-left{width: 100%;}
  .my-profile .profile-image{margin: 0px auto;}
  .my-profile .profile-right{width: 100%; padding-inline-start: 0px; margin-top: 30px;}
  .my-profile .card-head{display: block; justify-content: inherit; text-align: center;}
  .my-profile .avatar-upload{align-items: flex-start;}
  .my-profile .avatar-upload .avatar-preview{width: 60px; height: 60px;}
  .avatar-close, .thumb-image .avatar-close {top: -8px; right: -8px;padding: 4px;}
  .avatar-close img, .thumb-image .avatar-close img {max-width: 8px;}
  .my-profile .avatar-upload .avatar-content {width: calc(100% - 60px);}
  .my-profile .form-group .bootstrap-select.dropdown .dropdown-toggle {height: 36px; line-height: 36px;}
  .avatar-upload .avatar-content input + label {padding: 6px 18px;}
  /* Change Password Page CSS */
  .login-content .login-left{width: 100%;}
  .login-content .login-left .login-wrap {padding: 40px 30px 40px 30px;}
  .login-content .login-right{width:100%; border-top-left-radius:0px;border-bottom-left-radius:0px;padding: 40px 30px;}
  .login-content .login-right-centered{max-width: 100%;}
  .login-content .login-left::before{display: none;}
  .login-content .login-left .login-middle {margin: 40px 0 20px 0;}
  /* Form Detail Page CSS */
  .all-widget-area-sec .checkbox-box .custom-checkbox{margin-bottom: 15px;}
  .all-widget-area-sec .submit-widget{margin-top: 20px !important;}
  /* Icon Sidebar CSS */
  .iconBar .open-side-nav-2 { margin-top: 80px; }
  .sidenav { height: calc(100% - 50px); margin-top: 50px; }
  #close-sidebar { width: 20px; height: 20px; }
  .project-admin-form .upload-photo .card-body .avatar-upload:not(:last-of-type) .avatar-content {margin-bottom: 20px;}
  .import-area.import-large .file-input {width: 80px; height: 80px;}
  .import-area.import-large .thumb-output img {width: 80px; height: 80px;}
  .import-area .file-input:before {font-size: 35px;}
  .inspection-items {padding: 10px 20px; flex-direction: column; align-items: flex-start; gap: 10px;}
  .inspection-items:not(:last-of-type) {margin-bottom: 20px;}
  .inspection-title, .inspection-formfield{
    width: 100%;
  }
  .document-photos-wrapper { gap: 10px;}
  .document-photo { width: calc(25% - 8px);}
  .import-data-inner {margin-top: 30px;}
  .import-data-inner .form-check {padding: 12px;}
  .file-block {margin-top: 20px;}
  .hot-work-table .custom-head { min-width: 60px; }
  .hot-work-table .task-title h3 { font-size: 14px; }
  .rounded-corners-background, .rounded-corners-background-details, .rounded-corners-details, .rounded-corners {border-radius: 12px;}
  .rounded-corners-background-details {height: 80px; width: 80px; padding: 14px;}
  .drawing_inner { height: 400px !important; }
  .import-datatable .dataTables_wrapper .table-responsive {border-right: 1px solid var(--bs-border-table);}
  #header { font-size: 20px; }
  #header-photo { width: 36px; height: 36px; margin-inline-start: 0; }
  .chat-bar-collapsible { right: 15px; }
  .chat-btn { height: 40px; width: 40px; font-size: 12px; margin-bottom: 6px;}
  .chat-bar-icons { font-size: 17px ; }
  .chat-container {max-height: calc(400px - 58px); bottom: 58px;}
  .input-box { font-size: 12px; padding: 6px 10px; }
  .botText, .userText {margin-bottom: 10px; font-size: 14px;}
  .botText span {border-radius: 4px 10px 10px 10px;}
  .userText span {padding: 10px; border-radius: 10px 0 10px 10px;}
  .full-chat-block { width: auto; min-height: 400px; }
  .jumping-dots .dot-1 {margin-inline-start: 10px;}
  .jumping-dots .dot-1, .jumping-dots .dot-2, .jumping-dots .dot-3 {width: 8px; height: 8px; margin-inline-end: 0;}
  .extra-filter label {margin-bottom: 6px;}
  .smartphone { width: 290px; height: 470px; }
  .smartphone .content {max-height: 350px;}
  /* Custom fileinput */
  .card .import-area.import-large.custom-fileinput { flex-direction: column; align-items: flex-start; }
  .login-content .login-left .btn{ padding: 13px 12px; }
  .worklot-dropdown{ max-width: 100%; }
  .date-range-custom{ width: 100%; }
  /* Work crew */
  .crew-modal .form-label-area{ width: 100%; }
  .crew-modal .form-content-area{ width: 100%; padding-left: 0;}
  .permit-row .iso-row{ flex-basis: 100%; }
  .iso-content.punch-photo{ gap: 6px; }
  .iso-content.punch-photo{ grid-template-columns: repeat(2, 1fr); }
  .punch-photo .iso-image{ max-height: 130px; }
  small-file-input input{ font-size: 12px; }
  .user-selection-cards{ flex-wrap: wrap; }
  .user-selection-cards .card{ flex-basis: 100%; }
}

@media only screen and (max-width: 575.98px) {
  h3 {font-size: 16px;}
  .breadcrumb-group { margin-inline-start: 5px; gap: 8px; }
  .breadcrumb-group .breadcrumb-item a, .breadcrumb-group .breadcrumb-item.active { font-size: 12px; }
  /* Dash Card */
  .dash-card-row > div { flex: 0 0 100%; max-width: 100%; }
  .dash-card { margin-bottom: 15px; padding: 20px; }
  /* Multi Select Wrapper */
  .all-widget-area-sec .checkbox-box { margin-top: 20px!important; }
  /* Icon Sidebar CSS */
  .sidenav {padding-top: 15px;} .sidenav a {font-size: 18px;}
  .import-data-inner input[type=checkbox] {height: 16px; width: 16px;}
  .import-data-inner .form-check {max-width: initial; width: auto;}
  .remove-element {top: 0;}
  .remove-inspection {top: 0;}
  /* Work crew */
  .worker-infobox .worker-details{ flex-direction: column;align-items: flex-start;}
  .worker-details-left{ max-width: 100%; padding-right: 0; }
  .user-guide-banner{ padding: 60px 20px;height: 350px;}
}

/* =================== Min Width Media Query =================== */
@media only screen and (min-width: 1440px) {
  .all-metrics-table-list #data-table-1 th.col-w-120{
    width: 130px !important;
    min-width: 130px !important;
    white-space: unset !important;
    word-break: break-word;
  }
}
@media only screen and (min-width: 768px) {
  #userprojects-sidenav{
    display: none !important;
  }
}

@media (min-width: 992px) {
  .clear-btn { margin-inline-start: 30px; }
}