/*
 * Job Board / header dropdowns.
 *
 * Utility classes used by the new Job Board views that are not in the
 * current Vite build yet. Running `npm run build` regenerates them inside
 * tutot.css, after which this file is harmless duplication.
 *
 * Base rules are wrapped in :where() so they never outrank the responsive
 * variants (sm:, lg:) that the main stylesheet already ships.
 */

:where(.w-\[250px\]) { width: 250px; }
:where(.w-\[290px\]) { width: 290px; }
:where(.min-h-\[260px\]) { min-height: 260px; }
:where(.whitespace-normal) { white-space: normal; }
:where(.leading-\[1\]) { line-height: 1; }
:where(.rounded-\[2rem\]) { border-radius: 2rem; }
:where(.opacity-\[0\.06\]) { opacity: .06; }
:where(.tracking-\[\.18em\]) { letter-spacing: .18em; }
:where(.text-\[12\.5px\]) { font-size: 12.5px; }
:where(.text-\[14px\]) { font-size: 14px; }
:where(.text-\[2\.2rem\]) { font-size: 2.2rem; }
:where(.text-\[2\.4rem\]) { font-size: 2.4rem; }
:where(.text-\[2\.6rem\]) { font-size: 2.6rem; }
:where(.text-\[2\.8rem\]) { font-size: 2.8rem; }

:where(.border-black\/10) { border-color: rgb(0 0 0 / .1); }
:where(.bg-\[color\:var\(--coral\)\]\/12) { background-color: color-mix(in oklab, var(--coral) 12%, transparent); }
:where(.bg-\[color\:var\(--cream\)\]\/50) { background-color: color-mix(in oklab, var(--cream) 50%, transparent); }
:where(.bg-\[color\:var\(--ink\)\]\/8) { background-color: color-mix(in oklab, var(--ink) 8%, transparent); }
.hover\:bg-\[color\:var\(--lilac\)\]:hover { background-color: var(--lilac); }
.hover\:border-\[color\:var\(--ink\)\]\/40:hover { border-color: color-mix(in oklab, var(--ink) 40%, transparent); }

:where(.accent-\[color\:var\(--ink\)\]) { accent-color: var(--ink); }
:where(.accent-red-600) { accent-color: #dc2626; }

.peer:checked ~ .peer-checked\:border-\[color\:var\(--ink\)\] { border-color: var(--ink); }
.has-\[\:checked\]\:bg-\[color\:var\(--ink\)\]:has(:checked) { background-color: var(--ink); }
.has-\[\:checked\]\:text-\[color\:var\(--cream\)\]:has(:checked) { color: var(--cream); }

.file\:rounded-full::file-selector-button { border-radius: 9999px; }
.file\:px-4::file-selector-button { padding-left: 1rem; padding-right: 1rem; }
.file\:text-xs::file-selector-button { font-size: .75rem; line-height: 1rem; }
.file\:bg-\[color\:var\(--ink\)\]::file-selector-button { background-color: var(--ink); }
.file\:text-\[color\:var\(--cream\)\]::file-selector-button { color: var(--cream); }

@media (min-width: 340px) {
  .min-\[340px\]\:block { display: block; }
}
@media (min-width: 40rem) {
  .sm\:text-\[3\.4rem\] { font-size: 3.4rem; }
  .sm\:text-\[3\.6rem\] { font-size: 3.6rem; }
}
@media (min-width: 64rem) {
  .lg\:pt-12 { padding-top: 3rem; }
  .lg\:py-20 { padding-top: 5rem; padding-bottom: 5rem; }
  .lg\:text-right { text-align: right; }
  .lg\:text-\[5\.2rem\] { font-size: 5.2rem; }
}
@media (min-width: 80rem) {
  .xl\:block { display: block; }
  .xl\:col-span-3 { grid-column: span 3 / span 3; }
}
