/* screens-netmon.css · Option NETMON ส่วนรับข้อมูล (M14 lane S2 · 07-space-netmon.md §3.4 · §6.5 · DESIGN-TOKENS.md)
   ตัวเก็บข้อมูล (ลงทะเบียน · รหัสครั้งเดียว · เพิกถอน) · อุปกรณ์ที่เฝ้า · ข้อมูลรับรอง (เขียนได้อย่างเดียว) · ระยะเก็บข้อมูล
   สีจากตัวแปรของชุดสีเท่านั้น · ตัวอักษร ≥ 12px · สถานะมีไอคอน/ข้อความเสมอ · เป้ากด ≥ 24px · ไม่มี style ในหน้า (CSP) */

/* หัวหน้า + แถบแท็บ = netmon/head (screens-netmonops.css nm-head · nm-tabs · M15 N3) */
.nmc-sec-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.nmc-sec-head h2 { margin-bottom: 4px; }
.nmc-table th[scope="row"] a, .nmc-table td a:not(.btn) { text-decoration: underline; text-underline-offset: 3px; }
.nmc-search { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 8px; }
.nmc-search input[type="search"] { flex: 1 1 16rem; min-width: 0; }
.nmc-search select { min-height: 36px; }
.nmc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr)); gap: 0 12px; }
.nmc-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0 0 10px; }
.nmc-h3 { font-size: 13.5px; font-weight: 600; margin: 12px 0 6px; }
.nmc-list, .nmc-set { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: 13px; }
.nmc-set li { display: flex; align-items: center; gap: 4px; }
.nmc-set .ico { width: 14px; height: 14px; }
.nmc-steps { margin: 8px 0; padding-left: 1.4em; display: grid; gap: 4px; font-size: 13.5px; }

/* ป้าย (ไอคอน + ข้อความ) */
.nmc-st, .nmc-flag { display: inline-flex; white-space: nowrap; align-items: center; gap: 4px; min-height: 24px; padding: 0 8px; border-radius: var(--r-pill); font-size: 12.5px; }
.nmc-st .ico, .nmc-flag .ico { width: 14px; height: 14px; flex: none; }
.nmc-flag { background: var(--surf2); color: var(--ink2); }
.nmc-flag-warn { background: var(--p3-bg); color: var(--p3-fg); }
.nmc-flag-ok { background: var(--teal-bg); color: var(--teal-fg); }
.nmc-st-ok, .nmc-tst-active { background: var(--teal-bg); color: var(--teal-fg); }
.nmc-st-warn { background: var(--p3-bg); color: var(--p3-fg); }
.nmc-st-bad { background: var(--p1-bg); color: var(--p1-fg); }
.nmc-st-wait, .nmc-st-off, .nmc-tst-paused, .nmc-tst-discovered, .nmc-tst-ignored, .nmc-tst-retired { background: var(--surf2); color: var(--ink2); }
.nmc-warn { display: flex; gap: 8px; align-items: flex-start; }

/* รหัสลงทะเบียน (แสดงครั้งเดียว) */
.nmc-once { display: flex; gap: 8px; align-items: flex-start; }
.nmc-code { display: inline-block; max-width: 100%; overflow-wrap: anywhere; font-size: 15px; letter-spacing: .04em; background: var(--surf2); padding: 4px 8px; border-radius: var(--r-sm, 6px); }
.nmc-cmd { margin: 0 0 8px; padding: 10px 12px; max-width: 100%; overflow-x: auto; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12.5px;
  background: var(--surf2); color: var(--ink); border: 1px solid var(--line); border-radius: var(--r-md, 8px); }

/* ฟอร์ม */
.nmc-form label { display: block; }
.nmc-form textarea, .nmc-form input:not([type="checkbox"]):not([type="radio"]), .nmc-form select { width: 100%; }
.nmc-fs { min-width: 0; }
.nmc-fs[disabled] { opacity: 1; }
.nmc-legend { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; padding: 0; margin: 0 0 10px; float: left; width: 100%; }
.nmc-legend + * { clear: both; }
.nmc-check { display: flex !important; align-items: center; gap: 6px; min-height: 24px; }
.nmc-check input, .nmc-table input[type="checkbox"] { width: 18px; height: 18px; }

@media (max-width: 600px) {
  .nmc-sec-head .btn { width: 100%; justify-content: center; }
  .nmc-search button { flex: 1 1 auto; }
  .nmc-code { font-size: 13.5px; }
}