﻿/* =========================================================
   Global theme tokens (change here → site-wide colors)
   Accent from design system: #F47C20, soft #FFF1E6, bg #FFFFFF
   ========================================================= */
:root {
    --brand-orange: #F47C20;
    --brand-orange-soft: #FFF1E6;
    --brand-orange-hover: #E06E16;
    --brand-bg: #FFFFFF;
    --brand-surface: #FFFFFF;
    --brand-border: #E5E7EB;
    --brand-muted: #6B7280;
    --brand-ink: #1F2937;
    --brand-primary: var(--brand-orange);
    --brand-primary-soft: var(--brand-orange-soft);
}

html,
body,
.wrapper,
.content-wrapper,
.right-side,
.main-footer {
    background-color: var(--brand-bg) !important;
    background: var(--brand-bg) !important;
}

/* =========================================================
   Add buttons — Figma primary
   height 40 · radius 7 · Inter 14/500 · white on #F47C20
   ========================================================= */
.crm-add-btn,
.content .box-header .box-title > a,
.content .box-title > a[href*="/create"],
.content .box-title > a[href*="create?"],
.cd-btn.cd-btn--primary,
.visit-mobile-nav__add-new-visit,
button.btn-primary#addRow,
a > button.btn-primary,
.btn-primary#addRow {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    box-sizing: border-box;
    min-width: 94px;
    height: 40px !important;
    padding: 0 20px !important;
    margin: 0 0 10px !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: var(--brand-orange) !important;
    color: #ffffff !important;
    font-family: "Inter", sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 21px !important;
    letter-spacing: 0 !important;
    text-align: center;
    text-decoration: none !important;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(244, 124, 32, 0.2) !important;
    cursor: pointer;
    vertical-align: middle;
}

.crm-add-btn:hover,
.crm-add-btn:focus,
.content .box-header .box-title > a:hover,
.content .box-header .box-title > a:focus,
.content .box-title > a[href*="/create"]:hover,
.content .box-title > a[href*="create?"]:hover,
.cd-btn.cd-btn--primary:hover,
.cd-btn.cd-btn--primary:focus,
.visit-mobile-nav__add-new-visit:hover,
button.btn-primary#addRow:hover,
a > button.btn-primary:hover {
    background: var(--brand-orange-hover) !important;
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: 0 3px 8px rgba(244, 124, 32, 0.28) !important;
}

.content .box-header .box-title > a.inactive-link,
.content .box-title > a.inactive-link,
.cd-btn.cd-btn--primary.is-disabled,
.crm-add-btn.is-disabled,
.crm-add-btn:disabled {
    opacity: 0.45 !important;
    pointer-events: none !important;
    box-shadow: none !important;
}

/* Keep page Add CTAs as buttons even when wrapped in h3.box-title */
.content .box-header .box-title,
.content .box-title:has(> a[href*="create"]),
.content .box-title:has(> a[href*="/create"]) {
    margin: 0 0 8px !important;
    line-height: 1 !important;
}

.content .box-header .box-title > a + br,
.content .box-title > a + br {
    display: none;
}

.crm-add-btn-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 0 0 12px;
}

.crm-add-btn.crm-add-btn--outline,
a.crm-add-btn.crm-add-btn--outline {
    background: #ffffff !important;
    color: var(--brand-orange) !important;
    border: 1px solid var(--brand-orange) !important;
    box-shadow: none !important;
}

.crm-add-btn.crm-add-btn--outline:hover,
.crm-add-btn.crm-add-btn--outline:focus,
a.crm-add-btn.crm-add-btn--outline:hover,
a.crm-add-btn.crm-add-btn--outline:focus {
    background: var(--brand-orange-soft) !important;
    color: var(--brand-orange) !important;
}

/* Bootstrap / AdminLTE primary → orange */
.btn-primary,
.btn-primary:focus,
.btn-primary.focus {
    background-color: var(--brand-orange) !important;
    border-color: var(--brand-orange) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
    background-color: var(--brand-orange-hover) !important;
    border-color: var(--brand-orange-hover) !important;
    color: #ffffff !important;
}

.label-primary {
    background-color: var(--brand-orange) !important;
}

.box.box-primary {
    border-top-color: var(--brand-orange);
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
    background-color: var(--brand-orange) !important;
}

.nav-tabs-custom > .nav-tabs > li.active {
    border-top-color: var(--brand-orange);
}

.nav-tabs-custom > .nav-tabs > li.active > a {
    border-top-color: var(--brand-orange);
}

/* Form focus / active borders */
.form-control:focus,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default .select2-selection--single:focus,
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--brand-orange) !important;
    outline: none;
    box-shadow: 0 0 0 1px var(--brand-orange-soft);
}

/* Native checkbox / radio accent */
input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--brand-orange);
}

/* Required asterisk */
.required-field-label-star,
label.required-field-label .required-field-label-star {
    color: var(--brand-orange) !important;
}

/* Datepicker / daterangepicker selected states */
.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td span.active,
.datepicker table tr td span.active:hover,
.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker .ranges li.active {
    background-color: var(--brand-orange) !important;
    border-color: var(--brand-orange) !important;
    color: #ffffff !important;
}

.datepicker table tr td.today,
.datepicker table tr td.today:hover {
    background-color: var(--brand-orange-soft) !important;
    color: var(--brand-orange) !important;
}

