/* QMES report styles.
   Report preview and certificate extension point.
   Current production rules remain in common.css to preserve the exact original cascade. */

/* NAMO Talk 알림 프라이버시
   알림창에는 발신자와 건수만 표시하고 메시지·파일명·이모티콘 내용은 숨깁니다. */
div[aria-live="polite"][style*="2147483000"] > button > span:nth-child(2) > span {
  display: none !important;
}

div[aria-live="polite"][style*="2147483000"] > button > span:nth-child(2)::after {
  content: "새 메시지 1건이 있습니다.";
  display: block;
  margin-top: 4px;
  color: #d7e3ec;
  font-size: 13px;
  line-height: 1.4;
  white-space: nowrap;
}

/* 부적합관리 신규 등록 버튼 — 현황 화면을 가리지 않도록 작게 표시 */
button.self-start.rounded-lg.bg-red-600 {
  min-height: 32px !important;
  padding: 5px 10px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

button.self-start.rounded-lg.bg-red-600 svg {
  width: 12px !important;
  height: 12px !important;
  margin-right: 3px !important;
}

/* ─────────────────────────────────────────────────────────────
   설비·부적합 등록 화면 세부 정렬
   수입검사 관리의 제목·신규등록 배치를 기준으로 맞춥니다.
───────────────────────────────────────────────────────────── */
#root .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:has(> button) {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

#root .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:has(> button) > button {
  min-width: 98px !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  justify-content: center !important;
  text-align: center !important;
}

/* 설비대장 비고란을 넓고 길게 표시 */
[role="dialog"][aria-modal="true"][aria-label="설비대장 신규등록"] > div:nth-child(2) label:has(textarea),
[role="dialog"][aria-modal="true"][aria-label="설비대장 수정"] > div:nth-child(2) label:has(textarea) {
  grid-column: 1 / -1 !important;
}

[role="dialog"][aria-modal="true"][aria-label="설비대장 신규등록"] textarea,
[role="dialog"][aria-modal="true"][aria-label="설비대장 수정"] textarea {
  min-height: 150px !important;
}

/* 정기점검·교정의 점검내용 입력란 확대 */
[role="dialog"][aria-modal="true"][aria-label="정기점검·교정 신규등록"] > div:nth-child(2) label:has(textarea) {
  grid-column: 1 / -1 !important;
}

[role="dialog"][aria-modal="true"][aria-label="정기점검·교정 신규등록"] textarea {
  min-height: 160px !important;
}

/* 고장·수리 이력: 담당자와 조치내용을 하단 한 줄에 정렬 */
[role="dialog"][aria-modal="true"][aria-label="고장·수리 이력 신규등록"] > div:nth-child(2) > div > label:nth-child(6) {
  order: 7 !important;
  grid-column: span 2 / span 2 !important;
}

[role="dialog"][aria-modal="true"][aria-label="고장·수리 이력 신규등록"] > div:nth-child(2) > div > label:nth-child(7) {
  order: 6 !important;
  grid-column: span 1 / span 1 !important;
}

[role="dialog"][aria-modal="true"][aria-label="고장·수리 이력 신규등록"] textarea {
  min-height: 140px !important;
}

/* 부적합 발생내용 입력칸을 한 줄 전체 폭으로 확대 */
[role="dialog"][aria-modal="true"][aria-label="부적합 신규등록"] > div:nth-child(2) section:first-of-type > div > label:nth-child(9) {
  grid-column: 1 / -1 !important;
}

/* 일정 등록·이력 등록 문구를 저장으로 통일 */
[role="dialog"][aria-modal="true"][aria-label="정기점검·교정 신규등록"] > div:last-child button:last-child,
[role="dialog"][aria-modal="true"][aria-label="고장·수리 이력 신규등록"] > div:last-child button:last-child {
  font-size: 0 !important;
}

