/* SIAPIYA_ADMIN_MASTER_WORKSPACE_UX_V37038
   Administration & Master Data Workspace UX — Wave 1.
   Jurusan, Ruang, Kelas, Siswa, Mapel, Ekstra, Kokurikuler, Akun.
   Visual-only; CRUD, validation, permissions, and RPC stay unchanged. */

#mainContent[data-siapiya-master-ux="1"]{
  --siapiya-master-radius:.88rem;
  --siapiya-master-gap:.75rem;
  --siapiya-master-border:color-mix(in srgb,var(--bs-border-color) 88%,transparent);
  --siapiya-master-surface:color-mix(in srgb,var(--bs-tertiary-bg) 68%,var(--bs-body-bg));
  max-width:1320px;
  margin-inline:auto;
  padding-bottom:5.4rem;
}

/* Heading hierarchy */
#mainContent[data-siapiya-master-ux="1"] > h4{
  margin-bottom:.85rem!important;
  line-height:1.28;
  letter-spacing:-.012em;
}

#mainContent[data-siapiya-master-ux="1"] > h4 + .card{
  margin-top:0;
}

/* Editor/create surface = clear first task */
#mainContent[data-siapiya-master-ux="1"] > .card:first-of-type{
  border:1px solid var(--siapiya-master-border)!important;
  border-radius:var(--siapiya-master-radius);
  box-shadow:0 .35rem 1rem rgba(15,23,42,.055)!important;
}

#mainContent[data-siapiya-master-ux="1"] > .card:first-of-type .card-body{
  background:var(--siapiya-master-surface)!important;
  border-radius:var(--siapiya-master-radius)!important;
}

#mainContent[data-siapiya-master-ux="1"] > .card:first-of-type .card-body > h6{
  margin-bottom:.72rem!important;
  padding-bottom:.52rem!important;
  border-bottom:1px solid var(--siapiya-master-border)!important;
}

/* Form rhythm */
#mainContent[data-siapiya-master-ux="1"] .row.g-3{
  --bs-gutter-y:.72rem;
}

#mainContent[data-siapiya-master-ux="1"] .row.g-2{
  --bs-gutter-y:.62rem;
}

#mainContent[data-siapiya-master-ux="1"] .form-label{
  margin-bottom:.28rem;
  font-size:.79rem;
  font-weight:650!important;
  line-height:1.3;
}

#mainContent[data-siapiya-master-ux="1"] :is(.form-control,.form-select){
  min-height:2.62rem;
  border-radius:.68rem;
}

#mainContent[data-siapiya-master-ux="1"] .form-text{
  line-height:1.35;
  margin-top:.28rem;
}

/* Save/create actions read as primary. No selector-count-changing delegated attrs added. */
#mainContent[data-siapiya-master-ux="1"] :is(
  #btnSimpanJurusan,
  #btnSimpanRuang,
  #btnSimpanKelas,
  #btnSimpanSiswa,
  #btnSimpanMapel,
  #btnSimpanEkstra,
  #btnSimpanKoku,
  #btnSimpanUser
){
  min-height:2.72rem;
  font-weight:700;
  border-radius:.72rem!important;
}

/* Destructive/secondary actions remain visually subordinate. */
#mainContent[data-siapiya-master-ux="1"] .table :is(
  .btn-outline-danger,
  .btn-danger,
  .btn-outline-secondary
){
  box-shadow:none!important;
}

/* Table container = browse/manage task */
#mainContent[data-siapiya-master-ux="1"] > .table-responsive,
#mainContent[data-siapiya-master-ux="1"] > .table-responsive.bg-white{
  border:1px solid var(--siapiya-master-border)!important;
  border-radius:var(--siapiya-master-radius)!important;
  background:var(--bs-body-bg)!important;
  padding:.2rem!important;
  overflow:auto;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}

#mainContent[data-siapiya-master-ux="1"] .table{
  margin-bottom:0!important;
}

#mainContent[data-siapiya-master-ux="1"] .table thead th{
  white-space:nowrap;
  font-size:.74rem;
  text-transform:uppercase;
  letter-spacing:.024em;
  padding:.66rem .62rem;
}

#mainContent[data-siapiya-master-ux="1"] .table tbody td{
  padding:.62rem;
  border-color:var(--siapiya-master-border);
}

#mainContent[data-siapiya-master-ux="1"] .table tbody tr:hover > *{
  background:color-mix(in srgb,var(--bs-tertiary-bg) 66%,transparent);
}

#mainContent[data-siapiya-master-ux="1"] .table tbody tr:focus-within > *{
  background:color-mix(in srgb,var(--bs-primary-bg-subtle) 38%,transparent);
}

/* Loading/empty rows should look intentional. */
#mainContent[data-siapiya-master-ux="1"] .table td[colspan].text-center{
  padding:1rem .8rem!important;
  color:var(--bs-secondary-color);
}

#mainContent[data-siapiya-master-ux="1"] .table td[colspan].text-center::before{
  content:"\F431";
  font-family:"bootstrap-icons";
  display:block;
  margin-bottom:.25rem;
  opacity:.7;
}

