/* ============================================================
   RoadSafe — Design Tokens
   v0.7.0 — ปรับให้ตรงกับ UI Mockup Reference (มติ 2026-07-28)

   ไฟล์นี้เป็นแหล่งความจริงเดียวของสีและระยะทั้งระบบ
   ห้ามเขียนค่าสีเป็น hex ตรง ๆ ในไฟล์ CSS อื่นหรือใน inline style
   ============================================================ */

:root {
  /* ---- แบรนด์หลัก: navy จาก mockup ---- */
  --rs-primary: #16265a;
  --rs-primary-hover: #0f1a3d;
  --rs-primary-soft: #e8f0fb;

  /* ---- accent: น้ำเงินรอง ใช้กับลิงก์และปุ่มรอง ---- */
  --rs-accent: #2f6fc0;
  --rs-accent-hover: #245a9e;
  --rs-accent-soft: #dbe6ff;

  /* ---- สีเน้น ใช้กับปุ่มดำเนินการหลักบนพื้น navy ---- */
  --rs-highlight: #ef7a1f;
  --rs-highlight-hover: #d96a12;

  /* ---- สถานะ ---- */
  --rs-success: #178048;
  --rs-success-soft: #e3f5ea;
  --rs-warning: #f0a92a;
  --rs-warning-soft: #fef3d9;
  --rs-danger: #e23a2e;
  --rs-danger-soft: #fdefe2;
  --rs-info: #2f6fc0;

  /* ---- ระดับความรุนแรง ตรงกับ mst_SeverityLevel.DisplayColorHex ---- */
  --rs-severity-fatal: #e23a2e;
  --rs-severity-serious: #ef7a1f;
  --rs-severity-slight: #f0a92a;
  --rs-severity-property: #2f6fc0;
  --rs-severity-unknown: #9aa6c7;

  /* ---- พื้นผิวและข้อความ ---- */
  --rs-bg: #f2f4f9;
  --rs-surface: #ffffff;
  --rs-surface-soft: #eef1f6;
  --rs-surface-muted: #f6f8fc;
  --rs-border: #c3ccdd;
  --rs-border-soft: #e4e9f2;
  --rs-text: #16265a;
  --rs-text-body: #3a466a;
  --rs-text-muted: #5c6683;
  --rs-text-faint: #9aa6c7;
  --rs-on-primary: #ffffff;

  /* ---- เงาและมุม ---- */
  --rs-shadow-sm: 0 2px 10px rgba(20, 34, 77, .06);
  --rs-shadow-md: 0 12px 34px rgba(20, 34, 77, .10);
  --rs-shadow-lg: 0 16px 46px rgba(20, 34, 77, .18);
  --rs-radius-sm: .5rem;
  --rs-radius-md: .875rem;
  --rs-radius-lg: 1.25rem;

  /* ---- โครงหน้า ---- */
  --rs-header-height: 68px;
  --rs-sidebar-width: 260px;
  --rs-content-max: 1440px;

  /* ---- ตัวอักษร ---- */
  --rs-font-heading: "Prompt", "Noto Sans Thai", Arial, sans-serif;
  --rs-font-body: "Sarabun", "Noto Sans Thai", Arial, sans-serif;
}

/* ============================================================
   โลโก้ภาพในแบรนด์ (ใช้ favicon.svg ตัวเดียวกับ tab)
   วางในไฟล์นี้เพราะโหลดทุกหน้าทั้งสอง master — จุดเดียวครอบทั้งระบบ
   ============================================================ */
.rs-brand-mark.rs-brand-mark-img {
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.rs-brand-mark.rs-brand-mark-img img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}