/**
 * DA Class Finder
 *
 * Everything is scoped under .dacf. There are no bare element selectors and no
 * :root block, because this stylesheet loads inside somebody else's theme and
 * has no business restyling their headings or buttons.
 *
 * Colours and type match the DA Class Schedule calendar.
 */

.dacf {
	--dacf-ink: #1E1E24;
	--dacf-ink-2: #5B5B67;
	--dacf-ink-3: #8C8C99;
	--dacf-rule: #EAE6EA;
	--dacf-card: #fff;
	--dacf-accent: #E5007D;
	--dacf-accent-soft: #FDEFF7;
	--dacf-accent-line: #F6C9E1;
	--dacf-good: #0E9F6E;
	--dacf-good-soft: #EDF9F4;
	--dacf-warm: #9A6B00;
	--dacf-warm-soft: #FFF7E8;
	--dacf-warm-line: #F0DCAE;
	--dacf-shadow: 0 1px 3px rgba( 0, 0, 0, .08 );
	--dacf-r: 6px;

	font-family: Poppins, -apple-system, 'Segoe UI', Roboto, sans-serif;
	font-size: 15px;
	line-height: 1.55;
	color: var( --dacf-ink );
}

.dacf *,
.dacf *::before,
.dacf *::after { box-sizing: border-box; }

/*
 * Themes style form controls heavily and often with !important — Moesia gives
 * buttons an offset border and a shadow, and uppercases their text — and those
 * rules outrank a single class. Every control this plugin owns is reset here
 * first and styled below, so it looks the same whatever theme is underneath.
 *
 * Only the four properties themes actually force are marked important; the rest
 * stay overridable so the rules further down still do their work.
 */
.dacf button,
.dacf select,
.dacf input,
.dacf textarea {
	font: inherit;
	font-size: inherit;
	line-height: 1.4;
	text-transform: none !important;
	letter-spacing: normal !important;
	text-shadow: none !important;
	box-shadow: none !important;
	background-image: none;
	text-decoration: none;
	min-height: 0;
	min-width: 0;
	width: auto;
	height: auto;
	margin: 0;
	appearance: none;
	-webkit-appearance: none;
	transition: none;
}

.dacf button:hover,
.dacf button:focus {
	box-shadow: none !important;
	transform: none;
}

/* appearance:none takes the arrow off a select, so it is drawn back on. */
.dacf select {
	background-image: linear-gradient( 45deg, transparent 50%, currentColor 50% ),
		linear-gradient( 135deg, currentColor 50%, transparent 50% );
	background-position: calc( 100% - 15px ) calc( 50% + 1px ), calc( 100% - 10px ) calc( 50% + 1px );
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	padding-right: 28px;
}

/* A number input keeps its spinner, which appearance:none would remove. */
.dacf input[type="number"] {
	appearance: auto;
	-webkit-appearance: auto;
}

.dacf .dacf-h {
	font-size: clamp( 24px, 3.4vw, 32px );
	font-weight: 700;
	letter-spacing: -.02em;
	line-height: 1.14;
	margin: 0 0 8px;
	color: var( --dacf-ink );
}
.dacf .dacf-lede { color: var( --dacf-ink-2 ); margin: 0 0 20px; max-width: 64ch; }

.dacf .dacf-card {
	background: var( --dacf-card );
	border-radius: var( --dacf-r );
	box-shadow: var( --dacf-shadow );
	padding: 22px;
}
.dacf .dacf-card + .dacf-card { margin-top: 18px; }