.daterangepicker td.in-range {
    background-color: var(--brand-orange-soft) !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--brand-orange) !important;
    color: #ffffff !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--brand-orange-soft) !important;
    border-color: var(--brand-orange-soft) !important;
    color: var(--brand-orange) !important;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    background-color: var(--brand-orange) !important;
    border-color: var(--brand-orange) !important;
    color: #fff !important;
}

.skin-blue-light .main-header .navbar .conveyance .dropdown-menu li a {
    color: #777 !important;
}

@media (max-width: 768px) {
    .skin-blue-light .main-header .navbar .dropdown-menu li a {
        color: #777 !important
    }
    .submenu-main-container {
        position: absolute !important;
        width: 30%;
    }
    .submenu-container {
        background-color: #fff !important;
    }
    .left-menu-items-mobile{
        
    }
}

.container {
    width: 100% !important;
}

.text-wrap {
    white-space: normal;
    width: 100%;
}

/* =========================================================
   CRM data tables — Customer Directory reference
   ========================================================= */
:root {
    --crm-table-line: #e8eaef;
    --crm-table-head-bg: #fafbfc;
    --crm-table-head: #9ca3af;
    --crm-table-ink: #1a1d26;
    --crm-table-muted: #6b7280;
    /* Figma: brand orange #F47C20 — hover 20%, click 30% */
    --crm-table-hover: rgba(244, 124, 32, 0.2);
    --crm-table-active: rgba(244, 124, 32, 0.3);
}

.custom-table,
.custom-table-form,
.cd-table,
.vh-table,
.sl-table,
.manager-table,
.manager-visits__table,
.sales-dashboard-table,
.an-table,
.an-ask__table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}

.custom-table td,
.custom-table th,
.custom-table-form td,
.custom-table-form th {
    padding: 12px;
}

/* Enquiry + Quotes lists — Customer Directory table, 12px body */
.crm-list-table,
.dataTables_scrollHead .crm-list-table,
.dataTables_scrollBody .crm-list-table {
    border-collapse: collapse !important;
    background: #fff !important;
}

.crm-list-table.table-bordered,
.crm-list-table.table-striped,
.crm-list-table.table-bordered > thead > tr > th,
.crm-list-table.table-bordered > tbody > tr > td,
.crm-list-table.table-bordered > thead > tr > td,
.crm-list-table.table-bordered > tbody > tr > th {
    border: 0 !important;
}

.crm-list-table thead th,
.crm-list-table.table > thead > tr > th,
.dataTables_scrollHead .crm-list-table thead th {
    color: #9ca3af !important;
    font-family: "Inter", sans-serif !important;
    font-weight: 600 !important;
    font-size: 11px !important;
    line-height: 16px !important;
    letter-spacing: 0.55px !important;
    text-transform: uppercase !important;
    background-color: #fafbfc !important;
    border: 0 !important;
    border-bottom: 1px solid #e8eaef !important;
    padding: 12px 18px !important;
    white-space: nowrap;
    vertical-align: middle !important;
}

/* scrollX clones a hidden header inside the body — keep it collapsed */
.dataTables_scrollBody .crm-list-table thead,
.dataTables_scrollBody .crm-list-table thead tr,
.dataTables_scrollBody .crm-list-table thead th,
.dataTables_scrollBody table thead th {
    height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    line-height: 0 !important;
    font-size: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
}

.crm-list-table tbody td,
.crm-list-table.table > tbody > tr > td,
.dataTables_scrollBody .crm-list-table tbody td {
    padding: 12px !important;
    border: 0 !important;
    border-top: 1px solid #e8eaef !important;
    font-family: "Inter", sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 18px !important;
    color: #1a1d26 !important;
    vertical-align: middle !important;
    background: transparent !important;
}

.crm-list-table tbody td .text-wrap {
    font-family: "Inter", sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 18px !important;
    color: #1a1d26 !important;
}

.crm-list-table tbody td a {
    font-weight: 600 !important;
    text-decoration: none !important;
    color: #3c8dbc !important;
}

.crm-list-table.table-striped > tbody > tr,
.crm-list-table.table-striped > tbody > tr:nth-of-type(odd),
.crm-list-table.table-striped > tbody > tr:nth-of-type(even) {
    background: #fff !important;
}

.crm-list-table tbody tr:hover,
.crm-list-table tbody tr.is-hover {
    background: var(--crm-table-hover) !important;
}

.crm-list-table tbody tr:active,
.crm-list-table tbody tr.is-active,
.crm-list-table tbody tr.is-pressed {
    background: var(--crm-table-active) !important;
}

.crm-list-table tbody tr:hover td,
.crm-list-table tbody tr.is-hover td,
.crm-list-table tbody tr:active td,
.crm-list-table tbody tr.is-active td,
.crm-list-table tbody tr.is-pressed td {
    background: transparent !important;
}

.custom-table tr:nth-child(even),
.custom-table-form tr:nth-child(even),
.custom-table tr:nth-child(odd),
.custom-table-form tr:nth-child(odd) {
    background-color: #fff;
}

