/*
 * Pali Help Desk — Clean light-purple theme v1.4.103
 * Scoped to the combined Help Desk page only. No :has() and no DOM-wide rules.
 */

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page {
  --phdui-clean-page: #f7f3ff;
  --phdui-clean-card: rgba(232, 223, 248, .72);
  --phdui-clean-line: #c5afe8;
  --phdui-clean-text: #211b2d;
  --phdui-clean-muted: #5f566c;
  --phdui-clean-purple: #580095;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 34px 0 0 !important;
  background: linear-gradient(180deg, #fbf9ff 0%, var(--phdui-clean-page) 42%, #f3edff 100%) !important;
  color: var(--phdui-clean-text) !important;
}

/* กล่องแจ้งปัญหา: เอาการ์ดม่วงทึบออก ให้โครงเหมือนหน้า Track */
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-root.phdui-ticket-root {
  width: min(900px, calc(100% - 32px)) !important;
  max-width: 900px !important;
  margin: 0 auto 34px !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root > .phdui-hero {
  margin: 0 auto 10px !important;
  padding: 7px 14px 10px !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 2px solid #d7a82b !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root > .phdui-hero .phdui-title {
  margin: 0 0 4px !important;
  color: var(--phdui-clean-text) !important;
  -webkit-text-fill-color: var(--phdui-clean-text) !important;
  font-size: 27px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root > .phdui-hero p {
  display: block !important;
  margin: 0 !important;
  color: var(--phdui-clean-muted) !important;
  -webkit-text-fill-color: var(--phdui-clean-muted) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* เมนู 4 ปุ่ม — แบบเดียวกับรูปตัวอย่าง */
html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root .phdui-exact-tabs {
  width: 100% !important;
  margin: 0 auto 18px !important;
  gap: 10px !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root .phdui-exact-tab {
  min-height: 36px !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid var(--phdui-clean-line) !important;
  border-radius: 12px !important;
  color: #6b4a94 !important;
  -webkit-text-fill-color: #6b4a94 !important;
  box-shadow: 0 3px 10px rgba(88, 0, 149, .05) !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root .phdui-exact-tab.is-primary,
html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root .phdui-exact-tab:hover,
html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root .phdui-exact-tab:focus {
  background: linear-gradient(135deg, #a78adc 0%, #8060bf 100%) !important;
  border-color: #9575cd !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root .phdui-ticket-main,
html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root .phdui-ticket-form-column {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root #phd-ticket-form-wrap {
  width: 100% !important;
  padding: 22px !important;
  background: var(--phdui-clean-card) !important;
  background-image: none !important;
  border: 1px solid var(--phdui-clean-line) !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 24px rgba(88, 0, 149, .08) !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root input.phd-input,
html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root select.phd-input,
html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root textarea.phd-input {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #bda7df !important;
  border-radius: 12px !important;
  color: var(--phdui-clean-text) !important;
  -webkit-text-fill-color: var(--phdui-clean-text) !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root input.phd-input:focus,
html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root select.phd-input:focus,
html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root textarea.phd-input:focus {
  border-color: #9575cd !important;
  box-shadow: 0 0 0 3px rgba(149, 117, 205, .18) !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root #phd-submit-btn,
html body.phdui-page.phdui-screen-helpdesk .phdui-track-root .phdui-search-button {
  background: var(--phdui-clean-purple) !important;
  background-image: none !important;
  border-color: var(--phdui-clean-purple) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 5px 12px rgba(88, 0, 149, .16) !important;
}

/* Track และ FAQ: ลบแถบสีส่วนเกินทุกชั้นก่อน/หลัง section */
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-white-band,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-track-white-band,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-faq-white-band {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 28px 0 34px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-white-band::before,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-white-band::after,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-track-white-band::before,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-track-white-band::after,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-faq-white-band::before,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-faq-white-band::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-track-root,
html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root {
  width: min(900px, calc(100% - 32px)) !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-track-root > .phdui-hero,
html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root > .phdui-hero {
  margin: 0 0 14px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-track-root .phdui-icon,
html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root .phdui-icon {
  display: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-track-root .phdui-title,
html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root .phdui-title {
  margin: 0 0 5px !important;
  color: var(--phdui-clean-text) !important;
  -webkit-text-fill-color: var(--phdui-clean-text) !important;
  font-size: 27px !important;
  font-weight: 700 !important;
  text-align: left !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-track-root > .phdui-hero p,
html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root > .phdui-hero p {
  margin: 0 !important;
  color: var(--phdui-clean-muted) !important;
  -webkit-text-fill-color: var(--phdui-clean-muted) !important;
  text-align: left !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-track-root > .phdui-card,
html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root > .phdui-card {
  margin: 0 !important;
  padding: 24px !important;
  background: var(--phdui-clean-card) !important;
  background-image: none !important;
  border: 1px solid var(--phdui-clean-line) !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 24px rgba(88, 0, 149, .08) !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root .phdui-accordion-button {
  background: var(--phdui-clean-purple) !important;
  background-image: none !important;
  border-color: var(--phdui-clean-purple) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root .phdui-accordion-button span {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 767px) {
  html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page {
    padding-top: 24px !important;
  }

  html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root #phd-ticket-form-wrap,
  html body.phdui-page.phdui-screen-helpdesk .phdui-track-root > .phdui-card,
  html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root > .phdui-card {
    padding: 16px !important;
  }

  html body.phdui-page.phdui-screen-helpdesk .phdui-ticket-root > .phdui-hero .phdui-title,
  html body.phdui-page.phdui-screen-helpdesk .phdui-track-root .phdui-title,
  html body.phdui-page.phdui-screen-helpdesk .phdui-faq-root .phdui-title {
    font-size: 22px !important;
  }
}

/* v1.4.105 — ไม่ให้กรอบ FAQ/แถบแม่ตัดหรือวางทับปลายการ์ดฐานความรู้ */
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-faq-white-band,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page .phdui-faq-white-band {
  position: relative !important;
  z-index: 0 !important;
  padding-bottom: 48px !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-section {
  position: relative !important;
  z-index: 1 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin-bottom: 0 !important;
}

/* ============================================================
 * v1.4.107 — หน้าแจ้งปัญหา / ส่ง Ticket แบบแยกหน้า
 * ใช้สไตล์เดียวกับหน้าติดตามสถานะ Ticket
 * ============================================================ */
html body.phdui-page.phdui-screen-ticket,
html body.phdui-page.phdui-screen-ticket #page,
html body.phdui-page.phdui-screen-ticket #content,
html body.phdui-page.phdui-screen-ticket .site-content,
html body.phdui-page.phdui-screen-ticket #primary,
html body.phdui-page.phdui-screen-ticket .content-area,
html body.phdui-page.phdui-screen-ticket main.site-main,
html body.phdui-page.phdui-screen-ticket article,
html body.phdui-page.phdui-screen-ticket .entry-content {
  background: #f7f3ff !important;
  background-color: #f7f3ff !important;
  background-image: none !important;
}

html body.phdui-page.phdui-screen-ticket .phdui-root.phdui-ticket-root {
  width: min(900px, calc(100% - 32px)) !important;
  max-width: 900px !important;
  margin: 38px auto 54px !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section > .phdui-hero {
  margin: 0 auto 10px !important;
  padding: 7px 14px 10px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 2px solid #d7a82b !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section > .phdui-hero h1.phdui-title {
  margin: 0 0 4px !important;
  color: #1f1929 !important;
  -webkit-text-fill-color: #1f1929 !important;
  font-size: 27px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-shadow: none !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section > .phdui-hero p {
  display: block !important;
  margin: 0 !important;
  color: #5f566c !important;
  -webkit-text-fill-color: #5f566c !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  text-align: center !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section .phdui-exact-tabs {
  width: 100% !important;
  margin: 0 auto 18px !important;
  gap: 10px !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section .phdui-exact-tab {
  min-height: 36px !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #c5afe8 !important;
  border-radius: 12px !important;
  color: #6b4a94 !important;
  -webkit-text-fill-color: #6b4a94 !important;
  box-shadow: 0 3px 10px rgba(88, 0, 149, .05) !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section .phdui-exact-tab.is-primary,
html body.phdui-page.phdui-screen-ticket #phdui-report-section .phdui-exact-tab:hover,
html body.phdui-page.phdui-screen-ticket #phdui-report-section .phdui-exact-tab:focus {
  background: linear-gradient(135deg, #a78adc 0%, #8060bf 100%) !important;
  border-color: #9575cd !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section .phdui-ticket-main,
html body.phdui-page.phdui-screen-ticket #phdui-report-section .phdui-ticket-form-column {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section #phd-ticket-form-wrap {
  width: 100% !important;
  padding: 22px !important;
  background: rgba(232, 223, 248, .72) !important;
  background-color: rgba(232, 223, 248, .72) !important;
  background-image: none !important;
  border: 1px solid #c5afe8 !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 24px rgba(88, 0, 149, .08) !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section input.phd-input,
html body.phdui-page.phdui-screen-ticket #phdui-report-section select.phd-input,
html body.phdui-page.phdui-screen-ticket #phdui-report-section textarea.phd-input {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border: 1px solid #bda7df !important;
  border-radius: 12px !important;
  color: #211b2d !important;
  -webkit-text-fill-color: #211b2d !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-ticket #phdui-report-section #phd-submit-btn {
  background: #580095 !important;
  background-color: #580095 !important;
  background-image: none !important;
  border-color: #580095 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 5px 12px rgba(88, 0, 149, .16) !important;
}

html body.phdui-page.phdui-screen-ticket .phdui-root.phdui-ticket-root::before,
html body.phdui-page.phdui-screen-ticket .phdui-root.phdui-ticket-root::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 767px) {
  html body.phdui-page.phdui-screen-ticket .phdui-root.phdui-ticket-root {
    margin-top: 24px !important;
  }

  html body.phdui-page.phdui-screen-ticket #phdui-report-section #phd-ticket-form-wrap {
    padding: 16px !important;
  }

  html body.phdui-page.phdui-screen-ticket #phdui-report-section > .phdui-hero h1.phdui-title {
    font-size: 22px !important;
  }
}

/* v1.4.104 — บังคับหัวข้อ Help Desk เป็นสีดำ ชนะกฎหัวข้อสีขาวรุ่นเก่า */
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-report-section > .phdui-hero h1.phdui-title,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-report-section > .phdui-hero .phdui-title {
  color: #1f1929 !important;
  -webkit-text-fill-color: #1f1929 !important;
  text-shadow: none !important;
}

/* ฐานความรู้ด้านล่าง — ใช้ม่วงอ่อนชุดเดียวกับ Track และ FAQ */
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-section {
  width: 100% !important;
  margin: 28px 0 0 !important;
  padding: 30px 28px !important;
  overflow: hidden !important;
  background: rgba(232, 223, 248, .72) !important;
  background-color: rgba(232, 223, 248, .72) !important;
  background-image: none !important;
  border: 1px solid #c5afe8 !important;
  border-radius: 18px !important;
  outline: 0 !important;
  box-shadow: 0 10px 24px rgba(88, 0, 149, .08) !important;
  color: #211b2d !important;
  text-align: center !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-heading,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-heading h2,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-heading p {
  background: transparent !important;
  background-image: none !important;
  color: #211b2d !important;
  -webkit-text-fill-color: #211b2d !important;
  text-shadow: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-heading h2 {
  margin: 0 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-heading p {
  margin: 8px 0 0 !important;
  color: #5f566c !important;
  -webkit-text-fill-color: #5f566c !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-list {
  margin: 22px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-list a {
  min-height: 44px !important;
  padding: 10px 14px !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border: 1px solid #bda7df !important;
  border-radius: 10px !important;
  color: #352b43 !important;
  -webkit-text-fill-color: #352b43 !important;
  box-shadow: none !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-list a::before {
  color: #580095 !important;
  -webkit-text-fill-color: #580095 !important;
}

html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-list a:hover,
html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-list a:focus {
  background: #f8f4ff !important;
  border-color: #9575cd !important;
  color: #211b2d !important;
  -webkit-text-fill-color: #211b2d !important;
}

@media (max-width: 767px) {
  html body.phdui-page.phdui-screen-helpdesk .phdui-helpdesk-page #phdui-faq-section .phdui-kb-section {
    padding: 22px 16px !important;
  }
}
