/* ============================================
   Monograph Custom Theme Override
   แก้ไขไฟล์นี้เพื่อ customize หน้าตาของ Monograph
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Sarabun:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');

/* Font ทุก element */
* {
  font-family: 'Sarabun', sans-serif !important;
}

#root > div.theme-scope-base > div:first-child div div a {
  /* ปิดการกดลิงค์ logo หน้า page */
  pointer-events: none !important;
}

#root > div.theme-scope-base > div:first-child > div:nth-child(1) {
  /* background title */
  background-color: transparent !important;
  border-bottom-color: transparent !important;
}

#root > div.theme-scope-base > div:first-child > div:nth-child(2) {
  /* padding title */
  padding-top: 20px !important;
  background-color: transparent !important;
  border-bottom-color: transparent !important;
}

/* ---------------------------------------------------------------- */

#root > div.theme-scope-base > div:first-child {
  /* logo หน้า 404 */
  background-color: transparent !important;
  border-bottom-color: transparent !important;
}

#root > div.theme-scope-base > div:first-child > a {
  /* Publish a note */
  display: none !important;
}

/* ซ่อน footer */
footer {
  display: none !important;
}

/* =========================================
   Light mode — override เมื่อ system เป็น light
   app default เป็น dark จึงต้อง override ตรงๆ
   ========================================= */
@media (prefers-color-scheme00: light) {
  [type='password'] {
    background-color: #fff !important;
    color: #1a1a1a !important;
  }

  div.theme-scope-base > div:first-child span:first-child {
    /*logo login*/
    color: unset;
  }

  #root > div.theme-scope-base > div:nth-child(2) span {
    /* logo หน้า 404 */
    color: unset;
  }

  /* root wrapper ที่ app ใช้คุม theme */
  .theme-scope-base,
  .theme-scope-base > div {
    background-color: #ffffff !important;
    color: #1a1a1a !important;
  }

  /* ทุก div ภายใน theme wrapper */
  .theme-scope-base * {
    color: #1a1a1a;
    border-color: #e0e0e0;
  }

  /* Heading ให้เข้มชัดในทุกระดับ */
  .theme-scope-base h1,
  .theme-scope-base h2,
  .theme-scope-base h3,
  .theme-scope-base h4,
  .theme-scope-base h5,
  .theme-scope-base h6 {
    color: #111111 !important;
  }

  /* Content พื้นหลัง */
  .theme-scope-base div {
    background-color: #ffffff !important;
  }

  /* ยกเว้น code block ให้มี background ต่างออก */
  .theme-scope-base pre,
  .theme-scope-base code {
    background-color: #f5f5f5 !important;
    color: #1a1a1a !important;
  }

  /* Blockquote */
  .theme-scope-base blockquote {
    border-left-color: #4f46e5 !important;
    color: #555555 !important;
  }

  /* Link */
  .theme-scope-base a {
    color: #4f46e5 !important;
  }

  /* ตาราง */
  .theme-scope-base table,
  .theme-scope-base th,
  .theme-scope-base td {
    border-color: #e0e0e0 !important;
  }

  .theme-scope-base th {
    background-color: #f5f5f5 !important;
  }

  /* footer ถ้าไม่ซ่อน ให้ตาม light */
  footer {
    background-color: #f5f5f5 !important;
    color: #555555 !important;
  }
}