/* Issue #9725 M32 — striked-out rows for tickets escalated to DMS (clerk view) */
tr.cw-row-escalated {
    text-decoration: line-through;
    opacity: 0.55;
    pointer-events: none;
}
tr.cw-row-escalated .button,
tr.cw-row-escalated a.button {
    pointer-events: none;
    cursor: not-allowed;
    background: #e9ecef !important;
    color: #6c757d !important;
}
tr.cw-row-escalated td {
    /* keep readable but visibly muted */
    color: #6c757d;
}
/* allow the Detail button only — clerks can still inspect, just not act */
tr.cw-row-escalated .cw-btn-detail {
    pointer-events: auto;
    opacity: 1;
    text-decoration: none;
}

/* #9725 Phase J follow-up — DMS Escalations page (admin) local-dev fix.
 *
 * On prod the admin pages use Elementor full-width templates that bypass
 * the theme container hierarchy. Locally we use the default WP page
 * template, which clamps everything inside Bootstrap's .container
 * (max-width:1314px). The 14-column DataTable then either gets cropped
 * (1290px wrap) or pushes the document past viewport (when wrap is
 * unclamped but DT still overflows).
 *
 * Scope of this file: DMS Escalations page only (.wcp-dms-escalations).
 * The clerk page (.wcp-admin-support-tickets) is left as-is per Chris'
 * request 2026-05-20 — earlier attempts to fix both at once broke the
 * clerk DT body (rows not rendering). Clerk stays on the original prod
 * CSS path; if local clerk viewport is too narrow, users zoom out or
 * widen the browser.
 */
.page--content:has(.wcp-dms-escalations),
body.page-template-default .wcp-dms-escalations {
    max-width: 100% !important;
    width: 100% !important;
}
.wcp-dms-escalations {
    max-width: 100% !important;
}
.container:has(.wcp-dms-escalations) {
    max-width: 100% !important;
    width: 100% !important;
}
.wcp-dms-escalations .wcp-slr-dt-mount,
.wcp-dms-escalations #support-tickets-table {
    overflow-x: auto;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
}
.wcp-dms-escalations {
    overflow-x: hidden;
}
/* position:fixed children (detail panel, bulk modal) still pin to
   viewport correctly because the above overflow:hidden is on a
   non-transformed parent. */

/* ══════════════════════════════════════════════════════════════
   #9792 M16-M17 — Global .wcp-badge system (no-wrap · compact)
   Consumed by future M9-M15 (JS renderer) + M20-M22 (click handlers)
   ══════════════════════════════════════════════════════════════ */
.wcp-badge {
    display: inline-block;
    vertical-align: middle;
    padding: 2px 10px;
    font-size: 11px;
    font-weight: 600;
    border-radius: 12px;
    white-space: nowrap;
    border: 1px solid;
    transition: opacity 0.15s ease-in-out;
    line-height: 1.5;
}
.wcp-badge:hover { opacity: 0.85; cursor: pointer; }