/* Validation alerts stay close to fields but don't overwhelm. */
#mainContent[data-siapiya-master-ux="1"] .alert{
  border-radius:.7rem;
  border-inline-start-width:.28rem;
  margin-bottom:.55rem;
}

#mainContent[data-siapiya-master-ux="1"] .alert-danger{
  border-inline-start-color:var(--bs-danger)!important;
}

#mainContent[data-siapiya-master-ux="1"] .alert-warning{
  border-inline-start-color:var(--bs-warning)!important;
}

/* Data Siswa is the longest editor: reduce visual fatigue. */
#mainContent[data-siapiya-ux-route="siswa"][data-siapiya-master-ux="1"] > .card:first-of-type .card-body{
  padding:1rem!important;
}

#mainContent[data-siapiya-ux-route="siswa"][data-siapiya-master-ux="1"] .form-label.small{
  font-size:.76rem!important;
}

/* Account form: switch and password guidance align with other fields. */
#mainContent[data-siapiya-ux-route="akun"][data-siapiya-master-ux="1"] .form-check.form-switch{
  min-height:2.62rem;
  display:flex;
  flex-wrap:wrap;
  align-content:center;
}

#mainContent[data-siapiya-ux-route="akun"][data-siapiya-master-ux="1"] .form-check.form-switch small{
  width:100%;
}

/* Master Mapel: KKTP fields read as one compact group. */
#mainContent[data-siapiya-ux-route="mapel"][data-siapiya-master-ux="1"] :is(
  #inputKKTPX,
  #inputKKTPXI,
  #inputKKTPXII
){
  text-align:center;
  font-variant-numeric:tabular-nums;
}

/* Focus / accessibility */
#mainContent[data-siapiya-master-ux="1"] :is(
  button,
  .btn,
  a,
  input,
  select,
  textarea,
  summary
):focus-visible{
  outline:3px solid color-mix(in srgb,var(--bs-primary) 50%,transparent);
  outline-offset:3px;
  box-shadow:none!important;
}

#mainContent[data-siapiya-master-ux="1"] :is(.btn,.form-control,.form-select):disabled{
  opacity:.64;
  cursor:not-allowed;
}

/* Mobile density */
@media (max-width:767.98px){
  #mainContent[data-siapiya-master-ux="1"]{
    padding-bottom:calc(5.8rem + env(safe-area-inset-bottom));
  }

  #mainContent[data-siapiya-master-ux="1"] > h4{
    margin-bottom:.68rem!important;
    font-size:1.05rem;
  }

  #mainContent[data-siapiya-master-ux="1"] > .card:first-of-type{
    margin-bottom:.72rem!important;
  }

  #mainContent[data-siapiya-master-ux="1"] > .card:first-of-type .card-body{
    padding:.78rem!important;
  }

  #mainContent[data-siapiya-master-ux="1"] .row.g-3{
    --bs-gutter-y:.58rem;
  }

  #mainContent[data-siapiya-master-ux="1"] :is(
    .form-control,
    .form-select,
    .btn
  ){
    min-height:2.78rem;
  }

  #mainContent[data-siapiya-master-ux="1"] :is(
    #btnSimpanJurusan,
    #btnSimpanRuang,
    #btnSimpanKelas,
    #btnSimpanSiswa,
    #btnSimpanMapel,
    #btnSimpanEkstra,
    #btnSimpanKoku,
    #btnSimpanUser
  ){
    width:100%!important;
  }

  #mainContent[data-siapiya-master-ux="1"] > .table-responsive,
  #mainContent[data-siapiya-master-ux="1"] > .table-responsive.bg-white{
    border-radius:.75rem!important;
    scrollbar-gutter:stable;
  }

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

  #mainContent[data-siapiya-master-ux="1"] .table thead th{
    font-size:.69rem;
    padding:.55rem .54rem;
  }

  #mainContent[data-siapiya-master-ux="1"] .table tbody td{
    padding:.52rem .54rem;
  }

  #mainContent[data-siapiya-ux-route="siswa"][data-siapiya-master-ux="1"] > .card:first-of-type .card-body{
    padding:.78rem!important;
  }
}

@media (max-width:420px){
  #mainContent[data-siapiya-master-ux="1"] .form-label{
    font-size:.75rem;
  }

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

  #mainContent[data-siapiya-master-ux="1"] .alert{
    padding:.62rem .68rem;
  }
}

@media (forced-colors:active){
  #mainContent[data-siapiya-master-ux="1"] :is(
    .card,
    .table-responsive,
    .alert
  ){
    border-color:CanvasText!important;
  }

  #mainContent[data-siapiya-master-ux="1"] :is(
    button,.btn,a,input,select,textarea,summary
  ):focus-visible{
    outline:3px solid Highlight;
  }
}

@media (prefers-reduced-motion:reduce){
  #mainContent[data-siapiya-master-ux="1"] *,
  #mainContent[data-siapiya-master-ux="1"] *::before,
  #mainContent[data-siapiya-master-ux="1"] *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}