*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.c-form-group:has(> input[required])>label::after,
.c-form-group:has(> select[required])>label::after,
.c-form-group:has(> textarea[required])>label::after,
.form-group:has(> input[required])>label::after,
.form-group:has(> select[required])>label::after,
.form-group:has(> textarea[required])>label::after,
label:has(+ input[required])::after,
label:has(+ select[required])::after,
label:has(+ textarea[required])::after {
  content: " *";
  color: var(--color-danger);
  font-weight: 600;
  margin-left: 0.125rem;
}

label.no-required-marker::after,
.c-form-group:has(> input[required])>label.no-required-marker::after,
.c-form-group:has(> select[required])>label.no-required-marker::after,
.c-form-group:has(> textarea[required])>label.no-required-marker::after,
.form-group:has(> input[required])>label.no-required-marker::after,
.form-group:has(> select[required])>label.no-required-marker::after,
.form-group:has(> textarea[required])>label.no-required-marker::after,
label.no-required-marker:has(+ input[required])::after,
label.no-required-marker:has(+ select[required])::after,
label.no-required-marker:has(+ textarea[required])::after {
  content: none;
}

:root {
  --color-bg: #f7f7f5;
  --color-bg-surface: #ffffff;
  --color-bg-hover: #f0efed;
  --color-bg-active: #eae9e6;
  --color-border: #e5e2dd;
  --color-border-subtle: #eceae6;
  --color-text: #1c1917;
  --color-text-secondary: #57534e;
  --color-text-muted: #78716c;
  --color-accent: #1c1917;
  --color-accent-hover: #44403c;
  --color-success: #16a34a;
  --color-info: #2563eb;
  --color-danger: #dc2626;
  --sidebar-width: 256px;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.03);
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.03);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.06), 0 2px 6px rgba(0, 0, 0, 0.03);
  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 0.12s var(--ease-in-out);
  --transition-normal: 0.2s var(--ease-out);
  --z-topbar: 5;
  --z-sidebar: 10;
  --z-dropdown: 20;
  --z-modal-overlay: 100;
  --z-modal: 101;
  --z-mobile-nav-overlay: 900;
  --z-mobile-nav: 901;
  --z-drawer-overlay: 999;
  --z-drawer: 1000;
  --z-pinned: 9999;
  --z-dev-dropdown: 10000;
}
:root {
  --bp-mobile: 767px;
  --bp-tablet: 1023px;
  --bp-desktop: 1024px;
}

html {
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  background: var(--color-bg);
  color: var(--color-text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

@supports (font-variation-settings: normal) {
  html {
    font-family: "Inter var", system-ui, -apple-system, sans-serif;
  }
}

body {
  min-height: 100vh;
  overflow-wrap: break-word;
}

a {
  color: var(--color-accent);
  text-decoration: none;
  transition: color var(--transition-fast);
}

a:hover {
  color: var(--color-accent-hover);
}

::selection {
  background: rgba(28, 25, 23, 0.12);
}

.actions form,
.admin-toolbar form.button_to,
.c-filter-bar form.button_to,
.prompt-action-row form,
table .actions form,
.docs-folder-item-wrap form,
.school-card-meta form {
  margin: 0 !important;
  display: inline-flex;
  align-items: center;
}

.admin-toolbar .search-input,
.admin-toolbar .btn-sm {
  height: 2.25rem;
  box-sizing: border-box;
  line-height: 1.375;
}

/* Ensure the button is a flex container to vertically center its text,
   and apply a visible border (already provided by .btn-ghost). */
.admin-toolbar .btn-sm {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-top: 0;
  padding-bottom: 0;
  border: 1px solid var(--color-border);
  background: transparent;
}

select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 2rem !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2378716c' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 0.625rem center;
  background-size: 12px 12px;
  transition: background-color var(--transition-fast);
}

select.is-open {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%231c1917' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='18 15 12 9 6 15'/></svg>");
}

/* Hide the chrome native arrow on Edge/IE */
select::-ms-expand {
  display: none;
}

/* Multiple-select widgets keep their native UI — opt back out. */
select[multiple],
select[size]:not([size="1"]) {
  appearance: auto;
  -webkit-appearance: auto;
  -moz-appearance: auto;
  padding-right: 0.5rem !important;
  background-image: none;
}