/* Josh Mode — colours driven by CSS variables set in helpdesk-theme-josh.js */

body[data-hd-theme="josh"] {
    background: var(--hd-josh-page-gradient-layer, #0d1117);
    color: var(--hd-josh-text, #e6edf3);
    font-family: var(--hd-josh-font-stack, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
    font-size: var(--hd-josh-base-font-size, 15px);
    position: relative;
    isolation: isolate;
}
body[data-hd-theme="josh"]::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image: var(--hd-josh-bg-image, none);
    background-size: var(--hd-josh-bg-image-fit, cover);
    background-position: var(--hd-josh-bg-image-position, center);
    background-repeat: no-repeat;
    opacity: var(--hd-josh-bg-image-opacity, 0);
}
/* Optional page texture (noise / grid / etc.) sits behind the optional photo overlay */
body[data-hd-theme="josh"]::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    opacity: 0;
    background-repeat: repeat;
    background-size: auto;
}
body[data-hd-theme="josh"][data-hd-josh-page-tex="noise"]::after {
    opacity: 0.16;
    background-size: 120px 120px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}
body[data-hd-theme="josh"][data-hd-josh-page-tex="grid"]::after {
    opacity: 0.22;
    background-size: 14px 14px;
    background-image: linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
}
body[data-hd-theme="josh"][data-hd-josh-page-tex="dots"]::after {
    opacity: 0.2;
    background-size: 10px 10px;
    background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1.5px);
}
body[data-hd-theme="josh"][data-hd-josh-page-tex="fabric"]::after {
    opacity: 0.18;
    background-size: 8px 8px;
    background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.04) 0, rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 3px), repeating-linear-gradient(-45deg, rgba(0, 0, 0, 0.06) 0, rgba(0, 0, 0, 0.06) 1px, transparent 1px, transparent 3px);
}
body[data-hd-theme="josh"][data-hd-josh-page-tex="none"]::after {
    content: none;
}

