/* JavaSense App Rating (compact & theme-friendly)
   - Mengikuti token Lux jika tersedia (--js-*)
   - Tetap aman untuk tema lain (fallback)
*/

.jsar-wrap{
  --jsar-text: var(--js-text, inherit);
  --jsar-muted: var(--js-muted, rgba(0,0,0,.65));
  --jsar-border: var(--js-border, rgba(0,0,0,.18));
  --jsar-field-bg: var(--js-surface2, rgba(0,0,0,.04));
  color: var(--jsar-text);
  margin: 14px 0;
}

/* Fallback “card” jika bukan Lux */
.jsar-wrap:not(.jslx-card){
  border: 1px solid var(--jsar-border);
  border-radius: 12px;
  padding: 14px;
}

.jsar-summary{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  align-items:center;
  margin: 0 0 6px;
}

.jsar-stars{ letter-spacing: 2px; }
.jsar-meta{ color: var(--jsar-muted); font-size: 12px; }
.jsar-invite{ color: var(--jsar-muted); font-size: 12px; line-height: 1.55; margin: 6px 0 10px; }
.jsar-sep{ opacity: .6; padding: 0 4px; }

.jsar-fields{
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
  align-items: stretch;
}

.jsar-field--rating{ flex: 0 0 92px; }
.jsar-field--comment{ flex: 1 1 240px; min-width: 180px; }
.jsar-field--submit{ flex: 0 0 auto; }

.jsar-form select,
.jsar-form input[type="text"]{
  width: 100%;
  height: 40px;
  border-radius: 14px;
  border: 1px solid var(--jsar-border);
  background: var(--jsar-field-bg);
  color: var(--jsar-text);
  padding: 10px 12px;
  font: inherit;
}

.jsar-btn{
  height: 40px;
  padding: 10px 14px;
}

.jsar-msg{ margin-top: 8px; color: var(--jsar-muted); font-size: 12px; }

/* Honeypot: sembunyikan dari user */
.jsar-hp{ position:absolute!important; left:-9999px!important; top:auto!important; width:1px!important; height:1px!important; overflow:hidden!important; }

/* Screen-reader only */
.jsar-sr{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip: rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

@media (max-width: 520px){
  .jsar-field--rating{ flex: 1 1 110px; }
  .jsar-field--submit{ flex: 1 1 160px; }
}
