/* ══════════════════════════════════════════════════════════════════════════
   Quote Theme (Aurea) — main.css
   Minimal custom CSS; design system handled by Tailwind CDN.
   ══════════════════════════════════════════════════════════════════════════ */

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

html {
	font-size: 16px;
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	font-family: Inter, sans-serif;
	background-color: #fbf9f8;
	color: #1b1c1c;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

::selection { background-color: #ffddaf; }
img, svg { display: block; max-width: 100%; height: auto; }
a { text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
ul, ol { list-style: none; }
blockquote::before, blockquote::after { content: none; }

/* ── Screen reader only ─────────────────────────────────────────────────── */
.sr-only {
	position: absolute; width: 1px; height: 1px;
	padding: 0; margin: -1px; overflow: hidden;
	clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ── Material Symbols ────────────────────────────────────────────────────── */
.material-symbols-outlined {
	font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
	user-select: none;
	vertical-align: middle;
}

/* ── Quote indent (opening curly quote) ─────────────────────────────────── */
.quote-indent { text-indent: -0.5em; }

/* ── Hide scrollbar ──────────────────────────────────────────────────────── */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* ── Search highlight ────────────────────────────────────────────────────── */
mark {
	background: #ffddaf;
	color: #281800;
	border-radius: 2px;
	padding: 0 2px;
}

/* ── Search cancel button (hide browser default) ────────────────────────── */
input[type="search"]::-webkit-search-cancel-button { display: none; }

/* ── Like button: pop animation ─────────────────────────────────────────── */
@keyframes bq-pop {
	0%   { transform: scale(1); }
	40%  { transform: scale(1.35); }
	70%  { transform: scale(0.9); }
	100% { transform: scale(1); }
}
.bq-like-btn.did-like { animation: bq-pop 400ms ease; }
.bq-like-btn.is-liked .bq-like-icon { color: #805600; }
.bq-like-btn.is-liked .bq-like-icon-fill { font-variation-settings: 'FILL' 1, 'wght' 300, 'GRAD' 0, 'opsz' 24; }

/* ── Share menu (hidden by default, toggled via JS) ─────────────────────── */
.bq-share-menu[hidden] { display: none; }

/* ── Mobile menu (hidden by default) ────────────────────────────────────── */
#bq-mobile-menu[hidden] { display: none; }
