@font-face {
  font-family: "Cereal";
  src: url("../fonts/CerealVF_W_Wght.8816d9e5c3b6a860636193e36b6ac4e4.woff2")
    format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Cereal Arabic";
  src: url("../fonts/CerealVF_Arabic_W_Wght.6bee4dd7ab27ef998da2f3a25ae61b48.woff2")
    format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

html,
body {
  font-family:
    "Cereal",
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
}

:root {
  --haven-surface: #ffffff;
  --haven-surface-muted: #f8fafc;
  --haven-border: #e4e7ec;
  --haven-foreground: #111827;
  --haven-muted: #667085;
}

.admin-card {
  border: 1px solid var(--haven-border);
  border-radius: 14px;
  background: var(--haven-surface);
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.admin-card--interactive {
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.admin-card--interactive:hover {
  border-color: #d0d5dd;
  box-shadow: 0 8px 20px rgba(16, 24, 40, 0.07);
  transform: translateY(-1px);
}

[data-admin-shell-content] select {
  appearance: none;
  cursor: pointer;
  border-color: var(--haven-border);
  background-color: var(--haven-surface);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23667085' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.75'%3E%3Cpath d='m5 7.5 5 5 5-5'/%3E%3C/svg%3E");
  background-position: right 0.8rem center;
  background-repeat: no-repeat;
  background-size: 1rem;
  padding-right: 2.75rem;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

[data-admin-shell-content] select:hover {
  border-color: #cbd5e1;
}

[data-admin-shell-content] select:focus {
  border-color: #5b2eff;
  box-shadow: 0 0 0 3px rgba(91, 46, 255, 0.12);
  outline: none;
}

.admin-data-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.admin-data-table thead th {
  height: 42px;
  padding: 0 12px;
  border-top: 1px solid var(--haven-border);
  border-bottom: 1px solid var(--haven-border);
  background: var(--haven-surface-muted);
  color: var(--haven-muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.admin-data-table thead th:first-child {
  border-left: 1px solid var(--haven-border);
  border-radius: 10px 0 0 0;
}

.admin-data-table thead th:last-child {
  border-right: 1px solid var(--haven-border);
  border-radius: 0 10px 0 0;
}

.admin-data-table tbody td {
  padding: 14px 12px;
  border-bottom: 1px solid #eef0f3;
  color: var(--haven-foreground);
}

.admin-data-table tbody tr:hover td {
  background: #fcfcfd;
}

.admin-data-table tbody tr:last-child td:first-child {
  border-radius: 0 0 0 10px;
}

.admin-data-table tbody tr:last-child td:last-child {
  border-radius: 0 0 10px 0;
}

.admin-sidebar-scroll {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.admin-sidebar-scroll::-webkit-scrollbar {
  display: none;
}

@keyframes toastProgress {
  from {
    transform: scaleX(1);
  }

  to {
    transform: scaleX(0);
  }
}
