/* SIAPIYA_ADMIN_MASTER_DATA_QUALITY_V37040
   Administration & Master Data Workspace UX Wave 3 — Edit Flow & Data Quality Guidance.
   Client-only create-context and completeness guidance. */

#mainContent[data-siapiya-master-ux="1"] [data-siapiya-master-form-mode="create"]{
  position:relative;
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-strip{
  display:grid;
  gap:.55rem;
  margin-bottom:.78rem;
  padding:.72rem .78rem;
  border:1px solid var(--siapiya-master-border);
  border-inline-start:4px solid var(--bs-primary);
  border-radius:.78rem;
  background:color-mix(in srgb,var(--bs-primary-bg-subtle) 24%,var(--bs-body-bg));
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.65rem;
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-head > div{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.48rem;
  min-width:0;
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-head b{
  line-height:1.3;
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-count{
  flex:0 0 auto;
  min-height:2rem;
  display:inline-flex;
  align-items:center;
  font-variant-numeric:tabular-nums;
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-checks{
  display:flex;
  flex-wrap:wrap;
  gap:.42rem .72rem;
  font-size:.8rem;
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-checks > span{
  display:inline-flex;
  align-items:center;
  gap:.3rem;
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-checks .is-ready{
  color:var(--bs-success-text-emphasis);
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-checks .is-pending{
  color:var(--bs-warning-text-emphasis);
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-checks .is-neutral{
  color:var(--bs-secondary-color);
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-guidance{
  display:flex;
  align-items:flex-start;
  gap:.42rem;
  padding-top:.5rem;
  border-top:1px solid color-mix(in srgb,var(--bs-primary) 16%,var(--siapiya-master-border));
  color:var(--bs-secondary-color);
  font-size:.79rem;
  line-height:1.42;
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-guidance i{
  color:var(--bs-primary);
  margin-top:.08rem;
}

/* Required/recommended markers are appended to existing labels only. */
#mainContent[data-siapiya-master-ux="1"] .siapiya-master-field-marker{
  display:inline-flex;
  align-items:center;
  margin-inline-start:.38rem;
  padding:.12rem .35rem;
  border-radius:999px;
  font-size:.62rem;
  font-weight:700;
  vertical-align:.08rem;
  text-transform:none;
  letter-spacing:0;
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-field-marker.is-required{
  color:var(--bs-danger-text-emphasis);
  background:var(--bs-danger-bg-subtle);
}

#mainContent[data-siapiya-master-ux="1"] .siapiya-master-field-marker.is-recommended{
  color:var(--bs-info-text-emphasis);
  background:var(--bs-info-bg-subtle);
}

/* Completeness cues do not block save; backend validation remains authority. */
#mainContent[data-siapiya-master-ux="1"] [data-siapiya-quality-field="required"].siapiya-master-quality-missing{
  border-color:color-mix(in srgb,var(--bs-warning) 72%,var(--bs-border-color));
  background-image:none;
}

#mainContent[data-siapiya-master-ux="1"] [data-siapiya-quality-field].siapiya-master-quality-ready{
  border-color:color-mix(in srgb,var(--bs-success) 42%,var(--bs-border-color));
}

/* Account has placeholder-only fields: the top strip carries labels, while field borders convey state. */
#mainContent[data-siapiya-ux-route="akun"][data-siapiya-master-ux="1"] [data-siapiya-quality-field="required"]{
  scroll-margin-top:8rem;
}

/* Student and Mapel recommended fields remain visually quieter than mandatory inputs. */
#mainContent[data-siapiya-ux-route="siswa"][data-siapiya-master-ux="1"] [data-siapiya-quality-field="recommended"],
#mainContent[data-siapiya-ux-route="mapel"][data-siapiya-master-ux="1"] [data-siapiya-quality-field="recommended"]{
  border-style:dashed;
}

/* Table edit buttons communicate that edit is a separate context. */
#mainContent[data-siapiya-master-ux="1"] .table button[title^="Edit"]{
  position:relative;
}

#mainContent[data-siapiya-master-ux="1"] .table button[title^="Edit"]:focus-visible{
  outline-color:var(--bs-warning);
}

/* Mobile */
@media (max-width:767.98px){
  #mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-strip{
    margin-bottom:.62rem;
    padding:.65rem .68rem;
  }

  #mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-head{
    align-items:flex-start;
    flex-direction:column;
  }

  #mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-count{
    min-height:1.85rem;
  }

  #mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-checks{
    display:grid;
    gap:.35rem;
  }

  #mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-guidance{
    font-size:.76rem;
  }
}

@media (max-width:420px){
  #mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-strip{
    border-inline-start-width:3px;
  }

  #mainContent[data-siapiya-master-ux="1"] .siapiya-master-field-marker{
    margin-inline-start:.25rem;
    font-size:.58rem;
  }
}

@media (forced-colors:active){
  #mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-strip{
    border-color:CanvasText;
  }

  #mainContent[data-siapiya-master-ux="1"] [data-siapiya-quality-field="required"].siapiya-master-quality-missing,
  #mainContent[data-siapiya-master-ux="1"] [data-siapiya-quality-field].siapiya-master-quality-ready{
    border-color:CanvasText;
  }
}

@media (prefers-reduced-motion:reduce){
  #mainContent[data-siapiya-master-ux="1"] .siapiya-master-quality-strip{
    scroll-behavior:auto!important;
  }
}