.custom-table th,
.custom-table-form th,
.cd-table thead th,
.vh-table th,
.sl-table th,
.manager-table th,
.manager-visits__table th,
.sales-dashboard-table th,
.an-table th,
.an-ask__table th {
    color: var(--crm-table-head) !important;
    font-family: "Inter", sans-serif !important;
    font-weight: 600 !important;
    font-size: 11px !important;
    line-height: 16.5px !important;
    letter-spacing: 0.55px !important;
    text-transform: uppercase !important;
    background-color: var(--crm-table-head-bg) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--crm-table-line) !important;
    padding: 12px 18px !important;
    white-space: nowrap;
    vertical-align: middle;
}

.custom-table td,
.custom-table-form td,
.cd-table tbody td,
.vh-table td,
.sl-table td,
.manager-table td,
.manager-visits__table td,
.sales-dashboard-table td,
.an-table td,
.an-ask__table td {
    padding: 12px !important;
    border: 0 !important;
    border-top: 1px solid var(--crm-table-line) !important;
    font-family: "Inter", sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 19.5px !important;
    color: var(--crm-table-ink) !important;
    vertical-align: middle;
    background: transparent !important;
}

.custom-table tbody tr:hover,
.custom-table-form tbody tr:hover,
.cd-table tbody tr:hover,
.cd-table tbody tr.is-hover,
.vh-table tbody tr:hover,
.sl-table tbody tr:hover,
.manager-table tbody tr:hover,
.manager-visits__table tbody tr:hover,
.sales-dashboard-table tbody tr:hover,
.an-table tbody tr:hover,
.an-ask__table tbody tr:hover {
    background: var(--crm-table-hover) !important;
}

.custom-table tbody tr:active,
.custom-table tbody tr.is-active,
.custom-table tbody tr.is-pressed,
.custom-table-form tbody tr:active,
.custom-table-form tbody tr.is-active,
.custom-table-form tbody tr.is-pressed,
.cd-table tbody tr:active,
.cd-table tbody tr.is-active,
.cd-table tbody tr.is-pressed,
.vh-table tbody tr:active,
.vh-table tbody tr.is-active,
.vh-table tbody tr.is-pressed,
.sl-table tbody tr:active,
.sl-table tbody tr.is-active,
.sl-table tbody tr.is-pressed,
.manager-table tbody tr:active,
.manager-table tbody tr.is-active,
.manager-table tbody tr.is-pressed,
.manager-visits__table tbody tr:active,
.manager-visits__table tbody tr.is-active,
.manager-visits__table tbody tr.is-pressed,
.sales-dashboard-table tbody tr:active,
.sales-dashboard-table tbody tr.is-active,
.sales-dashboard-table tbody tr.is-pressed,
.an-table tbody tr:active,
.an-table tbody tr.is-active,
.an-table tbody tr.is-pressed,
.an-ask__table tbody tr:active,
.an-ask__table tbody tr.is-active,
.an-ask__table tbody tr.is-pressed {
    background: var(--crm-table-active) !important;
}

.custom-table tbody tr:hover td,
.custom-table-form tbody tr:hover td,
.cd-table tbody tr:hover td,
.cd-table tbody tr.is-hover td,
.vh-table tbody tr:hover td,
.sl-table tbody tr:hover td,
.manager-table tbody tr:hover td,
.manager-visits__table tbody tr:hover td,
.sales-dashboard-table tbody tr:hover td,
.an-table tbody tr:hover td,
.an-ask__table tbody tr:hover td,
.custom-table tbody tr:active td,
.custom-table tbody tr.is-active td,
.custom-table tbody tr.is-pressed td,
.custom-table-form tbody tr:active td,
.custom-table-form tbody tr.is-active td,
.custom-table-form tbody tr.is-pressed td,
.cd-table tbody tr:active td,
.cd-table tbody tr.is-active td,
.cd-table tbody tr.is-pressed td,
.vh-table tbody tr:active td,
.vh-table tbody tr.is-active td,
.vh-table tbody tr.is-pressed td,
.sl-table tbody tr:active td,
.sl-table tbody tr.is-active td,
.sl-table tbody tr.is-pressed td,
.manager-table tbody tr:active td,
.manager-table tbody tr.is-active td,
.manager-table tbody tr.is-pressed td,
.manager-visits__table tbody tr:active td,
.manager-visits__table tbody tr.is-active td,
.manager-visits__table tbody tr.is-pressed td,
.sales-dashboard-table tbody tr:active td,
.sales-dashboard-table tbody tr.is-active td,
.sales-dashboard-table tbody tr.is-pressed td,
.an-table tbody tr:active td,
.an-table tbody tr.is-active td,
.an-table tbody tr.is-pressed td,
.an-ask__table tbody tr:active td,
.an-ask__table tbody tr.is-active td,
.an-ask__table tbody tr.is-pressed td {
    background: transparent !important;
}

.custom-table td.sorting_1,
.custom-table td.sorting_2,
.custom-table td.sorting_3,
.custom-table-form td.sorting_1,
.custom-table-form td.sorting_2,
.custom-table-form td.sorting_3,
.cd-table td.sorting_1,
.cd-table td.sorting_2,
.cd-table td.sorting_3,
.table.dataTable td.sorting_1,
.table.dataTable td.sorting_2,
.table.dataTable td.sorting_3 {
    background: transparent !important;
}

