/* Mahyar UI-7 shared quality layer: accessibility, feedback, mobile and PWA. */
:root { --ui7-safe-bottom: env(safe-area-inset-bottom, 0px); }
html { scroll-behavior: smooth; }
body { overflow-wrap: anywhere; }
main { outline: none; }
button, [role="button"], input, select, textarea, a { -webkit-tap-highlight-color: transparent; }
button, [role="button"], input:not([type="hidden"]), select { min-height: 44px; }
.ui-sidebar-locked { overflow: hidden !important; }

.ui7-skip-link {
  position: fixed; inset-block-start: .65rem; inset-inline-start: .65rem; z-index: 100000;
  padding: .7rem 1rem; border-radius: .75rem; color: #fff; background: #111827;
  font: 700 .9rem/1.2 Vazirmatn, sans-serif; transform: translateY(-180%); transition: transform .16s ease;
}
.ui7-skip-link:focus { transform: translateY(0); }

.ui7-toast-region { position: fixed; inset-inline-start: 1rem; inset-block-end: calc(1rem + var(--ui7-safe-bottom)); z-index: 100010; width: min(360px, calc(100vw - 2rem)); display: grid; gap: .55rem; pointer-events: none; }
.ui7-toast { padding: .8rem 1rem; border: 1px solid #dbe5e2; border-inline-start: 4px solid #2563eb; border-radius: .85rem; color: #17211f; background: #fff; box-shadow: 0 14px 42px rgba(16,24,40,.18); font: 700 .85rem/1.7 Vazirmatn, sans-serif; animation: ui7-toast-in .2s ease-out; }
.ui7-toast--success { border-inline-start-color: #059669; }
.ui7-toast--danger { border-inline-start-color: #dc2626; }
.ui7-toast.is-leaving { opacity: 0; transform: translateY(8px); transition: .2s ease; }
@keyframes ui7-toast-in { from { opacity: 0; transform: translateY(10px); } }

.ui7-offline { position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 100005; padding: .7rem max(1rem, env(safe-area-inset-right)) calc(.7rem + var(--ui7-safe-bottom)) max(1rem, env(safe-area-inset-left)); text-align: center; color: #fff; background: #7c2d12; box-shadow: 0 -8px 30px rgba(0,0,0,.15); font: 750 .82rem/1.6 Vazirmatn, sans-serif; }

form[aria-busy="true"] { cursor: progress; }
form[aria-busy="true"] button[type="submit"] { position: relative; opacity: .72; cursor: progress; }
form[aria-busy="true"] button[type="submit"]::after { content: ""; display: inline-block; width: .9rem; height: .9rem; margin-inline-start: .45rem; vertical-align: -.12rem; border: 2px solid currentColor; border-inline-end-color: transparent; border-radius: 50%; animation: ui7-spin .7s linear infinite; }
@keyframes ui7-spin { to { transform: rotate(1turn); } }

.ui7-notification-tools { display: flex; align-items: center; gap: .5rem; }
.ui7-notification-tools form { margin: 0; }
.ui7-notification-read-all, [data-ui-notification-form="one"] button { min-height: 36px; border: 1px solid #bdd9d2; border-radius: .65rem; padding: .35rem .7rem; color: #076956; background: #effaf7; font: 750 .75rem/1.4 inherit; }
[data-ui-notification-id].is-unread { box-shadow: inset -4px 0 0 var(--ui-accent, #0f766e); background: color-mix(in srgb, var(--ui-accent, #0f766e) 6%, #fff); }
[data-ui-notification-form="one"] { margin-block-start: .45rem; }
.ui7-header-badge { position: absolute; inset-block-start: 1px; inset-inline-start: 1px; display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 99px; color: #fff; background: #dc2626; font-size: .65rem; }
.ui6o-header__actions > button { position: relative; }
[data-ui-install][hidden], .ui7-offline[hidden] { display: none !important; }

dialog.ui-modal { max-width: 100vw; max-height: 100dvh; }
.table-responsive, [class*="table"] { max-width: 100%; }
img, video, canvas, svg { max-width: 100%; }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--ui-accent, #2563eb) 75%, #fff); outline-offset: 3px; }

@media (max-width: 767.98px) {
  input, select, textarea { font-size: 16px !important; }
  .ui7-toast-region { inset-inline: .65rem; width: auto; }
  .ui-modal .ui-modal__surface { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); margin: .5rem; }
  .ui-modal__header { gap: .6rem; }
  .ui7-notification-tools { align-self: flex-start; }
  .ui7-notification-read-all { font-size: .7rem; padding-inline: .5rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@media (forced-colors: active) {
  .ui7-toast, .ui7-offline, [data-ui-notification-id].is-unread { border: 2px solid CanvasText; }
  :focus-visible { outline: 3px solid Highlight; }
}