[role="dialog"][aria-modal="true"][aria-label="정기점검·교정 신규등록"] > div:last-child button:last-child::after,
[role="dialog"][aria-modal="true"][aria-label="고장·수리 이력 신규등록"] > div:last-child button:last-child::after {
  content: "저장";
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

/* 날짜 입력 달력 아이콘 — 어두운 입력칸에서도 밝게 표시 */
[role="dialog"][aria-modal="true"][aria-label="부적합 신규등록"] input[type="date"],
[role="dialog"][aria-modal="true"][aria-label="설비대장 신규등록"] input[type="date"],
[role="dialog"][aria-modal="true"][aria-label="설비대장 수정"] input[type="date"],
[role="dialog"][aria-modal="true"][aria-label="정기점검·교정 신규등록"] input[type="date"],
[role="dialog"][aria-modal="true"][aria-label="고장·수리 이력 신규등록"] input[type="date"] {
  color-scheme: dark !important;
}

[role="dialog"][aria-modal="true"] input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1) brightness(1.9) contrast(1.1) !important;
  opacity: .95 !important;
  cursor: pointer !important;
}

/* 부적합 현황 4칸 — 제목 위로 이동하고 품질검사 현황 카드와 통일 */
#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 {
  order: -2 !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  overflow: hidden !important;
  border: 1px solid #182b42 !important;
  border-radius: 12px !important;
  background: #0f1e32 !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child {
  order: -1 !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 > .qmes-hybrid-kpi-card {
  min-height: 98px !important;
  padding: 15px 16px 14px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  border: 0 !important;
  border-right: 1px solid rgba(255,255,255,.055) !important;
  border-radius: 0 !important;
  background: transparent !important;
  text-align: center !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 > .qmes-hybrid-kpi-card:last-child {
  border-right: 0 !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 .qmes-hybrid-donut {
  width: 6px !important;
  height: 6px !important;
  min-width: 6px !important;
  margin: 0 auto 2px !important;
  display: block !important;
  border-radius: 999px !important;
  background: #41c4ee !important;
  box-shadow: 0 0 7px rgba(65,196,238,.72) !important;
  animation: qmes-summary-dot-float 1.35s ease-in-out infinite !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 > .qmes-hybrid-kpi-card:nth-child(1) .qmes-hybrid-donut,
#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 > .qmes-hybrid-kpi-card:nth-child(3) .qmes-hybrid-donut {
  background: #f87171 !important;
  box-shadow: 0 0 7px rgba(248,113,113,.68) !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 > .qmes-hybrid-kpi-card:nth-child(2) .qmes-hybrid-donut {
  background: #fbbf24 !important;
  box-shadow: 0 0 7px rgba(251,191,36,.68) !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 > .qmes-hybrid-kpi-card:nth-child(4) .qmes-hybrid-donut {
  background: #34d399 !important;
  box-shadow: 0 0 7px rgba(52,211,153,.68) !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 .qmes-hybrid-donut > * {
  display: none !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 .qmes-hybrid-copy {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 5px !important;
  text-align: center !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 .qmes-hybrid-label-row,
#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 .qmes-hybrid-value-row {
  width: 100% !important;
  justify-content: center !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 .qmes-hybrid-label {
  color: #7f98b5 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 .qmes-hybrid-value {
  color: #f2f7fc !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -.035em !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 .qmes-hybrid-unit {
  color: #7189a4 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}

#root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 .qmes-hybrid-caption {
  display: none !important;
}

@media (max-width: 900px) {
  #root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 > .qmes-hybrid-kpi-card {
    border-bottom: 1px solid rgba(255,255,255,.055) !important;
  }
}

@media (max-width: 767px) {
  #root .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:has(> button) {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  [role="dialog"][aria-modal="true"][aria-label="고장·수리 이력 신규등록"] > div:nth-child(2) > div > label:nth-child(6),
  [role="dialog"][aria-modal="true"][aria-label="고장·수리 이력 신규등록"] > div:nth-child(2) > div > label:nth-child(7) {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 520px) {
  #root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 {
    grid-template-columns: 1fr !important;
  }

  #root .flex.flex-col.gap-5:has(> .flex.flex-col.gap-3.border-b.border-slate-800.pb-4:first-child > button) > .grid.grid-cols-2.gap-3 > .qmes-hybrid-kpi-card {
    min-height: 78px !important;
    border-right: 0 !important;
  }
}