.custom-table .empty-cell,
.custom-table-form .empty-cell,
.cd-empty-cell,
.vh-muted,
.manager-visits__muted,
.sl-empty {
    color: var(--crm-table-muted) !important;
    font-weight: 500 !important;
}

/* Beat Bootstrap table-bordered / table-striped on CRM list tables */
.table.custom-table.table-bordered,
.table.custom-table-form.table-bordered,
.table.custom-table.table-striped,
.table.custom-table-form.table-striped {
    border: 0 !important;
}

.table.custom-table.table-bordered > thead > tr > th,
.table.custom-table.table-bordered > tbody > tr > th,
.table.custom-table.table-bordered > tfoot > tr > th,
.table.custom-table.table-bordered > thead > tr > td,
.table.custom-table.table-bordered > tbody > tr > td,
.table.custom-table.table-bordered > tfoot > tr > td,
.table.custom-table-form.table-bordered > thead > tr > th,
.table.custom-table-form.table-bordered > tbody > tr > th,
.table.custom-table-form.table-bordered > tfoot > tr > th,
.table.custom-table-form.table-bordered > thead > tr > td,
.table.custom-table-form.table-bordered > tbody > tr > td,
.table.custom-table-form.table-bordered > tfoot > tr > td {
    border: 0 !important;
    border-top: 1px solid var(--crm-table-line) !important;
}

.table.custom-table.table-bordered > thead > tr > th,
.table.custom-table-form.table-bordered > thead > tr > th {
    border-top: 0 !important;
    border-bottom: 1px solid var(--crm-table-line) !important;
}

.table.custom-table.table-striped > tbody > tr:nth-of-type(odd),
.table.custom-table-form.table-striped > tbody > tr:nth-of-type(odd),
.table.custom-table.table-striped > tbody > tr:nth-of-type(even),
.table.custom-table-form.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #fff !important;
}

.table.custom-table.table-hover > tbody > tr:hover,
.table.custom-table-form.table-hover > tbody > tr:hover {
    background-color: var(--crm-table-hover) !important;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    background-image: none !important;
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after {
    display: none !important;
}

table.dataTable.no-footer {
    border-bottom: 0 !important;
}

.inactive-link {
    pointer-events: none;
    cursor: default;
    color: #777;
}

.active-link {
    cursor: pointer;
}

.required-field-label-star {
    color: var(--brand-orange);
}

.disableClick {
    pointer-events: none;
}

.datepicker table tr td.old,
.datepicker table tr td.new {
    visibility: hidden;
}

.datepicker {
    padding: 6px;
}

.loader {
    text-align: center
}

#searchResults {
    position: absolute;
    width: 140px;
    background: white;
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #ccc;
    left: 0;
    right: 0;
    top: 34px;
    z-index: 1000;
}

#searchDiv {
    position: relative;
    width: 25% !important;
    padding-bottom: 20px;
}

.search-results {
    list-style: none;
    padding: 6px 12px;
}

.search-results a {
    text-decoration: none;
    display: block;
    color: black;
    width: 100%;
    height: 100%;
}

.category {
    color: var(--brand-orange);
}

.search-section {
    margin-bottom: 25px;
}

#search {
    height: 34px;
    outline: none !important;
}

#searchResults li.selected {
    background: #eee
}

.required-field-label-star {
    color: var(--brand-orange);
}

.absFormTxt {
    font-size: 15px;
    color: #777;
    line-height: 1;
    position: absolute;
    top: 25%;
    left: 30px
}

.toTxt {
    padding-left: 39px
}

.fromTxt {
    padding-left: 58px
}

.dateCodeTxt {
    padding-left: 90px
}

ul {
    list-style-type: none;
}

#machine_details {
    display: none;
}

#machine-details.show {
    display: block;
}

@media print {

    .no-print,
    .no-print * {
        display: none !important;
    }
}

/* to hide arrows from number input fields */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* to hide arrows from number input fields in firefox */
input[type=number] {
    -moz-appearance: textfield;
}

/* @media (max-width: 768px) {
  .navbar-brand {
    height: 80px; // Logo will not overhang
  }
  #LC-navbar {
    background-color: #ccc; // Change background color
  }
  .navbar-toggle {
    margin-top: 25px; // Adjust toggle position
  }
} */
td {
    word-wrap: break-word !important
}

.text-right {
    float: right;
    margin: 0;
}

.bootstrap-select .btn {
    background-color: #fff;
}

.disabled-selectpicker+.bootstrap-select .btn {
    background-color: #eee;
    color: black;
}

.ui-select-match-text>span {
    overflow: hidden;
    text-overflow: ellipsis;
    position: absolute;
}

.erroronous-input {
    border: 2px solid red;
}

.animate-trends {
    animation: animateTrends 2s ease infinite;
    transition: all 0.3s ease;
    will-change: transform, color;
}

@keyframes animateTrends {
    0% {
        transform: scale(1) translateY(0px);
    }
    50% {
        transform: scale(1.1) translateY(-3px);
        color: #ffea00;
    }
    100% {
        transform: scale(1) translateY(0px);
    }
}

/* Visit role: hide blue top navbar on mobile; custom overlay menu */
.visit-mobile-nav {
    display: none;
}