body[data-hd-theme="josh"] .helpdesk-bar {
    background: var(--hd-josh-header-bg, #161b22);
    border-bottom-color: var(--hd-josh-header-border, #30363d);
}
body[data-hd-theme="josh"] .hd-title { color: var(--hd-josh-text, #e6edf3); }
body[data-hd-theme="josh"] .hd-btn {
    background: var(--hd-josh-btn-bg, #21262d);
    color: var(--hd-josh-btn-text, #e6edf3);
    border-color: var(--hd-josh-header-border, #30363d);
}
body[data-hd-theme="josh"] .hd-btn.hd-btn-primary {
    background: var(--hd-josh-btn-primary-bg, #238636);
    color: var(--hd-josh-btn-primary-text, #fff);
    border-color: var(--hd-josh-btn-primary-bg, #238636);
}
body[data-hd-theme="josh"] .hd-dropdown,
body[data-hd-theme="josh"] .hd-reports-dropdown,
body[data-hd-theme="josh"] .hd-settings-dropdown {
    background: var(--hd-josh-modal-bg, #161b22);
    border-color: var(--hd-josh-card-border, #30363d);
}
body[data-hd-theme="josh"] .hd-dropdown a,
body[data-hd-theme="josh"] .hd-dropdown button,
body[data-hd-theme="josh"] .hd-reports-dropdown a,
body[data-hd-theme="josh"] .hd-settings-dropdown a {
    color: var(--hd-josh-text, #e6edf3);
}
body[data-hd-theme="josh"] .hd-dropdown > div:first-child,
body[data-hd-theme="josh"] .hd-dropdown-group {
    border-color: var(--hd-josh-card-border, #30363d);
    color: var(--hd-josh-text-muted, #8b949e);
}

/* Admin list + modals */
body[data-hd-theme="josh"] .helpdesk-filters-row {
    background: var(--hd-josh-filters-bg, var(--hd-josh-header-bg, #161b22));
    border-bottom-color: var(--hd-josh-header-border, #30363d);
}
body[data-hd-theme="josh"] .filters select,
body[data-hd-theme="josh"] .bulk-bar select {
    background: var(--hd-josh-input-bg, #0d1117);
    border-color: var(--hd-josh-input-border, #30363d);
    color: var(--hd-josh-text, #e6edf3);
}
body[data-hd-theme="josh"] .ticket-card {
    --ticket-card-fill: var(--hd-josh-card-bg, #161b22);
    background: var(--hd-josh-card-bg, #161b22);
    border-color: var(--hd-josh-card-border, #30363d);
    color: var(--hd-josh-text, #e6edf3);
}
body[data-hd-theme="josh"] .ticket-card .subject,
body[data-hd-theme="josh"] .ticket-card .ticket-meta {
    color: var(--hd-josh-text-muted, #8b949e);
}
body[data-hd-theme="josh"] .ticket-card.ticket-card-status-open { border-left-color: var(--hd-josh-status-open, #22c55e) !important; }
body[data-hd-theme="josh"] .ticket-card.ticket-card-status-in_progress { border-left-color: var(--hd-josh-status-in_progress, #0ea5e9) !important; }
body[data-hd-theme="josh"] .ticket-card.ticket-card-status-on_hold { border-left-color: var(--hd-josh-status-on_hold, #eab308) !important; }
body[data-hd-theme="josh"] .ticket-card.ticket-card-status-long_term_project { border-left-color: var(--hd-josh-status-long_term_project, #a855f7) !important; }
body[data-hd-theme="josh"] .ticket-card.ticket-card-status-closed { border-left-color: var(--hd-josh-status-closed, #94a3b8) !important; }
body[data-hd-theme="josh"] .ticket-card.ticket-card-status-archived { border-left-color: var(--hd-josh-status-archived, #64748b) !important; }
/* Age highlight on ticket cards — mode from data-hd-josh-age-style (see helpdesk-theme-josh.js). */
body[data-hd-theme="josh"][data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-fresh,
body[data-hd-theme="josh"]:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-fresh {
    background: linear-gradient(90deg, var(--hd-josh-new-fresh) 0%, var(--ticket-card-fill) 48%) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-recent,
body[data-hd-theme="josh"]:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-recent {
    background: linear-gradient(90deg, var(--hd-josh-new-recent) 0%, var(--ticket-card-fill) 50%) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-days,
body[data-hd-theme="josh"]:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-days {
    background: linear-gradient(90deg, var(--hd-josh-new-days) 0%, var(--ticket-card-fill) 51%) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-week,
body[data-hd-theme="josh"]:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-week {
    background: linear-gradient(90deg, var(--hd-josh-new-week) 0%, var(--ticket-card-fill) 52%) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-old,
body[data-hd-theme="josh"]:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-old {
    background: linear-gradient(90deg, var(--hd-josh-new-old) 0%, var(--ticket-card-fill) 54%) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-stale,
body[data-hd-theme="josh"]:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-stale {
    background: linear-gradient(90deg, var(--hd-josh-new-stale) 0%, var(--ticket-card-fill) 56%) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-fresh,
body[data-hd-theme="josh"][data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-recent,
body[data-hd-theme="josh"][data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-days,
body[data-hd-theme="josh"][data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-week,
body[data-hd-theme="josh"][data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-old,
body[data-hd-theme="josh"][data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-stale {
    background: var(--ticket-card-fill) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-fresh {
    background: var(--hd-josh-new-fresh) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-recent {
    background: var(--hd-josh-new-recent) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-days {
    background: var(--hd-josh-new-days) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-week {
    background: var(--hd-josh-new-week) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-old {
    background: var(--hd-josh-new-old) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-stale {
    background: var(--hd-josh-new-stale) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-fresh,
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-recent,
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-days,
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-week,
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-old,
body[data-hd-theme="josh"][data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-stale {
    background: var(--hd-josh-age-custom-solid, var(--ticket-card-fill)) !important;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-fresh {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-fresh) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-fresh) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-fresh) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-fresh) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-recent {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-recent) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-recent) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-recent) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-recent) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-days {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-days) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-days) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-days) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-days) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-week {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-week) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-week) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-week) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-week) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-old {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-old) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-old) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-old) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-old) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-stale {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-stale) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-stale) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-stale) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-stale) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-fresh {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-fresh) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-recent {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-recent) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-days {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-days) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-week {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-week) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-old {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-old) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-stale {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-stale) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-fresh {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-fresh) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-recent {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-recent) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-days {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-days) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-week {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-week) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-old {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-old) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light[data-hd-theme="josh"][data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-stale {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-stale) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}

body[data-hd-theme="josh"] .modal {
    background: var(--hd-josh-modal-bg, #161b22);
    border-color: var(--hd-josh-card-border, #30363d);
    color: var(--hd-josh-text, #e6edf3);
}
body[data-hd-theme="josh"] .modal-header {
    border-bottom-color: var(--hd-josh-card-border, #30363d);
}
body[data-hd-theme="josh"] .modal-header h2 { color: var(--hd-josh-text, #e6edf3); }
body[data-hd-theme="josh"] .modal-sidebar {
    background: var(--hd-josh-input-bg, #0d1117);
    border-color: var(--hd-josh-card-border, #30363d);
}
body[data-hd-theme="josh"] .modal-main,
body[data-hd-theme="josh"] .modal-body,
body[data-hd-theme="josh"] .ticket-meta {
    color: var(--hd-josh-text-muted, #8b949e);
}
body[data-hd-theme="josh"] .modal-sidebar .form-group label,
body[data-hd-theme="josh"] .modal-body label {
    color: var(--hd-josh-text-muted, #8b949e);
}
body[data-hd-theme="josh"] .modal-sidebar input,
body[data-hd-theme="josh"] .modal-sidebar select,
body[data-hd-theme="josh"] .modal-sidebar textarea,
body[data-hd-theme="josh"] .modal-main input,
body[data-hd-theme="josh"] .modal-main select,
body[data-hd-theme="josh"] .modal-main textarea {
    background: var(--hd-josh-input-bg, #0d1117);
    border-color: var(--hd-josh-input-border, #30363d);
    color: var(--hd-josh-text, #e6edf3);
}
body[data-hd-theme="josh"] .btn {
    background: var(--hd-josh-btn-bg, #21262d);
    color: var(--hd-josh-btn-text, #e6edf3);
    border-color: var(--hd-josh-card-border, #30363d);
}
body[data-hd-theme="josh"] .btn.btn-primary {
    background: var(--hd-josh-btn-primary-bg, #238636);
    color: var(--hd-josh-btn-primary-text, #fff);
    border-color: var(--hd-josh-btn-primary-bg, #238636);
}
body[data-hd-theme="josh"] #agentSidebar .modal-sidebar-footer {
    border-top-color: var(--hd-josh-card-border, #30363d);
}

/* Generic .card pages (preferences, ticket submitter, KB, etc.) */
body[data-hd-theme="josh"] .card {
    background: var(--hd-josh-card-bg, #161b22);
    border-color: var(--hd-josh-card-border, #30363d);
    color: var(--hd-josh-text, #e6edf3);
}
body[data-hd-theme="josh"] .card h2,
body[data-hd-theme="josh"] .card h1,
body[data-hd-theme="josh"] h1 {
    color: var(--hd-josh-text, #e6edf3);
}
body[data-hd-theme="josh"] .meta,
body[data-hd-theme="josh"] .pref-row .hint {
    color: var(--hd-josh-text-muted, #8b949e);
}
body[data-hd-theme="josh"] label { color: var(--hd-josh-text-muted, #8b949e); }
body[data-hd-theme="josh"] input,
body[data-hd-theme="josh"] select,
body[data-hd-theme="josh"] textarea {
    background: var(--hd-josh-input-bg, #0d1117);
    border-color: var(--hd-josh-input-border, #30363d);
    color: var(--hd-josh-text, #e6edf3);
}
body[data-hd-theme="josh"] .link { color: var(--hd-josh-link, #58a6ff); }
body[data-hd-theme="josh"] .btn-primary:not(.hd-btn) {
    background: var(--hd-josh-btn-primary-bg, #238636);
    color: var(--hd-josh-btn-primary-text, #fff);
}

body[data-hd-theme="josh"] .topbar {
    background: var(--hd-josh-header-bg, #161b22);
    border-bottom-color: var(--hd-josh-header-border, #30363d);
}

/* ── Live preview (preferences): same variables as Josh Mode, applied on .hd-josh-preview-root ── */
.hd-josh-preview-root {
    position: relative;
    isolation: isolate;
    border-radius: 10px;
    overflow: hidden;
    max-height: min(380px, 46vh);
    border: 1px solid var(--hd-josh-card-border, #30363d);
    background: var(--hd-josh-page-gradient-layer, #0d1117);
    color: var(--hd-josh-text, #e6edf3);
    font-family: var(--hd-josh-font-stack, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
    font-size: var(--hd-josh-base-font-size, 13px);
    line-height: 1.45;
    text-align: left;
    padding: 10px;
    cursor: default;
}
/* Preferences dock: no inner scroll — compact layout, page scroll only */
.pref-josh-preview-dock .hd-josh-preview-root {
    max-height: none;
    overflow: hidden;
    padding: 8px;
}
.pref-josh-preview-dock .hd-josh-preview-root .hd-jpv-cards {
    padding: 6px 0 8px;
}
.pref-josh-preview-dock .hd-josh-preview-root .hd-jpv-card-wrap {
    margin: 0 8px 5px;
}
.pref-josh-preview-dock .hd-josh-preview-root .ticket-card.hd-jpv-tc {
    padding: 7px 10px 7px 12px;
}
.pref-josh-preview-dock .hd-josh-preview-root .hd-jpv-foot,
.pref-josh-preview-dock .hd-josh-preview-root button.hd-jpv-foot {
    padding: 6px 10px 8px;
}
.pref-josh-preview-dock .hd-josh-preview-root button.helpdesk-bar.hd-jpv-compact {
    min-height: 40px;
    padding: 6px 10px;
}
.pref-josh-preview-dock .hd-josh-preview-root .helpdesk-filters-row.hd-jpv-filters,
.pref-josh-preview-dock .hd-josh-preview-root button.helpdesk-filters-row.hd-jpv-filters {
    padding: 6px 10px;
}
.hd-josh-preview-root::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background-image: var(--hd-josh-bg-image, none);
    background-size: var(--hd-josh-bg-image-fit, cover);
    background-position: var(--hd-josh-bg-image-position, center);
    background-repeat: no-repeat;
    opacity: var(--hd-josh-bg-image-opacity, 0);
}
.hd-josh-preview-root::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0;
    background-repeat: repeat;
}
.hd-josh-preview-root[data-hd-josh-page-tex="noise"]::after {
    opacity: 0.16;
    background-size: 120px 120px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}
.hd-josh-preview-root[data-hd-josh-page-tex="grid"]::after {
    opacity: 0.22;
    background-size: 14px 14px;
    background-image: linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
}
.hd-josh-preview-root[data-hd-josh-page-tex="dots"]::after {
    opacity: 0.2;
    background-size: 10px 10px;
    background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1.5px);
}
.hd-josh-preview-root[data-hd-josh-page-tex="fabric"]::after {
    opacity: 0.18;
    background-size: 8px 8px;
    background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.04) 0, rgba(255, 255, 255, 0.04) 1px, transparent 1px, transparent 3px), repeating-linear-gradient(-45deg, rgba(0, 0, 0, 0.06) 0, rgba(0, 0, 0, 0.06) 1px, transparent 1px, transparent 3px);
}
.hd-josh-preview-root[data-hd-josh-page-tex="none"]::after {
    content: none;
}
.hd-josh-preview-root .hd-jpv-stack {
    position: relative;
    z-index: 2;
    border-radius: 8px;
    overflow: hidden;
}
.hd-josh-preview-root .pref-josh-preview-hit {
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    font: inherit;
    text-align: inherit;
    color: inherit;
    display: block;
    box-sizing: border-box;
}
.hd-josh-preview-root .pref-josh-preview-hit:not(.hd-jpv-hit-abs) {
    width: 100%;
}
.hd-josh-preview-root button.helpdesk-bar.hd-jpv-compact {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.hd-josh-preview-root .hd-jpv-compact .hd-btn-sim {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    font-size: 0.86em;
    font-weight: 600;
    border-radius: 6px;
    border: 1px solid var(--hd-josh-header-border, #30363d);
    background: var(--hd-josh-btn-bg, #21262d);
    color: var(--hd-josh-btn-text, #e6edf3);
    pointer-events: none;
}
.hd-josh-preview-root .hd-jpv-compact .hd-btn-sim.hd-btn-primary {
    background: var(--hd-josh-btn-primary-bg, #238636);
    color: var(--hd-josh-btn-primary-text, #fff);
    border-color: var(--hd-josh-btn-primary-bg, #238636);
}
.hd-josh-preview-root .pref-josh-preview-hit.hd-jpv-hit-abs {
    width: 14px;
    z-index: 3;
}
.hd-josh-preview-root .pref-josh-preview-hit.hd-jpv-hit-abs--tint {
    left: 14px;
    right: 10px;
    width: auto;
}
.hd-josh-preview-root .pref-josh-preview-hit:focus-visible {
    outline: 2px solid var(--hd-josh-link, #58a6ff);
    outline-offset: 2px;
}
.hd-josh-preview-root .pref-josh-preview-hit:hover {
    box-shadow: inset 0 0 0 999px rgba(255, 255, 255, 0.04);
}
.hd-josh-preview-root .helpdesk-bar.hd-jpv-compact,
.hd-josh-preview-root button.helpdesk-bar.hd-jpv-compact {
    padding: 8px 12px;
    min-height: 44px;
    background: var(--hd-josh-header-bg, #161b22);
    border-bottom: 1px solid var(--hd-josh-header-border, #30363d);
}
.hd-josh-preview-root .hd-jpv-compact .hd-title {
    font-weight: 600;
    font-size: 1.07em;
    color: var(--hd-josh-text, #e6edf3);
    pointer-events: none;
}
.hd-josh-preview-root button.pref-josh-preview-hit.hd-jpv-compact > *,
.hd-josh-preview-root button.pref-josh-preview-hit.hd-jpv-filters > * {
    pointer-events: none;
}
.hd-josh-preview-root .helpdesk-filters-row.hd-jpv-filters,
.hd-josh-preview-root button.helpdesk-filters-row.hd-jpv-filters {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: var(--hd-josh-filters-bg, var(--hd-josh-header-bg, #161b22));
    border-bottom: 1px solid var(--hd-josh-header-border, #30363d);
    font-size: 12px;
    color: var(--hd-josh-text-muted, #8b949e);
}
.hd-josh-preview-root .hd-jpv-faux-select {
    padding: 5px 10px;
    border-radius: 6px;
    border: 1px solid var(--hd-josh-input-border, #30363d);
    background: var(--hd-josh-input-bg, #0d1117);
    color: var(--hd-josh-text, #e6edf3);
}
.hd-josh-preview-root .hd-jpv-cards {
    padding: 10px 0 12px;
}
.hd-josh-preview-root .hd-jpv-card-wrap {
    position: relative;
    margin: 0 10px 8px;
}
.hd-josh-preview-root .ticket-card.hd-jpv-tc {
    --ticket-card-fill: var(--hd-josh-card-bg, #161b22);
    display: block;
    margin: 0;
    padding: 10px 12px 10px 14px;
    border-radius: 8px;
    border: 1px solid var(--hd-josh-card-border, #30363d);
    border-left-width: 6px;
    border-left-style: solid;
    background: var(--hd-josh-card-bg, #161b22);
    color: var(--hd-josh-text, #e6edf3);
    position: relative;
    z-index: 1;
    pointer-events: none;
}
.hd-josh-preview-root .ticket-card.hd-jpv-tc .subject {
    display: block;
    font-weight: 600;
    margin-bottom: 4px;
    color: var(--hd-josh-text, #e6edf3);
}
.hd-josh-preview-root .ticket-card.hd-jpv-tc .ticket-meta {
    font-size: 12px;
    color: var(--hd-josh-text-muted, #8b949e);
}
.hd-josh-preview-root .ticket-card.ticket-card-status-open.hd-jpv-tc { border-left-color: var(--hd-josh-status-open, #22c55e) !important; }
.hd-josh-preview-root .ticket-card.ticket-card-status-in_progress.hd-jpv-tc { border-left-color: var(--hd-josh-status-in_progress, #0ea5e9) !important; }
.hd-josh-preview-root .ticket-card.ticket-card-status-on_hold.hd-jpv-tc { border-left-color: var(--hd-josh-status-on_hold, #eab308) !important; }
.hd-josh-preview-root .ticket-card.ticket-card-status-closed.hd-jpv-tc { border-left-color: var(--hd-josh-status-closed, #94a3b8) !important; }
.hd-josh-preview-root[data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-fresh.hd-jpv-tc,
.hd-josh-preview-root:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-fresh.hd-jpv-tc {
    background: linear-gradient(90deg, var(--hd-josh-new-fresh) 0%, var(--ticket-card-fill) 48%) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-recent.hd-jpv-tc,
.hd-josh-preview-root:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-recent.hd-jpv-tc {
    background: linear-gradient(90deg, var(--hd-josh-new-recent) 0%, var(--ticket-card-fill) 50%) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-days.hd-jpv-tc,
.hd-josh-preview-root:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-days.hd-jpv-tc {
    background: linear-gradient(90deg, var(--hd-josh-new-days) 0%, var(--ticket-card-fill) 51%) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-week.hd-jpv-tc,
.hd-josh-preview-root:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-week.hd-jpv-tc {
    background: linear-gradient(90deg, var(--hd-josh-new-week) 0%, var(--ticket-card-fill) 52%) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-old.hd-jpv-tc,
.hd-josh-preview-root:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-old.hd-jpv-tc {
    background: linear-gradient(90deg, var(--hd-josh-new-old) 0%, var(--ticket-card-fill) 54%) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="wash"] .ticket-card.ticket-card-age-stale.hd-jpv-tc,
.hd-josh-preview-root:not([data-hd-josh-age-style]) .ticket-card.ticket-card-age-stale.hd-jpv-tc {
    background: linear-gradient(90deg, var(--hd-josh-new-stale) 0%, var(--ticket-card-fill) 56%) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-fresh.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-recent.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-days.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-week.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-old.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="stripe"] .ticket-card.ticket-card-age-stale.hd-jpv-tc {
    background: var(--ticket-card-fill) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-fresh.hd-jpv-tc {
    background: var(--hd-josh-new-fresh) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-recent.hd-jpv-tc {
    background: var(--hd-josh-new-recent) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-days.hd-jpv-tc {
    background: var(--hd-josh-new-days) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-week.hd-jpv-tc {
    background: var(--hd-josh-new-week) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-old.hd-jpv-tc {
    background: var(--hd-josh-new-old) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="solid_tier"] .ticket-card.ticket-card-age-stale.hd-jpv-tc {
    background: var(--hd-josh-new-stale) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-fresh.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-recent.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-days.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-week.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-old.hd-jpv-tc,
.hd-josh-preview-root[data-hd-josh-age-style="solid_custom"] .ticket-card.ticket-card-age-stale.hd-jpv-tc {
    background: var(--hd-josh-age-custom-solid, var(--ticket-card-fill)) !important;
}
.hd-josh-preview-root[data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-fresh.hd-jpv-tc {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-fresh) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-fresh) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-fresh) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-fresh) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-recent.hd-jpv-tc {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-recent) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-recent) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-recent) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-recent) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-days.hd-jpv-tc {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-days) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-days) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-days) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-days) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-week.hd-jpv-tc {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-week) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-week) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-week) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-week) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-old.hd-jpv-tc {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-old) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-old) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-old) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-old) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="dapple"] .ticket-card.ticket-card-age-stale.hd-jpv-tc {
    background-color: var(--ticket-card-fill);
    background-image:
        radial-gradient(circle at 10px 8px, var(--hd-josh-new-stale) 1px, transparent 1.55px),
        radial-gradient(circle at 21px 18px, var(--hd-josh-new-stale) 0.9px, transparent 1.35px),
        radial-gradient(circle at 4px 17px, var(--hd-josh-new-stale) 0.8px, transparent 1.2px),
        linear-gradient(90deg, var(--hd-josh-new-stale) 0%, var(--ticket-card-fill) 55%);
    background-size: 27px 24px, 27px 24px, 27px 24px, auto;
    background-repeat: repeat, repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-fresh.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-fresh) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-recent.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-recent) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-days.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-days) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-week.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-week) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-old.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-old) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
.hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-stale.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(255, 255, 255, 0.05) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(255, 255, 255, 0.04) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-stale) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light .hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-fresh.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-fresh) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light .hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-recent.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-recent) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light .hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-days.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-days) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light .hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-week.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-week) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light .hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-old.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-old) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
body.light .hd-josh-preview-root[data-hd-josh-age-style="mesh"] .ticket-card.ticket-card-age-stale.hd-jpv-tc {
    background-image:
        repeating-linear-gradient(52deg, transparent 0 5px, rgba(0, 0, 0, 0.045) 5px 6px),
        repeating-linear-gradient(-38deg, transparent 0 7px, rgba(0, 0, 0, 0.035) 7px 8px),
        linear-gradient(90deg, var(--hd-josh-new-stale) 0%, var(--ticket-card-fill) 50%);
    background-repeat: repeat, repeat, no-repeat;
}
.hd-josh-preview-root .hd-jpv-foot,
.hd-josh-preview-root button.hd-jpv-foot {
    padding: 8px 12px 12px;
    font-size: 11px;
    color: var(--hd-josh-text-muted, #8b949e);
    width: 100%;
    text-align: left;
}
.hd-josh-preview-root .hd-jpv-foot a {
    color: var(--hd-josh-link, #58a6ff);
    font-weight: 600;
    text-decoration: none;
    pointer-events: none;
}
.hd-josh-preview-root .hd-jpv-fake-link {
    color: var(--hd-josh-link, #58a6ff);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ── Josh wins over body.dark / body.light from helpdesk-header.css, global-search.css, and page inline <style> (higher specificity) ── */
body.dark[data-hd-theme="josh"],
body.light[data-hd-theme="josh"] {
    background: var(--hd-josh-page-gradient-layer, #0d1117) !important;
    color: var(--hd-josh-text, #e6edf3) !important;
    font-family: var(--hd-josh-font-stack, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif) !important;
    font-size: var(--hd-josh-base-font-size, 15px) !important;
}
body.dark[data-hd-theme="josh"] .helpdesk-bar,
body.light[data-hd-theme="josh"] .helpdesk-bar {
    background: var(--hd-josh-header-bg, #161b22) !important;
    border-bottom-color: var(--hd-josh-header-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .hd-title,
body.light[data-hd-theme="josh"] .hd-title {
    color: var(--hd-josh-text, #e6edf3) !important;
}
body.dark[data-hd-theme="josh"] .hd-btn,
body.light[data-hd-theme="josh"] .hd-btn {
    background: var(--hd-josh-btn-bg, #21262d) !important;
    color: var(--hd-josh-btn-text, #e6edf3) !important;
    border-color: var(--hd-josh-header-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .hd-btn:hover,
body.light[data-hd-theme="josh"] .hd-btn:hover {
    filter: brightness(1.08);
}
body.dark[data-hd-theme="josh"] .helpdesk-bar .hd-btn.hd-btn-primary,
body.light[data-hd-theme="josh"] .helpdesk-bar .hd-btn.hd-btn-primary {
    background: var(--hd-josh-btn-primary-bg, #238636) !important;
    color: var(--hd-josh-btn-primary-text, #fff) !important;
    border-color: var(--hd-josh-btn-primary-bg, #238636) !important;
}
body.dark[data-hd-theme="josh"] .helpdesk-bar .hd-btn.hd-btn-salto,
body.light[data-hd-theme="josh"] .helpdesk-bar .hd-btn.hd-btn-salto {
    background: #fff !important;
    color: #1a1a1a !important;
    border: 2px solid #42a5f5 !important;
    box-shadow: 0 0 0 1px rgba(66, 165, 245, 0.28) !important;
}
body.dark[data-hd-theme="josh"] .helpdesk-bar .hd-btn.hd-btn-salto:hover,
body.light[data-hd-theme="josh"] .helpdesk-bar .hd-btn.hd-btn-salto:hover {
    background: #f3f9ff !important;
    border-color: #64b5f6 !important;
    filter: none;
}
body.dark[data-hd-theme="josh"] .helpdesk-bar .hd-btn.hd-btn-salto .hd-salto-mark--teal { fill: #00838f !important; }
body.dark[data-hd-theme="josh"] .helpdesk-bar .hd-btn.hd-btn-salto .hd-salto-mark--sky { fill: #4fc3f7 !important; }
body.dark[data-hd-theme="josh"] .hd-signin-custom,
body.light[data-hd-theme="josh"] .hd-signin-custom {
    background: var(--hd-josh-btn-bg, #21262d) !important;
    color: var(--hd-josh-btn-text, #e6edf3) !important;
    border-color: var(--hd-josh-header-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .hd-dropdown,
body.light[data-hd-theme="josh"] .hd-dropdown {
    background: var(--hd-josh-modal-bg, #161b22) !important;
    border-color: var(--hd-josh-card-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .hd-dropdown > div:first-child,
body.light[data-hd-theme="josh"] .hd-dropdown > div:first-child {
    border-color: var(--hd-josh-card-border, #30363d) !important;
    color: var(--hd-josh-text-muted, #8b949e) !important;
}
body.dark[data-hd-theme="josh"] .hd-dropdown a,
body.dark[data-hd-theme="josh"] .hd-dropdown button,
body.light[data-hd-theme="josh"] .hd-dropdown a,
body.light[data-hd-theme="josh"] .hd-dropdown button {
    color: var(--hd-josh-text, #e6edf3) !important;
}
body.dark[data-hd-theme="josh"] .hd-dropdown a:hover,
body.dark[data-hd-theme="josh"] .hd-dropdown button:hover,
body.light[data-hd-theme="josh"] .hd-dropdown a:hover,
body.light[data-hd-theme="josh"] .hd-dropdown button:hover {
    background: rgba(88, 166, 255, 0.12) !important;
}
body.dark[data-hd-theme="josh"] .hd-reports-dropdown,
body.light[data-hd-theme="josh"] .hd-reports-dropdown {
    background: var(--hd-josh-modal-bg, #161b22) !important;
    border-color: var(--hd-josh-card-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .hd-reports-dropdown a,
body.light[data-hd-theme="josh"] .hd-reports-dropdown a {
    color: var(--hd-josh-text, #e6edf3) !important;
}
body.dark[data-hd-theme="josh"] .hd-dropdown-group,
body.light[data-hd-theme="josh"] .hd-dropdown-group {
    color: var(--hd-josh-text-muted, #8b949e) !important;
    border-color: var(--hd-josh-card-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .hd-settings-dropdown,
body.light[data-hd-theme="josh"] .hd-settings-dropdown {
    background: var(--hd-josh-modal-bg, #161b22) !important;
    border-color: var(--hd-josh-card-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .hd-settings-dropdown a,
body.light[data-hd-theme="josh"] .hd-settings-dropdown a {
    color: var(--hd-josh-text, #e6edf3) !important;
}
body.dark[data-hd-theme="josh"] .helpdesk-filters-row,
body.light[data-hd-theme="josh"] .helpdesk-filters-row {
    background: var(--hd-josh-filters-bg, var(--hd-josh-header-bg, #161b22)) !important;
    border-bottom-color: var(--hd-josh-header-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .filters select,
body.light[data-hd-theme="josh"] .filters select {
    background: var(--hd-josh-input-bg, #0d1117) !important;
    border-color: var(--hd-josh-input-border, #30363d) !important;
    color: var(--hd-josh-text, #e6edf3) !important;
}
body.dark[data-hd-theme="josh"] .bulk-bar select,
body.light[data-hd-theme="josh"] .bulk-bar select {
    background: var(--hd-josh-input-bg, #0d1117) !important;
    border-color: var(--hd-josh-input-border, #30363d) !important;
    color: var(--hd-josh-text, #e6edf3) !important;
}
body.dark[data-hd-theme="josh"] .hd-global-search-input,
body.light[data-hd-theme="josh"] .hd-global-search-input {
    background: var(--hd-josh-input-bg, #0d1117) !important;
    border-color: var(--hd-josh-link, #58a6ff) !important;
    color: var(--hd-josh-text, #e6edf3) !important;
}
body.dark[data-hd-theme="josh"] .hd-global-search-input::placeholder,
body.light[data-hd-theme="josh"] .hd-global-search-input::placeholder {
    color: var(--hd-josh-text-muted, #8b949e) !important;
}
body.dark[data-hd-theme="josh"] .hd-global-search-panel,
body.light[data-hd-theme="josh"] .hd-global-search-panel {
    background: var(--hd-josh-card-bg, #161b22) !important;
    border-color: var(--hd-josh-card-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .hd-search-hint,
body.light[data-hd-theme="josh"] .hd-search-hint {
    color: var(--hd-josh-text-muted, #8b949e) !important;
}
body.dark[data-hd-theme="josh"] .hd-search-group-label,
body.light[data-hd-theme="josh"] .hd-search-group-label {
    color: var(--hd-josh-text-muted, #8b949e) !important;
}
body.dark[data-hd-theme="josh"] .hd-search-chip,
body.light[data-hd-theme="josh"] .hd-search-chip {
    background: var(--hd-josh-btn-bg, #21262d) !important;
    color: var(--hd-josh-text, #e6edf3) !important;
    border-color: var(--hd-josh-card-border, #30363d) !important;
}
body.dark[data-hd-theme="josh"] .hd-search-item,
body.light[data-hd-theme="josh"] .hd-search-item {
    border-color: var(--hd-josh-card-border, #30363d) !important;
    color: var(--hd-josh-text, #e6edf3) !important;
}
body.dark[data-hd-theme="josh"] .hd-search-item:hover,
body.dark[data-hd-theme="josh"] .hd-search-item.hd-search-item-active,
body.light[data-hd-theme="josh"] .hd-search-item:hover,
body.light[data-hd-theme="josh"] .hd-search-item.hd-search-item-active {
    background: var(--hd-josh-input-bg, #0d1117) !important;
}
body.dark[data-hd-theme="josh"] .hd-global-search-panel .link,
body.light[data-hd-theme="josh"] .hd-global-search-panel .link {
    color: var(--hd-josh-link, #58a6ff) !important;
}
body.dark[data-hd-theme="josh"] .topbar,
body.light[data-hd-theme="josh"] .topbar {
    background: var(--hd-josh-header-bg, #161b22) !important;
    border-bottom-color: var(--hd-josh-header-border, #30363d) !important;
}