/* Vùng form */
.azpq-inline{border:1px solid #e5e7eb; border-radius:12px; padding:14px; margin:12px 0; background:#fafafa}
.azpq-field{display:flex; flex-direction:column; gap:6px; margin-bottom:10px}
.azpq-lb{font-weight:600; font-size:.95rem}
.azpq-inp{width:100%; padding:10px 12px; border:1px solid #d1d5db; border-radius:10px; outline:none; transition:border-color .2s, box-shadow .2s}
.azpq-inp:focus{border-color:#60a5fa; box-shadow:0 0 0 3px rgba(96,165,250,.25)}
.azpq-chk{display:flex; align-items:center; gap:8px}
.azpq-btn{margin-top:6px; border-radius:999px; padding:.6rem 1rem; transition:transform .06s ease}
.azpq-btn:active{transform:scale(.98)}
.azpq-result{margin-top:8px; font-weight:700}

/* (tuỳ chọn) switch đẹp nếu sau này bạn cần hiển thị checkbox kiểu switch */
.azpq-switch{position:relative; width:46px; height:26px; display:inline-block}
.azpq-switch input{display:none}
.azpq-slider{position:absolute; inset:0; background:#c7c7c7; border-radius:999px; transition:background .25s, box-shadow .25s}
.azpq-slider:before{content:""; position:absolute; width:22px; height:22px; top:2px; left:2px; background:#fff; border-radius:50%; box-shadow:0 1px 3px rgba(0,0,0,.25); transition:transform .25s}
.azpq-switch input:checked + .azpq-slider{background:#22c55e}
.azpq-switch input:checked + .azpq-slider:before{transform:translateX(20px)}
#azpq-inline.is-loading { opacity: .92; transition: opacity .15s ease; }
#azpq-inline-calc[disabled] { opacity: .6; cursor: not-allowed; }

/* trạng thái trong form */
.azpq-inline-actions{ display:flex; align-items:center; gap:10px; margin-top:10px; }
#azpq-inline-calc[disabled]{ opacity:.6; cursor:not-allowed; }
#azpq-inline.is-loading{ opacity:.98; transition: opacity .15s ease; }

.azpq-inline-status{ font-size:13px; line-height:1; }

.azpq-badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:999px; font-size:12px; font-weight:600;
  background:#eef2ff; color:#1f2937; border:1px solid #e5e7eb;
}
.azpq-badge.is-loading{ background:#fff7ed; color:#9a3412; border-color:#fed7aa; }
.azpq-badge.is-ok{ background:#ecfdf5; color:#065f46; border-color:#a7f3d0; }
.azpq-badge.is-err{ background:#fef2f2; color:#991b1b; border-color:#fecaca; }

/* spinner nhỏ */
.azpq-spinner{
  width:14px; height:14px; border:2px solid currentColor;
  border-right-color: transparent; border-radius:50%;
  display:inline-block; animation:azpqspin .6s linear infinite;
}
@keyframes azpqspin { to { transform: rotate(360deg); } }


