/* =========================================================================
   Vendo Digital brand theme  (VD 2026 Brand Sheet)
   Loaded last so it overrides the base template. Palette:
     Vendo Green (mint) #8EFEBB  | interactive green #10A96B / #0B8A55
     Vendo Sage #09221F | Vendo Black #051412 | Charcoal #2C2C2C | Gray #ABABAB
   Typography: Manrope (primary), Instrument Sans (secondary / italic)
   ========================================================================= */

:root {
    --vendo-green: #8EFEBB;
    --vendo-green-600: #10A96B;
    --vendo-green-700: #0B8A55;
    --vendo-sage: #09221F;
    --vendo-black: #051412;
    --vendo-charcoal: #2C2C2C;
    --vendo-gray: #ABABAB;
    --first-font: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* Force the template's theme colour to Vendo green regardless of theme class */
body[class] {
    --theme-color: var(--vendo-green-600) !important;
    --light-color: rgba(16, 169, 107, 0.12) !important;
    --color-customColor: var(--vendo-green-600) !important;
    --support-svg-clr: var(--vendo-green-600) !important;
}

/* ----------------------------- Typography ------------------------------ */
body,
button,
input,
select,
textarea,
.btn,
.dash-sidebar,
.dash-header,
.custom-header,
.form-control,
.form-select {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.dash-caption,
.page-header h2,
.card-title {
    font-family: 'Manrope', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.2px;
}

/* Instrument Sans for italic / secondary accents */
em, i.accent, .text-accent-italic, blockquote {
    font-family: 'Instrument Sans', Georgia, serif !important;
    font-style: italic;
}

/* ------------------------- Admin: dark sidebar ------------------------- */
.dash-sidebar,
.dash-sidebar.light-sidebar {
    background: var(--vendo-black) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.dash-sidebar .navbar-content,
.dash-sidebar .m-header,
.dash-sidebar .logo-col,
.dash-sidebar .dash-logo {
    background: transparent !important;
    border-color: rgba(255, 255, 255, 0.06) !important;
}

.dash-sidebar .dash-caption,
.dash-sidebar .dash-navbar .dash-caption {
    color: #647671 !important;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    font-size: 11px;
}

.dash-sidebar .dash-navbar > .dash-item > .dash-link {
    color: #C2CBC8 !important;
    border-radius: 10px;
}

.dash-sidebar .dash-navbar > .dash-item > .dash-link i {
    color: #8a9793 !important;
}

.dash-sidebar .dash-navbar > .dash-item:hover > .dash-link {
    background: rgba(142, 254, 187, 0.10) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.dash-sidebar .dash-navbar > .dash-item:hover > .dash-link i {
    color: var(--vendo-green) !important;
}

/* Active item: green fill (from base) — keep text/icon crisp white */
.dash-sidebar .dash-navbar > .dash-item.active > .dash-link,
.dash-sidebar .dash-navbar > .dash-item.active > .dash-link i,
.dash-sidebar .dash-navbar > .dash-item:active > .dash-link,
.dash-sidebar .dash-navbar > .dash-item:focus > .dash-link {
    color: #ffffff !important;
}

/* Submenu links */
.dash-sidebar .dash-item .dash-submenu .dash-item > .dash-link {
    color: #97a3a0 !important;
}
.dash-sidebar .dash-item .dash-submenu .dash-item > .dash-link:hover,
.dash-sidebar .dash-item .dash-submenu .dash-item.active > .dash-link {
    color: var(--vendo-green) !important;
}

/* Sidebar logo sizing */
.dash-sidebar .logo-col img,
.dash-sidebar .m-header img {
    max-width: 150px;
    height: auto;
}

/* --------------------- Frontend: dark top header ---------------------- */
.custom-header {
    background-color: var(--vendo-black) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.custom-header .main-nav li.nav-item a,
.custom-header .nav-link,
.custom-header .drp-language a.dropdown-toggle,
.custom-header .drp-text {
    color: #C2CBC8 !important;
    font-weight: 600;
}

.custom-header .main-nav li.nav-item.active a,
.custom-header .main-nav li.nav-item a:hover,
.custom-header .nav-link:hover {
    color: var(--vendo-green) !important;
}

.custom-header .login-btn {
    background: var(--vendo-green) !important;
    color: var(--vendo-black) !important;
    border-radius: 10px;
    padding: 9px 20px;
    font-weight: 700;
    border: none;
    transition: background .15s ease;
}
.custom-header .login-btn:hover {
    background: #7af0ac !important;
    color: var(--vendo-black) !important;
}

.custom-header .mobile-menu-btn svg path {
    fill: #ffffff !important;
}

.custom-header .logo-col img {
    max-width: 150px;
}

/* --------------------------- Primary buttons -------------------------- */
/* Signature Vendo CTA: mint fill with near-black label */
.btn-primary,
.btn.btn-primary {
    background: var(--vendo-green) !important;
    border-color: var(--vendo-green) !important;
    color: var(--vendo-black) !important;
    font-weight: 700 !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn.btn-primary:hover {
    background: #7af0ac !important;
    border-color: #7af0ac !important;
    color: var(--vendo-black) !important;
    box-shadow: 0 6px 16px rgba(16, 169, 107, 0.30) !important;
}
.btn-primary i,
.btn-primary span:not(.badge) {
    color: var(--vendo-black) !important;
}

/* Outline primary */
.btn-outline-primary {
    color: var(--vendo-green-700) !important;
    border-color: var(--vendo-green-600) !important;
}
.btn-outline-primary:hover {
    background: var(--vendo-green-600) !important;
    border-color: var(--vendo-green-600) !important;
    color: #fff !important;
}

/* --------------------------- Links & accents ------------------------- */
a { color: var(--vendo-green-700); }
a:hover { color: var(--vendo-green-600); }
.text-primary { color: var(--vendo-green-600) !important; }

/* Form focus rings */
.form-control:focus,
.form-select:focus,
.choices__inner:focus,
.ck.ck-editor__editable:focus {
    border-color: var(--vendo-green-600) !important;
    box-shadow: 0 0 0 0.2rem rgba(16, 169, 107, 0.18) !important;
}

/* Form check / switches */
.form-check-input:checked {
    background-color: var(--vendo-green-600) !important;
    border-color: var(--vendo-green-600) !important;
}

/* --------------------------- Misc components ------------------------- */
/* Home floating chat widget header uses bg-primary — keep on dark brand */
.chat_header .chat_option,
.chat_header .chat_option.bg-primary {
    background: var(--vendo-black) !important;
    color: #fff !important;
}
.chat_header .chat_option img { max-width: 120px; }

/* Centered auth logo (e.g. 2FA) sits on a light page — give it a dark pill */
body.ticket-page-sec .logo-col.mx-auto {
    background: var(--vendo-black);
    padding: 14px 22px;
    border-radius: 14px;
    display: inline-block;
}

/* Pagination / active states */
.pagination .page-item.active .page-link {
    background-color: var(--vendo-green-600) !important;
    border-color: var(--vendo-green-600) !important;
    color: #fff !important;
}

/* Selection colour */
::selection { background: rgba(142, 254, 187, 0.45); }

/* -------------------- Cookie consent (Orest Bida v2) ------------------ */
#cc--main #c-p-bn,
#cc--main #s-all-bn,
#c-p-bn, #s-all-bn {
    background: var(--vendo-green) !important;
    color: var(--vendo-black) !important;
    border: 1px solid var(--vendo-green) !important;
    font-weight: 700 !important;
}
#c-p-bn:hover, #s-all-bn:hover {
    background: #7af0ac !important;
}
#c-s-bn, #s-rall-bn {
    background: rgba(16, 169, 107, 0.10) !important;
    color: var(--vendo-green-700) !important;
    border: 1px solid rgba(16, 169, 107, 0.30) !important;
    font-weight: 600 !important;
}
#c-s-bn:hover, #s-rall-bn:hover {
    background: rgba(16, 169, 107, 0.18) !important;
}
#cm .c-bl .b-tl,
#s-ttl, #c-ttl { color: var(--vendo-black) !important; }
.cc_div .b-tg .c-tgl:checked ~ .c-tg { background: var(--vendo-green-600) !important; }

/* Dashboard alert pulse (from Vendo Support Console design) */
@keyframes vdpulse { 0%,100% { box-shadow:0 0 0 0 rgba(16,169,107,.5);} 50% { box-shadow:0 0 0 7px rgba(16,169,107,0);} }

/* Console sidebar (shared admin shell) */
.vd-console-side .vd-side-link:hover:not(.active){ background:rgba(255,255,255,.06)!important; color:#ffffff!important; }
.vd-console-side .navbar-content::-webkit-scrollbar{ width:6px; }
.vd-console-side .navbar-content::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.12); border-radius:3px; }
.dash-header .vd-topsearch:focus{ border-color:#10A96B!important; background:#FFFFFF!important; }

/* ===================== Admin console shell (all admin tabs) ===================== */
body.vd-admin { background:#E9EEEB !important; }
.vd-wrap { padding:24px; min-height:100vh; }
.vd-wrap .vd-shell { display:flex; align-items:stretch; min-height:calc(100vh - 48px); background:#F5F8F6; background-image:linear-gradient(90deg, #051412 0, #051412 236px, #F5F8F6 236px); border:1px solid #E2E8E5; border-radius:20px; overflow:hidden; overflow:clip; box-shadow:0 30px 70px -34px rgba(5,20,18,.35); }
.vd-side { flex:none; width:236px; display:flex; flex-direction:column; background:#051412; padding:20px 14px; line-height:1.5; }
/* Keep the sidebar pinned to the viewport on long pages so the nav and user footer stay put */
@supports (overflow: clip) { .vd-side { position:sticky; top:24px; align-self:flex-start; height:calc(100vh - 48px); } }
.vd-top { line-height:1.5; }
.vd-side-head { padding:0 8px 18px; }
.vd-side-tag { margin-top:5px; font-family:'Instrument Sans',sans-serif; font-size:9px; letter-spacing:.24em; text-transform:uppercase; color:#7E938C; }
.vd-side-nav { display:flex; flex-direction:column; gap:2px; overflow-y:auto; flex:1; min-height:0; }
.vd-side-link { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-radius:10px; font-size:13.5px; font-weight:600; color:#C2D2CD; text-decoration:none; }
.vd-side-link:hover { background:rgba(255,255,255,.06); color:#ffffff; }
.vd-side-link.active { background:#8EFEBB; color:#051412; font-weight:700; }
.vd-side-count { padding:1px 7px; border-radius:999px; font-size:11px; font-weight:700; background:rgba(142,254,187,.16); color:#8EFEBB; }
.vd-side-link.active .vd-side-count { background:rgba(5,20,18,.16); color:#051412; }
.vd-side-foot { flex:none; display:flex; align-items:center; gap:10px; margin-top:8px; padding:14px 8px 4px; border-top:1px solid rgba(255,255,255,.08); }
.vd-side-avatar { flex:none; display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:999px; background:#8EFEBB; color:#051412; font-size:12px; font-weight:800; }
.vd-side-user { display:flex; flex-direction:column; min-width:0; }
.vd-side-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12.5px; font-weight:700; color:#fff; }
.vd-side-role { font-family:'Instrument Sans',sans-serif; font-size:11px; color:#7E938C; }
.vd-side-signout { margin-left:auto; font-family:'Instrument Sans',sans-serif; font-size:11.5px; font-weight:600; color:#8EFEBB; text-decoration:none; white-space:nowrap; }
.vd-main { flex:1; min-width:0; display:flex; flex-direction:column; }
.vd-top { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; padding:16px 24px; background:#fff; border-bottom:1px solid #E2E8E5; }
.vd-top-title { font-size:19px; font-weight:800; letter-spacing:-.02em; color:#051412; font-family:'Manrope',sans-serif; }
.vd-top-sub { margin:2px 0 0; padding:0; list-style:none; display:flex; gap:8px; flex-wrap:wrap; font-family:'Instrument Sans',sans-serif; font-size:12.5px; color:#6B7A75; }
.vd-top-sub li { list-style:none; }
.vd-top-sub li a { color:#0E6F66; text-decoration:none; }
.vd-top-r { flex:none; display:flex; align-items:center; gap:10px; }
.vd-topsearch { width:280px; max-width:44vw; padding:10px 13px; border:1px solid #DDE4E1; border-radius:10px; background:#F7FAF8; font-family:'Instrument Sans',sans-serif; font-size:13px; color:#051412; outline:none; }
.vd-topsearch:focus { border-color:#10A96B; background:#fff; }
.vd-top-action { padding:10px 16px; border-radius:10px; background:#09221F; color:#8EFEBB; font-size:13.5px; font-weight:700; text-decoration:none; border:0; white-space:nowrap; }
.vd-top-action:hover { background:#0E332E; color:#8EFEBB; }
.vd-content { padding:24px; }
@media (max-width:900px){ .vd-shell{ flex-direction:column; background-image:none !important; } .vd-side{ width:100%; position:static !important; height:auto !important; } .vd-side-nav{ flex-direction:row; flex-wrap:wrap; } }

/* Conversations: recolour the generic blue channel bubbles to Vendo green
   (leaves real channel brand colours like WhatsApp/Facebook untouched) */
.chat-wrapper-left .social-icon-wrp svg path[fill="#2675E2"],
.chat-wrapper-left .social-icon-wrp svg path[fill="#2976E2"],
.chat-header .social-icon-wrp svg path[fill="#2675E2"],
.chat-header .social-icon-wrp svg path[fill="#2976E2"] { fill:#10A96B !important; }
/* Ensure action-button icons stay dark on the mint primary buttons */
.vd-top-r .btn-primary i, .chat-header .btn-primary i, .btn-primary i.text-white, .btn-primary .text-white { color:#051412 !important; }

/* Breadcrumb in the admin top bar: centre the chevron divider between items */
.vd-top-sub li.breadcrumb-item { display:inline-flex; align-items:center; padding-left:0; margin:0; }
.vd-top-sub .breadcrumb-item + .breadcrumb-item::before { float:none; display:inline-flex; align-items:center; line-height:1; padding-right:8px; position:static; top:auto; }

/* SVG icons inside mint primary buttons: use Vendo black instead of white
   (base CSS hardcodes fill:#fff on chat header / info / send buttons) */
.btn-primary svg path[fill="white"],
.btn-primary svg path[fill="#fff"],
.btn-primary svg path[fill="#ffffff"],
.btn-primary svg path[fill="#FFFFFF"],
.header-right-col .btn-primary svg path,
.info-icon .btn-primary svg path,
.chat-footer-btn .btn-primary svg path,
.ticket-info-card .close-icon.btn-primary svg path { fill:#051412 !important; }
.btn-primary svg[stroke="white"],
.btn-primary svg[stroke="#fff"] { stroke:#051412 !important; }


/* ===================== Admin content area (all tabs, matches dashboard styling) ===================== */
.vd-content { font-family:'Manrope',system-ui,sans-serif; }
.vd-content h6, .vd-content .h6 { font-size:13.5px; font-weight:700; color:#051412; }

/* Section sub-nav */
.vd-content .setting-sidebar { padding:8px; background:#fff; border:1px solid #E2E8E5 !important; border-radius:14px; box-shadow:none !important; }
.vd-content .setting-sidebar .list-group-item { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0; padding:10px 12px; border:0 !important; border-radius:10px; background:transparent; font-size:13.5px; font-weight:600; color:#3E4E4A; }
.vd-content .setting-sidebar .list-group-item + .list-group-item { margin-top:2px; }
.vd-content .setting-sidebar .list-group-item:hover { background:#F2F7F4; color:#051412; }
.vd-content .setting-sidebar .list-group-item.active { background:#8EFEBB !important; color:#051412 !important; font-weight:700; }
.vd-content .setting-sidebar .list-group-item .float-end { float:none !important; display:inline-flex; color:#7C8F89; }
.vd-content .setting-sidebar .list-group-item.active .float-end { color:#051412; }

/* Cards */
.vd-content .card { margin-bottom:18px; background:#fff; border:1px solid #E2E8E5 !important; border-radius:14px; box-shadow:none !important; overflow:hidden; }
.vd-content .card-header { padding:16px 20px; background:#fff; border-bottom:1px solid #EDF2EF; }
.vd-content .card-header h5, .vd-content .card-header .h5, .vd-content .card-header h4 { margin:0; font-size:15px; font-weight:800; letter-spacing:-.01em; color:#051412; }
.vd-content .card-header h5:after, .vd-content .card-header .h5:after, .vd-content .card-header h4:after { display:none !important; content:none !important; }
.vd-content .card-header small, .vd-content .card-header p, .vd-content .card-header .text-danger small { font-family:'Instrument Sans',sans-serif; font-size:12px; color:#6B7A75 !important; }
.vd-content .card-header a.text-blue, .vd-content .card-header a.text-blue small { color:#0E6F66 !important; }
.vd-content .card-body { padding:20px; }
.vd-content .card-footer { padding:14px 20px; background:#FAFCFB; border-top:1px solid #EDF2EF; }
.vd-content .small-title { font-size:13.5px !important; font-weight:700 !important; color:#051412; }
/* Nested cards (logos, customizer tiles, notification toggles) */
.vd-content .card .card { margin-bottom:0; background:#FAFCFB; border-radius:12px; }
.vd-content .card .card .card-header { padding:12px 16px; background:transparent; }
.vd-content .card .card .card-body { padding:16px; }
.vd-content .setting-logo-box .logo-content { border:1px solid #E2E8E5; border-radius:10px; background:#F5F8F6; }
.vd-content #logo-settings .col-lg-4:nth-child(-n+2) .setting-logo-box .logo-content { background:#051412; border-color:#051412; }

/* Form fields */
.vd-content .form-label, .vd-content .col-form-label, .vd-content label { font-size:13px; font-weight:600; color:#2C2C2C; }
.vd-content .form-check-label { font-family:'Instrument Sans',sans-serif; font-size:13px; font-weight:500; color:#3E4E4A; }
.vd-content .form-control, .vd-content .form-select, .vd-content .choices__inner, .vd-content .input-group-text { min-height:0; padding:10px 13px; background:#fff; border:1px solid #DDE4E1 !important; border-radius:10px !important; box-shadow:none !important; font-family:'Instrument Sans',sans-serif; font-size:13.5px; color:#051412; }
.vd-content .form-select { padding-right:2.2rem; }
.vd-content .form-control:focus, .vd-content .form-select:focus, .vd-content .choices.is-focused .choices__inner { border-color:#10A96B !important; }
.vd-content .form-control::placeholder { color:#8A9A95; }
.vd-content .form-control[readonly], .vd-content .form-control:disabled { background:#F5F8F6; color:#3E4E4A; }
.vd-content .input-group > .form-control { border-top-right-radius:0 !important; border-bottom-right-radius:0 !important; }
.vd-content .input-group > .input-group-text { background:#F5F8F6; color:#3E4E4A; border-left:0 !important; border-top-left-radius:0 !important; border-bottom-left-radius:0 !important; }
.vd-content .text-danger { color:#B42318 !important; }
.vd-content .form-text, .vd-content .text-muted, .vd-content small { font-family:'Instrument Sans',sans-serif; font-size:11.5px; }

/* Buttons */
.vd-content .btn { padding:10px 16px; border-radius:10px !important; box-shadow:none !important; font-size:13.5px; font-weight:700 !important; }
.vd-content .btn-sm { padding:7px 11px; font-size:12.5px; }
.vd-content .btn-primary, .vd-content .btn.btn-primary, .vd-content .choose-files .bg-primary { background:#09221F !important; border-color:#09221F !important; color:#8EFEBB !important; }
.vd-content .btn-primary:hover, .vd-content .btn.btn-primary:hover, .vd-content .choose-files .bg-primary:hover { background:#0E332E !important; border-color:#0E332E !important; color:#8EFEBB !important; }
.vd-content .btn-primary i, .vd-content .btn-primary span, .vd-content .choose-files .bg-primary i { color:#8EFEBB !important; }
.vd-content .btn-primary svg path[fill] { fill:#8EFEBB !important; }
.vd-content .btn-primary svg[stroke], .vd-content .btn-primary svg path[stroke] { stroke:#8EFEBB !important; }
.vd-content .info-icon .btn-primary svg path, .vd-content .close-icon.btn-primary svg path { fill:#8EFEBB !important; }
.vd-content .choose-files .bg-primary { display:inline-flex; align-items:center; gap:6px; padding:9px 14px; border-radius:10px; font-size:12.5px; font-weight:700; cursor:pointer; }
.vd-content .btn-light, .vd-content .btn-secondary, .vd-content .btn-outline-secondary { background:#fff !important; border:1px solid #DDE4E1 !important; color:#051412 !important; }
.vd-content .btn-light:hover, .vd-content .btn-secondary:hover { background:#F2F7F4 !important; border-color:#09221F !important; }
/* Segmented choice (storage driver) */
.vd-content .btn-outline-primary { background:#fff !important; border:1px solid #DDE4E1 !important; color:#3E4E4A !important; font-weight:600 !important; }
.vd-content .btn-outline-primary:hover { background:#F2F7F4 !important; border-color:#09221F !important; color:#051412 !important; }
.vd-content .btn-check:checked + .btn-outline-primary, .vd-content .btn-check:active + .btn-outline-primary { background:#8EFEBB !important; border-color:#09221F !important; color:#051412 !important; font-weight:700 !important; }
/* Pills (notification modules) */
.vd-content .nav-pills .nav-link { padding:8px 14px; border-radius:9px; background:#F2F7F4; font-size:13px; font-weight:600; color:#3E4E4A; }
.vd-content .nav-pills .nav-link.active { background:#8EFEBB !important; color:#051412 !important; font-weight:700; }
/* Icon action buttons (tables) */
.vd-content .btn-info, .vd-content .bg-info.btn, .vd-content a.bg-info { background:#fff !important; border:1px solid #DDE4E1 !important; color:#0E6F66 !important; }
.vd-content .btn-danger, .vd-content .bg-danger.btn, .vd-content a.bg-danger { background:#fff !important; border:1px solid #DDE4E1 !important; color:#B42318 !important; }
.vd-content .btn-info i, .vd-content .bg-info i { color:#0E6F66 !important; }
.vd-content .btn-danger i, .vd-content .bg-danger i { color:#B42318 !important; }
.vd-content .btn-info:hover, .vd-content .btn-danger:hover { background:#F2F7F4 !important; }

/* Switches and checkboxes */
.vd-content .form-check-input { border:1px solid #C9D4CF; background-color:#E2E8E5; box-shadow:none !important; }
.vd-content .form-switch .form-check-input { width:2.4em; height:1.3em; }
.vd-content .form-check-input:checked { background-color:#09221F !important; border-color:#09221F !important; }
.vd-content .custom-control-input:checked ~ .custom-control-label::before { background-color:#09221F !important; border-color:#09221F !important; }
.vd-content .switch.btn { min-width:74px; border:1px solid #DDE4E1 !important; }
.vd-content .switch-on.btn-primary { background:#09221F !important; color:#8EFEBB !important; }
.vd-content .switch-off.btn-light { background:#F2F7F4 !important; color:#3E4E4A !important; border:0 !important; }
.vd-content .switch-handle { border-radius:8px !important; }

/* Multi-select chips */
.vd-content .choices__list--multiple .choices__item { padding:3px 8px; border:0 !important; border-radius:7px; background:#8EFEBB !important; color:#051412 !important; font-size:12px; font-weight:700; }
.vd-content .choices__list--multiple .choices__item .choices__button { border-left:1px solid rgba(5,20,18,.25) !important; filter:brightness(0); opacity:.7; }

/* Tables */
.vd-content table thead th { padding:10px 12px; background:transparent; border-bottom:1px solid #EDF2EF; font-family:'Instrument Sans',sans-serif; font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#7C8F89; }
.vd-content table td { padding:12px; border-color:#EDF2EF; vertical-align:middle; font-family:'Instrument Sans',sans-serif; font-size:13px; color:#3E4E4A; }
.vd-content .btn-primary.send_email { background:#fff !important; border:1px solid #DDE4E1 !important; color:#051412 !important; }
.vd-content .btn-primary.send_email:hover { background:#F2F7F4 !important; border-color:#09221F !important; color:#051412 !important; }


/* ---- Sub-nav cards (Category / Priority setup menu) ---- */
.vd-content .card.sticky-top { padding:8px; }
.vd-content .card.sticky-top .list-group-item { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0; padding:10px 12px; border:0 !important; border-radius:10px; background:transparent; font-size:13.5px; font-weight:600; color:#3E4E4A; }
.vd-content .card.sticky-top .list-group-item + .list-group-item { margin-top:2px; }
.vd-content .card.sticky-top .list-group-item:hover { background:#F2F7F4; color:#051412; }
.vd-content .card.sticky-top .list-group-item.active { background:#8EFEBB !important; color:#051412 !important; font-weight:700; }
.vd-content .card.sticky-top .list-group-item .float-end { float:none !important; display:inline-flex; color:#7C8F89; }
.vd-content .card.sticky-top .list-group-item.active .float-end { color:#051412; }

/* ---- Data tables (simple-datatables) ---- */
.vd-content .card-body.table-border-style { padding:20px; }
.vd-content .dataTable-top { padding:0 0 16px; }
.vd-content .dataTable-dropdown label { display:inline-flex; align-items:center; gap:10px; font-family:'Instrument Sans',sans-serif; font-size:13px; color:#6B7A75; }
.vd-content .dataTable-selector { width:auto; padding:8px 30px 8px 12px; }
.vd-content .dataTable-input { width:240px; max-width:100%; padding:9px 12px; }
.vd-content .table { margin-bottom:0; }
.vd-content .table thead th, .vd-content .dataTable-table thead th { padding:10px 12px; background:#FAFCFB; border-top:0; border-bottom:1px solid #EDF2EF; font-family:'Instrument Sans',sans-serif; font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#7C8F89; }
.vd-content .table thead th:first-child { border-top-left-radius:10px; border-bottom-left-radius:10px; }
.vd-content .table thead th:last-child { border-top-right-radius:10px; border-bottom-right-radius:10px; }
.vd-content .table tbody td { padding:12px; border-color:#EDF2EF; vertical-align:middle; font-family:'Instrument Sans',sans-serif; font-size:13px; color:#3E4E4A; }
.vd-content .table tbody tr:last-child td { border-bottom:0; }
.vd-content .table tbody tr:hover td { background:#FAFCFB; }
.vd-content .dataTable-sorter::before, .vd-content .dataTable-sorter::after { opacity:.35; }
.vd-content .dataTable-bottom { padding:14px 0 0; }
.vd-content .dataTable-info { font-family:'Instrument Sans',sans-serif; font-size:12.5px; color:#6B7A75; }
.vd-content .dataTable-pagination a { padding:6px 10px; border-radius:8px; font-family:'Instrument Sans',sans-serif; font-size:12.5px; color:#3E4E4A; }
.vd-content .dataTable-pagination .active a { background:#8EFEBB; color:#051412; font-weight:700; }

/* ---- Row action buttons: neutral outlined squares with coloured icons ---- */
.vd-content .btn.bg-info, .vd-content .btn.bg-warning, .vd-content .btn.bg-danger, .vd-content .btn.bg-success, .vd-content .btn.bg-secondary, .vd-content .btn.bg-primary, .vd-content .btn.btn-icon, .vd-content .btn.btn-icon.btn-primary { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; padding:0; margin:0 3px !important; background:#fff !important; border:1px solid #DDE4E1 !important; border-radius:9px !important; box-shadow:none !important; font-size:14px; line-height:1; color:#3E4E4A !important; }
.vd-content .btn.bg-info:hover, .vd-content .btn.bg-warning:hover, .vd-content .btn.bg-danger:hover, .vd-content .btn.bg-success:hover, .vd-content .btn.bg-secondary:hover, .vd-content .btn.bg-primary:hover, .vd-content .btn.btn-icon:hover { background:#F2F7F4 !important; border-color:#09221F !important; }
.vd-content .btn.bg-info, .vd-content .btn.bg-info *, .vd-content .btn.bg-info .text-white { color:#0E6F66 !important; }
.vd-content .btn.bg-primary, .vd-content .btn.bg-primary *, .vd-content .btn.btn-icon.btn-primary, .vd-content .btn.btn-icon.btn-primary * { color:#0E6F66 !important; }
.vd-content .btn.bg-warning, .vd-content .btn.bg-warning *, .vd-content .btn.bg-warning .text-white { color:#3E4E4A !important; }
.vd-content .btn.bg-danger, .vd-content .btn.bg-danger *, .vd-content .btn.bg-danger .text-white { color:#B42318 !important; }
.vd-content .btn.bg-success, .vd-content .btn.bg-success *, .vd-content .btn.bg-success .text-white { color:#10A96B !important; }
.vd-content .btn.bg-secondary, .vd-content .btn.bg-secondary *, .vd-content .btn.bg-secondary .text-white { color:#8A9A95 !important; }
.vd-content .action-btn-wrp { gap:0 !important; }

/* ---- Badges / status chips ---- */
.vd-content .badge { padding:5px 10px !important; border-radius:999px; font-family:'Instrument Sans',sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0; line-height:1.2; }
.vd-content .badge.bg-primary, .vd-content .badge.bg-success { background:#8EFEBB !important; color:#051412 !important; }
.vd-content .badge.bg-danger { background:#FDE8E8 !important; color:#B42318 !important; }
.vd-content .badge.bg-warning { background:#FFF4D6 !important; color:#8A5A00 !important; }
.vd-content .badge.bg-info { background:#E1F3F1 !important; color:#0E6F66 !important; }
.vd-content .badge.bg-secondary, .vd-content .badge.bg-light { background:#EEF2F0 !important; color:#3E4E4A !important; }

/* ---- Category tree ---- */
.vd-content .category-menu, .vd-content .category-menu ul { margin:0; padding-left:0; list-style:none; }
.vd-content .category-menu li { min-width:0; margin-bottom:8px; list-style:none; }
.vd-content .category-menu .sub { margin:8px 0 0 12px; padding-left:22px; border-left:2px solid #EDF2EF; }
.vd-content .category-menu .sub li { list-style:none; }
.vd-content .category-menu li .category-item { padding:10px 14px; background:#FAFCFB; border:1px solid #E2E8E5; border-radius:10px; font-size:13.5px; font-weight:600; color:#051412; }
.vd-content .category-menu .action-btn form { margin:0; }

/* ---- Popup modals (create / edit forms) ---- */
.vd-admin .modal-content { border:1px solid #E2E8E5; border-radius:16px; box-shadow:0 30px 70px -34px rgba(5,20,18,.35); font-family:'Manrope',system-ui,sans-serif; }
.vd-admin .modal-header { padding:16px 20px; border-bottom:1px solid #EDF2EF; }
.vd-admin .modal-title { font-size:16px; font-weight:800; letter-spacing:-.01em; color:#051412; }
.vd-admin .modal-body { padding:20px; }
.vd-admin .modal-footer { padding:14px 20px; background:#FAFCFB; border-top:1px solid #EDF2EF; }
.vd-admin .modal .form-label, .vd-admin .modal label { font-size:13px; font-weight:600; color:#2C2C2C; }
.vd-admin .modal .form-control, .vd-admin .modal .form-select { min-height:0; padding:10px 13px; border:1px solid #DDE4E1 !important; border-radius:10px !important; box-shadow:none !important; font-family:'Instrument Sans',sans-serif; font-size:13.5px; color:#051412; }
.vd-admin .modal .form-control:focus, .vd-admin .modal .form-select:focus { border-color:#10A96B !important; }
.vd-admin .modal .btn { padding:10px 16px; border-radius:10px !important; box-shadow:none !important; font-size:13.5px; font-weight:700 !important; }
.vd-admin .modal .btn-primary { background:#09221F !important; border-color:#09221F !important; color:#8EFEBB !important; }
.vd-admin .modal .btn-primary:hover { background:#0E332E !important; border-color:#0E332E !important; }
.vd-admin .modal .btn-secondary, .vd-admin .modal .btn-light { background:#fff !important; border:1px solid #DDE4E1 !important; color:#051412 !important; }

/* ---- Conversations (tickets) page ---- */
.vd-content .chat-main-wrapper { border:1px solid #E2E8E5; border-radius:14px; box-shadow:none !important; }
.vd-content .chat-wrapper-left .user li.active { background:#8EFEBB !important; border-radius:12px; }
.vd-content .chat-wrapper-left .user li.active::after { background:#09221F !important; }
.vd-content .chat-wrapper-left .user li.active .user-name, .vd-content .chat-wrapper-left .user li.active .user-info span, .vd-content .chat-wrapper-left .user li.active .user-info p, .vd-content .chat-wrapper-left .user li.active .chat-time { color:#051412 !important; }
.vd-content .chat-wrapper-left .user li.active .user-info span svg path { fill:#051412 !important; }
.vd-content .chat-wrapper-left .user li:not(.active):hover { background:#F2F7F4; border-radius:12px; }
.vd-content .chat-wrapper-left .social-chat .user-info .user-name { font-size:14px; font-weight:700; }
.vd-content .chat-wrapper-left .social-chat .user-info span, .vd-content .chat-wrapper-left .social-chat .user-info p { font-family:'Instrument Sans',sans-serif; font-size:12px; }
.vd-content .chat-wrapper-left .social-icon-wrp a, .vd-content .chat-wrapper-left .social-icon-wrp svg path, .vd-content .chat-header .social-icon-wrp svg path { color:#0E6F66 !important; fill:#0E6F66 !important; }
.vd-content .chat-wrapper-left .load-more-btn, .vd-content .chat-wrapper-left .no-more-btn { margin:12px auto 0; padding:9px 16px; border:1px solid #DDE4E1 !important; border-radius:10px; background:#fff !important; font-size:13px; font-weight:700; color:#051412 !important; }
.vd-content .chat-wrapper-left .load-more-btn:hover { background:#F2F7F4 !important; border-color:#09221F !important; }
.vd-content .ticket-number { padding:4px 9px !important; border-radius:999px; background:#8EFEBB !important; color:#051412 !important; font-family:'Instrument Sans',sans-serif; font-size:12px; font-weight:700; }
.vd-content .chat-wrapper-right .nice-select { background:#fff !important; border:1px solid #DDE4E1 !important; border-radius:10px; color:#051412 !important; font-weight:600; }
.vd-content .chat-wrapper-right .nice-select:after { border-color:#3E4E4A; }
.vd-content .nice-select .list-wrp { border:1px solid #E2E8E5; border-radius:10px; box-shadow:0 12px 30px -12px rgba(5,20,18,.25) !important; overflow:hidden; }
.vd-content .nice-select .option { font-family:'Instrument Sans',sans-serif; font-size:13px; }
.vd-content .nice-select .option:hover, .vd-content .nice-select .option.focus { background:#F2F7F4 !important; }
.vd-content .chat-header .btn-danger, .vd-content .chat-header .delete-icon, .vd-content .chat-wrapper-left .delete-icon { background:#fff !important; border:1px solid #DDE4E1 !important; color:#B42318 !important; }
.vd-content .chat-header .btn-danger svg path, .vd-content .chat-header .delete-icon svg path { fill:#B42318 !important; }
.vd-content .chat-header .btn, .vd-content .chat-header .info-icon .btn { border-radius:9px !important; }
.vd-content .chat-container .msg-box-content, .vd-content .chat-container .msg-box-inner { border-radius:12px; }
.vd-content .chat-wrapper-left .search-wrp input, .vd-content .chat-wrapper-left .nice-select { border-radius:10px; }

/* Page stylesheets (conversations) capitalise spans/labels globally; keep the shell's own casing */
.vd-side .vd-side-link span, .vd-side-name, .vd-side-role, .vd-side-count, .vd-top-title, .vd-top-sub li, .vd-top-sub li a { text-transform:none !important; }
.vd-content .chat-header .btn, .vd-content .info-icon .btn, .vd-content .close-icon.btn { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; padding:0; }
.vd-content .chat-header .btn svg, .vd-content .info-icon .btn svg, .vd-content .close-icon.btn svg { flex:none; }

/* Role badges: size to their text instead of the template's fixed 80px */
.vd-content .badge.role-badge { width:auto !important; white-space:nowrap; }
/* Conversation list names: regular weight */
.vd-content .chat-wrapper-left .social-chat .user-info .user-name { font-weight:500 !important; }
.vd-content .chat-wrapper-left .social-chat .user-info .chat-user.not-read { font-weight:600 !important; }
/* Top-bar icon buttons: dark background with mint icon, matching "New ticket" */
.vd-top-r .btn-primary, .vd-top-r .btn.btn-primary, .vd-top-r .btn-icon { display:inline-flex !important; align-items:center; justify-content:center; flex:none; box-sizing:border-box; width:34px !important; min-width:34px !important; max-width:34px; height:34px !important; margin:0; padding:0 !important; background:#09221F !important; border:1px solid #09221F !important; border-radius:9px !important; font-size:14px; line-height:1; box-shadow:none !important; color:#8EFEBB !important; }
.vd-top-r .btn-primary:hover, .vd-top-r .btn-icon:hover { background:#0E332E !important; border-color:#0E332E !important; }
.vd-top-r .btn-primary i, .vd-top-r .btn-icon i, .vd-top-r .btn-primary .text-white { color:#8EFEBB !important; }
.vd-top-r .btn-primary svg path, .vd-top-r .btn-primary svg path[fill] { fill:#8EFEBB !important; }
.vd-top-r .btn-primary svg[stroke], .vd-top-r .btn-primary svg path[stroke] { stroke:#8EFEBB !important; }

/* ---- Summernote rich-text editors (email templates, ticket replies, notes) ---- */
.vd-content .note-editor.note-frame, .vd-admin .modal .note-editor.note-frame { border:1px solid #DDE4E1 !important; border-radius:10px; box-shadow:none !important; overflow:hidden; }
.vd-content .note-editor .note-toolbar, .vd-admin .modal .note-editor .note-toolbar { padding:8px 10px; background:#FAFCFB; border-bottom:1px solid #EDF2EF; }
.vd-content .note-editor .note-btn-group, .vd-admin .modal .note-editor .note-btn-group { margin:0 6px 0 0; }
.vd-content .note-editor .btn, .vd-content .note-editor .note-btn, .vd-admin .modal .note-editor .btn, .vd-admin .modal .note-editor .note-btn { display:inline-flex; align-items:center; justify-content:center; width:auto; height:30px; min-width:30px; margin:0; padding:0 8px; background:#fff !important; border:1px solid #E2E8E5 !important; border-radius:7px !important; box-shadow:none !important; font-size:13px; font-weight:400 !important; line-height:1; color:#051412 !important; }
.vd-content .note-editor .note-btn:hover, .vd-content .note-editor .note-btn.active, .vd-admin .modal .note-editor .note-btn:hover, .vd-admin .modal .note-editor .note-btn.active { background:#F2F7F4 !important; border-color:#09221F !important; }
.vd-content .note-editor .note-btn i, .vd-admin .modal .note-editor .note-btn i { color:#051412 !important; }
.vd-content .note-editor .note-editing-area, .vd-admin .modal .note-editor .note-editing-area { position:relative; }
.vd-content .note-editor .note-editable, .vd-admin .modal .note-editor .note-editable { padding:14px 16px; background:#fff; font-family:'Instrument Sans',sans-serif; font-size:13.5px; line-height:1.55; color:#051412; }
.vd-content .note-editor .note-statusbar, .vd-admin .modal .note-editor .note-statusbar { background:#FAFCFB; border-top:1px solid #EDF2EF; }
.vd-content .note-editor .note-dropdown-menu, .vd-admin .modal .note-editor .note-dropdown-menu { border:1px solid #E2E8E5; border-radius:10px; box-shadow:0 12px 30px -12px rgba(5,20,18,.25); }
.vd-content .note-placeholder { color:#8A9A95; }
.vd-content .note-editor.note-frame .note-editing-area .note-editable, .vd-admin .modal .note-editor.note-frame .note-editing-area .note-editable { padding:14px 16px !important; }
.vd-content .note-editor .note-toolbar-wrapper, .vd-admin .modal .note-editor .note-toolbar-wrapper { height:auto !important; }
.vd-content .note-editor .note-toolbar, .vd-admin .modal .note-editor .note-toolbar { position:static !important; }

/* ---- Brand fonts in third-party widgets that ship their own font stacks ---- */
.cc_div, .cc_div *, #cc--main, #cc--main *, #cc_div, #cc_div * { font-family:'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important; }
.note-editor .note-toolbar *, .note-popover *, .note-modal *, .note-dropdown-menu * { font-family:'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important; }
.note-editor pre, .note-editor code, .note-editor kbd, .note-modal pre, .note-modal code, .note-modal kbd, .note-popover kbd { font-family:'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important; }
.modal kbd, .modal code, .modal pre, kbd, code, pre, samp { font-family:'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important; }