/* M17 — Severity variants (4 colors per SEV-1..SEV-4) */
.wcp-badge-severity-SEV-1 { background-color: #dc2626; color: #fff; border-color: #991b1b; }
.wcp-badge-severity-SEV-2 { background-color: #f97316; color: #fff; border-color: #c2410c; }
.wcp-badge-severity-SEV-3 { background-color: #eab308; color: #000; border-color: #a16207; }
.wcp-badge-severity-SEV-4 { background-color: #22c55e; color: #fff; border-color: #15803d; }

/* M17 — Status variants (5 colors per status enum) */
.wcp-badge-status-new          { background-color: #3b82f6; color: #fff; border-color: #1d4ed8; }
.wcp-badge-status-triaged      { background-color: #facc15; color: #000; border-color: #a16207; }
.wcp-badge-status-in_progress  { background-color: #0ea5e9; color: #fff; border-color: #0369a1; }
.wcp-badge-status-uat          { background-color: #a855f7; color: #fff; border-color: #7e22ce; }
.wcp-badge-status-closed       { background-color: #9ca3af; color: #fff; border-color: #4b5563; }

/* M17 — Source variants (5 colors per submission_source enum) */
.wcp-badge-source-email        { background-color: #3b82f6; color: #fff; border-color: #1d4ed8; }
.wcp-badge-source-admin        { background-color: #6b7280; color: #fff; border-color: #374151; }
.wcp-badge-source-public_modal { background-color: #10b981; color: #fff; border-color: #047857; }
.wcp-badge-source-ai_chat      { background-color: #06b6d4; color: #fff; border-color: #0e7490; }
.wcp-badge-source-api          { background-color: #8b5cf6; color: #fff; border-color: #6d28d9; }

/* M17 — Category variants (12 pastel-rainbow colors per AI category) */
.wcp-badge-category-login                     { background-color: #fecaca; color: #7f1d1d; border-color: #fca5a5; }
.wcp-badge-category-password                  { background-color: #fed7aa; color: #7c2d12; border-color: #fdba74; }
.wcp-badge-category-invitation                { background-color: #cffafe; color: #155e75; border-color: #a5f3fc; }
.wcp-badge-category-vbs-booking               { background-color: #ccfbf1; color: #115e59; border-color: #99f6e4; }
.wcp-badge-category-container-tracking        { background-color: #dbeafe; color: #1e3a8a; border-color: #bfdbfe; }
.wcp-badge-category-container-tracking-issue  { background-color: #c7d2fe; color: #312e81; border-color: #a5b4fc; }
.wcp-badge-category-billing                   { background-color: #d1fae5; color: #065f46; border-color: #a7f3d0; }
.wcp-badge-category-billing-ifs               { background-color: #bbf7d0; color: #14532d; border-color: #86efac; }
.wcp-badge-category-storage-guarantee         { background-color: #fef3c7; color: #78350f; border-color: #fde68a; }
.wcp-badge-category-escalation                { background-color: #ffedd5; color: #9a3412; border-color: #fed7aa; }
.wcp-badge-category-complaint                 { background-color: #fee2e2; color: #991b1b; border-color: #fecaca; }
.wcp-badge-category-customs-clearance         { background-color: #ede9fe; color: #5b21b6; border-color: #ddd6fe; }
.wcp-badge-category-other                     { background-color: #f1f5f9; color: #334155; border-color: #e2e8f0; }

/* M17 — Submitter variants (matched vs unmatched · replaces 🔴 red chip · M14) */
.wcp-badge-submitter-matched   { background-color: #22c55e; color: #fff; border-color: #15803d; }
.wcp-badge-submitter-unmatched { background-color: #fed7aa; color: #9a3412; border-color: #fdba74; }

/* M17 — Org variants (color graded by match score · keeps high/mid/low semantics · M15) */
.wcp-badge-org-high { background-color: #22c55e; color: #fff;    border-color: #15803d; }
.wcp-badge-org-mid  { background-color: #eab308; color: #000;    border-color: #a16207; }
.wcp-badge-org-low  { background-color: #d1d5db; color: #374151; border-color: #9ca3af; }

/* Pending state — used when a value is null / dash (keeps row alignment stable) */
.wcp-badge-pending {
    background-color: transparent;
    color: #cbd5e1;
    border-color: transparent;
    cursor: default;
}
.wcp-badge-pending:hover { opacity: 1; cursor: default; }

/* ══════════════════════════════════════════════════════════════
   #9792 M14-M15 + M20-M22 — clickable badge ergonomics
   Scoped under .wcp-admin-support-tickets so .wcp-badge styling
   never leaks to sibling pages that might reuse the class.
   ══════════════════════════════════════════════════════════════ */
.wcp-admin-support-tickets .wcp-cell-submitter .wcp-badge,
.wcp-admin-support-tickets .wcp-cell-org       .wcp-badge {
    max-width: 200px;
    overflow:  hidden;
    text-overflow: ellipsis;
    /* white-space:nowrap is already on .wcp-badge — M16 contract */
}

/* M20-M22 — clickable badges signal affordance via cursor + subtle ring on focus.
   :focus-visible used so keyboard users still see the outline without it leaking
   to mouse-clicks (which is the normal Bootstrap idiom). */
.wcp-admin-support-tickets .wcp-badge[role="button"] {
    cursor: pointer;
    user-select: none;
}
.wcp-admin-support-tickets .wcp-badge[role="button"]:focus-visible {
    outline: 2px solid #0ea5e9;
    outline-offset: 2px;
}

/* Pending state must NOT show pointer cursor even when wrapped in a clickable
   td — there's nothing to click on a dashed placeholder. */
.wcp-admin-support-tickets .wcp-cell-submitter .wcp-badge-pending,
.wcp-admin-support-tickets .wcp-cell-org       .wcp-badge-pending {
    cursor: default;
    pointer-events: none;
}

/* ══════════════════════════════════════════════════════════════
   #9792 M18 — Rich-HTML tooltip styling (Tippy.js custom theme)
   Targets the small label/value table emitted by buildTooltipHtml()
   inside data-tippy-content. Scoped to the .tippy-box[data-theme~='wcp']
   wrapper so it never bleeds into other Tippy instances on the site.
   ══════════════════════════════════════════════════════════════ */
.tippy-box[data-theme~='wcp'] {
    background-color: #1f2937;
    color: #f3f4f6;
    font-size: 12px;
    border-radius: 6px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.18);
}
.tippy-box[data-theme~='wcp'] > .tippy-arrow { color: #1f2937; }
.tippy-box[data-theme~='wcp'] .tippy-content { padding: 8px 10px; }
.tippy-box[data-theme~='wcp'] .wcp-tip-table {
    border-collapse: collapse;
    margin: 0;
    width: 100%;
}
.tippy-box[data-theme~='wcp'] .wcp-tip-table td {
    padding: 2px 8px 2px 0;
    vertical-align: top;
    line-height: 1.4;
    border: 0;
}
.tippy-box[data-theme~='wcp'] .wcp-tip-label {
    color: #9ca3af;
    font-weight: 500;
    text-align: left;
    white-space: nowrap;
    padding-right: 10px;
}
.tippy-box[data-theme~='wcp'] .wcp-tip-value {
    color: #f9fafb;
    font-weight: 600;
    text-align: left;
    word-break: break-word;
}

/* ══════════════════════════════════════════════════════════════
   Issue #9949 PRE-AI 8/10 — Pipeline % advancement filter + column
   ══════════════════════════════════════════════════════════════ */

/* M11 — mini progress bar inside the DT "Avancement" column.
   The inline-styles in renderPipelinePct() set width + color per row;
   these rules normalise the wrapper / track so the cell layout stays
   stable across rows of different progress values. */
.dms-pipeline-progress-cell {
    white-space: nowrap;
    text-align: left;
    vertical-align: middle;
}
.dms-pipeline-progress-mini {
    user-select: none;
}
.dms-pipeline-progress-track {
    border: 1px solid rgba(0,0,0,0.04);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.04);
}
.dms-pipeline-progress-bar {
    box-shadow: inset 0 -1px 0 rgba(0,0,0,0.06);
}
.dms-pipeline-progress-empty {
    display: inline-block;
    padding-left: 4px;
}

/* M3 — chip row layout · sits its own flex row inside .wcp-support-filters
   because flex:1 1 100% in the partial forces it to wrap.
   Mobile (< 600px) tightens spacing + hides the inline hint so the chips
   stay tappable. */
.filter-group[data-filter-key="pipeline_pct_filter"] {
    padding: 4px 0;
    border-top: 1px dashed #e5e7eb;
    margin-top: 6px;
}
.filter-group[data-filter-key="pipeline_pct_filter"] .wcp-fbtn {
    line-height: 1.2;
}
.filter-group[data-filter-key="pipeline_pct_filter"] .wcp-fbtn-count {
    /* Match the sibling chip-row count badges (status / severity / source / date) */
    font-weight: 600;
}
@media (max-width: 600px) {
    .filter-group[data-filter-key="pipeline_pct_filter"] .dms-pipeline-pct-hint {
        display: none;
    }
    .filter-group[data-filter-key="pipeline_pct_filter"] .wcp-fbtn {
        font-size: 10px;
        padding: 2px 6px;
    }
}