/* ============================================================
   HSA Notes — RTL specific adjustments
   Layout mirroring is handled automatically by CSS logical
   properties (inset-inline, margin-inline, padding-inline) and
   flexbox/grid flow, which follow the `dir` attribute.
   These rules cover remaining physical-direction details.
   ============================================================ */

[dir="rtl"] body {
  text-align: right;
}

/* Mirrored slide-up animation for menu opening in RTL */
[dir="rtl"] .nav-item .icon {
  transform: scaleX(-1);
}
[dir="rtl"] .nav-item.active .icon,
[dir="rtl"] .nav-item:hover .icon {
  transform: scaleX(-1);
}

/* Toast slides from the left in RTL (it is positioned inline-end) */
[dir="rtl"] .toast { animation-name: slideUpRtl; }
@keyframes slideUpRtl {
  from { opacity: 0; transform: translateY(14px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Select arrow padding reversed */
[dir="rtl"] .select {
  background-position: left 14px center;
  padding-inline-start: 38px;
  padding-inline-end: 14px;
}

/* Modal close button alignment */
.modal-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: var(--radius-sm);
  color: var(--color-text-secondary);
}
.modal-close:hover { background: var(--color-surface-alt); color: var(--color-text-primary); }

/* Blockquote mirrored already via logical props; ensure quote glyph */
[dir="rtl"] .editor-area blockquote { text-align: right; }

/* Card secret field keeps LTR regardless of direction */
.card-secret, .gen-output, .gen-history-item { direction: ltr; }

/* Ensure the brand and header render correctly in RTL */
.sidebar-brand { text-align: start; }