.dacf fieldset { border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
.dacf legend,
.dacf .lbl {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var( --dacf-ink-3 );
	padding: 0;
	margin: 0 0 8px;
	display: block;
	float: none;
	width: auto;
}
.dacf .hint { font-size: 12.5px; color: var( --dacf-ink-3 ); margin: 7px 0 0; line-height: 1.45; }
.dacf .state { font-size: 13px; color: var( --dacf-ink-2 ); margin: 8px 0 0; }
.dacf .state b { font-weight: 600; color: var( --dacf-ink ); }
.dacf .state .any { color: var( --dacf-ink-3 ); }
.dacf .hidden { display: none; }

.dacf input[type="number"],
.dacf select {
	padding: 8px 10px;
	border: 1px solid var( --dacf-rule );
	border-radius: var( --dacf-r );
	/* Longhand: the shorthand would wipe the arrow drawn on the select above. */
	background-color: #fff;
	font: inherit;
	color: inherit;
	width: 100%;
	height: auto;
	margin: 0;
	box-shadow: none;
}
.dacf select { padding-right: 28px; }
.dacf input[type="number"]:focus,
.dacf select:focus { border-color: var( --dacf-accent ); outline: 0; box-shadow: none; }
.dacf :focus-visible { outline: 2px solid var( --dacf-accent ); outline-offset: 2px; border-radius: 4px; }

/* ---- chips ---- */
.dacf .chips { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.dacf .chip {
	border: 1px solid var( --dacf-rule );
	background: #fff;
	color: var( --dacf-ink );
	border-radius: 999px;
	padding: 5px 14px;
	font: inherit;
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.4;
	cursor: pointer;
	user-select: none;
	text-transform: none;
	letter-spacing: normal;
	box-shadow: none;
	height: auto;
}
.dacf .chip:hover { border-color: var( --dacf-accent ); color: var( --dacf-accent ); background: #fff; }
.dacf .chip[aria-pressed="true"] { background: var( --dacf-accent ); border-color: var( --dacf-accent ); color: #fff; }
.dacf .chip.mini { padding: 4px 12px; font-size: 13px; }
.dacf .clearchips {
	background: none; border: 0; color: var( --dacf-ink-3 ); font: inherit; font-size: 12.5px;
	cursor: pointer; text-decoration: underline; text-underline-offset: 3px; padding: 5px 4px;
}
.dacf .clearchips:hover { color: var( --dacf-accent ); background: none; }

/* ---- time windows ---- */
.dacf .grid { display: grid; grid-template-columns: repeat( auto-fit, minmax( 160px, 1fr ) ); gap: 14px; }
.dacf .timebox {
	border: 1px solid var( --dacf-rule ); border-radius: var( --dacf-r );
	padding: 14px 15px; background: #FAF8F9;
}
.dacf .timebox + .timebox { margin-top: 10px; }
.dacf .timebox h3 {
	font-size: 13.5px; font-weight: 700; letter-spacing: 0; margin: 0 0 10px;
	line-height: 1.3; color: var( --dacf-ink );
}
.dacf .timebox h3 em { font-style: normal; color: var( --dacf-ink-3 ); font-weight: 500; font-size: 12.5px; }

.dacf .go {
	background: var( --dacf-accent ); color: #fff; border: 0; border-radius: 999px;
	padding: 11px 26px; font: inherit; font-weight: 600; cursor: pointer;
	text-transform: none; letter-spacing: normal; height: auto; box-shadow: none;
}
.dacf .go,
.dacf .go:hover,
.dacf .go:focus { border: 0; }
.dacf .go:hover { background: #C40069; color: #fff; }

/* ---- results ---- */
.dacf .count { font-size: 13.5px; color: var( --dacf-ink-2 ); margin: 0 0 14px; }
.dacf .bundle {
	border: 1px solid var( --dacf-rule ); border-radius: var( --dacf-r );
	padding: 15px 17px; margin-bottom: 12px; background: #fff;
}
.dacf .bundle.best { border-color: var( --dacf-good ); background: var( --dacf-good-soft ); }
.dacf .b-hd {
	display: flex; justify-content: space-between; align-items: baseline;
	gap: 14px; flex-wrap: wrap; margin-bottom: 4px;
}
.dacf .b-hd h3 { font-size: 17px; font-weight: 700; letter-spacing: -.02em; margin: 0; line-height: 1.2; color: var( --dacf-ink ); }
.dacf .b-hd .p { text-align: right; line-height: 1.22; }
.dacf .b-hd .p b {
	display: block; font-size: 24px; font-weight: 700; letter-spacing: -.035em;
	color: var( --dacf-accent ); font-variant-numeric: tabular-nums;
}
.dacf .b-hd .p .unit {
	display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .08em;
	text-transform: uppercase; color: var( --dacf-ink-3 );
}
.dacf .b-hd .p .total {
	display: block; margin-top: 6px; padding-top: 6px; border-top: 1px solid var( --dacf-rule );
	font-size: 13px; color: var( --dacf-ink-2 ); font-variant-numeric: tabular-nums; white-space: nowrap;
}
.dacf .b-hd .p .total em { font-style: normal; color: var( --dacf-ink-3 ); }
.dacf .b-meta { font-size: 12.5px; color: var( --dacf-ink-3 ); margin: 0 0 8px; }
.dacf .badge {
	display: inline-block; background: var( --dacf-good ); color: #fff; font-size: 10.5px;
	font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
	padding: 2px 9px; border-radius: 999px; margin-bottom: 6px;
}
.dacf .cls { display: flex; gap: 12px; padding: 7px 0; border-top: 1px dashed var( --dacf-rule ); font-size: 14px; }
.dacf .cls .t { flex: 0 0 132px; font-weight: 600; font-variant-numeric: tabular-nums; font-size: 13.5px; }
.dacf .cls .n { flex: 1; }
.dacf .cls .n small { display: block; color: var( --dacf-ink-3 ); font-size: 12.5px; }

.dacf .b-actions {
	display: flex; gap: 12px; align-items: center; margin-top: 12px;
	padding-top: 11px; border-top: 1px solid var( --dacf-rule );
}
.dacf .b-actions button {
	background: none; border: 0; padding: 4px 0; font: inherit; font-size: 12.5px;
	font-weight: 600; color: var( --dacf-accent ); cursor: pointer;
	text-transform: none; letter-spacing: normal; height: auto; box-shadow: none;
}
.dacf .b-actions button:hover { text-decoration: underline; text-underline-offset: 3px; background: none; }
.dacf .b-actions .reg {
	background: var( --dacf-accent ); color: #fff; border: 0; border-radius: 999px;
	padding: 8px 16px; font-size: 12.5px; font-weight: 700; text-decoration: none;
	margin-right: 4px; white-space: nowrap;
}
.dacf .b-actions .reg:hover,
.dacf .b-actions .reg:focus { background: #C40069; color: #fff; text-decoration: none; }
.dacf .b-actions .sep { color: var( --dacf-rule ); font-size: 12px; }
.dacf .b-actions .done { color: var( --dacf-good ); cursor: default; text-decoration: none; }

/* ---- near misses ---- */
.dacf .near { margin-top: 22px; border-top: 1px solid var( --dacf-rule ); padding-top: 20px; }
.dacf .near h2 {
	font-size: 17px; font-weight: 700; letter-spacing: -.02em; margin: 0 0 3px;
	line-height: 1.2; color: var( --dacf-ink );
}
.dacf .near > p { font-size: 13.5px; color: var( --dacf-ink-2 ); margin: 0 0 13px; max-width: 64ch; }
.dacf .miss {
	display: flex; width: 100%; text-align: left; gap: 12px; align-items: center;
	border: 1px solid var( --dacf-rule ); border-left: 3px solid #C8C4CC; background: #fff;
	border-radius: var( --dacf-r ); padding: 10px 13px; margin-bottom: 8px;
	cursor: pointer; font: inherit; color: var( --dacf-ink );
	text-transform: none; letter-spacing: normal; height: auto; box-shadow: none;
}
.dacf .miss:hover { border-color: var( --dacf-accent ); border-left-color: var( --dacf-accent ); background: #fff; }
.dacf .miss.close { border-left-color: var( --dacf-good ); background: var( --dacf-good-soft ); }
.dacf .miss.close:hover { border-color: var( --dacf-good ); }
.dacf .miss .t { flex: 0 0 132px; font-weight: 600; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.dacf .miss .n { flex: 1; font-size: 14px; line-height: 1.35; }
.dacf .miss .n small { display: block; color: var( --dacf-warm ); font-size: 12.5px; font-weight: 500; }
.dacf .miss.close .n small { color: var( --dacf-good ); }
.dacf .miss .fix {
	flex: 0 0 auto; font-size: 12px; font-weight: 700; letter-spacing: .06em;
	text-transform: uppercase; color: var( --dacf-accent ); white-space: nowrap;
}

.dacf .near.alts .miss { border-left-color: var( --dacf-accent-line ); }
.dacf .near.alts .miss:hover { border-left-color: var( --dacf-accent ); }
.dacf .near.alts .miss .n small { color: var( --dacf-ink-3 ); font-weight: 400; }
.dacf .linky {
	background: none; border: 0; padding: 0 0 0 4px; font: inherit; font-size: inherit;
	font-weight: 600; color: var( --dacf-accent ); cursor: pointer;
	text-decoration: underline; text-underline-offset: 3px;
	text-transform: none; letter-spacing: normal; height: auto; box-shadow: none;
}
.dacf .linky:hover { color: #C40069; background: none; }

/* ---- messages ---- */
.dacf .alert { border-radius: var( --dacf-r ); padding: 15px 17px; font-size: 14.5px; line-height: 1.55; }
.dacf .alert.warn { background: var( --dacf-warm-soft ); border: 1px solid var( --dacf-warm-line ); color: var( --dacf-warm ); }
.dacf .alert.stop { background: var( --dacf-accent-soft ); border: 1px solid var( --dacf-accent-line ); }
.dacf .alert b { display: block; margin-bottom: 3px; }

/* ---- fine print ---- */
.dacf .fineprint {
	margin-top: 18px; border-top: 1px solid var( --dacf-rule ); padding-top: 14px;
	font-size: 12.5px; color: var( --dacf-ink-3 ); line-height: 1.6;
}
.dacf .fineprint h3 {
	font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
	color: var( --dacf-ink-3 ); margin: 0 0 7px; line-height: 1.3;
}
.dacf .fineprint ul { margin: 0; padding-left: 17px; list-style: disc; }
.dacf .fineprint li { margin-bottom: 3px; }
.dacf .fineprint b { color: var( --dacf-ink-2 ); font-weight: 600; }
.dacf .fineprint .draft { color: var( --dacf-warm ); font-weight: 600; }

@media ( prefers-reduced-motion: reduce ) {
	.dacf * { animation: none !important; scroll-behavior: auto !important; }
}

/* ---- availability ----
   The schedule knows how full a class is, so the finder says so rather than
   letting a family plan around a class they cannot join. */
.dacf .avail{
  display:inline-block;margin-left:7px;padding:2px 8px 3px;border-radius:999px;
  font-size:11px;font-weight:700;letter-spacing:.01em;vertical-align:middle;
  background:#EFEDEF;color:#5B5B67}
.dacf .avail.av-open{background:#E4F3E9;color:#1F5B39}
.dacf .avail.av-limited{background:#FDF0D5;color:#7A5510}
.dacf .avail.av-waitlist{background:#FBE3E3;color:#8A2F2F}
.dacf .waitnote{
  margin:10px 0 0;padding:10px 12px;border-radius:6px;
  background:#FBE3E3;color:#8A2F2F;font-size:13.5px;line-height:1.5}

/* ---- full year estimate ----
   Behind a disclosure: the biggest number on the card and the least useful for
   choosing between options, but one tap away with its working shown. The box is
   transparent so it reads as part of the card it sits in rather than a panel
   dropped on top of it. */
.dacf .b-year{margin-top:10px;font-size:13px}
.dacf .b-year summary{
  display:inline-flex;align-items:center;gap:5px;cursor:pointer;list-style:none;
  color:var( --dacf-ink-2 );font-weight:600;font-size:12.5px;
  text-transform:none;letter-spacing:normal;padding:2px 0}
.dacf .b-year summary::-webkit-details-marker{display:none}
.dacf .b-year summary::after{content:"\203A";font-size:15px;line-height:1;transition:transform .15s ease}
.dacf .b-year[open] summary::after{transform:rotate(90deg)}
.dacf .b-year summary:hover{color:var( --dacf-ink );text-decoration:underline;text-underline-offset:3px}
.dacf .b-year > ul{
  list-style:none;margin:7px 0 0;padding:0;
  color:var( --dacf-ink-2 );line-height:1.5}
.dacf .b-year > ul li{display:flex;gap:8px;align-items:baseline;margin:0}
.dacf .b-year > ul li + li{margin-top:3px}
.dacf .b-year > ul li i{font-style:normal;color:var( --dacf-ink-3 );font-size:12px}
.dacf .b-year > ul li span{margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}
.dacf .b-year .tot{
  margin-top:7px;padding-top:7px;border-top:1px solid var( --dacf-rule );
  color:var( --dacf-ink );font-weight:600}
.dacf .b-year .tot em{font-style:normal;font-weight:400;color:var( --dacf-ink-3 )}
.dacf .b-year > p{margin:8px 0 0;font-size:12px;color:var( --dacf-ink-3 );line-height:1.5}
@media ( prefers-reduced-motion: reduce ){
  .dacf .b-year summary::after{transition:none}
}