/* SIMAKSI v0.8.16 — Aksesibilitas & Konsistensi Akhir */

:root{
  --ui-focus-ring:0 0 0 3px color-mix(in srgb,var(--primary) 24%,transparent);
}

/* Fokus keyboard yang konsisten */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2px solid var(--primary);
  outline-offset:2px;
  box-shadow:var(--ui-focus-ring);
}
:where(a,button,input,select,textarea,summary,[tabindex]):focus:not(:focus-visible){outline:none}

/* Header dan tindakan halaman */
.page-intro.row,.section-head,.card-header{
  min-width:0;
}
.page-intro.row>div:first-child,.section-head>div:first-child,.card-header>div:first-child{
  min-width:0;
}
.page-intro h1,.section-head h2,.card-header h2{
  overflow-wrap:anywhere;
}
.page-intro>div>p:last-child,.card-header p{
  max-width:76ch;
}
.ui-detail-actions-v0815,.form-actions,.actions{
  align-items:center;
}

/* Field wajib dan status validasi */
label.ui-required-v0816>span:first-child,
label.ui-required-v0816{
  position:relative;
}
.ui-required-mark-v0816{
  color:var(--danger);
  margin-left:4px;
  font-weight:900;
  text-decoration:none;
}
.ui-required-note-v0816{
  display:flex;
  align-items:center;
  gap:6px;
  color:var(--muted);
  font-size:.76rem;
  margin-top:4px;
}
:where(input,select,textarea):user-invalid{
  border-color:color-mix(in srgb,var(--danger) 72%,var(--line));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 13%,transparent);
}
:where(input,select,textarea)[aria-invalid="true"]{
  border-color:var(--danger);
}

/* Flash message dapat ditutup tanpa kehilangan konteks */
.ui-flash-v0816{
  position:relative;
  padding-right:50px;
  scroll-margin-top:84px;
}
.ui-flash-close-v0816{
  position:absolute;
  top:50%;
  right:10px;
  transform:translateY(-50%);
  width:32px;
  height:32px;
  padding:0;
  border:0;
  border-radius:10px;
  background:transparent;
  color:currentColor;
  opacity:.7;
  font-size:20px;
  line-height:1;
  cursor:pointer;
}
.ui-flash-close-v0816:hover{background:color-mix(in srgb,currentColor 8%,transparent);opacity:1}
.ui-flash-v0816.is-dismissed{display:none}

/* Details dan menu tindakan */
details>summary{min-height:40px}
details[open]>summary{scroll-margin-top:82px}
.ui-row-actions-v0815>summary,
.ui-row-actions-v0812>summary,
[data-ui-action-menu]>summary{
  touch-action:manipulation;
}

/* Tabel besar tetap dapat diakses keyboard */
.table-wrap.ui-scrollable-v0816{
  position:relative;
  border-radius:inherit;
}
.table-wrap.ui-scrollable-v0816:focus-visible{
  outline:2px solid var(--primary);
  outline-offset:3px;
}
.ui-scroll-hint-v0816{
  display:none;
  color:var(--muted);
  font-size:.72rem;
  margin:4px 0 8px;
}

/* Dialog bantuan */
.ui-help-dialog-v083{
  max-width:min(540px,calc(100vw - 28px));
  max-height:min(720px,calc(100dvh - 28px));
}
.ui-help-card-v083{
  overflow:auto;
  max-height:calc(100dvh - 56px);
}
.ui-help-card-v083 [data-ui-help-close]{
  min-width:40px;
  min-height:40px;
}

/* Empty state dan loading state */
.empty-state,.empty{
  overflow-wrap:anywhere;
}
button[aria-busy="true"]{
  cursor:wait;
}
button[aria-busy="true"]::after{
  content:'';
  width:14px;
  height:14px;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  animation:ui-spin-v0816 .75s linear infinite;
}
@keyframes ui-spin-v0816{to{transform:rotate(360deg)}}

/* Tombol ikon harus memiliki hit area aman */
.icon-button,.ui-info-button-v0811,.ui-row-actions-v0815>summary{
  min-width:40px;
  min-height:40px;
}
.ui-info-button-v0811{
  width:24px;
  height:24px;
  min-width:24px;
  min-height:24px;
}

/* Mobile: aksi tidak tumpang tindih dan tidak memaksa overflow */
@media(max-width:820px){
  .page-intro.row{
    align-items:stretch;
  }
  .page-intro.row>.button,
  .page-intro.row>form,
  .page-intro.row>.form-actions{
    width:100%;
  }
  .page-intro.row>form>.button,
  .page-intro.row>.button{
    width:100%;
  }
  .card-header{
    align-items:flex-start;
    gap:10px;
  }
  .card-header>.button,
  .card-header>form,
  .card-header>.actions{
    flex:0 0 auto;
  }
  .top-actions .user-chip>span:last-child{
    display:none;
  }
  .ui-scroll-hint-v0816{display:block}
  .table-wrap.ui-scrollable-v0816{
    overscroll-behavior-inline:contain;
    scrollbar-width:thin;
  }
  .ui-help-dialog-v083{
    margin:auto 10px 10px;
    width:calc(100vw - 20px);
    max-width:none;
  }
}

@media(max-width:520px){
  .topbar{
    gap:8px;
  }
  .top-actions{
    gap:6px;
  }
  .top-actions .user-chip{
    display:none;
  }
  .card-header{
    flex-wrap:wrap;
  }
  .card-header>.actions,
  .card-header>.form-actions{
    width:100%;
  }
  .card-header>.actions .button,
  .card-header>.form-actions .button{
    flex:1;
  }
  .ui-detail-actions-v0815{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .ui-detail-actions-v0815>.tag{
    grid-column:1/-1;
    justify-self:start;
  }
  .ui-detail-actions-v0815>.button{
    width:100%;
  }
}

/* Pengguna yang memilih animasi minimal */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}

/* Dukungan mode kontras tinggi */
@media(forced-colors:active){
  .tag,.button,.icon-button,.ui-info-button-v0811,.card,.alert{
    forced-color-adjust:auto;
  }
  :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
    outline:3px solid Highlight;
  }
}

@media print{
  .ui-flash-close-v0816,.ui-scroll-hint-v0816{display:none!important}
}