#wphd-root.wphd {
  --wphd-ink: #172b3e;
  --wphd-muted: #526579;
  --wphd-line: #d9e2ea;
  --wphd-blue: #145b7c;
  width: min(100%, 1080px);
  max-width: 1080px;
  margin: 2rem auto 4rem;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  border: 1px solid var(--wphd-line);
  border-radius: 18px;
  background: #fff;
  color: var(--wphd-ink);
  box-shadow: 0 18px 45px rgb(7 30 47 / 12%);
  font: inherit;
  line-height: 1.5;
}
.wphd *, .wphd *::before, .wphd *::after { box-sizing: border-box; }
.wphd h2, .wphd h3, .wphd p, .wphd label { color: var(--wphd-ink); }
.wphd h2, .wphd h3 { margin: 0; line-height: 1.25; }
.wphd h2 { font-size: clamp(1.6rem, 3vw, 2.15rem); }
.wphd h3 { font-size: 1.1rem; }
.wphd p { margin: .45rem 0 1rem; }
.wphd a { color: #0c5d8d; text-decoration: underline; text-underline-offset: 2px; }
.wphd .wphd-header { margin-bottom: 1.4rem; }
.wphd .wphd-customer-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin: 0 0 1.25rem; }
.wphd .wphd-customer-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1.4rem; }
.wphd .wphd-customer-metric { display: flex; flex-direction: column; gap: .35rem; min-width: 0; padding: 1rem; border: 1px solid var(--wphd-line); border-radius: 12px; background: #f8fbfd; }
.wphd .wphd-customer-metric.attention { border-top: 3px solid #d89429; }
.wphd .wphd-customer-metric span { color: var(--wphd-muted); font-size: .85rem; font-weight: 700; }
.wphd .wphd-customer-metric strong { color: var(--wphd-ink); font-size: 1.8rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.wphd .wphd-customer-metric small { color: var(--wphd-muted); font-size: .75rem; line-height: 1.3; }
.wphd .wphd-customer-recent { padding: 1.2rem; border: 1px solid var(--wphd-line); border-radius: 12px; background: #fff; }
.wphd .wphd-customer-section-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .45rem; }
.wphd .wphd-customer-section-head .wphd-button { min-height: 34px; padding: .4rem .7rem; }
.wphd .wphd-customer-recent-list { display: grid; }
.wphd a.wphd-customer-ticket-link { display: flex; align-items: center; justify-content: space-between; gap: .8rem; min-width: 0; padding: .9rem .2rem; border-top: 1px solid var(--wphd-line); color: var(--wphd-ink); text-decoration: none; }
.wphd a.wphd-customer-ticket-link:hover strong, .wphd a.wphd-customer-ticket-link:focus strong { color: var(--wphd-blue); text-decoration: underline; }
.wphd .wphd-customer-ticket-main { display: grid; min-width: 0; gap: .25rem; }
.wphd .wphd-customer-ticket-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wphd .wphd-customer-ticket-main small { color: var(--wphd-muted); font-size: .8rem; overflow-wrap: anywhere; }
.wphd a.wphd-dashboard-link { display: inline-flex; align-items: center; min-height: 44px; padding: .65rem 1rem; border-radius: 9px; background: var(--wphd-blue); color: #fff; font-weight: 700; text-decoration: none; }
.wphd .wphd-closed-help { display: flex; align-items: center; justify-content: space-between; gap: 1rem; max-width: 760px; }
.wphd .wphd-closed-help p { margin: 0; }
.wphd .wphd-eyebrow { margin: 0 0 .35rem; color: var(--wphd-blue); font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.wphd .wphd-intro { margin: .55rem 0 0; color: var(--wphd-muted); font-size: 1rem; }
.wphd nav[aria-label="Helpdesk sections"] { display: flex; gap: .5rem; flex-wrap: wrap; margin: 0 0 1.75rem; padding: 0 0 1rem; border-bottom: 1px solid var(--wphd-line); }
.wphd button, .wphd input, .wphd select, .wphd textarea { font: inherit; }
.wphd button, .wphd button.wphd-button {
  appearance: none;
  width: auto;
  min-height: 44px;
  padding: .63rem 1rem;
  border: 1px solid var(--wphd-blue);
  border-radius: 9px;
  background: var(--wphd-blue);
  color: #fff;
  font-weight: 650;
  line-height: 1.25;
  text-align: center;
  cursor: pointer;
  box-shadow: none;
}
.wphd button:hover { filter: brightness(.92); }
.wphd button:disabled { opacity: .6; cursor: wait; }
.wphd button.secondary, .wphd button.wphd-button.secondary { background: #fff; color: var(--wphd-blue); }
.wphd nav button.secondary, .wphd nav button.wphd-button.secondary { border-color: transparent; background: transparent; color: var(--wphd-muted); }
.wphd nav button.is-active, .wphd nav button.wphd-button.is-active { border-color: var(--wphd-blue); background: var(--wphd-blue); color: #fff; }
.wphd nav button:not(.is-active):hover { border-color: var(--wphd-line); background: #eaf2f6; color: var(--wphd-blue); filter: none; }
.wphd button:focus-visible, .wphd a:focus-visible, .wphd input:focus-visible, .wphd select:focus-visible, .wphd textarea:focus-visible { outline: 3px solid #f0a832; outline-offset: 2px; }
.wphd form { display: grid; gap: 1rem; max-width: 720px; }
.wphd form > button { justify-self: start; }
.wphd label { display: grid; gap: .35rem; margin: 0; font-weight: 650; }
.wphd label.wphd-checkbox { display: inline-flex; align-items: center; justify-self: start; gap: .55rem; }
.wphd input[type="checkbox"] { display: inline-block; width: 18px !important; min-width: 18px; max-width: 18px; height: 18px !important; min-height: 18px; margin: 0; padding: 0; flex: none; accent-color: var(--wphd-blue); }
.wphd input:not([type="checkbox"]), .wphd select, .wphd textarea {
  display: block;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: .7rem .8rem;
  border: 1px solid #aab9c7;
  border-radius: 8px;
  background: #fff;
  color: var(--wphd-ink);
  font-weight: 400;
  box-shadow: none;
}
.wphd input::placeholder, .wphd textarea::placeholder { color: #65788b; opacity: 1; }
.wphd textarea { min-height: 130px; resize: vertical; }
.wphd input[type="file"] { padding: .5rem; }
.wphd input[type="file"]::file-selector-button { margin-right: .75rem; padding: .35rem .65rem; border: 1px solid var(--wphd-line); border-radius: 6px; background: #eef4f7; color: var(--wphd-ink); cursor: pointer; }
.wphd .wphd-panel, .wphd .wphd-ticket-summary, .wphd .wphd-empty { padding: clamp(1.1rem, 2.5vw, 1.6rem); border: 1px solid var(--wphd-line); border-radius: 12px; background: #fff; }
.wphd .wphd-panel > :last-child { margin-bottom: 0; }
.wphd .wphd-template-slot:empty { display: none; }
.wphd .wphd-field-help { margin: .15rem 0 0; color: var(--wphd-muted); font-size: .88rem; }
.wphd .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.wphd .ticket-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 275px), 1fr)); gap: 1rem; }
.wphd .card { margin: 0; padding: 1.2rem; border: 1px solid var(--wphd-line); border-radius: 12px; background: #fff; color: var(--wphd-ink); }
.wphd .ticket-grid .card { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; }
.wphd .ticket-grid .card p { margin: 0 0 .3rem; }
.wphd .ticket-grid .card .wphd-waiting { color: #82540b; font-weight: 700; }
.wphd .ticket-grid .card button { margin-top: auto; }
.wphd .wphd-ticket-number { display: block; color: var(--wphd-muted); font-size: .79rem; font-weight: 750; letter-spacing: .04em; }
.wphd .wphd-status { display: inline-block; padding: .2rem .7rem; border-radius: 999px; background: #e8f3f9; color: #145678; font-size: .8rem; font-weight: 750; }
.wphd .wphd-status[data-status="closed"], .wphd .wphd-status[data-status="resolved"] { background: #e8f4ed; color: #17663b; }
.wphd .wphd-status[data-status="pending"] { background: #fff2db; color: #82540b; }
.wphd .wphd-ticket-summary { margin: 1rem 0 1.6rem; }
.wphd .wphd-ticket-summary h3 { margin: .4rem 0 .7rem; font-size: 1.4rem; }
.wphd .wphd-ticket-summary p { margin: .6rem 0 0; }
.wphd .wphd-purchase-picker { display: grid; gap: .65rem; }
.wphd .wphd-purchase-context { margin-top: 1rem; padding: .9rem 1rem; border: 1px solid var(--wphd-line); border-radius: 8px; background: #f7fafc; overflow-wrap: anywhere; }
.wphd .wphd-purchase-context h4 { margin: .6rem 0 .2rem; font-size: 1rem; }
.wphd .wphd-purchase-context h4:first-child { margin-top: 0; }
.wphd .wphd-conversation { max-width: 760px; margin: 1.5rem 0; }
.wphd .wphd-conversation > h3 { margin-bottom: .8rem; }
.wphd .wphd-message { margin: .75rem 0; padding: 1rem 1.2rem; border: 1px solid var(--wphd-line); border-left: 4px solid var(--wphd-blue); border-radius: 8px; background: #fff; }
.wphd .wphd-message.private { border-left-color: #b37a17; background: #fffaf0; }
.wphd .wphd-message-head { display: flex; gap: .5rem 1rem; flex-wrap: wrap; align-items: baseline; }
.wphd .wphd-message p { margin: .6rem 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.wphd .wphd-draft-actions { display: flex; align-items: center; gap: .7rem 1rem; flex-wrap: wrap; }
.wphd .wphd-draft-note-help { margin: -.35rem 0 .85rem; }
.wphd .wphd-private-help { margin: -.75rem 0 .5rem; }
.wphd .wphd-draft-actions .wphd-field-help { margin: 0; }
.wphd .wphd-draft-sources:not(:empty) { display: flex; flex-wrap: wrap; gap: .35rem .8rem; padding: .8rem 1rem; border: 1px solid var(--wphd-line); border-radius: 8px; background: #f5f9fb; font-size: .88rem; }
.wphd .wphd-draft-sources a { overflow-wrap: anywhere; }
.wphd .muted, .wphd .wphd-field-help { color: var(--wphd-muted); font-size: .88rem; }
.wphd .notice { max-width: 760px; margin: 1rem 0; padding: .9rem 1rem; border: 1px solid #b9d4e2; border-left: 4px solid var(--wphd-blue); border-radius: 8px; background: #eaf4f8; color: #163b51; }
.wphd .notice.error, .wphd .wphd-chat-message.error { border-color: #e6a4a4; background: #fff2f2; color: #812e2e; }
.wphd .wphd-empty { grid-column: 1 / -1; text-align: center; }
.wphd .wphd-empty p { color: var(--wphd-muted); }
.wphd .wphd-kb-results-heading { margin-top: 1.5rem; }
.wphd .wphd-article-list { display: grid; max-width: 760px; gap: .8rem; margin-top: 1rem; }
.wphd .wphd-article-list .card h3 { margin-bottom: .5rem; }
.wphd .chatlog { display: grid; gap: .8rem; max-width: 760px; min-height: 110px; max-height: 440px; margin: 1rem 0; padding: 1rem; overflow: auto; border: 1px solid var(--wphd-line); border-radius: 12px; background: #fff; }
.wphd .wphd-chat-empty { align-self: center; margin: 0; color: var(--wphd-muted); text-align: center; }
.wphd .wphd-chat-message { max-width: 85%; padding: .85rem 1rem; border: 1px solid var(--wphd-line); border-radius: 10px; background: #f3f7fa; }
.wphd .wphd-chat-message.is-user { justify-self: end; background: #eaf4f8; }
.wphd .wphd-chat-message p { margin: .35rem 0 .5rem; white-space: pre-wrap; }
.wphd .wphd-chat-message a { display: block; margin-top: .35rem; }
.wphd .wphd-chat-message button { margin-top: .6rem; }
.wphd .actions { display: flex; gap: .5rem; flex-wrap: wrap; margin: .8rem 0; }
.wphd .overdue { color: #a21d1d; font-weight: 700; }
@media (max-width: 640px) {
  #wphd-root.wphd { margin: 1rem auto 2rem; padding: 1.1rem; border-radius: 12px; }
  .wphd .wphd-customer-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wphd .wphd-closed-help { align-items: stretch; flex-direction: column; }
  .wphd nav[aria-label="Helpdesk sections"] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wphd nav button { width: 100%; }
  .wphd .row { grid-template-columns: 1fr; }
  .wphd .wphd-chat-message { max-width: 100%; }
}
@media (max-width: 400px) { .wphd .wphd-customer-metrics { grid-template-columns: 1fr; } }