body {
  font-family: 'Tajawal', 'Manrope', system-ui, sans-serif;
}

.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  font-feature-settings: 'liga';
}
.material-symbols-outlined.fill {
  font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;
}

input, select, textarea, button {
  font-family: inherit;
}

dialog::backdrop {
  background: rgba(23, 29, 28, 0.45);
}

dialog[open] {
  animation: dialogIn 0.18s ease-out;
}
@keyframes dialogIn {
  from { opacity: 0; transform: translateY(-8px) scale(.98); }
  to   { opacity: 1; transform: none; }
}

.toast {
  background: #ffffff;
  border: 1px solid #dee4e1;
  box-shadow: 0 8px 28px rgba(17, 28, 45, 0.12);
  border-radius: 0.75rem;
  padding: 12px 16px;
  min-width: 240px;
  display: flex;
  align-items: center;
  gap: 8px;
  animation: toastIn 0.2s ease-out;
}
.toast.success { border-color: #00685f; color: #00685f; }
.toast.error   { border-color: #ba1a1a; color: #ba1a1a; }
.toast.info    { border-color: #545f73; color: #545f73; }
@keyframes toastIn {
  from { opacity: 0; transform: translateX(-12px); }
  to   { opacity: 1; transform: none; }
}

.table-zebra tbody tr:nth-child(even) {
  background: #f0f5f2;
}
.table-zebra tbody tr:hover {
  background: #eaefed;
}

input[type="time"], input[type="date"], input[type="datetime-local"] {
  font-family: inherit;
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #bcc9c6; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #6d7a77; }
::-webkit-scrollbar-track { background: transparent; }

/* RTL select: chevron on the visual LEFT, with safe padding so it never
   overlaps the text. Overrides Tailwind Forms defaults that place the
   chevron on the right (which collides with right-aligned Arabic text). */
select:not([multiple]):not([size]) {
  -webkit-appearance: none !important;
     -moz-appearance: none !important;
          appearance: none !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23545f73'><path fill-rule='evenodd' d='M5.23 7.21a.75.75 0 0 1 1.06.02L10 11.085l3.71-3.855a.75.75 0 1 1 1.08 1.04l-4.25 4.41a.75.75 0 0 1-1.08 0l-4.25-4.41a.75.75 0 0 1 .02-1.06z' clip-rule='evenodd'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: left 0.75rem center !important;
  background-size: 1.1rem 1.1rem !important;
  padding-left: 2.25rem !important;
  padding-right: 0.875rem !important;
}
select::-ms-expand { display: none; }

/* Collapsible sidebar */
#sideNav { width: 16rem; }
#mainShell { margin-right: 16rem; }
#appHeader { right: 16rem; }
body.nav-collapsed #sideNav { width: 4.5rem; }
body.nav-collapsed #mainShell { margin-right: 4.5rem; }
body.nav-collapsed #appHeader { right: 4.5rem; }
body.nav-collapsed .nav-text { display: none; }
body.nav-collapsed #sideNavBrand {
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.75rem 0.5rem;
}
body.nav-collapsed .nav-link {
  justify-content: center;
  padding-inline: 0.5rem;
}
body.nav-collapsed .nav-link.border-r-4 {
  border-right-width: 0;
  outline: 2px solid rgba(0,104,95,0.55);
  outline-offset: -2px;
}