@media (max-width: 767px) {
    body.hide-visit-mobile-navbar .main-header {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1040;
        background: transparent;
        border: 0;
        max-height: none;
        /* Let page header menu/back receive clicks while menu is closed */
        pointer-events: none;
    }

    body.hide-visit-mobile-navbar .main-header .navbar {
        background: transparent !important;
        min-height: 0;
        margin: 0;
        border: 0;
        box-shadow: none;
    }

    body.hide-visit-mobile-navbar .main-header .navbar-header,
    body.hide-visit-mobile-navbar .main-header .navbar-custom-menu {
        display: none !important;
    }

    body.hide-visit-mobile-navbar .main-header .container {
        width: 100%;
        padding: 0;
        margin: 0;
    }

    /*
     * Full-screen white panel: slides in left→right, out right→left.
     * No dim/backdrop. Bootstrap height collapse is disabled for this menu.
     */
    body.hide-visit-mobile-navbar .main-header #navbar-collapse {
        float: none !important;
        margin: 0 !important;
        padding: 0 !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: auto !important;
        bottom: 0 !important;
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100vh !important;
        max-height: none !important;
        min-height: 100vh !important;
        background: #ffffff !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        overflow-x: hidden;
        overflow-y: auto;
        z-index: 1050;
        -webkit-overflow-scrolling: touch;
        display: block !important;
        visibility: hidden;
        pointer-events: none;
        transform: translate3d(-100%, 0, 0);
        -webkit-transform: translate3d(-100%, 0, 0);
        transition: transform 0.34s cubic-bezier(0.22, 1, 0.36, 1);
        -webkit-transition: -webkit-transform 0.34s cubic-bezier(0.22, 1, 0.36, 1);
    }

    body.hide-visit-mobile-navbar .main-header #navbar-collapse.collapse,
    body.hide-visit-mobile-navbar .main-header #navbar-collapse.collapsing {
        display: block !important;
        height: 100vh !important;
        overflow: hidden !important;
    }

    /* Open (and opening) — panel fully covers UI, no dim */
    body.hide-visit-mobile-navbar .main-header #navbar-collapse.is-open,
    body.hide-visit-mobile-navbar .main-header #navbar-collapse.collapse.in {
        visibility: visible;
        pointer-events: auto;
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
    }

    body.hide-visit-mobile-navbar.visit-nav-open {
        overflow: hidden;
    }

    /* Never show a dim overlay on visit pages */
    body.hide-visit-mobile-navbar .visit-mobile-nav-backdrop,
    body.hide-visit-mobile-navbar .modal-backdrop {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body.hide-visit-mobile-navbar .main-header .visit-default-menu {
        display: none !important;
    }

    body.hide-visit-mobile-navbar .main-header .visit-mobile-nav {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 20px 20px 40px;
        box-sizing: border-box;
        background: #ffffff;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 56px;
        padding-top: 8px;
        width: 100%;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__logo {
        display: block;
        height: 36px;
        width: auto;
        max-width: 180px;
        object-fit: contain;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__close {
        width: 40px;
        height: 40px;
        border: 0;
        background: transparent;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex: 0 0 auto;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__menu {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 29px;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__menu li {
        width: 100%;
        text-align: center;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__menu a,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu a:link,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu a:visited,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu a:hover,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu a:focus,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu a:active {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 4px 88px;
        border-radius: 19px;
        font-family: "Manrope", "Inter", sans-serif;
        font-size: 20px;
        font-weight: 700;
        line-height: 30px;
        color: #0f0f1e !important;
        text-decoration: none !important;
        background: transparent;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__menu li.is-active a,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu li.is-active a:link,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu li.is-active a:visited,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu li.is-active a:hover,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu li.is-active a:focus,
    body.hide-visit-mobile-navbar .visit-mobile-nav__menu li.is-active a:active {
        color: #f47c20 !important;
        background: #FCEAE3;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__add-new-visit {
        background-color: #F47C20;
        margin: 45px 44px 24px 44px !important;
        width: 140px !important;
        height: 32px !important;
        border-radius: 54279800px !important;
        padding: 0 12px !important;
        box-sizing: border-box;
        border: 1.62px solid #F47C20;
        color: #FFFFFF;
        font-weight: 500;
        font-family: "Inter", sans-serif;
        font-size: 12px;
        line-height: 16px;
        cursor: pointer;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__bottom {
        margin-top: auto;
        width: 100%;
        display: flex;
        justify-content: center;
        padding-top: 24px;
        padding-bottom: 8px;
    }

    body.hide-visit-mobile-navbar .visit-mobile-nav__logout,
    body.hide-visit-mobile-navbar .visit-mobile-nav__logout:link,
    body.hide-visit-mobile-navbar .visit-mobile-nav__logout:visited,
    body.hide-visit-mobile-navbar .visit-mobile-nav__logout:hover,
    body.hide-visit-mobile-navbar .visit-mobile-nav__logout:focus,
    body.hide-visit-mobile-navbar .visit-mobile-nav__logout:active {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 160px;
        padding: 10px 24px;
        border-radius: 19px;
        border: 1px solid #e5e7eb;
        background: #ffffff;
        font-family: "Manrope", "Inter", sans-serif;
        font-size: 16px;
        font-weight: 600;
        line-height: 24px;
        color: #b42318 !important;
        text-decoration: none !important;
        cursor: pointer;
    }

    body.hide-visit-mobile-navbar .content-wrapper,
    body.hide-visit-mobile-navbar .right-side {
        padding-top: 0 !important;
        margin-top: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    body.hide-visit-mobile-navbar .wrapper {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }
}

@media (min-width: 768px) {
    body.hide-visit-mobile-navbar .visit-mobile-nav {
        display: none !important;
    }
}

/* =========================================================
   Global pagination — site-wide
   Showing left · faint ‹ › · orange active page
   ========================================================= */
:root {
    --crm-pager-border: #eceef2;
    --crm-pager-ink: #6b7280;
    --crm-pager-muted: #c4c8d0;
    --crm-pager-meta: #858c96;
    --crm-pager-radius: 6px;
    --crm-pager-size: 28px;
}

.vh-footer,
.sales-table-pagination,
.manager-table-pagination,
.manager-visits__footer,
#slPagination,
.dataTables_wrapper .row:has(.dataTables_paginate),
.dataTables_wrapper > .row:last-child:has(.dataTables_info) {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    box-sizing: border-box;
    width: 100%;
    margin: 0 !important;
    padding: 10px 17px 12px;
    border-top: 1px solid #f0f0f2;
    background: #fff;
}

.dataTables_wrapper .row:has(.dataTables_paginate)::before,
.dataTables_wrapper .row:has(.dataTables_paginate)::after,
.dataTables_wrapper > .row:last-child:has(.dataTables_info)::before,
.dataTables_wrapper > .row:last-child:has(.dataTables_info)::after {
    display: none !important;
    content: none !important;
}

.dataTables_wrapper .row:has(.dataTables_paginate) > [class*="col-"],
.dataTables_wrapper > .row:last-child:has(.dataTables_info) > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
}

.dataTables_wrapper .row:has(.dataTables_paginate) > [class*="col-"]:last-child {
    margin-left: auto !important;
}

.pagination,
.crm-page-buttons,
.vh-pager,
.vh-pager__pages,
.sales-table-pagination__buttons,
.manager-table-pagination > div,
.manager-visits__pagination,
.dataTables_wrapper .dataTables_paginate,
.dataTables_wrapper .dataTables_paginate > span,
.dataTables_wrapper .dataTables_paginate .pagination {
    display: flex !important;
    align-items: center;
    gap: 6px;
    margin: 0 !important;
    float: none !important;
    padding: 0 !important;
}

/* DataTables Bootstrap puts .paginate_button on <li> — never style the li as a button */
.pagination > li,
.dataTables_wrapper .dataTables_paginate .paginate_button {
    float: none !important;
    display: inline-flex !important;
    align-items: center;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    min-width: 0 !important;
    height: auto !important;
    line-height: 1 !important;
}

.vh-footer__meta,
.sales-table-pagination__summary,
.manager-pagination-summary,
#slPagination .manager-pagination-summary,
.dataTables_wrapper .dataTables_info {
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    clear: none !important;
    color: var(--crm-pager-meta) !important;
    font: 400 12px/1.4 "Inter", sans-serif !important;
    text-align: left !important;
}

/* Single button chrome — only on the clickable control, never on the li */
.pagination > li > a,
.pagination > li > span,
.pagination.pagination-sm > li > a,
.pagination.pagination-sm > li > span,
.pagination > .page-item > .page-link,
.crm-page-button,
.vh-pager__page,
.vh-pager__btn,
.sales-table-pagination__buttons button[data-page-action],
.manager-table-pagination button[data-page-action],
.manager-table-pagination button[data-recent-activity-action],
.manager-visits__pagination button[data-page-action],
.dataTables_wrapper .dataTables_paginate .paginate_button > a,
.dataTables_wrapper .dataTables_paginate .paginate_button > span {
    position: relative;
    min-width: var(--crm-pager-size);
    height: var(--crm-pager-size);
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 8px !important;
    margin: 0 !important;
    border: 1px solid var(--crm-pager-border) !important;
    border-radius: var(--crm-pager-radius) !important;
    color: var(--crm-pager-ink) !important;
    background: #fff !important;
    font: 500 12px/1 "Inter", sans-serif !important;
    text-decoration: none !important;
    box-shadow: none !important;
    cursor: pointer;
    box-sizing: border-box;
    float: none !important;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination.pagination-sm > .active > a,
.pagination.pagination-sm > .active > span,
.pagination > .page-item.active > .page-link,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
.pagination > .page-item.active > .page-link:hover,
.crm-page-button.is-active,
.crm-page-button.is-active:hover,
.crm-page-button.is-active:focus,
.vh-pager__page.is-active,
.vh-pager__page.is-active:hover,
.vh-pager__btn.is-active,
.sales-table-pagination__buttons button[data-current-page],
.manager-table-pagination button[data-current-page],
.dataTables_wrapper .dataTables_paginate .paginate_button.current > a,
.dataTables_wrapper .dataTables_paginate .paginate_button.current > span,
.dataTables_wrapper .dataTables_paginate .paginate_button.active > a,
.dataTables_wrapper .dataTables_paginate .paginate_button.active > span {
    border-color: var(--brand-orange, #f47c20) !important;
    color: #fff !important;
    background: var(--brand-orange, #f47c20) !important;
    box-shadow: none !important;
    cursor: default;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination.pagination-sm > li > a:hover,
.pagination.pagination-sm > li > span:hover,
.pagination > .page-item > .page-link:hover,
.crm-page-button:hover:not(:disabled):not(.is-active),
.vh-pager__page:hover:not(:disabled):not(.is-active),
.vh-pager__btn:hover:not(:disabled),
.sales-table-pagination__buttons button[data-page-action]:hover:not(:disabled):not([data-current-page]),
.manager-table-pagination button[data-page-action]:hover:not(:disabled):not([data-current-page]),
.manager-table-pagination button[data-recent-activity-action]:hover:not(:disabled):not([data-current-page]),
.manager-visits__pagination button[data-page-action]:hover:not(:disabled):not([data-current-page]),
.dataTables_wrapper .dataTables_paginate .paginate_button:not(.current):not(.active):not(.disabled) > a:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:not(.current):not(.active):not(.disabled) > span:hover {
    border-color: #f0d2b8 !important;
    color: var(--brand-orange, #f47c20) !important;
    background: #fff !important;
}

.pagination > .disabled > a,
.pagination > .disabled > span,
.pagination.pagination-sm > .disabled > a,
.pagination.pagination-sm > .disabled > span,
.pagination > .page-item.disabled > .page-link,
.crm-page-button:disabled:not(.is-active),
.vh-pager__page:disabled:not(.is-active),
.vh-pager__btn:disabled,
.sales-table-pagination__buttons button[data-page-action]:disabled,
.manager-table-pagination button[data-page-action]:disabled,
.manager-table-pagination button[data-recent-activity-action]:disabled,
.manager-visits__pagination button[data-page-action]:disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled > a,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled > span {
    color: var(--crm-pager-muted) !important;
    background: #fff !important;
    border-color: var(--crm-pager-border) !important;
    cursor: default;
    opacity: 1;
}

/* Only previous · current page · next (hide first/last, other pages, ellipsis) */
.pagination > li.first,
.pagination > li.last,
.pagination > li:not(.previous):not(.next):not(.active),
.dataTables_wrapper .dataTables_paginate .paginate_button.first,
.dataTables_wrapper .dataTables_paginate .paginate_button.last,
.dataTables_wrapper .dataTables_paginate .paginate_button:not(.previous):not(.next):not(.current):not(.active),
.dataTables_wrapper .dataTables_paginate .ellipsis,
.pagination > li .ellipsis,
.crm-page-ellipsis,
.vh-pager__ellipsis {
    display: none !important;
}

/* Prev / next — replace label with a single faint chevron inside the button */
.pagination > li.previous > a,
.pagination > li.previous > span,
.pagination > li.next > a,
.pagination > li.next > span,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous > a,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous > span,
.dataTables_wrapper .dataTables_paginate .paginate_button.next > a,
.dataTables_wrapper .dataTables_paginate .paginate_button.next > span {
    overflow: hidden;
    font-size: 0 !important;
    color: transparent !important;
    min-width: var(--crm-pager-size);
}

.pagination > li.previous > a::after,
.pagination > li.previous > span::after,
.pagination > li.next > a::after,
.pagination > li.next > span::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous > a::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous > span::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.next > a::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.next > span::after {
    font: 18px/1 "Inter", sans-serif !important;
    color: var(--crm-pager-muted);
}

.pagination > li.previous > a::after,
.pagination > li.previous > span::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous > a::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous > span::after {
    content: "‹";
}

.pagination > li.next > a::after,
.pagination > li.next > span::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.next > a::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.next > span::after {
    content: "›";
}

.pagination > li.previous:not(.disabled) > a:hover::after,
.pagination > li.next:not(.disabled) > a:hover::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.previous:not(.disabled) > a:hover::after,
.dataTables_wrapper .dataTables_paginate .paginate_button.next:not(.disabled) > a:hover::after {
    color: var(--brand-orange, #f47c20);
}

.vh-pager__btn,
.sales-table-pagination__buttons button[data-page-action="previous"],
.sales-table-pagination__buttons button[data-page-action="next"],
.manager-table-pagination button[data-page-action="previous"],
.manager-table-pagination button[data-page-action="next"],
.manager-visits__pagination button[data-page-action="previous"],
.manager-visits__pagination button[data-page-action="next"] {
    color: var(--crm-pager-muted) !important;
}

.vh-pager__btn:hover:not(:disabled),
.sales-table-pagination__buttons button[data-page-action="previous"]:hover:not(:disabled),
.sales-table-pagination__buttons button[data-page-action="next"]:hover:not(:disabled),
.manager-table-pagination button[data-page-action="previous"]:hover:not(:disabled),
.manager-table-pagination button[data-page-action="next"]:hover:not(:disabled),
.manager-visits__pagination button[data-page-action="previous"]:hover:not(:disabled),
.manager-visits__pagination button[data-page-action="next"]:hover:not(:disabled) {
    color: var(--brand-orange, #f47c20) !important;
}

.crm-page-ellipsis,
.vh-pager__ellipsis,
.pagination > li.disabled > span.ellipsis,
.dataTables_wrapper .dataTables_paginate .paginate_button.ellipsis,
.dataTables_wrapper .dataTables_paginate .ellipsis {
    color: var(--crm-pager-meta) !important;
    font: 12px/1 "Inter", sans-serif !important;
    padding: 0 2px !important;
    border: 0 !important;
    background: transparent !important;
    min-width: auto !important;
    height: auto !important;
    cursor: default;
}

.dataTables_wrapper .dataTables_paginate {
    text-align: right;
}

/* Keep pagination controls the same size across CRM pages. */
body .wrapper .pagination,
body .wrapper .crm-page-buttons,
body .wrapper .vh-pager__pages,
body .wrapper .sales-table-pagination__buttons,
body .wrapper .manager-table-pagination > div,
body .wrapper .manager-visits__pagination,
body .wrapper .dataTables_wrapper .dataTables_paginate {
    display: flex;
    align-items: center;
    gap: 6px;
}

body .wrapper .pagination > li > a,
body .wrapper .pagination > li > span,
body .wrapper .crm-page-button,
body .wrapper .vh-pager__page,
body .wrapper .vh-pager__btn,
body .wrapper .sales-table-pagination__buttons button[data-page-action],
body .wrapper .manager-table-pagination button[data-page-action],
body .wrapper .manager-table-pagination button[data-recent-activity-action],
body .wrapper .manager-visits__pagination button[data-page-action],
body .wrapper .dataTables_wrapper .dataTables_paginate .paginate_button {
    box-sizing: border-box !important;
    min-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 9px !important;
    margin: 0 !important;
    font: 500 13px/1 "Inter", sans-serif !important;
}

body .wrapper .pagination > li.previous > a,
body .wrapper .pagination > li.previous > span,
body .wrapper .pagination > li.next > a,
body .wrapper .pagination > li.next > span {
    font-size: 0 !important;
}

/* Desktop-only page gutter. Mobile pages already pad their own content. */
@media (min-width: 901px) {
    body .wrapper .content-wrapper > .content:not(.no-page-gutter) {
        box-sizing: border-box;
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}

body .wrapper .content-wrapper.visit-create-page.is-salesperson-modal > .content {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body .wrapper > .content-wrapper {
    zoom: 1.1;
}

body.visit-create-salesperson-modal .wrapper > .content-wrapper {
    zoom: 1;
}

#allQuotesSection,
#recentQuotesSection,
#allEnquiriesSection,
#recentEnquiriesSection {
    overflow-x: auto;
}

body .wrapper .calendar-page .cal-page-header__actions > {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 94px !important;
    max-width: none !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

/* Shared dropdown colors across native selects and Select2 controls. */
select:not(.select2-hidden-accessible) {
    border-color: #d0d5dd;
    border-radius: 8px;
}

select:not(:disabled):focus {
    border-color: #ff6b00 !important;
    outline: 0;
    box-shadow: 0 0 0 1px #ff6b00 !important;
}

select option:checked:not(:disabled):not([value=""]) {
    background: #ff6b00;
    color: #ffffff;
}

select option:hover {
    background: #fde7d7;
    color: #191b22;
}

.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border-color: #d0d5dd;
    border-radius: 8px;
}

.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: #ff6b00 !important;
    box-shadow: 0 0 0 1px #ff6b00 !important;
}

.select2-dropdown {
    border-color: #e1e3e7;
    border-radius: 8px !important;
    box-shadow: 0 4px 8px rgba(16, 24, 40, 0.16);
}

.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: #ff6b00;
    color: #ffffff;
}

.select2-container--default
    .select2-results__option--highlighted[aria-selected="false"] {
    background-color: #fde7d7;
    color: #191b22;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: #ff6b00;
    outline: 0;
    box-shadow: 0 0 0 1px #ff6b00;
}

.bootstrap-select > .dropdown-toggle {
    border-color: #d0d5dd;
    border-radius: 8px;
}

.bootstrap-select.open > .dropdown-toggle,
.bootstrap-select > .dropdown-toggle:focus {
    border-color: #ff6b00 !important;
    outline: 0 !important;
    box-shadow: 0 0 0 1px #ff6b00 !important;
}

.bootstrap-select .dropdown-menu {
    border-color: #e1e3e7;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(16, 24, 40, 0.16);
}

.bootstrap-select .dropdown-menu > .inner > li.selected > a,
.bootstrap-select .dropdown-menu > .inner > li.selected > a:focus {
    background-color: #ff6b00;
    color: #ffffff;
}

.bootstrap-select .dropdown-menu > .inner > li:not(.selected) > a:focus,
.bootstrap-select .dropdown-menu > .inner > li:not(.selected) > a:hover,
.bootstrap-select .dropdown-menu > .inner > li.active:not(.selected) > a {
    background-color: #fde7d7;
    color: #191b22;
}

body,
body * {
    cursor: default;
}

body a[href],
body a[href] *,
body button:not(:disabled),
body button:not(:disabled) *,
body input[type="button"],
body input[type="submit"],
body input[type="reset"],
body [role="button"],
body [role="button"] *,
body [onclick],
body [onclick] * {
    cursor: pointer;
}

input:not([type]),
input[type="text"],
input[type="search"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="date"],
input[type="datetime-local"],
input[type="month"],
input[type="time"],
input[type="week"],
textarea,
[contenteditable=""],
[contenteditable="true"],
[contenteditable="plaintext-only"],
[role="textbox"] {
    cursor: text;
}